Merge pull request #212 from seanpdoyle/frame-loading-lazy-anchor

Navigate a lazy-loaded turbo-frame

src/core/frames/frame_controller.ts

@@ -22,6 +22,7 @@ export class FrameController implements AppearanceObserverDelegate, FetchRequest
   formSubmission?: FormSubmission
   private resolveVisitPromise = () => {}
   private connected = false
+  private hasBeenLoaded = false
 
   constructor(element: FrameElement) {
     this.element = element
@@ -53,7 +54,7 @@ export class FrameController implements AppearanceObserverDelegate, FetchRequest
   }
 
   sourceURLChanged() {
-    if (this.loadingStyle == FrameLoadingStyle.eager) {
+    if (this.loadingStyle == FrameLoadingStyle.eager || this.hasBeenLoaded) {
       this.loadSourceURL()
     }
   }
@@ -76,6 +77,7 @@ export class FrameController implements AppearanceObserverDelegate, FetchRequest
           this.element.loaded = this.visit(this.sourceURL)
           this.appearanceObserver.stop()
           await this.element.loaded
+          this.hasBeenLoaded = true
         } catch (error) {
           this.currentURL = previousURL
           throw error

src/tests/fixtures/frames/hello.html

@@ -10,6 +10,8 @@
     <h1>Form</h1>
     <turbo-frame id="hello">
       <h2>Hello from a frame</h2>
+
+      <a href="/src/tests/fixtures/frames.html">Navigate #hello</a>
     </turbo-frame>
   </body>
 </html>

src/tests/functional/loading_tests.ts

@@ -43,6 +43,20 @@ export class LoadingTests extends TurboDriveTestCase {
     this.assert.equal(await contents.getVisibleText(), "Hello from a frame")
   }
 
+  async "test navigating a visible frame with loading=lazy navigates"() {
+    await this.clickSelector("#loading-lazy summary")
+    await this.nextBeat
+
+    const initialContents = await this.querySelector("#hello h2")
+    this.assert.equal(await initialContents.getVisibleText(), "Hello from a frame")
+
+    await this.clickSelector("#hello a")
+    await this.nextBeat
+
+    const navigatedContents = await this.querySelector("#hello h2")
+    this.assert.equal(await navigatedContents.getVisibleText(), "Frames: #hello")
+  }
+
   async "test changing src attribute on a frame with loading=lazy defers navigation"() {
     const frameContents = "#loading-lazy turbo-frame h2"
     await this.nextBeat