Skip to content

Commit da5983e

Browse files
committed
02.vitest-browser-mode: typos/grammar
1 parent bdc50a9 commit da5983e

File tree

1 file changed

+2
-2
lines changed

1 file changed

+2
-2
lines changed

exercises/02.vitest-browser-mode/README.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Vitest Browser Mode
22

3-
[Browser Mode](https://vitest.dev/guide/browser/) is a recent addition to [Vitest](https://vitest.dev/) that allows you to run your tests in the actual browser. With the browser-like environment issues becoming more and more pressing, a lot of testing frameworks have invested into designing a component-level testing model:
3+
[Browser Mode](https://vitest.dev/guide/browser/) is a recent addition to [Vitest](https://vitest.dev/) that allows you to run your tests in the actual browser. With browser-like environment issues becoming more and more problematic, a lot of testing frameworks have invested into designing a component-level testing model:
44

55
- [Component testing in Playwright](https://playwright.dev/docs/test-components)
66
- [Cypress component testing](https://docs.cypress.io/app/component-testing/get-started)
@@ -33,7 +33,7 @@ Compared to browser-like environments, Vitest Browser Mode has the following ben
3333
There are also a few advantages I find in Vitest Browser Mode when compared to other component-testing approaches:
3434

3535
- **Consistency**. Vitest can use your existing Vite configuration both for your app and for your tests. This means a smaller difference between your production and tested code, which is always a win.
36-
- **Component rendering model**. Running in the browser, your components can render similarly to how they are rendered in production. Vitest has a more [straighforward rendering flow](https://github.com/vitest-dev/vitest-browser-react/blob/1d6be8ca8d94bb2289b6260886f76a6e527c45f7/src/pure.tsx#L50) compared to [Playwright Component Testing](https://github.com/microsoft/playwright/blob/91f46bb5d057a284ff33def5802aba496033c030/packages/playwright-ct-core/src/mount.ts#L61), where Playwright has to channel the rendering from the test (Node.js) to the browser.
36+
- **Component rendering model**. Running in the browser, your components can render similarly to how they are rendered in production. Vitest has a more [straightforward rendering flow](https://github.com/vitest-dev/vitest-browser-react/blob/1d6be8ca8d94bb2289b6260886f76a6e527c45f7/src/pure.tsx#L50) compared to [Playwright Component Testing](https://github.com/microsoft/playwright/blob/91f46bb5d057a284ff33def5802aba496033c030/packages/playwright-ct-core/src/mount.ts#L61), where Playwright has to channel the rendering from the test (Node.js) to the browser.
3737
- **Flexibility**. You can use Vitest for both unit tests, Node.js integration tests, and in-browser integration tests. In fact, Vitest makes that easy to do with the concept of workspaces, which you will get your hands on later in this workshop.
3838

3939
Alright, that's enough details. It's time you put Vitest Browser Mode to work for your tests. Let's go!

0 commit comments

Comments
 (0)