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

exports[`<JSONEditor /> spec renders the component 1`] = `
HTMLCollection [
  <div>
    <textarea
      data-test-subj="jsonEditor-valueDisplay"
      readonly=""
      style="display: none;"
    >
      {"name":"test"}
    </textarea>
    <div
      class="euiCodeEditorWrapper"
      data-test-subj="codeEditorContainer"
    >
      <button
        class="euiCodeEditorKeyboardHint"
        data-test-subj="codeEditorHint"
        id="some_html_id"
      >
        <p
          class="euiText"
        >
          Press Enter to start editing.
        </p>
        <p
          class="euiText"
        >
          When you're done, press Escape to stop editing.
        </p>
      </button>
      <div
        class=" ace_editor ace-tm"
        id="some_html_id"
        style="width: 500px; height: 500px;"
      >
        <textarea
          autocapitalize="off"
          autocorrect="off"
          class="ace_text-input"
          spellcheck="false"
          style="opacity: 0;"
          tabindex="-1"
          wrap="off"
        />
        <div
          aria-hidden="true"
          class="ace_gutter"
        >
          <div
            class="ace_layer ace_gutter-layer ace_folding-enabled"
          />
          <div
            class="ace_gutter-active-line"
          />
        </div>
        <div
          class="ace_scroller"
        >
          <div
            class="ace_content"
          >
            <div
              class="ace_layer ace_print-margin-layer"
            >
              <div
                class="ace_print-margin"
                style="left: 4px; visibility: visible;"
              />
            </div>
            <div
              class="ace_layer ace_marker-layer"
            />
            <div
              class="ace_layer ace_text-layer"
              style="padding: 0px 4px;"
            />
            <div
              class="ace_layer ace_marker-layer"
            />
            <div
              class="ace_layer ace_cursor-layer ace_hidden-cursors"
            >
              <div
                class="ace_cursor"
              />
            </div>
          </div>
        </div>
        <div
          class="ace_scrollbar ace_scrollbar-v"
          style="display: none; width: 20px;"
        >
          <div
            class="ace_scrollbar-inner"
            style="width: 20px;"
          />
        </div>
        <div
          class="ace_scrollbar ace_scrollbar-h"
          style="display: none; height: 20px;"
        >
          <div
            class="ace_scrollbar-inner"
            style="height: 20px;"
          />
        </div>
        <div
          style="height: auto; width: auto; top: 0px; left: 0px; visibility: hidden; position: absolute; white-space: pre; overflow: hidden;"
        >
          <div
            style="height: auto; width: auto; top: 0px; left: 0px; visibility: hidden; position: absolute; white-space: pre; overflow: visible;"
          />
          <div
            style="height: auto; width: auto; top: 0px; left: 0px; visibility: hidden; position: absolute; white-space: pre; overflow: visible;"
          >
            XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
          </div>
        </div>
      </div>
    </div>
  </div>,
]
`;