diff --git a/langs/en/guides/testing.md b/langs/en/guides/testing.md
index 03f3eca5..79c60a50 100644
--- a/langs/en/guides/testing.md
+++ b/langs/en/guides/testing.md
@@ -10,6 +10,8 @@ We offer support for two test runners:
- uvu - only brings the bare necessities
+- WebdriverIO - offers component testing in the browser
+
Both are based around [solid-testing-library](https://github.com/solidjs/solid-testing-library), which integrates [Testing Library](https://testing-library.com/) into Solid. Testing Library mimics a light-weight browser and provides an API to interact with it from your tests.
We maintain a starter template for Solid and Jest tests. We recommend you base your project on it, or alternatively install the starter template in a scratch project and copy the configuration from it into your own project.
@@ -73,6 +75,32 @@ If you want nice HTML coverage reports, you can use `c8 -r html` instead of `c8`
Now if you run `npm run test:watch`, the tests will run every time you change a file.
+### Setting up WebdriverIO
+
+If you prefer testing your Solid components in the browser, we recommend using WebdriverIO which comes with a preset for Solid component testing. In your project run:
+
+```bash
+$ npm init wdio@latest ./tests
+```
+
+It will kick off a configuration wizard in which you have the opportunity to choose Solid as preset or if you using Solid with Vitejs pick "Other" so you can re-use your existing Vite config.
+
+The configuration wizard will set-up a `wdio` NPM script that allows to start the test via:
+
+```sh
+npm run wdio
+```
+
+#### Watch Mode
+
+You can run your tests in watch mode which will automatically re-run test files that have been changed. You can also [define](https://webdriver.io/docs/configuration#filestowatch) a glob for your application files and have these tests re-run whenever you change your components.
+
+To run in watch mode, call:
+
+```sh
+npm run wdio -- --watch
+```
+
## Testing Patterns and Best Practices
Now that you have installed your testing tools, you should start to use them. In order to make this easier, Solid supports a few nice patterns.
@@ -429,3 +457,33 @@ testCounter("it increases its value on click", async () => {
testCounter.run();
```
+
+#### Testing with WebdriverIO
+
+```ts
+// counter.test.tsx
+import { $, expect } from '@wdio/globals'
+import { cleanup, render, screen } from 'solid-testing-library'
+
+import { Counter } from '../components/counter'
+
+describe('my component tests', () => {
+ afterEach(cleanup)
+
+ it('it starts with zero', async () => {
+ render(() => )
+ const button = screen.getByRole("button");
+ expect($(button)).toBePresent();
+ expect($(button)).toHaveTextContaining("Count: 0");
+ });
+
+ it("it increases its value on click", async () => {
+ render(() => );
+ const button = screen.getByRole("button");
+ await $(button).click()
+ expect($(button)).toHaveTextContaining("Count: 1");
+ await $(button).click()
+ expect(button).toHaveTextContaining("Count: 2");
+ });
+})
+```
\ No newline at end of file