04/04: retryable assertions solution

kettanaito · kettanaito · commit 631933e2c58b · 2025-03-17T11:54:34.000+01:00
diff --git a/exercises/01.setup/01.solution.vscode-extension/tsconfig.node.json b/exercises/01.setup/01.solution.vscode-extension/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/01.setup/01.solution.vscode-extension/vite.config.ts b/exercises/01.setup/01.solution.vscode-extension/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/01.setup/02.solution.multiple-workspaces/tsconfig.node.json b/exercises/01.setup/02.solution.multiple-workspaces/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/01.setup/02.solution.multiple-workspaces/vite.config.ts b/exercises/01.setup/02.solution.multiple-workspaces/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/01.setup/03.solution.code-coverage/tsconfig.node.json b/exercises/01.setup/03.solution.code-coverage/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/01.setup/03.solution.code-coverage/vite.config.ts b/exercises/01.setup/03.solution.code-coverage/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/02.environment/01.solution.custom-environment/tsconfig.node.json b/exercises/02.environment/01.solution.custom-environment/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/02.environment/01.solution.custom-environment/vite.config.ts b/exercises/02.environment/01.solution.custom-environment/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/02.environment/02.solution.applying-environments/tsconfig.node.json b/exercises/02.environment/02.solution.applying-environments/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/02.environment/02.solution.applying-environments/vite.config.ts b/exercises/02.environment/02.solution.applying-environments/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/03.context/01.solution.custom-fixtures/tsconfig.node.json b/exercises/03.context/01.solution.custom-fixtures/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/03.context/01.solution.custom-fixtures/vite.config.ts b/exercises/03.context/01.solution.custom-fixtures/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/03.context/02.solution.automatic-fixtures/tsconfig.node.json b/exercises/03.context/02.solution.automatic-fixtures/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/03.context/02.solution.automatic-fixtures/vite.config.ts b/exercises/03.context/02.solution.automatic-fixtures/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/03.context/03.solution.global-context/tsconfig.node.json b/exercises/03.context/03.solution.global-context/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/03.context/03.solution.global-context/vite.config.ts b/exercises/03.context/03.solution.global-context/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/04.assertions/02.solution.asymmetric-matchers/tsconfig.node.json b/exercises/04.assertions/02.solution.asymmetric-matchers/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/04.assertions/02.solution.asymmetric-matchers/vite.config.ts b/exercises/04.assertions/02.solution.asymmetric-matchers/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/04.assertions/03.solution.custom-equality-testers/tsconfig.node.json b/exercises/04.assertions/03.solution.custom-equality-testers/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/04.assertions/03.solution.custom-equality-testers/vite.config.ts b/exercises/04.assertions/03.solution.custom-equality-testers/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/04.assertions/04.solution.retryable-assertions/README.mdx b/exercises/04.assertions/04.solution.retryable-assertions/README.mdx
@@ -1,3 +1,22 @@
 # Retryable assertions
 
 - Use `expect.poll` to retry any assertion.
+- Use `expect.element()` in the Browser Mode for built-in polling + element-based assertions.
+- Gotchas:
+  - `expect.poll()` doesn't work with all matchers (no support for snapshot matchers, e.g.);
+  - `expect.poll()` always awaits the given promise, which means there's no `.rejects` or `.resolves`;
+  - `expect.poll()` won't work with `.toThrow()` so don't use it for negative assertions.
+
+## TODOD
+
+- [ ] Explain the difference between `vi.waitFor()` and `expect.poll()` and when you'd want to use each.
+
+```ts
+await vi.waitFor(() => {
+	expect(fn).toHaveBeenCalled()
+})
+
+// is the same as this:
+
+await expect.poll(() => fn).toHaveBeenCalled()
+```
diff --git a/exercises/04.assertions/04.solution.retryable-assertions/src/client.ts b/exercises/04.assertions/04.solution.retryable-assertions/src/client.ts
@@ -0,0 +1,18 @@
+import { EventEmitter } from 'node:events'
+import { Server } from './server'
+
+export class Client extends EventEmitter {
+	private server: Server
+
+	constructor() {
+		super()
+		this.server = new Server()
+	}
+
+	public request(
+		requestType: string,
+		responseListener: (data: unknown) => void,
+	) {
+		this.server.emit('request', requestType, responseListener)
+	}
+}
diff --git a/exercises/04.assertions/04.solution.retryable-assertions/src/example.test.ts b/exercises/04.assertions/04.solution.retryable-assertions/src/example.test.ts
@@ -0,0 +1,11 @@
+import { Client } from './client'
+
+test('receives a basket of fruits', async () => {
+	const client = new Client()
+	const responseListener = vi.fn()
+	client.request('fruits', responseListener)
+
+	await expect
+		.poll(() => responseListener)
+		.toHaveBeenCalledWith(['apple', 'banana', 'cherry'])
+})
diff --git a/exercises/04.assertions/04.solution.retryable-assertions/src/server.ts b/exercises/04.assertions/04.solution.retryable-assertions/src/server.ts
@@ -0,0 +1,20 @@
+import { EventEmitter } from 'node:events'
+
+export class Server extends EventEmitter {
+	constructor() {
+		super()
+		this.on('request', (requestType, respondWith) => {
+			queueMicrotask(() => {
+				switch (requestType) {
+					case 'fruits': {
+						return respondWith(['apple', 'banana', 'cherry'])
+					}
+
+					default: {
+						return respondWith('unknown request')
+					}
+				}
+			})
+		})
+	}
+}
diff --git a/exercises/04.assertions/04.solution.retryable-assertions/tsconfig.app.json b/exercises/04.assertions/04.solution.retryable-assertions/tsconfig.app.json
@@ -1,9 +1,5 @@
 {
 	"extends": "./tsconfig.base.json",
 	"include": ["src/**/*"],
-	"exclude": ["src/**/*.test.ts*"],
-	"compilerOptions": {
-		"lib": ["ES2020", "DOM", "DOM.Iterable"],
-		"jsx": "react-jsx"
-	}
+	"exclude": ["src/**/*.test.ts*"]
 }
