test/index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
    />
    <title>Eruda Test Page</title>
    <link rel="stylesheet" href="style.css" />
    <script src="assets/eruda.js"></script>
  </head>
  <body>
    <header>ERUDA TEST PAGE</header>
    <nav id="test-list">
      <ul>
        <li>
          <a href="eruda.html">eruda</a>
        </li>
        <li>
          <a href="console.html">console</a>
        </li>
        <li>
          <a href="elements.html">elements</a>
        </li>
        <li>
          <a href="network.html">network</a>
        </li>
        <li>
          <a href="resources.html">resources</a>
        </li>
        <li>
          <a href="sources.html">sources</a>
        </li>
        <li>
          <a href="info.html">info</a>
        </li>
        <li>
          <a href="snippets.html">snippets</a>
        </li>
        <li>
          <a href="settings.html">settings</a>
        </li>
        <li>
          <a href="manual.html">manual</a>
        </li>
      </ul>
    </nav>
    <script>
      ;(function () {
        let el = document.createElement('div')
        document.body.appendChild(el)
        setTimeout(function () {
          try {
            eruda.init({
              container: el,
              useShadowDom: false,
              defaults: {
                displaySize: 50,
                transparency: 0.9,
                theme: 'Monokai Pro',
              },
            })
          } catch (e) {
            alert(e)
          }
          eruda.show().get().config.set('displaySize', 50)
        }, 1000)
      })()
    </script>
  </body>
</html>