Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix Turbo Frame prefetching bug #1198

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 4 additions & 3 deletions src/tests/fixtures/hover_to_prefetch.html
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
<!DOCTYPE html>
<html>
<html id="html">
<head>
<meta charset="utf-8" />
<title>Hover to Prefetch</title>
<script src="/dist/turbo.es2017-umd.js" data-turbo-track="reload"></script>
<script src="/src/tests/fixtures/test.js"></script>
<meta name="turbo-prefetch" content="true" />
</head>

Expand Down Expand Up @@ -49,11 +50,11 @@
<iframe src="/src/tests/fixtures/hover_to_prefetch_iframe.html" name="prefetch_iframe"> </iframe>

<turbo-frame id="frame_for_prefetch">
<a href="/src/tests/fixtures/prefetched.html" id="anchor_for_prefetch_in_frame">Hover to prefetch me</a>
<a href="/src/tests/fixtures/prefetched.html" id="anchor_for_prefetch_in_frame">Hover to prefetch /prefetched.html frame</a>
</turbo-frame>

<turbo-frame id="frame_for_prefetch_top" target="_top">
<a href="/src/tests/fixtures/prefetched.html" id="anchor_for_prefetch_in_frame_target_top">Hover to prefetch me</a>
<a href="/src/tests/fixtures/prefetched.html" id="anchor_for_prefetch_in_frame_target_top">Hover to prefetch /prefetched.html page</a>
</turbo-frame>
</body>
</html>
33 changes: 31 additions & 2 deletions src/tests/functional/link_prefetch_observer_tests.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { test } from "@playwright/test"
import { expect, test } from "@playwright/test"
import { assert } from "chai"
import { nextBeat, sleep } from "../helpers/page"
import { nextBeat, nextEventOnTarget, sleep } from "../helpers/page"
import fs from "fs"
import path from "path"

Expand Down Expand Up @@ -182,6 +182,35 @@ test("it prefetches links inside a turbo frame", async ({ page }) => {
}})
})

test("prefetching a page-wide request does not affect frame requests", async ({ page }) => {
await goTo({ page, path: "/hover_to_prefetch.html" })

const pageLink = page.locator("#anchor_for_prefetch_in_frame_target_top")
const frameLink = page.locator("#anchor_for_prefetch_in_frame")

await pageLink.hover()
await sleep(25)
await frameLink.click()

const frameRequest = await nextEventOnTarget(page, "frame_for_prefetch", "turbo:before-fetch-request")

expect(frameRequest.fetchOptions.headers["Turbo-Frame"]).toEqual("frame_for_prefetch")
})

test("prefetching a frame request does not affect page-wide requests", async ({ page }) => {
await goTo({ page, path: "/hover_to_prefetch.html" })

const pageLink = page.locator("#anchor_for_prefetch_in_frame_target_top")
const frameLink = page.locator("#anchor_for_prefetch_in_frame")

await frameLink.hover()
await sleep(25)
await pageLink.click()

const pageRequest = await nextEventOnTarget(page, "html", "turbo:before-fetch-request")

expect(pageRequest.fetchOptions.headers["Turbo-Frame"]).toEqual(undefined)
})

test("doesn't include a turbo-frame header when the link is inside a turbo frame with a target=_top", async ({ page}) => {
await goTo({ page, path: "/hover_to_prefetch.html" })
Expand Down
Loading