You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: exercises/02.vitest-browser-mode/05.problem.multiple-workspaces/README.mdx
+7-7Lines changed: 7 additions & 7 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,14 +1,14 @@
1
1
# Multiple workspaces
2
2
3
-
The way you have Vitest configured right now will run _all tests_using Browser Mode. This may not be what you want, especially if you are using Vitest for unit testing or integration testing in Node.js in the same project that needs in-browser component tests as well.
3
+
Our current Vitest configuration runs _all tests_in Browser Mode. This isn't ideal when you need to run different types of tests in the same project - like unit tests in Node.js alongside browser-based component tests.
4
4
5
-
You can fix this by introducing _different workspaces_ for differnt types of tests. In fact, I think this is just the right task for you...
5
+
You can fix this by introducing _different workspaces_ for different types of tests. In fact, I think this is just the right task for you...
6
6
7
-
👨💼 In this one, you will expand on the Vitest configuration to support running multiple types of tests in the same project. This will be a multi-step process to make sure you have the Vitest and TypeScript configured correctly for your tests.
7
+
👨💼 In this one, you will expand the Vitest configuration to support running multiple types of tests in the same project. This will be a multi-step process to make sure you have Vitest and TypeScript configured correctly for your tests.
8
8
9
-
🐨 First, update <InlineFilefile="vite.config.ts">`vite.config.ts`</InlineFile> to list multiple [workspaces](https://main.vitest.dev/guide/workspace.html#configuration). Define one for unit tests and the other for component tests.
9
+
🐨 First, update <InlineFilefile="vite.config.ts">`vite.config.ts`</InlineFile> to list multiple [workspaces](https://main.vitest.dev/guide/workspace.html#configuration). Define one for unit tests and another for component tests.
10
10
11
-
🐨 Next, rename <InlineFilefile="tsconfig.test.json">`tsconfig.test.json`</InlineFile> to `tsconfig.test.browser.json`. This TypeScript configuration will apply only to the component tests now. Update its `include` to target `**/*.browser.test.ts*` files:
11
+
🐨 Next, rename <InlineFilefile="tsconfig.test.json">`tsconfig.test.json`</InlineFile> to `tsconfig.test.browser.json`. This TypeScript configuration will only apply to the component tests now. Update its `include` setting to target `**/*.browser.test.ts*` files:
@@ -17,7 +17,7 @@ You can fix this by introducing _different workspaces_ for differnt types of tes
17
17
}
18
18
```
19
19
20
-
🐨 To have proper type-checking in unit tests, create a new <InlineFilefile="tsconfig.test.unit.json">`tsconfig.test.unit.json`</InlineFile> file and list there the properties necessary for the unit tests. You can use this as an example:
20
+
🐨 To have proper type-checking in unit tests, create a new <InlineFilefile="tsconfig.test.unit.json">`tsconfig.test.unit.json`</InlineFile> file and add the necessary properties for unit tests. You can use this as an example:
21
21
22
22
```json filename=tsconfig.test.unit.json
23
23
{
@@ -49,6 +49,6 @@ You can fix this by introducing _different workspaces_ for differnt types of tes
49
49
}
50
50
```
51
51
52
-
🐨 Finally, rename the existing `file-preview.test.tsx` component test to `file-preview.browser.test.tsx` to be picked up by the proper workspace in Vitest.
52
+
🐨 Finally, rename the existing `file-preview.test.tsx` component test to `file-preview.browser.test.tsx` to be included in the correct Vitest workspace.
53
53
54
54
See you on the other side once you're done to go through each step in more detail.
0 commit comments