From ed273ca482ede65f457b3a89ed68afe4874bb96d Mon Sep 17 00:00:00 2001 From: Sean Doyle Date: Sun, 14 Nov 2021 20:48:35 -0500 Subject: [PATCH] Treat response `turbo-frame[disabled]` as missing When a response body has a `turbo-frame` element with an `[id]` that matches the requesting frame, ignore it if it's `[disabled]`. --- src/core/frames/frame_controller.ts | 4 ++-- src/tests/fixtures/frames/disabled.html | 13 +++++++++++++ .../fixtures/frames/disabled_recursive.html | 16 ++++++++++++++++ src/tests/fixtures/loading.html | 6 ++++++ src/tests/functional/frame_tests.ts | 3 +-- src/tests/functional/loading_tests.ts | 12 ++++++++++++ 6 files changed, 50 insertions(+), 4 deletions(-) create mode 100644 src/tests/fixtures/frames/disabled.html create mode 100644 src/tests/fixtures/frames/disabled_recursive.html diff --git a/src/core/frames/frame_controller.ts b/src/core/frames/frame_controller.ts index ee12f4b01..f573d9de5 100644 --- a/src/core/frames/frame_controller.ts +++ b/src/core/frames/frame_controller.ts @@ -291,11 +291,11 @@ export class FrameController implements AppearanceObserverDelegate, FetchRequest const id = CSS.escape(this.id) try { - if (element = activateElement(container.querySelector(`turbo-frame#${id}`), this.currentURL)) { + if (element = activateElement(container.querySelector(`turbo-frame:not([disabled])#${id}`), this.currentURL)) { return element } - if (element = activateElement(container.querySelector(`turbo-frame[src][recurse~=${id}]`), this.currentURL)) { + if (element = activateElement(container.querySelector(`turbo-frame:not([disabled])[src][recurse~=${id}]`), this.currentURL)) { await element.loaded return await this.extractForeignFrameElement(element, fetchResponse) } diff --git a/src/tests/fixtures/frames/disabled.html b/src/tests/fixtures/frames/disabled.html new file mode 100644 index 000000000..b38300b0c --- /dev/null +++ b/src/tests/fixtures/frames/disabled.html @@ -0,0 +1,13 @@ + + + + + Disabled Frame + + + + +

Frame: #disabled loaded

+
+ + diff --git a/src/tests/fixtures/frames/disabled_recursive.html b/src/tests/fixtures/frames/disabled_recursive.html new file mode 100644 index 000000000..ac48697bd --- /dev/null +++ b/src/tests/fixtures/frames/disabled_recursive.html @@ -0,0 +1,16 @@ + + + + + Disabled Recursive Frame + + + + +

Frame: #disabled_recursive loaded

+ +

Frame: #disabled_composer loaded

+
+
+ + diff --git a/src/tests/fixtures/loading.html b/src/tests/fixtures/loading.html index 9c0b9a673..6314f23ea 100644 --- a/src/tests/fixtures/loading.html +++ b/src/tests/fixtures/loading.html @@ -19,6 +19,12 @@ + + + + + +

One

diff --git a/src/tests/functional/frame_tests.ts b/src/tests/functional/frame_tests.ts index c6b79689e..e88e5a3e7 100644 --- a/src/tests/functional/frame_tests.ts +++ b/src/tests/functional/frame_tests.ts @@ -217,8 +217,7 @@ export class FrameTests extends TurboDriveTestCase { async "test 'turbo:frame-render' is triggered after frame has finished rendering"() { await this.clickSelector("#frame-part") - await this.nextEventNamed("turbo:frame-render") // recursive - const { fetchResponse } = await this.nextEventNamed("turbo:frame-render") + const { fetchResponse } = await this.nextEventOnTarget("part", "turbo:frame-render") this.assert.include(fetchResponse.response.url, "/src/tests/fixtures/frames/part.html") } diff --git a/src/tests/functional/loading_tests.ts b/src/tests/functional/loading_tests.ts index 328b5acb1..1847c8954 100644 --- a/src/tests/functional/loading_tests.ts +++ b/src/tests/functional/loading_tests.ts @@ -126,6 +126,18 @@ export class LoadingTests extends TurboDriveTestCase { const requestLogs = eventLogs.filter(([ name ]) => name == "turbo:before-fetch-request") this.assert.equal(requestLogs.length, 0) } + + async "test loading a page with a does not lazily load the matching frame"() { + await this.nextBeat + + this.assert.notOk(await this.hasSelector("#disabled h2")) + } + + async "test loading a page with a does not lazily loads the matching frame"() { + await this.nextBeat + + this.assert.notOk(await this.hasSelector("#disabled_recursive h2")) + } } LoadingTests.registerSuite()