DRY-up tests a little bit and tidy them

Author: rosa

src/tests/fixtures/service_workers/cache_trimming.js

@@ -5,7 +5,7 @@ importScripts("/dist/turbo-offline-umd.js")
 TurboOffline.addRule({
   match: /\/dynamic\.txt/,
   handler: TurboOffline.handlers.cacheFirst({
-    cacheName: "test-cache-trimming-short",
+    cacheName: "test-cache-short-lived",
     maxAge: 0.5 // Only 500ms for testing
   })
 })

src/tests/functional/offline_tests.js

@@ -1,6 +1,6 @@
 import { test } from "@playwright/test"
 import { assert } from "chai"
-import { clearAllCaches, getCacheStatus, registerServiceWorker, unregisterServiceWorker, testFetch, waitForServiceWorkerToControl, getCachedResponse, setNetworkDelay } from "../helpers/offline"
+import { clearAllCaches, registerServiceWorker, unregisterServiceWorker, testFetch, waitForServiceWorkerToControl, getCachedResponse, setNetworkDelay } from "../helpers/offline"
 
 test.beforeEach(async ({ page }) => {
   await page.goto("/src/tests/fixtures/bare.html")
@@ -21,22 +21,14 @@ test("registers service worker and intercepts and caches requests with cache-fir
 
   const dynamicTxtUrl = "/__turbo/dynamic.txt"
 
-  const firstTxtResponse = await testFetch(page, dynamicTxtUrl)
-  assert.equal(firstTxtResponse.ok, true)
-  const firstContent = firstTxtResponse.text.trim()
+  const firstContent = await fetchContent(page, dynamicTxtUrl)
 
   // Wait a bit for the response to be cached
   await page.waitForTimeout(200)
 
-  // Check the cached content
-  const fullUrl = "http://localhost:9000" + dynamicTxtUrl
-  const cachedResponse = await getCachedResponse(page, "test-cache-first", fullUrl)
-  assert.isTrue(cachedResponse.found)
-  assert.equal(cachedResponse.text.trim(), firstContent, "Cached content should match first response")
+  await assertCachedContent(page, "test-cache-first", dynamicTxtUrl, firstContent)
 
-  const secondTxtResponse = await testFetch(page, dynamicTxtUrl)
-  assert.equal(secondTxtResponse.ok, true)
-  const secondContent = secondTxtResponse.text.trim()
+  const secondContent = await fetchContent(page, dynamicTxtUrl)
 
   assert.equal(secondContent, firstContent, "Second request should return identical content from cache")
 })
@@ -48,27 +40,20 @@ test("registers service worker and intercepts and caches requests with network-f
   const dynamicTxtUrl = "/__turbo/dynamic.txt"
 
   // First request to dynamic text file - should hit network and cache unique content
-  const firstTxtResponse = await testFetch(page, dynamicTxtUrl)
-  assert.equal(firstTxtResponse.ok, true)
-  const firstContent = firstTxtResponse.text.trim()
+  const firstContent = await fetchContent(page, dynamicTxtUrl)
 
-  // Check the cached content
-  const fullUrl = "http://localhost:9000" + dynamicTxtUrl
-  const cachedResponse = await getCachedResponse(page, "test-network-first", fullUrl)
-  assert.isTrue(cachedResponse.found)
-  assert.equal(cachedResponse.text.trim(), firstContent, "Cached content should match first response")
+  // Wait a bit for the response to be cached
+  await page.waitForTimeout(200)
+  await assertCachedContent(page, "test-network-first", dynamicTxtUrl, firstContent)
 
   // Second request - should hit the network again
-  const secondTxtResponse = await testFetch(page, dynamicTxtUrl)
-  assert.equal(secondTxtResponse.ok, true)
-  const secondContent = secondTxtResponse.text.trim()
+  const secondContent = await fetchContent(page, dynamicTxtUrl)
 
   assert.notEqual(secondContent, firstContent, "Second request should return different content from network")
 
   // The cached content should have been refreshed as well
-  const cachedResponseAfterSecondRequest = await getCachedResponse(page, "test-network-first", fullUrl)
-  assert.isTrue(cachedResponseAfterSecondRequest.found)
-  assert.notEqual(cachedResponseAfterSecondRequest.text.trim(), cachedResponse.text.trim(), "Cached content should have changed")
+  const cachedContentAfterSecondRequest = await getCachedContent(page, "test-network-first", dynamicTxtUrl)
+  assert.notEqual(cachedContentAfterSecondRequest, firstContent, "Cached content should have changed")
 })
 
 test("registers service worker and intercepts and caches requests with stale-while-revalidate strategy", async ({ page }) => {
@@ -78,28 +63,20 @@ test("registers service worker and intercepts and caches requests with stale-whi
   const dynamicTxtUrl = "/__turbo/dynamic.txt"
 
   // First request to dynamic text file - should hit network and cache unique content
-  const firstTxtResponse = await testFetch(page, dynamicTxtUrl)
-  assert.equal(firstTxtResponse.ok, true)
-  const firstContent = firstTxtResponse.text.trim()
+  const firstContent = await fetchContent(page, dynamicTxtUrl)
 
-  // Check the cached content
-  const fullUrl = "http://localhost:9000" + dynamicTxtUrl
-  const cachedResponse = await getCachedResponse(page, "test-stale-while-revalidate", fullUrl)
-  assert.isTrue(cachedResponse.found)
-  assert.equal(cachedResponse.text.trim(), firstContent, "Cached content should match first response")
+  // Wait a bit for the response to be cached
+  await page.waitForTimeout(200)
+  await assertCachedContent(page, "test-stale-while-revalidate", dynamicTxtUrl, firstContent)
 
   // Second request - should return the cached response but refresh it in the background
-  const secondTxtResponse = await testFetch(page, dynamicTxtUrl)
-  assert.equal(secondTxtResponse.ok, true)
-  const secondContent = secondTxtResponse.text.trim()
-
+  const secondContent = await fetchContent(page, dynamicTxtUrl)
   assert.equal(secondContent, firstContent, "Second request should return identical content from cache")
 
   // Now check that the cached content was refreshed
   await page.waitForTimeout(200)
-  const cachedResponseAfterSecondRequest = await getCachedResponse(page, "test-stale-while-revalidate", fullUrl)
-  assert.isTrue(cachedResponseAfterSecondRequest.found)
-  assert.notEqual(cachedResponseAfterSecondRequest.text.trim(), cachedResponse.text.trim(), "Cached content should have changed")
+  const cachedContentAfterSecondRequest = await getCachedContent(page, "test-stale-while-revalidate", dynamicTxtUrl)
+  assert.notEqual(cachedContentAfterSecondRequest, firstContent, "Cached content should have changed")
 })
 
 test("doesn't intercept non-matching requests", async ({ page }) => {
@@ -123,10 +100,7 @@ test("doesn't intercept non-matching requests", async ({ page }) => {
   assert.notEqual(secondJsonData.timestamp, firstJsonData.timestamp, "Timestamps should have changed")
   assert.notEqual(secondJsonData.requestId, firstJsonData.requestId, "Request IDs should be different")
 
-  const cacheStatus = await getCacheStatus(page)
-
-  // Should not have our test cache since no matching requests were made
-  assert.isFalse(Object.keys(cacheStatus).includes("test-cache-first"), "Test cache should not exist for non-matching requests")
+  await assertNotCached(page, "test-cache-first", dynamicJsonUrl)
 })
 
 test("registers service worker as a module and intercepts and caches requests", async ({ page, browserName }) => {
@@ -138,13 +112,8 @@ test("registers service worker as a module and intercepts and caches requests",
 
   const dynamicTxtUrl = "/__turbo/dynamic.txt"
 
-  const firstTxtResponse = await testFetch(page, dynamicTxtUrl)
-  assert.equal(firstTxtResponse.ok, true)
-  const firstContent = firstTxtResponse.text.trim()
-
-  const secondTxtResponse = await testFetch(page, dynamicTxtUrl)
-  assert.equal(secondTxtResponse.ok, true)
-  const secondContent = secondTxtResponse.text.trim()
+  const firstContent = await fetchContent(page, dynamicTxtUrl)
+  const secondContent = await fetchContent(page, dynamicTxtUrl)
 
   assert.equal(secondContent, firstContent, "Second request should return identical content from cache")
 })
@@ -158,38 +127,22 @@ test("applies different handlers to different requests based on different rules"
   const dynamicJsonUrl = "/__turbo/dynamic.json"
 
   // Request cached with network-first
-  const jsonResponse = await testFetch(page, dynamicJsonUrl)
-  assert.equal(jsonResponse.ok, true)
-
-  let fullUrl = "http://localhost:9000" + dynamicJsonUrl
-  let cachedResponse = await getCachedResponse(page, "test-network-first", fullUrl)
-  assert.isTrue(cachedResponse.found)
-  assert.equal(cachedResponse.text.trim(), jsonResponse.text.trim(), "Cached content should match response")
+  const jsonContent = await fetchContent(page, dynamicJsonUrl)
+  await assertCachedContent(page, "test-network-first", dynamicJsonUrl, jsonContent)
 
   // Request without header - should NOT be cached
   const notCachedTxtResponse = await testFetch(page, dynamicTxtUrl)
   assert.equal(notCachedTxtResponse.ok, true)
+  await assertNotCached(page, "test-cache-first", dynamicTxtUrl)
 
-  // Verify it wasn't cached (no matching rule)
-  fullUrl = "http://localhost:9000" + dynamicTxtUrl
-  cachedResponse = await getCachedResponse(page, "test-cache-first", fullUrl)
-  assert.isFalse(cachedResponse.found, "Response for request without X-Cache header should not be cached")
 
   // Request with header - should be cached
-  const cachedTxtResponse = await testFetch(page, dynamicTxtUrl, { "X-Cache": "yes" })
-  assert.equal(cachedTxtResponse.ok, true)
-
-  // Wait a bit for caching
-  await page.waitForTimeout(200)
-
-  // Verify it was cached
-  cachedResponse = await getCachedResponse(page, "test-cache-first", fullUrl)
-  assert.isTrue(cachedResponse.found, "Response for request with X-Cache header should be cached")
-  assert.equal(cachedResponse.text.trim(), cachedTxtResponse.text.trim(), "Cached content should match response requested with header")
+  const cachedTxtContent = await fetchContent(page, dynamicTxtUrl, { "X-Cache": "yes" })
+  await assertCachedContent(page, "test-cache-first", dynamicTxtUrl, cachedTxtContent)
 
   // Make the same request again - should return cached content
-  const secondCachedTxtResponse = await testFetch(page, dynamicTxtUrl, { "X-Cache": "yes" })
-  assert.equal(secondCachedTxtResponse.text.trim(), cachedTxtResponse.text.trim(), "Second request with header should return cached content")
+  const secondCachedTxtContent = await fetchContent(page, dynamicTxtUrl, { "X-Cache": "yes" })
+  assert.equal(secondCachedTxtContent, cachedTxtContent, "Second request with header should return cached content")
 })
 
 test("network timeout triggers cache fallback for network-first", async ({ page }) => {
@@ -198,11 +151,9 @@ test("network timeout triggers cache fallback for network-first", async ({ page
 
   const dynamicTxtUrl = "/__turbo/dynamic.txt"
 
-  const initialResponse = await testFetch(page, dynamicTxtUrl)
-  assert.equal(initialResponse.ok, true)
-  const initialContent = initialResponse.text.trim()
+  const initialContent = await fetchContent(page, dynamicTxtUrl)
 
-  // Set a long delay that exceeds the network timeout (2 seconds)
+  // Set a long delay that exceeds the network timeout configured in the network-first service worker
   await setNetworkDelay(page, 5000)
 
   const timeoutResponse = await testFetch(page, dynamicTxtUrl)
@@ -217,61 +168,70 @@ test("deletes cached entries after maxAge per cache", async ({ page }) => {
   const dynamicTxtUrl = "/__turbo/dynamic.txt"
   const dynamicJsonUrl = "/__turbo/dynamic.json"
 
-  // Cache in short-lived cache using X-Cache header (0.5 second maxAge)
-  const shortLivedResponse = await testFetch(page, dynamicTxtUrl)
-  assert.equal(shortLivedResponse.ok, true)
+  // Cache in short-lived cache using (0.5 second maxAge)
+  const shortLivedContent = await fetchContent(page, dynamicTxtUrl)
 
   // Cache in long-lived cache (5 minute maxAge)
-  const longLivedResponse = await testFetch(page, dynamicJsonUrl)
-  assert.equal(longLivedResponse.ok, true)
+  const longLivedContent = await fetchContent(page, dynamicJsonUrl)
 
   // Wait for caching to complete
   await page.waitForTimeout(200)
 
   // Verify both are cached
-  const shortLivedUrl = "http://localhost:9000" + dynamicTxtUrl
-  const longLivedUrl = "http://localhost:9000" + dynamicJsonUrl
-
-  let shortLivedCached = await getCachedResponse(page, "test-cache-trimming-short", shortLivedUrl)
-  let longLivedCached = await getCachedResponse(page, "test-cache-stable", longLivedUrl)
-
-  assert.isTrue(shortLivedCached.found, "Short-lived cache entry should be cached")
-  assert.isTrue(longLivedCached.found, "Long-lived cache entry should be cached")
+  await assertCachedContent(page, "test-cache-short-lived", dynamicTxtUrl, shortLivedContent)
+  await assertCachedContent(page, "test-cache-stable", dynamicJsonUrl, longLivedContent)
 
   // Wait for the short-lived cache to expire (0.5 seconds + buffer)
   await page.waitForTimeout(750)
 
   // Make a request to a different URL to trigger caching (and therefore trimming)
   const triggerTrimUrl = "/__turbo/dynamic.txt?trigger=trim"
-  const firstTriggerTrimResponse = await testFetch(page, triggerTrimUrl)
-  assert.equal(firstTriggerTrimResponse.ok, true)
+  const firstTriggerTrimContent = await fetchContent(page, triggerTrimUrl)
 
   // Wait a bit for trimming to potentially complete
   await page.waitForTimeout(500)
 
-  // Check cache states after trimming
-  shortLivedCached = await getCachedResponse(page, "test-cache-trimming-short", shortLivedUrl)
-  longLivedCached = await getCachedResponse(page, "test-cache-stable", longLivedUrl)
-
   // The expired short-lived entry should be removed
-  assert.isFalse(shortLivedCached.found, "Expired short-lived entry should be trimmed")
+  await assertNotCached(page, "test-cache-short-lived", dynamicTxtUrl)
 
-  // The long-lived cache should be unaffected (different cache, different trimmer, longer maxAge)
-  assert.isTrue(longLivedCached.found, "Long-lived cache should not be affected by short-lived cache trimming")
-  assert.equal(longLivedCached.text.trim(), longLivedResponse.text.trim(), "Long-lived cached content should remain unchanged")
+  // The long-lived cache should be unaffected
+  await assertCachedContent(page, "test-cache-stable", dynamicJsonUrl, longLivedContent)
 
   // And now, request the last cached response in the short-lived cache, which will be expired, yet returned,
   // to trigger trimming as well
   // Wait a bit to ensure it has really expired
   await page.waitForTimeout(200)
 
-  const secondTriggerTrimResponse = await testFetch(page, triggerTrimUrl)
-  assert.equal(secondTriggerTrimResponse.ok, true)
-  assert.equal(secondTriggerTrimResponse.text, firstTriggerTrimResponse.text, "Second request should return identical content from cache")
+  const secondTriggerTrimContent = await fetchContent(page, triggerTrimUrl)
+  assert.equal(secondTriggerTrimContent, firstTriggerTrimContent, "Second request should return identical content from cache")
 
   // Wait a bit for trimming to potentially complete
   await page.waitForTimeout(500)
   // And finally check that it's gone
-  const triggerTrimCached = await getCachedResponse(page, "test-cache-trimming-short", "http://localhost:9000" + triggerTrimUrl)
-  assert.isFalse(triggerTrimCached.found, "Expired short-lived entry should be trimmed")
+  await assertNotCached(page, "test-cache-short-lived", triggerTrimUrl)
 })
+
+async function fetchContent(page, url, headers = {}) {
+  const response = await testFetch(page, url, headers)
+  assert.equal(response.ok, true)
+  return response.text.trim()
+}
+
+async function getCachedContent(page, cacheName, url) {
+  const fullUrl = "http://localhost:9000" + url
+  const cachedResponse = await getCachedResponse(page, cacheName, fullUrl)
+  assert.isTrue(cachedResponse.found)
+
+  return cachedResponse.text.trim()
+}
+
+async function assertCachedContent(page, cacheName, url, expectedContent) {
+  const cachedContent = await getCachedContent(page, cacheName, url)
+  assert.equal(cachedContent, expectedContent, "Cached content should match expected content")
+}
+
+async function assertNotCached(page, cacheName, url) {
+  const fullUrl = "http://localhost:9000" + url
+  const cachedResponse = await getCachedResponse(page, cacheName, fullUrl)
+  assert.isFalse(cachedResponse.found)
+}

src/tests/helpers/offline.js

@@ -5,19 +5,6 @@ export async function clearAllCaches(page) {
   })
 }
 
-export async function getCacheStatus(page) {
-  return page.evaluate(async () => {
-    const cacheNames = await caches.keys()
-    const status = {}
-    for (const name of cacheNames) {
-      const cache = await caches.open(name)
-      const keys = await cache.keys()
-      status[name] = keys.map(req => req.url)
-    }
-    return status
-  })
-}
-
 export async function getCachedResponse(page, cacheName, url) {
   return page.evaluate(async ({ cacheName, url }) => {
     const cache = await caches.open(cacheName)