chore: include tests for pwa assets example

examples/sveltekit-ts-assets-generator/client-test/offline.spec.ts

@@ -0,0 +1,38 @@
+import {test, expect} from '@playwright/test';
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+import {generateSW} from "../pwa.mjs";
+
+test('Test offline and trailing slashes', async ({ browser}) => {
+ // test offline + trailing slashes routes
+ const context = await browser.newContext()
+ const offlinePage = await context.newPage()
+ await offlinePage.goto('/')
+ const offlineSwURL = await offlinePage.evaluate(async () => {
+ const registration = await Promise.race([
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+ // @ts-ignore
+ navigator.serviceWorker.ready,
+ new Promise((_, reject) => setTimeout(() => reject(new Error('Service worker registration failed: time out')), 10000))
+ ])
+ // @ts-expect-error registration is of type unknown
+ return registration.active?.scriptURL
+ });
+ const offlineSwName = generateSW ? 'sw.js' : 'prompt-sw.js'
+ expect(offlineSwURL).toBe(`http://localhost:4173/${offlineSwName}`);
+ await context.setOffline(true)
+ const aboutAnchor = offlinePage.getByRole('link', { name: 'About' })
+ expect(await aboutAnchor.getAttribute('href')).toBe('/about')
+ await aboutAnchor.click({ noWaitAfter: false })
+ const url = await offlinePage.evaluate(async () => {
+ await new Promise(resolve => setTimeout(resolve, 3000))
+ return location.href
+ })
+ expect(url).toBe('http://localhost:4173/about')
+ expect(offlinePage.locator('li[aria-current="page"] a').getByText('About')).toBeTruthy()
+ await offlinePage.reload({ waitUntil: 'load' })
+ expect(offlinePage.url()).toBe('http://localhost:4173/about')
+ expect(offlinePage.locator('li[aria-current="page"] a').getByText('About')).toBeTruthy()
+ // Dispose context once it's no longer needed.
+ await context.close();
+});

examples/sveltekit-ts-assets-generator/client-test/sw.spec.ts

@@ -0,0 +1,51 @@
+import {test, expect} from '@playwright/test';
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+import {generateSW} from "../pwa.mjs";
+
+test('The service worker is registered and cache storage is present', async ({ page}) => {
+ await page.goto('/');
+
+ const swURL = await page.evaluate(async () => {
+ const registration = await Promise.race([
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+ // @ts-ignore
+ navigator.serviceWorker.ready,
+ new Promise((_, reject) => setTimeout(() => reject(new Error('Service worker registration failed: time out')), 10000))
+ ])
+ // @ts-expect-error registration is of type unknown
+ return registration.active?.scriptURL
+ });
+ const swName = generateSW ? 'sw.js' : 'prompt-sw.js'
+ expect(swURL).toBe(`http://localhost:4173/${swName}`);
+
+ const cacheContents = await page.evaluate(async () => {
+ const cacheState: Record<string, Array<string>> = {};
+ for (const cacheName of await caches.keys()) {
+ const cache = await caches.open(cacheName);
+ cacheState[cacheName] = (await cache.keys()).map((req) => req.url);
+ }
+ return cacheState;
+ });
+
+ expect(Object.keys(cacheContents).length).toEqual(1)
+
+ const key = 'workbox-precache-v2-http://localhost:4173/'
+
+ expect(Object.keys(cacheContents)[0]).toEqual(key)
+
+ const urls = cacheContents[key].map(url => url.slice('http://localhost:4173/'.length))
+
+ /*
+ 'http://localhost:4173/about?__WB_REVISION__=38251751d310c9b683a1426c22c135a2',
+ 'http://localhost:4173/?__WB_REVISION__=073370aa3804305a787b01180cd6b8aa',
+ 'http://localhost:4173/manifest.webmanifest?__WB_REVISION__=27df2fa4f35d014b42361148a2207da3'
+ */
+ expect(urls.some(url => url.startsWith('manifest.webmanifest?__WB_REVISION__='))).toEqual(true)
+ expect(urls.some(url => url.startsWith('?__WB_REVISION__='))).toEqual(true)
+ expect(urls.some(url => url.startsWith('about?__WB_REVISION__='))).toEqual(true)
+ // dontCacheBustURLsMatching: any asset in _app/immutable folder shouldn't have a revision (?__WB_REVISION__=)
+ expect(urls.some(url => url.startsWith('_app/immutable/') && url.endsWith('.css'))).toEqual(true)
+ expect(urls.some(url => url.startsWith('_app/immutable/') && url.endsWith('.js'))).toEqual(true)
+ expect(urls.some(url => url.includes('_app/version.json?__WB_REVISION__='))).toEqual(true)
+});

examples/sveltekit-ts-assets-generator/test/build.test.ts

@@ -0,0 +1,35 @@
+import { describe, expect, it } from 'vitest'
+import { existsSync, readFileSync } from 'node:fs'
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+import { generateSW } from '../pwa.mjs'
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+import { nodeAdapter } from '../adapter.mjs'
+
+describe(`test-build: ${nodeAdapter ? 'node' : 'static'} adapter`, () => {
+ it(`service worker is generated: ${generateSW ? 'sw.js' : 'prompt-sw.js'}`, () => {
+ const swName = `./build/${nodeAdapter ? 'client/': ''}${generateSW ? 'sw.js' : 'prompt-sw.js'}`
+ expect(existsSync(swName), `${swName} doesn't exist`).toBeTruthy()
+ const webManifest = `./build/${nodeAdapter ? 'client/': ''}manifest.webmanifest`
+ expect(existsSync(webManifest), `${webManifest} doesn't exist`).toBeTruthy()
+ const swContent = readFileSync(swName, 'utf-8')
+ let match: RegExpMatchArray | null
+ if (generateSW) {
+ match = swContent.match(/define\(\['\.\/(workbox-\w+)'/)
+ expect(match && match.length === 2, `workbox-***.js entry not found in ${swName}`).toBeTruthy()
+ const workboxName = `./build/${nodeAdapter ? 'client/': ''}${match?.[1]}.js`
+ expect(existsSync(workboxName),`${workboxName} doesn't exist`).toBeTruthy()
+ }
+ match = swContent.match(/"url":\s*"manifest\.webmanifest"/)
+ expect(match && match.length === 1, 'missing manifest.webmanifest in sw precache manifest').toBeTruthy()
+ match = swContent.match(/"url":\s*"\/"/)
+ expect(match && match.length === 1, 'missing entry point route (/) in sw precache manifest').toBeTruthy()
+ match = swContent.match(/"url":\s*"about"/)
+ expect(match && match.length === 1,'missing about route (/about) in sw precache manifest').toBeTruthy()
+ if (nodeAdapter) {
+ match = swContent.match(/"url":\s*"server\//)
+ expect(match === null, 'found server/ entries in sw precache manifest').toBeTruthy()
+ }
+ })
+})

package.json

@@ -47,7 +47,7 @@
  "lint-fix": "nr lint --fix",
  "prepublishOnly": "npm run build",
  "release": "bumpp && npm publish",
- "test": "pnpm run -C examples/sveltekit-ts test"
+ "test": "pnpm run -C examples/sveltekit-ts test && pnpm run -C examples/sveltekit-ts-assets-generator test"
  },
  "peerDependencies": {
  "@sveltejs/kit": "^1.3.1 || ^2.0.1",