py/test/pytests/audio_diagnostic_static/audio_diagnostic.html

<test-template>
  <div id="container">
    <div id="tonegen" class="ctl-panel">
      <h2>
        <i18n-label>Tone generator</i18n-label>
      </h2>
      <div id="tonegen-main">
        <div>
          <div>
            <button id="tone-btn" class="btn-off">
              <span class="btn-on-text">
                <i18n-label>Tone off</i18n-label>
              </span>
              <span class="btn-off-text">
                <i18n-label>Tone On</i18n-label>
              </span>
            </button>
            <select id="tone-type">
              <option value="sine">Sine wave</option>
              <option value="square">Square wave</option>
              <option value="triangle">Triangle wave</option>
            </select>
          </div>
          <input id="freq-bar" type="range" min="1" max="500">
          <div id="freq" class="edit-off">
            <span id="freq-curr">ff</span> /
            <span id="freq-max-label">mm</span>
            <input id="freq-max-edit"> Hz
          </div>
        </div>
        <div>
          <div id="tonegen-vol-sliders">
            <input id="left-gain" type="range" min="1" max="20" value="10">
            <input id="right-gain" type="range" min="1" max="20" value="10">
          </div>
          <span>L / R</span>
        </div>
      </div>
    </div>
    <div class="ctl-panel">
      <h2>
        <i18n-label>Manual record</i18n-label>
      </h2>
      <button id="record-btn" class="btn-off">
        <span class="btn-on-text">
          <i18n-label>Stop record</i18n-label>
        </span>
        <span class="btn-off-text">
          <i18n-label>Start record</i18n-label>
        </span>
      </button>
      <button id="record-playback-btn" class="btn-off">
        <span class="btn-on-text">
          <i18n-label>Stop playback</i18n-label>
        </span>
        <span class="btn-off-text">
          <i18n-label>Start playback</i18n-label>
        </span>
      </button>
    </div>
    <div class="ctl-panel">
      <h2>
        <i18n-label>Audio loopback</i18n-label>
      </h2>
      <button id="loopback-btn" class="btn-off">
        <span class="btn-on-text">
          <i18n-label>Loopback off</i18n-label>
        </span>
        <span class="btn-off-text">
          <i18n-label>Loopback on</i18n-label>
        </span>
      </button>
    </div>
    <div class="ctl-panel">
      <h2>
        <i18n-label>Output Nodes</i18n-label>
      </h2>
      <div id="output-nodes"></div>
    </div>
    <div class="ctl-panel">
      <h2>
        <i18n-label>Input Nodes</i18n-label>
      </h2>
      <div id="input-nodes"></div>
    </div>
    <div id="test-result" class="ctl-panel">
      <button id="pass-btn">
        <i18n-label>Pass</i18n-label>
      </button>
      <button id="fail-btn">
        <i18n-label>Fail</i18n-label>
      </button>
    </div>
  </div>
</test-template>