element-call/src/settings/__snapshots__/DeveloperSettingsTab.test.tsx.snap

// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html

exports[`DeveloperSettingsTab > renders and matches snapshot 1`] = `
<div>
  <p>
    Hostname: localhost
  </p>
  <p>
    Element Call version: dev
  </p>
  <p>
    Crypto version: crypto-1.0.0
  </p>
  <p>
    Matrix ID: @alice:example.org
  </p>
  <p>
    Device ID: DEVICE123
  </p>
  <div
    class="_separator_13qwf_8"
    data-kind="primary"
    data-orientation="horizontal"
    role="separator"
  />
  <div
    class="_fieldRow_1bd8c0"
  >
    <div
      class="_field_1bd8c0 _inputField_1bd8c0"
    >
      <input
        aria-describedby="_r_1_"
        id="duplicateTiles"
        min="0"
        type="number"
        value="0"
      />
      <label
        for="duplicateTiles"
      >
        Number of additional tile copies per participant
      </label>
    </div>
  </div>
  <div
    class="_fieldRow_1bd8c0"
  >
    <div
      class="_field_1bd8c0 _checkboxField_1bd8c0"
    >
      <input
        aria-describedby="_r_2_"
        id="debugTileLayout"
        type="checkbox"
      />
      <label
        for="debugTileLayout"
      >
        <div
          class="_checkbox_1bd8c0"
        >
          <svg
            fill="none"
            height="24"
            stroke="#000"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            viewBox="0 0 24 24"
            width="24"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="m20 6-11 11-5-5"
            />
          </svg>
        </div>
        Debug tile layout
      </label>
    </div>
  </div>
  <div
    class="_fieldRow_1bd8c0"
  >
    <div
      class="_field_1bd8c0 _checkboxField_1bd8c0"
    >
      <input
        aria-describedby="_r_3_"
        id="showConnectionStats"
        type="checkbox"
      />
      <label
        for="showConnectionStats"
      >
        <div
          class="_checkbox_1bd8c0"
        >
          <svg
            fill="none"
            height="24"
            stroke="#000"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            viewBox="0 0 24 24"
            width="24"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="m20 6-11 11-5-5"
            />
          </svg>
        </div>
        Show connection statistics
      </label>
    </div>
  </div>
  <div
    class="_fieldRow_1bd8c0"
  >
    <div
      class="_field_1bd8c0 _checkboxField_1bd8c0"
    >
      <input
        aria-describedby="_r_4_"
        id="muteAllAudio"
        type="checkbox"
      />
      <label
        for="muteAllAudio"
      >
        <div
          class="_checkbox_1bd8c0"
        >
          <svg
            fill="none"
            height="24"
            stroke="#000"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            viewBox="0 0 24 24"
            width="24"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="m20 6-11 11-5-5"
            />
          </svg>
        </div>
        Mute all audio (participants, reactions, join sounds)
      </label>
    </div>
  </div>
   
  <div
    class="_fieldRow_1bd8c0"
  >
    <div
      class="_field_1bd8c0 _checkboxField_1bd8c0"
    >
      <input
        aria-describedby="_r_5_"
        id="alwaysShowIphoneEarpiece"
        type="checkbox"
      />
      <label
        for="alwaysShowIphoneEarpiece"
      >
        <div
          class="_checkbox_1bd8c0"
        >
          <svg
            fill="none"
            height="24"
            stroke="#000"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            viewBox="0 0 24 24"
            width="24"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="m20 6-11 11-5-5"
            />
          </svg>
        </div>
        Show iPhone earpiece option on all platforms
      </label>
    </div>
  </div>
  <div
    class="_fieldRow_1bd8c0"
  >
    <div
      class="_field_1bd8c0 _checkboxField_1bd8c0"
    >
      <input
        aria-describedby="_r_6_"
        id="enableLivekitExtendedLogs"
        type="checkbox"
      />
      <label
        for="enableLivekitExtendedLogs"
      >
        <div
          class="_checkbox_1bd8c0"
        >
          <svg
            fill="none"
            height="24"
            stroke="#000"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            viewBox="0 0 24 24"
            width="24"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="m20 6-11 11-5-5"
            />
          </svg>
        </div>
        Enable extended livekit logs
      </label>
    </div>
  </div>
  <form
    class="_root_1o4d9_17"
  >
    <div
      class="_field_1o4d9_27"
    >
      <label
        class="_label_1o4d9_60"
        for="radix-_r_7_"
      >
        Custom Livekit-url
      </label>
      <div
        class="_controls_17lij_8"
      >
        <input
          aria-describedby="radix-_r_8_"
          class="_control_d83jn_10"
          id="radix-_r_7_"
          name="input"
          title=""
          value=""
        />
      </div>
      <span
        class="_message_1o4d9_86 _help-message_1o4d9_92"
        id="radix-_r_8_"
      >
        Currently, no overwrite is set. Url from config is used.
      </span>
    </div>
  </form>
  <div
    class="_separator_13qwf_8"
    data-kind="primary"
    data-orientation="horizontal"
    role="separator"
  />
  <h3
    class="_typography_6v6n8_153 _font-body-lg-semibold_6v6n8_74"
  >
    MatrixRTC mode
  </h3>
  <form
    class="_root_1o4d9_17"
  >
    <div
      class="_inline-field_1o4d9_33"
    >
      <div
        class="_inline-field-control_1o4d9_45"
      >
        <div
          class="_container_1ug7n_10"
        >
          <input
            aria-describedby="radix-_r_a_ radix-_r_c_"
            checked=""
            class="_input_1ug7n_18"
            id="radix-_r_9_"
            name="_r_0_"
            title=""
            type="radio"
            value="compatibility"
          />
          <div
            class="_ui_1ug7n_19"
          />
        </div>
      </div>
      <div
        class="_inline-field-body_1o4d9_39"
      >
        <label
          class="_label_1o4d9_60"
          for="radix-_r_9_"
        >
          Compatibility: state events & multi SFU
        </label>
        <span
          class="_message_1o4d9_86 _help-message_1o4d9_92"
          id="radix-_r_a_"
        >
          Compatible with homeservers that do not support sticky events (but all other EC clients are v0.17.0 or later)
        </span>
      </div>
    </div>
    <div
      class="_inline-field_1o4d9_33"
    >
      <div
        class="_inline-field-control_1o4d9_45"
      >
        <div
          class="_container_1ug7n_10"
        >
          <input
            aria-describedby="radix-_r_a_ radix-_r_c_"
            class="_input_1ug7n_18"
            id="radix-_r_b_"
            name="_r_0_"
            title=""
            type="radio"
            value="matrix_2_0"
          />
          <div
            class="_ui_1ug7n_19"
          />
        </div>
      </div>
      <div
        class="_inline-field-body_1o4d9_39"
      >
        <label
          class="_label_1o4d9_60"
          for="radix-_r_b_"
        >
          Matrix 2.0: sticky events & multi SFU
        </label>
        <span
          class="_message_1o4d9_86 _help-message_1o4d9_92"
          id="radix-_r_c_"
        >
          Compatible only with homservers supporting sticky events and all EC clients v0.17.0 or later
        </span>
      </div>
    </div>
  </form>
  <div
    class="_livekit_room_box_2ddec4"
  >
    <h4>
      LiveKit SFU: wss://local-sfu.example.org
    </h4>
    <p>
      LivekitAlias: 
      TestAlias
    </p>
    <p>
      connectionState (wont hot reload): 
    </p>
    <p>
      ws-url: 
      wss://local-sfu.example.org/
    </p>
    <p>
      LiveKit Server Info
      (
      local
      )
    </p>
    <pre>
      {
  "region": "local",
  "version": "1.2.3"
}
      local-metadata
    </pre>
    <p>
      Local Participant
    </p>
    <pre>
      localParticipantIdentity
    </pre>
    <p>
      Remote Participants
    </p>
    <ul />
  </div>
  <div
    class="_livekit_room_box_2ddec4"
  >
    <h4>
      LiveKit SFU: wss://remote-sfu.example.org
    </h4>
    <p>
      LivekitAlias: 
      TestAlias2
    </p>
    <p>
      connectionState (wont hot reload): 
    </p>
    <p>
      LiveKit Server Info
      (
      remote
      )
    </p>
    <pre>
      {
  "region": "remote",
  "version": "4.5.6"
}
      remote-metadata
    </pre>
    <p>
      Local Participant
    </p>
    <pre>
      localParticipantIdentity
    </pre>
    <p>
      Remote Participants
    </p>
    <ul />
  </div>
  <div
    class="_separator_13qwf_8"
    data-kind="primary"
    data-orientation="horizontal"
    role="separator"
  />
  <h4>
    Camera quality
  </h4>
  <div
    class="_fieldRow_1bd8c0"
  >
    <div
      class="_field_1bd8c0 _checkboxField_1bd8c0"
    >
      <input
        aria-describedby="_r_i_"
        id="cameraToggle"
        type="checkbox"
      />
      <label
        for="cameraToggle"
      >
        <div
          class="_checkbox_1bd8c0"
        >
          <svg
            fill="none"
            height="24"
            stroke="#000"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            viewBox="0 0 24 24"
            width="24"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="m20 6-11 11-5-5"
            />
          </svg>
        </div>
        Advanced camera settings
      </label>
      <p
        class="_description_1bd8c0"
        id="_r_i_"
      >
        Configure resolution, framerate, bitrate, and codec for camera video. Changes apply on next call join.
      </p>
    </div>
  </div>
  <div
    class="_separator_13qwf_8"
    data-kind="primary"
    data-orientation="horizontal"
    role="separator"
  />
  <h4>
    Screen sharing
  </h4>
  <div
    class="_fieldRow_1bd8c0"
  >
    <div
      class="_field_1bd8c0 _checkboxField_1bd8c0"
    >
      <input
        aria-describedby="_r_j_"
        id="screenShareToggle"
        type="checkbox"
      />
      <label
        for="screenShareToggle"
      >
        <div
          class="_checkbox_1bd8c0"
        >
          <svg
            fill="none"
            height="24"
            stroke="#000"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            viewBox="0 0 24 24"
            width="24"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="m20 6-11 11-5-5"
            />
          </svg>
        </div>
        Advanced screen share settings
      </label>
      <p
        class="_description_1bd8c0"
        id="_r_j_"
      >
        Configure resolution, framerate, bitrate, and codec for screen sharing
      </p>
    </div>
  </div>
  <div
    class="_separator_13qwf_8"
    data-kind="primary"
    data-orientation="horizontal"
    role="separator"
  />
  <h4>
    Audio processing
  </h4>
  <p>
    Changes apply on next call join.
  </p>
  <div
    class="_fieldRow_1bd8c0"
  >
    <div
      class="_field_1bd8c0 _checkboxField_1bd8c0"
    >
      <input
        aria-describedby="_r_k_"
        checked=""
        id="echoCancellation"
        type="checkbox"
      />
      <label
        for="echoCancellation"
      >
        <div
          class="_checkbox_1bd8c0"
        >
          <svg
            fill="none"
            height="24"
            stroke="#000"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            viewBox="0 0 24 24"
            width="24"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="m20 6-11 11-5-5"
            />
          </svg>
        </div>
        Echo cancellation
      </label>
    </div>
  </div>
  <div
    class="_fieldRow_1bd8c0"
  >
    <div
      class="_field_1bd8c0 _checkboxField_1bd8c0"
    >
      <input
        aria-describedby="_r_l_"
        checked=""
        id="noiseSuppression"
        type="checkbox"
      />
      <label
        for="noiseSuppression"
      >
        <div
          class="_checkbox_1bd8c0"
        >
          <svg
            fill="none"
            height="24"
            stroke="#000"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            viewBox="0 0 24 24"
            width="24"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="m20 6-11 11-5-5"
            />
          </svg>
        </div>
        Noise suppression
      </label>
    </div>
  </div>
  <div
    class="_fieldRow_1bd8c0"
  >
    <div
      class="_field_1bd8c0 _checkboxField_1bd8c0"
    >
      <input
        aria-describedby="_r_m_"
        checked=""
        id="autoGainControl"
        type="checkbox"
      />
      <label
        for="autoGainControl"
      >
        <div
          class="_checkbox_1bd8c0"
        >
          <svg
            fill="none"
            height="24"
            stroke="#000"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            viewBox="0 0 24 24"
            width="24"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="m20 6-11 11-5-5"
            />
          </svg>
        </div>
        Automatic gain control
      </label>
    </div>
  </div>
  <div
    class="_separator_13qwf_8"
    data-kind="primary"
    data-orientation="horizontal"
    role="separator"
  />
  <p>
    Environment variables
  </p>
  <pre>
    {
  "MY_MOCK_ENV": 10,
  "ENV": "test"
}
  </pre>
  <p>
    URL parameters
  </p>
  <pre>
    {
  "mocked": true,
  "answer": 42
}
  </pre>
</div>
`;