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

exports[`Nav Dark Nav List 1`] = `
<DocumentFragment>
  <nav
    aria-label="Global"
    class="pf-c-nav test=nav-class"
    data-ouia-component-id="OUIA-Generated-Nav-4"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <ul
      class="pf-c-nav__list test-nav-list-class"
    >
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-13"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link1"
        >
          Link 1
        </a>
      </li>
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-14"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link2"
        >
          Link 2
        </a>
      </li>
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-15"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link3"
        >
          Link 3
        </a>
      </li>
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-16"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link4"
        >
          Link 4
        </a>
      </li>
    </ul>
  </nav>
</DocumentFragment>
`;

exports[`Nav Default Nav List - Trigger item active update 1`] = `
<DocumentFragment>
  <nav
    aria-label="Global"
    class="pf-c-nav"
    data-ouia-component-id="OUIA-Generated-Nav-5"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <ul
      class="pf-c-nav__list"
    >
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-17"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link1"
        >
          Link 1
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-18"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link2"
        >
          Link 2
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-19"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link3"
        >
          Link 3
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-20"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link4"
        >
          Link 4
        </a>
      </li>
    </ul>
  </nav>
</DocumentFragment>
`;

exports[`Nav Default Nav List 1`] = `
<DocumentFragment>
  <nav
    aria-label="Global"
    class="pf-c-nav test-nav-class"
    data-ouia-component-id="OUIA-Generated-Nav-1"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <ul
      class="pf-c-nav__list test-nav-list-class"
    >
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-1"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link1"
        >
          Link 1
        </a>
      </li>
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-2"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link2"
        >
          Link 2
        </a>
      </li>
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-3"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link3"
        >
          Link 3
        </a>
      </li>
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-4"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link4"
        >
          Link 4
        </a>
      </li>
    </ul>
  </nav>
</DocumentFragment>
`;

exports[`Nav Expandable Nav List - Trigger toggle 1`] = `
<DocumentFragment>
  <nav
    aria-label="Global"
    class="pf-c-nav"
    data-ouia-component-id="OUIA-Generated-Nav-1"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <ul
      class="pf-c-nav__list"
    >
      <li
        class="pf-c-nav__item pf-m-expandable expandable-group"
        data-ouia-component-id="OUIA-Generated-NavExpandable-1"
        data-ouia-component-type="PF4/NavExpandable"
        data-ouia-safe="true"
      >
        <button
          aria-expanded="false"
          class="pf-c-nav__link"
          id="grp-1"
        >
          Section 1
          <span
            class="pf-c-nav__toggle"
          >
            <span
              class="pf-c-nav__toggle-icon"
            >
              <svg
                aria-hidden="true"
                fill="currentColor"
                height="1em"
                role="img"
                style="vertical-align: -0.125em;"
                viewBox="0 0 256 512"
                width="1em"
              >
                <path
                  d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
                />
              </svg>
            </span>
          </span>
        </button>
        <section
          aria-labelledby="grp-1"
          class="pf-c-nav__subnav"
          hidden=""
        >
          <ul
            class="pf-c-nav__list"
          >
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-1"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link1"
              >
                Link 1
              </a>
            </li>
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-2"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link2"
              >
                Link 2
              </a>
            </li>
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-3"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link3"
              >
                Link 3
              </a>
            </li>
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-4"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link4"
              >
                Link 4
              </a>
            </li>
          </ul>
        </section>
      </li>
    </ul>
  </nav>
</DocumentFragment>
`;