diff --git a/exercises/04.assertions/04.solution.retryable-assertions/tsconfig.node.json b/exercises/04.assertions/04.solution.retryable-assertions/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vitest.config.ts"]
 }
diff --git a/exercises/04.assertions/04.solution.retryable-assertions/vitest.config.ts b/exercises/04.assertions/04.solution.retryable-assertions/vitest.config.ts
@@ -1,11 +1,12 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
 		port: process.env.PORT ? Number(process.env.PORT) : undefined,
 	},
 	test: {
 		globals: true,
+		environment: 'node',
 	},
 })
diff --git a/exercises/04.assertions/05.solution.soft-assertions/tsconfig.node.json b/exercises/04.assertions/05.solution.soft-assertions/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/04.assertions/05.solution.soft-assertions/vite.config.ts b/exercises/04.assertions/05.solution.soft-assertions/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/05.performance/01.solution.profiling-slow-tests/tsconfig.node.json b/exercises/05.performance/01.solution.profiling-slow-tests/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/05.performance/01.solution.profiling-slow-tests/vite.config.ts b/exercises/05.performance/01.solution.profiling-slow-tests/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/05.performance/02.solution.concurrency/tsconfig.node.json b/exercises/05.performance/02.solution.concurrency/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/05.performance/02.solution.concurrency/vite.config.ts b/exercises/05.performance/02.solution.concurrency/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/05.performance/03.solution.test-isolation/tsconfig.node.json b/exercises/05.performance/03.solution.test-isolation/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/05.performance/03.solution.test-isolation/vite.config.ts b/exercises/05.performance/03.solution.test-isolation/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/exercises/05.performance/04.solution.sharding/tsconfig.node.json b/exercises/05.performance/04.solution.sharding/tsconfig.node.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"lib": ["ES2023"]
 	},
-	"include": ["vite.config.ts", "tailwind.config.ts"]
+	"include": ["vite.config.ts"]
 }
diff --git a/exercises/05.performance/04.solution.sharding/vite.config.ts b/exercises/05.performance/04.solution.sharding/vite.config.ts
@@ -1,5 +1,5 @@
 /// <reference types="vitest" />
-import { defineConfig } from 'vite'
+import { defineConfig } from 'vitest/config'
 
 export default defineConfig({
 	server: {
diff --git a/package.json b/package.json
@@ -2,9 +2,9 @@
   "name": "react-component-testing-with-vitest",
   "private": true,
   "epicshop": {
-    "title": "React Component Testing with Vitest",
-    "subtitle": "Test React components in the actual browser",
-    "githubRepo": "https://github.com/epicweb-dev/react-component-testing-with-vitest",
+    "title": "Advanced Vitest Patterns",
+    "subtitle": "Become Vitest superuser",
+    "githubRepo": "https://github.com/epicweb-dev/advanced-vitest-patterns",
     "instructor": {
       "name": "Artem Zakharchenko",
       "avatar": "/images/instructor.png",

Original file line number	Diff line number	Diff line change
`@@ -3,5 +3,5 @@`
`3`	`3`	`"compilerOptions": {`
`4`	`4`	`"lib": ["ES2023"]`
`5`	`5`	`},`
`6`		`- "include": ["vite.config.ts", "tailwind.config.ts"]`
	`6`	`+ "include": ["vite.config.ts"]`
`7`	`7`	`}`