From 8c706bb894e05ea14448f0098aa32a7446836332 Mon Sep 17 00:00:00 2001 From: David Alejandro <15317732+davidalejandroaguilar@users.noreply.github.com> Date: Mon, 20 May 2024 11:11:02 +0200 Subject: [PATCH] Fix test to verify no network request on prefetched link click (#1257) * Fix test not making a network request after prefetch click The test was supposed to assert that a network request was not made when clicking on a link that had been prefetched by hovering over it. However, the test was not actually making the click, just trying to hover over an already hovered link, so this wasn't really testing what it was supposed to. * assertRequestMade and assertRequestNotMade take functions as arguments These functions are called to perform the action that should trigger the network request. This allows us to test different scenarios without repeating the same code. It also allows us to pass a callback that will be called with the request object when the request is made. This is useful for testing the request object itself. --- .../link_prefetch_observer_tests.js | 99 +++++++++---------- 1 file changed, 48 insertions(+), 51 deletions(-) diff --git a/src/tests/functional/link_prefetch_observer_tests.js b/src/tests/functional/link_prefetch_observer_tests.js index 735efb7fb..361c8b020 100644 --- a/src/tests/functional/link_prefetch_observer_tests.js +++ b/src/tests/functional/link_prefetch_observer_tests.js @@ -195,35 +195,28 @@ test("doesn't include a turbo-frame header when the link is inside a turbo frame test("it prefetches links with a delay", async ({ page }) => { await goTo({ page, path: "/hover_to_prefetch.html" }) - let requestMade = false - page.on("request", async (request) => (requestMade = true)) - - await page.hover("#anchor_for_prefetch") - await sleep(75) - - assertRequestNotMade(requestMade) - - await sleep(100) + await assertRequestNotMade(page, async () => { + await page.hover("#anchor_for_prefetch") + await sleep(75) + }) - assertRequestMade(requestMade) + await assertRequestMade(page, async () => { + await sleep(100) + }) }) test("it cancels the prefetch request if the link is no longer hovered", async ({ page }) => { await goTo({ page, path: "/hover_to_prefetch.html" }) - let requestMade = false - page.on("request", async (request) => (requestMade = true)) - - await page.hover("#anchor_for_prefetch") - await sleep(75) - - assertRequestNotMade(requestMade) - - await page.mouse.move(0, 0) - - await sleep(100) + await assertRequestNotMade(page, async () => { + await page.hover("#anchor_for_prefetch") + await sleep(75) + }) - assertRequestNotMade(requestMade) + await assertRequestNotMade(page, async () => { + await page.mouse.move(0, 0) + await sleep(100) + }) }) test("it resets the cache when a link is hovered", async ({ page }) => { @@ -246,11 +239,8 @@ test("it resets the cache when a link is hovered", async ({ page }) => { test("it does not make a network request when clicking on a link that has been prefetched", async ({ page }) => { await goTo({ page, path: "/hover_to_prefetch.html" }) - await hoverSelector({ page, selector: "#anchor_for_prefetch" }) - - await sleep(100) - - await assertNotPrefetchedOnHover({ page, selector: "#anchor_for_prefetch" }) + await assertPrefetchedOnHover({ page, selector: "#anchor_for_prefetch" }) + await assertRequestNotMadeOnClick({ page, selector: "#anchor_for_prefetch" }) }) test("it follows the link using the cached response when clicking on a link that has been prefetched", async ({ @@ -264,44 +254,51 @@ test("it follows the link using the cached response when clicking on a link that }) const assertPrefetchedOnHover = async ({ page, selector, callback }) => { - let requestMade = false + await assertRequestMade(page, async () => { + await hoverSelector({ page, selector }) + + await sleep(100) + }, callback) +} - page.on("request", (request) => { - requestMade = request +const assertNotPrefetchedOnHover = async ({ page, selector, callback }) => { + await assertRequestNotMade(page, async () => { + await hoverSelector({ page, selector }) + + await sleep(100) + }, callback) +} + +const assertRequestNotMadeOnClick = async ({ page, selector }) => { + await assertRequestNotMade(page, async () => { + await clickSelector({ page, selector }) }) +} - await hoverSelector({ page, selector }) +const assertRequestMade = async (page, action, callback) => { + let requestMade = false + page.on("request", async (request) => requestMade = request) - await sleep(100) + await action() + + assert.equal(!!requestMade, true, "Network request wasn't made when it should have been.") if (callback) { await callback(requestMade) } - - assertRequestMade(!!requestMade) } -const assertNotPrefetchedOnHover = async ({ page, selector, callback }) => { +const assertRequestNotMade = async (page, action, callback) => { let requestMade = false + page.on("request", async (request) => requestMade = request) - page.on("request", (request) => { - callback && callback(request) - requestMade = true - }) - - await hoverSelector({ page, selector }) - - await sleep(100) - - assert.equal(requestMade, false, "Network request was made when it should not have been.") -} + await action() -const assertRequestMade = (requestMade) => { - assert.equal(requestMade, true, "Network request wasn't made when it should have been.") -} + assert.equal(!!requestMade, false, "Network request was made when it should not have been.") -const assertRequestNotMade = (requestMade) => { - assert.equal(requestMade, false, "Network request was made when it should not have been.") + if (callback) { + await callback(requestMade) + } } const goTo = async ({ page, path }) => {