exports[`Nav Expandable Nav List 1`] = `
<DocumentFragment>
  <nav
    aria-label="Global"
    class="pf-c-nav"
    data-ouia-component-id="OUIA-Generated-Nav-6"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <ul
      class="pf-c-nav__list"
    >
      <li
        class="pf-c-nav__item pf-m-expandable"
        data-ouia-component-id="OUIA-Generated-NavExpandable-1"
        data-ouia-component-type="PF4/NavExpandable"
        data-ouia-safe="true"
      >
        <button
          aria-expanded="false"
          class="pf-c-nav__link"
          id="grp-1"
        >
          Section 1
          <span
            class="pf-c-nav__toggle"
          >
            <span
              class="pf-c-nav__toggle-icon"
            >
              <svg
                aria-hidden="true"
                fill="currentColor"
                height="1em"
                role="img"
                style="vertical-align: -0.125em;"
                viewBox="0 0 256 512"
                width="1em"
              >
                <path
                  d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
                />
              </svg>
            </span>
          </span>
        </button>
        <section
          aria-labelledby="grp-1"
          class="pf-c-nav__subnav"
          hidden=""
        >
          <ul
            class="pf-c-nav__list"
          >
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-21"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link1"
              >
                Link 1
              </a>
            </li>
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-22"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link2"
              >
                Link 2
              </a>
            </li>
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-23"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link3"
              >
                Link 3
              </a>
            </li>
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-24"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link4"
              >
                Link 4
              </a>
            </li>
          </ul>
        </section>
      </li>
    </ul>
  </nav>
</DocumentFragment>
`;

exports[`Nav Expandable Nav List with aria label 1`] = `
<DocumentFragment>
  <nav
    aria-label="Test"
    class="pf-c-nav"
    data-ouia-component-id="OUIA-Generated-Nav-8"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <ul
      class="pf-c-nav__list"
    >
      <li
        class="pf-c-nav__item pf-m-expandable"
        data-ouia-component-id="OUIA-Generated-NavExpandable-3"
        data-ouia-component-type="PF4/NavExpandable"
        data-ouia-safe="true"
      >
        <button
          aria-expanded="false"
          class="pf-c-nav__link"
        >
          Section 1
          <span
            class="pf-c-nav__toggle"
          >
            <span
              class="pf-c-nav__toggle-icon"
            >
              <svg
                aria-hidden="true"
                fill="currentColor"
                height="1em"
                role="img"
                style="vertical-align: -0.125em;"
                viewBox="0 0 256 512"
                width="1em"
              >
                <path
                  d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
                />
              </svg>
            </span>
          </span>
        </button>
        <section
          aria-labelledby="grp-1"
          class="pf-c-nav__subnav"
          hidden=""
        >
          <h2
            class="pf-u-screen-reader"
            id="grp-1"
          >
            Section 1 - Example sub-navigation
          </h2>
          <ul
            class="pf-c-nav__list"
          >
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-29"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link1"
              >
                Link 1
              </a>
            </li>
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-30"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link2"
              >
                Link 2
              </a>
            </li>
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-31"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link3"
              >
                Link 3
              </a>
            </li>
            <li
              class="pf-c-nav__item"
              data-ouia-component-id="OUIA-Generated-NavItem-32"
              data-ouia-component-type="PF4/NavItem"
              data-ouia-safe="true"
            >
              <a
                class="pf-c-nav__link"
                href="#link4"
              >
                Link 4
              </a>
            </li>
          </ul>
        </section>
      </li>
    </ul>
  </nav>
</DocumentFragment>
`;

exports[`Nav Horizontal Nav List 1`] = `
<DocumentFragment>
  <nav
    aria-label="Global"
    class="pf-c-nav pf-m-horizontal"
    data-ouia-component-id="OUIA-Generated-Nav-horizontal-1"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <button
      aria-label="Scroll left"
      class="pf-c-nav__scroll-button"
      disabled=""
    >
      <svg
        aria-hidden="true"
        fill="currentColor"
        height="1em"
        role="img"
        style="vertical-align: -0.125em;"
        viewBox="0 0 256 512"
        width="1em"
      >
        <path
          d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
        />
      </svg>
    </button>
    <ul
      class="pf-c-nav__list"
    >
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-41"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link1"
        >
          Link 1
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-42"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link2"
        >
          Link 2
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-43"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link3"
        >
          Link 3
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-44"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link4"
        >
          Link 4
        </a>
      </li>
    </ul>
    <button
      aria-label="Scroll right"
      class="pf-c-nav__scroll-button"
      disabled=""
    >
      <svg
        aria-hidden="true"
        fill="currentColor"
        height="1em"
        role="img"
        style="vertical-align: -0.125em;"
        viewBox="0 0 256 512"
        width="1em"
      >
        <path
          d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
        />
      </svg>
    </button>
  </nav>
</DocumentFragment>
`;

