// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`DevtoolsDialog renders the devtools dialog 1`] = `
<DocumentFragment>
  <div
    data-focus-guard="true"
    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
    tabindex="0"
  />
  <div
    aria-labelledby="mx_BaseDialog_title"
    class="mx_QuestionDialog mx_Dialog_fixedWidth"
    data-focus-lock-disabled="false"
    role="dialog"
    tabindex="-1"
  >
    <div
      class="mx_Dialog_header"
    >
      <h1
        class="mx_Heading_h3 mx_Dialog_title"
        id="mx_BaseDialog_title"
      >
        Developer Tools
      </h1>
    </div>
    <div
      class="mx_DevTools_label_left"
    >
      Toolbox
    </div>
    <div
      class="mx_CopyableText mx_DevTools_label_right"
    >
      Room ID: !id
      <div
        aria-describedby="«r2»"
        aria-label="Copy"
        class="mx_AccessibleButton mx_CopyableText_copyButton"
        role="button"
        tabindex="0"
      />
    </div>
    <div
      class="mx_DevTools_label_bottom"
    />
    <div
      class="mx_DevTools_content"
    >
      <div>
        <h2
          class="mx_DevTools_toolHeading"
        >
          Room
        </h2>
        <button
          class="mx_DevTools_button"
        >
          Send custom timeline event
        </button>
        <button
          class="mx_DevTools_button"
        >
          Explore room state
        </button>
        <button
          class="mx_DevTools_button"
        >
          Explore room account data
        </button>
        <button
          class="mx_DevTools_button"
        >
          View servers in room
        </button>
        <button
          class="mx_DevTools_button"
        >
          Notifications debug
        </button>
        <button
          class="mx_DevTools_button"
        >
          Active Widgets
        </button>
      </div>
      <div>
        <h2
          class="mx_DevTools_toolHeading"
        >
          Other
        </h2>
        <button
          class="mx_DevTools_button"
        >
          Explore account data
        </button>
        <button
          class="mx_DevTools_button"
        >
          Settings explorer
        </button>
        <button
          class="mx_DevTools_button"
        >
          Server info
        </button>
        <button
          class="mx_DevTools_button"
        >
          End-to-end encryption
        </button>
      </div>
      <div>
        <h2
          class="mx_DevTools_toolHeading"
        >
          Options
        </h2>
        <div
          class="mx_SettingsFlag"
        >
          <label
            class="mx_SettingsFlag_label"
            for="mx_SettingsFlag_vY7Q4uEh9K38"
          >
            <span
              class="mx_SettingsFlag_labelText"
            >
              Developer mode
            </span>
          </label>
          <div
            aria-checked="false"
            aria-disabled="false"
            aria-label="Developer mode"
            class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
            id="mx_SettingsFlag_vY7Q4uEh9K38"
            role="switch"
            tabindex="0"
          >
            <div
              class="mx_ToggleSwitch_ball"
            />
          </div>
        </div>
        <div
          class="mx_SettingsFlag"
        >
          <label
            class="mx_SettingsFlag_label"
            for="mx_SettingsFlag_QgU2PomxwKpa"
          >
            <span
              class="mx_SettingsFlag_labelText"
            >
              Show hidden events in timeline
            </span>
          </label>
          <div
            aria-checked="false"
            aria-disabled="false"
            aria-label="Show hidden events in timeline"
            class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
            id="mx_SettingsFlag_QgU2PomxwKpa"
            role="switch"
            tabindex="0"
          >
            <div
              class="mx_ToggleSwitch_ball"
            />
          </div>
        </div>
        <div
          class="mx_SettingsFlag"
        >
          <label
            class="mx_SettingsFlag_label"
            for="mx_SettingsFlag_6hpi3YEetmBG"
          >
            <span
              class="mx_SettingsFlag_labelText"
            >
              Enable widget screenshots on supported widgets
            </span>
          </label>
          <div
            aria-checked="false"
            aria-disabled="false"
            aria-label="Enable widget screenshots on supported widgets"
            class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
            id="mx_SettingsFlag_6hpi3YEetmBG"
            role="switch"
            tabindex="0"
          >
            <div
              class="mx_ToggleSwitch_ball"
            />
          </div>
        </div>
        <form
          class="_root_19upo_16"
        >
          <div
            class="_field_19upo_26"
          >
            <label
              class="_label_19upo_59"
              for="radix-«r4»"
            >
              Element Call URL
            </label>
            <div
              class="_controls_17lij_8"
            >
              <input
                class="_control_sqdq4_10"
                id="radix-«r4»"
                name="input"
                title=""
                value=""
              />
            </div>
          </div>
        </form>
      </div>
    </div>
    <div
      class="mx_Dialog_buttons"
    >
      <button>
        Back
      </button>
    </div>
    <div
      aria-label="Close dialog"
      class="mx_AccessibleButton mx_Dialog_cancelButton"
      role="button"
      tabindex="0"
    />
  </div>
  <div
    data-focus-guard="true"
    style="width: 1px; height: 0px; padding: 0px; overflow: hidden; position: fixed; top: 1px; left: 1px;"
    tabindex="0"
  />
</DocumentFragment>
`;
