wip: vitest pool testing

package.json

@@ -30,6 +30,7 @@
 		"test:watch": "vitest watch"
 	},
 	"devDependencies": {
+		"@cloudflare/vitest-pool-workers": "https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/7978720501/npm-package-cloudflare-vitest-pool-workers-5060",
 		"@adaptivelink/pops": "0.5.8",
 		"@cloudflare/kv-asset-handler": "0.3.1",
 		"@cloudflare/workers-types": "4.20240222.0",
@@ -43,7 +44,7 @@
 		"sanitize-html": "2.12.1",
 		"typescript": "5.3.3",
 		"validate-color": "2.2.4",
-		"vitest": "1.3.1",
+		"vitest": "1.3.0",
 		"wrangler": "3.29.0"
 	},
 	"engines": {

src/index.test.ts → test/index.test.ts

@@ -1,3 +1,4 @@
+import { createExecutionContext, env, waitOnExecutionContext } from 'cloudflare:test';
 import {
 	afterAll,
 	beforeAll,
@@ -6,30 +7,15 @@ import {
 	it,
 	test,
 } from 'vitest';
-import { unstable_dev } from 'wrangler';
 
-import { getKeys } from './utils';
-
-import type { UnstableDevWorker } from 'wrangler';
+import worker from '../src/index';
+import { getKeys } from '../src/utils';
 
 describe('Worker', () => {
-	let worker: UnstableDevWorker;
-
-	beforeAll(async () => {
-		worker = await unstable_dev('src/index.ts', {
-			experimental: {
-				disableExperimentalWarning: true,
-			},
-		});
-	});
-
-	afterAll(async () => {
-		await worker.stop();
-	});
-
 	it('should return html landing page', async () => {
 		const req = new Request('https://example.com', { method: 'GET' });
-		const resp = await worker.fetch(req.url);
+		const ctx = createExecutionContext();
+		const resp = await worker.fetch(req, env, ctx);
 		expect(resp.status).toBe(200);
 
 		// check if html is returned
@@ -41,7 +27,8 @@ describe('Worker', () => {
 
 	it('should sanitize for XSS', async () => {
 		const req = new Request('https://example.com/api/?width=350&height=100&text=Hello%20World&bgColor=%22%3E%3Cscript%3Ealert(%22XSS%22);%3C/script%3E', { method: 'GET' });
-		const resp = await worker.fetch(req.url);
+		const ctx = createExecutionContext();
+		const resp = await worker.fetch(req, env, ctx);
 		expect(resp.status).toBe(200);
 
 		const text = await resp.text();
@@ -50,7 +37,8 @@ describe('Worker', () => {
 
 	it('should sanitize for CSS prop injection', async () => {
 		const req = new Request('https://example.com/api/?width=450&height=450&text=James&fontFamily=test;background:url(https://avatars.githubusercontent.com/u/856748?v=4)&textWrap=true', { method: 'GET' });
-		const resp = await worker.fetch(req.url);
+		const ctx = createExecutionContext();
+		const resp = await worker.fetch(req, env, ctx);
 		expect(resp.status).toBe(200);
 
 		const text = await resp.text();
@@ -122,7 +110,8 @@ describe('Worker', () => {
 			searchParams.set(key, String(query[key]));
 		}
 		const req = new Request(`https://example.com/api/?${searchParams.toString()}`, { method: 'GET' });
-		const resp = await worker.fetch(req.url);
+		const ctx = createExecutionContext();
+		const resp = await worker.fetch(req, env, ctx);
 		expect(resp.status).toBe(200);
 
 		const text = await resp.text();

src/sanitizers.test.ts → test/sanitizers.test.ts

@@ -6,7 +6,7 @@ import {
 	sanitizeNumber,
 	sanitizeString,
 	sanitizeStringForCss,
-} from './sanitizers';
+} from '../src/sanitizers';
 
 describe('Sanitizers', () => {
 	it('number', () => {

src/simple-svg-placeholder.test.ts → test/simple-svg-placeholder.test.ts

@@ -1,6 +1,6 @@
 import { describe, expect, test } from 'vitest';
 
-import { type Options, simpleSvgPlaceholder } from './simple-svg-placeholder';
+import { type Options, simpleSvgPlaceholder } from '../src/simple-svg-placeholder';
 
 describe('simpleSVGPlaceholder', () => {
 	const testOptions: Options[] = [

test/tsconfig.json

@@ -0,0 +1,10 @@
+{
+	"extends": "../tsconfig.json",
+	"compilerOptions": {
+		"types": [
+			"@cloudflare/workers-types/experimental",
+			"@cloudflare/vitest-pool-workers"
+		]
+	},
+	"include": ["./**/*.ts"]
+}

test/types.ts

@@ -0,0 +1,4 @@
+import type { Env } from '../src/types';
+declare module 'cloudflare:test' {
+	interface ProvidedEnv extends Env {}
+}

vitest.config.ts

@@ -0,0 +1,18 @@
+import { defineWorkersPoolOptions } from '@cloudflare/vitest-pool-workers/config';
+import { defineConfig } from 'vitest/config';
+
+
+export default defineConfig({
+	test: {
+		pool: '@cloudflare/vitest-pool-workers',
+		poolOptions: {
+			workers: defineWorkersPoolOptions({
+				isolatedStorage: true,
+				main: './src/index.ts',
+				wrangler: {
+					configPath: './wrangler.toml',
+				},
+			}),
+		},
+	},
+});

wrangler.toml

@@ -1,6 +1,7 @@
 name = "placeholders-dev"
 workers_dev = true
 compatibility_date = "2023-12-09"
+compatibility_flags = ["nodejs_compat"]
 main = "./src/index.ts"
 
 [site]