src/tests/fixtures/frame_navigation.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Turbo</title>
    <script src="/dist/turbo.es2017-umd.js" data-turbo-track="reload"></script>
    <script src="/src/tests/fixtures/test.js"></script>
  </head>
  <body>
    <div id="container">
      <a id="outside" href="/src/tests/fixtures/frame_navigation.html" data-turbo-frame="frame">Outside Frame</a>

      <custom-link-element id="outside-in-shadow-dom" link="/src/tests/fixtures/frame_navigation.html" data-turbo-frame="frame">
        Outside Frame in Shadow DOM
      </custom-link-element>

      <turbo-frame id="frame">
        <h2>Frame Navigation</h2>

        <a id="inside" href="/src/tests/fixtures/frame_navigation.html">Inside Frame</a>
        <a id="self" href="/src/tests/fixtures/frame_navigation.html" data-turbo-frame="_self">Self Frame</a>
        <a id="top" href="/src/tests/fixtures/frame_navigation.html" data-turbo-frame="_top">Top</a>
      </turbo-frame>

      <div style="height: calc(100vh*2);"></div>

      <turbo-frame id="eager-loaded-frame" src="/src/tests/fixtures/frames/frame_for_eager.html" loading="lazy"
                   data-turbo-action="advance">
        <h2>Eager-loaded frame: Not Loaded</h2>
      </turbo-frame>
    </div>
  </body>
</html>