02/05: fix descriptions

Author: kettanaito

exercises/02.vitest-browser-mode/05.problem.multiple-workspaces/README.mdx

@@ -22,11 +22,9 @@ You can fix this by introducing _different workspaces_ for different types of te
 ```json filename=tsconfig.test.unit.json
 {
 	"extends": "./tsconfig.base.json",
-	"include": ["**/*.test.ts*"],
-	"exclude": ["**/*.browser.test.ts*"],
+	"include": ["src/**/*.test.ts*"],
+	"exclude": ["src/**/*.browser.test.ts*"],
 	"compilerOptions": {
-		"target": "esnext",
-		"module": "preserve",
 		"types": ["node", "vitest/globals"]
 	}
 }

exercises/02.vitest-browser-mode/05.problem.multiple-workspaces/vite.config.ts

@@ -1,6 +1,6 @@
 /// <reference types="vitest" />
 import { defineConfig } from 'vite'
-// 🐨 Import `defaultConfig` from `vitest/config`
+// 🐨 Import `configDefaults` from `vitest/config`
 // 💰 import { foo } from 'bar'
 import react from '@vitejs/plugin-react'
 import tailwindcss from '@tailwindcss/vite'
@@ -9,7 +9,7 @@ export default defineConfig({
 	plugins: [react(), tailwindcss()],
 	// 🐨 Add a new property called `workspace`.
 	// As the value, provide an array with two entries.
-	// 💰 workspace: [{}, {}]
+	// 💰 test: { workspace: [{}, {}] }
 	//
 	// 🐨 In the first entry of the `workspace` array,
 	// define a `test` property and give it a `test.name` equal to "unit".
@@ -31,18 +31,18 @@ export default defineConfig({
 	// default values to ignore tests from `node_modules`, for example.
 	// 💰 exclude: [...defaultConfig.exclude, '**/*.browser.test.ts(x)?']
 	//
-	// 🐨 Now, switch to the second entry in the `workspace`
-	// array. There, give it the following properties:
+	// Now, switch to the second entry in the `workspace` array.
+	// 🐨 First, set the `extends` property to `true`. Let's extend the
+	// root-level options, like `plugins` to have consistent behavior in prod and tests.
+	// 💰 { extends: true, test: {} }
+	//
+	// 🐨 Next, add these properties to the `test` in this workspace:
 	// {
 	//   name: "browser",
 	//   globals: true,
 	//   include: ["**/*.browser.test.ts(x)?"]
 	// }
 	//
-	// 🐨 At the root-level of the browser workspace object
-	// set the `extends` property to true. This will use the
-	// root-level plugins, like `react()`, for browser tests.
-	//
 	// 🐨 Finally, copy the existing `browser` configuration
 	// under the `test` property of the second workspace.
 	// 💰 { test: { name: 'browser', browser: {...} }}

exercises/02.vitest-browser-mode/05.solution.multiple-workspaces/README.mdx

@@ -27,9 +27,9 @@ export default defineConfig({
 				test: {
 					name: 'unit',
 					globals: true,
+					environment: 'node',
 					include: ['**/*.test.ts'],
 					exclude: [...configDefaults.exclude, '**/*.browser.test.ts(x)?'],
-					environment: 'node',
 				},
 			},
 			{
@@ -64,9 +64,9 @@ The first workspace include the configuration for running unit tests:
   test: {
 		name: 'unit',
 		globals: true,
+		environment: 'node',
 		include: ['**/*.test.ts'],
 		exclude: ['**/*.browser.test.ts(x)?'],
-		environment: 'node',
   },
 },
 ```
@@ -82,6 +82,7 @@ Similarly, here's the workspace for the browser (component) tests:
 
 ```ts filename=vite.config.ts nonumber
 {
+	extends: true,
 	test: {
 		name: 'browser',
 		globals: true,
@@ -115,11 +116,9 @@ Let's start with the unit tests:
 ```json filename=tsconfig.test.unit.json
 {
 	"extends": "./tsconfig.base.json",
-	"include": ["**/*.test.ts*"],
-	"exclude": ["**/*.browser.test.ts*"],
+	"include": ["src/**/*.test.ts*"],
+	"exclude": ["src/**/*.browser.test.ts*"],
 	"compilerOptions": {
-		"target": "esnext",
-		"module": "preserve",
 		"types": ["node", "vitest/globals"]
 	}
 }
@@ -139,13 +138,16 @@ npm i -D @types/node
 
 Next, I rename the existing `tsconfig.test.json` to `tsconfig.test.browser.json` to act as the TypeScript configuration for my browser component tests:
 
-```json highlight=3,7
+```json highlight=6,10
 {
-	"extends": "./tsconfig.base.json",
-	"include": ["vitest.browser.setup.ts", "**/*.browser.test.ts*"],
+	"extends": "./tsconfig.app.json",
+	"include": [
+		"vitest.browser.setup.ts",
+		"src/**/*",
+		"src/**/*.browser.test.ts*"
+	],
+	"exclude": [],
 	"compilerOptions": {
-		"target": "esnext",
-		"module": "preserve",
 		"types": ["vitest/globals", "@vitest/browser/providers/playwright"]
 	}
 }

exercises/02.vitest-browser-mode/05.solution.multiple-workspaces/vite.config.ts

@@ -12,9 +12,9 @@ export default defineConfig({
 				test: {
 					name: 'unit',
 					globals: true,
+					environment: 'node',
 					include: ['**/*.test.ts'],
 					exclude: [...configDefaults.exclude, '**/*.browser.test.ts(x)?'],
-					environment: 'node',
 				},
 			},
 			{