feat!: add SvelteKit 2 support (#76)

* feat!: add SvelteKit 2 support

* chore: update Vitest to v1

* chore: update readme

* chore: fix readme typo

* chore: .

* chore: add offline and trailing slash tests

* chore: add reload about page when offline test

Author: userquin

.npmrc

@@ -1,4 +1,3 @@
-node-version=16.14.0
 engine-strict=true
 ignore-workspace-root-check=true
 shamefully-hoist=true

README.md

@@ -45,6 +45,8 @@ Zero-config PWA Plugin for SvelteKit
 
 ## 📦 Install
 
+> From v0.3.0, `@vite-pwa/sveltekit` supports SvelteKit 2 (should also support SvelteKit 1).
+
 > From v0.2.0, `@vite-pwa/sveltekit` requires **SvelteKit 1.3.1 or above**.
 
 ```bash

examples/sveltekit-ts/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/package.json

@@ -25,20 +25,20 @@
 	},
 	"devDependencies": {
 		"@playwright/test": "^1.37.1",
-		"@sveltejs/adapter-static": "^2.0.3",
-		"@sveltejs/adapter-node": "^1.3.1",
-		"@sveltejs/kit": "^1.24.1",
-		"@types/cookie": "^0.5.2",
-		"@typescript-eslint/eslint-plugin": "^6.13.2",
-		"@typescript-eslint/parser": "^6.13.2",
+		"@sveltejs/adapter-static": "^3.0.0",
+		"@sveltejs/adapter-node": "^2.0.0",
+		"@sveltejs/kit": "^2.0.1",
+		"@types/cookie": "^0.6.0",
+		"@typescript-eslint/eslint-plugin": "^6.14.0",
+		"@typescript-eslint/parser": "^6.14.0",
 		"@vite-pwa/sveltekit": "workspace:*",
-		"eslint": "^8.49.0",
-		"eslint-plugin-svelte": "^2.34.0",
-		"svelte": "^4.2.0",
-		"svelte-check": "^3.5.1",
+		"eslint": "^8.55.0",
+		"eslint-plugin-svelte": "^2.35.1",
+		"svelte": "^4.2.8",
+		"svelte-check": "^3.6.2",
 		"tslib": "^2.6.2",
-		"typescript": "^5.2.2",
-		"vitest": "^0.34.4"
+		"typescript": "^5.3.3",
+		"vitest": "^1.0.4"
 	},
 	"type": "module",
 	"dependencies": {

examples/sveltekit-ts/playwright.config.ts

@@ -43,6 +43,7 @@ export default defineConfig({
     actionTimeout: 0,
     /* Base URL to use in actions like `await page.goto('/')`. */
     baseURL: url,
+    //offline: true,
 
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
     trace: 'on-first-retry',

examples/sveltekit-ts/svelte.config.js

@@ -1,4 +1,4 @@
-import { vitePreprocess } from '@sveltejs/kit/vite';
+import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
 // you don't need to do this if you're using generateSW strategy in your app
 import { generateSW } from './pwa.mjs'
 import { adapter } from './adapter.mjs'

examples/sveltekit-ts/tsconfig.json

@@ -8,7 +8,8 @@
 		"resolveJsonModule": true,
 		"skipLibCheck": true,
 		"sourceMap": true,
-		"strict": true
+		"strict": true,
+		"moduleResolution": "bundler"
 	}
 	// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
 	//

package.json

@@ -2,7 +2,7 @@
   "name": "@vite-pwa/sveltekit",
   "type": "module",
   "version": "0.2.10",
-  "packageManager": "pnpm@8.11.0",
+  "packageManager": "pnpm@8.12.1",
   "description": "Zero-config PWA for SvelteKit",
   "author": "antfu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -39,7 +39,7 @@
     "*.d.ts"
   ],
   "engines": {
-    "node": ">=16.14 || >=18"
+    "node": ">=16.14 || >=18.13"
   },
   "scripts": {
     "build": "unbuild",
@@ -50,8 +50,8 @@
     "test": "pnpm run -C examples/sveltekit-ts test"
   },
   "peerDependencies": {
-    "@sveltejs/kit": "^1.3.1",
-    "vite-plugin-pwa": ">=0.16.7 <1"
+    "@sveltejs/kit": "^1.3.1 || ^2.0.1",
+    "vite-plugin-pwa": ">=0.17.4 <1"
   },
   "dependencies": {
     "kolorist": "^1.8.0"
@@ -62,12 +62,11 @@
     "@types/debug": "^4.1.8",
     "@types/node": "^18.17.15",
     "@typescript-eslint/eslint-plugin": "^6.13.2",
-    "@vite-pwa/sveltekit": "workspace:*",
     "bumpp": "^9.2.0",
     "eslint": "^8.55.0",
     "typescript": "^5.3.3",
     "unbuild": "^2.0.0",
-    "vite": "^4.5.1",
-    "vite-plugin-pwa": ">=0.16.7 <1"
+    "vite": "^5.0.10",
+    "vite-plugin-pwa": ">=0.17.4 <1"
   }
 }