exports[`Nav Horizontal SubNav List 1`] = `
<DocumentFragment>
  <nav
    aria-label="Global"
    class="pf-c-nav pf-m-horizontal-subnav"
    data-ouia-component-id="OUIA-Generated-Nav-horizontal-subnav-1"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <button
      aria-label="Scroll left"
      class="pf-c-nav__scroll-button"
      disabled=""
    >
      <svg
        aria-hidden="true"
        fill="currentColor"
        height="1em"
        role="img"
        style="vertical-align: -0.125em;"
        viewBox="0 0 256 512"
        width="1em"
      >
        <path
          d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
        />
      </svg>
    </button>
    <ul
      class="pf-c-nav__list"
    >
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-45"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link1"
        >
          Link 1
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-46"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link2"
        >
          Link 2
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-47"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link3"
        >
          Link 3
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-48"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link4"
        >
          Link 4
        </a>
      </li>
    </ul>
    <button
      aria-label="Scroll right"
      class="pf-c-nav__scroll-button"
      disabled=""
    >
      <svg
        aria-hidden="true"
        fill="currentColor"
        height="1em"
        role="img"
        style="vertical-align: -0.125em;"
        viewBox="0 0 256 512"
        width="1em"
      >
        <path
          d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
        />
      </svg>
    </button>
  </nav>
</DocumentFragment>
`;

exports[`Nav Nav Grouped List 1`] = `
<DocumentFragment>
  <nav
    aria-label="Global"
    class="pf-c-nav"
    data-ouia-component-id="OUIA-Generated-Nav-9"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <section
      aria-labelledby="grp-1"
      class="pf-c-nav__section"
    >
      <h2
        class="pf-c-nav__section-title"
        id="grp-1"
      >
        Section 1
      </h2>
      <ul
        class="pf-c-nav__list"
      >
        <ul
          class="pf-c-nav__list"
        >
          <li
            class="pf-c-nav__item"
            data-ouia-component-id="OUIA-Generated-NavItem-33"
            data-ouia-component-type="PF4/NavItem"
            data-ouia-safe="true"
          >
            <a
              class="pf-c-nav__link"
              href="#link1"
            >
              Link 1
            </a>
          </li>
          <li
            class="pf-c-nav__item"
            data-ouia-component-id="OUIA-Generated-NavItem-34"
            data-ouia-component-type="PF4/NavItem"
            data-ouia-safe="true"
          >
            <a
              class="pf-c-nav__link"
              href="#link2"
            >
              Link 2
            </a>
          </li>
          <li
            class="pf-c-nav__item"
            data-ouia-component-id="OUIA-Generated-NavItem-35"
            data-ouia-component-type="PF4/NavItem"
            data-ouia-safe="true"
          >
            <a
              class="pf-c-nav__link"
              href="#link3"
            >
              Link 3
            </a>
          </li>
          <li
            class="pf-c-nav__item"
            data-ouia-component-id="OUIA-Generated-NavItem-36"
            data-ouia-component-type="PF4/NavItem"
            data-ouia-safe="true"
          >
            <a
              class="pf-c-nav__link"
              href="#link4"
            >
              Link 4
            </a>
          </li>
        </ul>
      </ul>
    </section>
    <section
      aria-labelledby="grp-2"
      class="pf-c-nav__section"
    >
      <h2
        class="pf-c-nav__section-title"
        id="grp-2"
      >
        Section 2
      </h2>
      <ul
        class="pf-c-nav__list"
      >
        <ul
          class="pf-c-nav__list"
        >
          <li
            class="pf-c-nav__item"
            data-ouia-component-id="OUIA-Generated-NavItem-37"
            data-ouia-component-type="PF4/NavItem"
            data-ouia-safe="true"
          >
            <a
              class="pf-c-nav__link"
              href="#link1"
            >
              Link 1
            </a>
          </li>
          <li
            class="pf-c-nav__item"
            data-ouia-component-id="OUIA-Generated-NavItem-38"
            data-ouia-component-type="PF4/NavItem"
            data-ouia-safe="true"
          >
            <a
              class="pf-c-nav__link"
              href="#link2"
            >
              Link 2
            </a>
          </li>
          <li
            class="pf-c-nav__item"
            data-ouia-component-id="OUIA-Generated-NavItem-39"
            data-ouia-component-type="PF4/NavItem"
            data-ouia-safe="true"
          >
            <a
              class="pf-c-nav__link"
              href="#link3"
            >
              Link 3
            </a>
          </li>
          <li
            class="pf-c-nav__item"
            data-ouia-component-id="OUIA-Generated-NavItem-40"
            data-ouia-component-type="PF4/NavItem"
            data-ouia-safe="true"
          >
            <a
              class="pf-c-nav__link"
              href="#link4"
            >
              Link 4
            </a>
          </li>
        </ul>
      </ul>
    </section>
  </nav>
</DocumentFragment>
`;

