From 06d66fc4990bf240185a65b404eca03bf8a3df59 Mon Sep 17 00:00:00 2001 From: Julian Rubisch Date: Thu, 5 Oct 2023 07:57:38 +0200 Subject: [PATCH 1/2] chore: Rewrite preloadLinkObserver in pure JS --- src/core/drive/preloader.js | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/src/core/drive/preloader.js b/src/core/drive/preloader.js index b971cea19..07d5f2f43 100644 --- a/src/core/drive/preloader.js +++ b/src/core/drive/preloader.js @@ -5,6 +5,13 @@ export class Preloader { constructor(delegate) { this.delegate = delegate + this.preloadLinkObserver = new MutationObserver((mutationList, observer) => { + mutationList.forEach((mutation) => { + if (mutation.attributeName !== "data-turbo-preload" || mutation.target.tagName !== "A") return + + this.preloadURL(mutation.target) + }) + }) } get snapshotCache() { @@ -15,9 +22,11 @@ export class Preloader { if (document.readyState === "loading") { return document.addEventListener("DOMContentLoaded", () => { this.preloadOnLoadLinksForView(document.body) + this.observeLinksForView(document.body) }) } else { this.preloadOnLoadLinksForView(document.body) + this.observeLinksForView(document.body) } } @@ -27,6 +36,13 @@ export class Preloader { } } + observeLinksForView(element) { + this.preloadLinkObserver.observe(element, { + attributes: true, + subtree: true + }) + } + async preloadURL(link) { const location = new URL(link.href) From ec656900306978efd5e4d9e6a417f8112b43c7ec Mon Sep 17 00:00:00 2001 From: Julian Rubisch Date: Thu, 5 Oct 2023 09:30:34 +0200 Subject: [PATCH 2/2] test: Add dynamic preloader test --- src/tests/fixtures/dynamic_preloading.html | 16 ++++++++++++++++ src/tests/functional/preloader_tests.js | 19 +++++++++++++++++++ 2 files changed, 35 insertions(+) create mode 100644 src/tests/fixtures/dynamic_preloading.html diff --git a/src/tests/fixtures/dynamic_preloading.html b/src/tests/fixtures/dynamic_preloading.html new file mode 100644 index 000000000..de2dd487a --- /dev/null +++ b/src/tests/fixtures/dynamic_preloading.html @@ -0,0 +1,16 @@ + + + + + + Preloading Page + + + + + + Visit preloaded page + + + + diff --git a/src/tests/functional/preloader_tests.js b/src/tests/functional/preloader_tests.js index ecd7ca619..389ae95b0 100644 --- a/src/tests/functional/preloader_tests.js +++ b/src/tests/functional/preloader_tests.js @@ -51,3 +51,22 @@ test("test navigates to preloaded snapshot from frame", async ({ page }) => { }) ) }) + +test("test preloads snapshot after adding data-turbo-preload attribute at runtime", async ({ page }) => { + await page.goto("/src/tests/fixtures/dynamic_preloading.html") + await nextBeat() + + await page.evaluate(async () => { + document.querySelector("#preload_anchor").setAttribute("data-turbo-preload", "true") + }) + await nextBeat() + + assert.ok( + await page.evaluate(async () => { + const preloadedUrl = new URL("http://localhost:9000/src/tests/fixtures/preloaded.html") + const cache = window.Turbo.session.preloader.snapshotCache + + return await cache.has(preloadedUrl) + }) + ) +})