exports[`Nav Nav List with custom item nodes 1`] = `
<DocumentFragment>
  <nav
    aria-label="Local"
    class="pf-c-nav pf-m-horizontal pf-m-tertiary"
    data-ouia-component-id="OUIA-Generated-Nav-tertiary-2"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <button
      aria-label="Scroll left"
      class="pf-c-nav__scroll-button"
      disabled=""
    >
      <svg
        aria-hidden="true"
        fill="currentColor"
        height="1em"
        role="img"
        style="vertical-align: -0.125em;"
        viewBox="0 0 256 512"
        width="1em"
      >
        <path
          d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
        />
      </svg>
    </button>
    <ul
      class="pf-c-nav__list"
    >
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-53"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <div
          class="pf-c-nav__link my-custom-node"
        >
          My custom node
        </div>
      </li>
    </ul>
    <button
      aria-label="Scroll right"
      class="pf-c-nav__scroll-button"
      disabled=""
    >
      <svg
        aria-hidden="true"
        fill="currentColor"
        height="1em"
        role="img"
        style="vertical-align: -0.125em;"
        viewBox="0 0 256 512"
        width="1em"
      >
        <path
          d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
        />
      </svg>
    </button>
  </nav>
</DocumentFragment>
`;

exports[`Nav Renders nav list in strict mode 1`] = `
<DocumentFragment>
  <nav
    aria-label="Global"
    class="pf-c-nav test-nav-class"
    data-ouia-component-id="OUIA-Generated-Nav-3"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <ul
      class="pf-c-nav__list test-nav-list-class"
    >
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-6"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link1"
        >
          Link 1
        </a>
      </li>
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-8"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link2"
        >
          Link 2
        </a>
      </li>
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-10"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link3"
        >
          Link 3
        </a>
      </li>
      <li
        class="pf-c-nav__item test-nav-item-class"
        data-ouia-component-id="OUIA-Generated-NavItem-12"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link test-nav-item-class"
          href="#link4"
        >
          Link 4
        </a>
      </li>
    </ul>
  </nav>
</DocumentFragment>
`;

exports[`Nav Tertiary Nav List 1`] = `
<DocumentFragment>
  <nav
    aria-label="Local"
    class="pf-c-nav pf-m-horizontal pf-m-tertiary"
    data-ouia-component-id="OUIA-Generated-Nav-tertiary-1"
    data-ouia-component-type="PF4/Nav"
    data-ouia-safe="true"
  >
    <button
      aria-label="Scroll left"
      class="pf-c-nav__scroll-button"
      disabled=""
    >
      <svg
        aria-hidden="true"
        fill="currentColor"
        height="1em"
        role="img"
        style="vertical-align: -0.125em;"
        viewBox="0 0 256 512"
        width="1em"
      >
        <path
          d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
        />
      </svg>
    </button>
    <ul
      class="pf-c-nav__list"
    >
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-49"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link1"
        >
          Link 1
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-50"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link2"
        >
          Link 2
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-51"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link3"
        >
          Link 3
        </a>
      </li>
      <li
        class="pf-c-nav__item"
        data-ouia-component-id="OUIA-Generated-NavItem-52"
        data-ouia-component-type="PF4/NavItem"
        data-ouia-safe="true"
      >
        <a
          class="pf-c-nav__link"
          href="#link4"
        >
          Link 4
        </a>
      </li>
    </ul>
    <button
      aria-label="Scroll right"
      class="pf-c-nav__scroll-button"
      disabled=""
    >
      <svg
        aria-hidden="true"
        fill="currentColor"
        height="1em"
        role="img"
        style="vertical-align: -0.125em;"
        viewBox="0 0 256 512"
        width="1em"
      >
        <path
          d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
        />
      </svg>
    </button>
  </nav>
</DocumentFragment>
`;
