docs(website): support for WebdriverIO 9

Author: jan-molak

docusaurus.config.ts

@@ -111,6 +111,7 @@ const config: Config = {
                     showReadingTime: true,
                     blogSidebarTitle: 'Serenity/JS News',
                     blogSidebarCount: 'ALL',
+                    onUntruncatedBlogPosts: 'ignore',
                 },
                 pages: {
                     ...remarkOptions,
@@ -154,15 +155,14 @@ const config: Config = {
             items: [
                 { label: 'Handbook', type: 'doc', docId: 'index', position: 'left' },
                 { label: 'API', to: '/api/', position: 'left' },
+                { to: '/blog', label: 'News', position: 'left' },
                 { label: `Releases`, to: 'releases', position: 'left' },
                 { to: '/community', label: 'Community', position: 'left' },
                 {
                     to: 'https://github.com/sponsors/serenity-js',
-                    label: 'Sponsors',
+                    label: 'Sponsor',
                     position: 'left',
                 },
-
-                { to: '/blog', label: 'News', position: 'left' },
                 {
                     href: 'https://www.youtube.com/@serenity-js',
                     'aria-label': 'Serenity/JS YouTube channel',
@@ -334,6 +334,13 @@ const config: Config = {
                             adapter: { label: 'Test runner adapter', path: 'src/adapter/index.ts' },
                         },
                     },
+                    {
+                        path: './node_modules/@serenity-js/webdriverio-8',
+                        entry: {
+                            index: { label: 'index', path: 'src/index.ts' },
+                            adapter: { label: 'Test runner adapter', path: 'src/adapter/index.ts' },
+                        },
+                    },
 
                     {
                         path: './node_modules/@serenity-js/rest',

package-lock.json

@@ -31,20 +31,21 @@
     "@docusaurus/theme-mermaid": "3.6.3",
     "@giscus/react": "3.0.0",
     "@mdx-js/react": "3.1.0",
-    "@serenity-js/assertions": "3.30.0",
-    "@serenity-js/console-reporter": "3.30.0",
-    "@serenity-js/core": "3.30.0",
-    "@serenity-js/cucumber": "3.30.0",
-    "@serenity-js/jasmine": "3.30.0",
-    "@serenity-js/local-server": "3.30.0",
-    "@serenity-js/mocha": "3.30.0",
-    "@serenity-js/playwright": "3.30.0",
-    "@serenity-js/playwright-test": "3.30.0",
-    "@serenity-js/protractor": "3.30.0",
-    "@serenity-js/rest": "3.30.0",
-    "@serenity-js/serenity-bdd": "3.30.0",
-    "@serenity-js/web": "3.30.0",
-    "@serenity-js/webdriverio": "3.30.0",
+    "@serenity-js/assertions": "3.31.0",
+    "@serenity-js/console-reporter": "3.31.0",
+    "@serenity-js/core": "3.31.0",
+    "@serenity-js/cucumber": "3.31.0",
+    "@serenity-js/jasmine": "3.31.0",
+    "@serenity-js/local-server": "3.31.0",
+    "@serenity-js/mocha": "3.31.0",
+    "@serenity-js/playwright": "3.31.0",
+    "@serenity-js/playwright-test": "3.31.0",
+    "@serenity-js/protractor": "3.31.0",
+    "@serenity-js/rest": "3.31.0",
+    "@serenity-js/serenity-bdd": "3.31.0",
+    "@serenity-js/web": "3.31.0",
+    "@serenity-js/webdriverio": "3.31.0",
+    "@serenity-js/webdriverio-8": "3.31.0",
     "clsx": "2.1.1",
     "docusaurus-plugin-sass": "0.2.6",
     "docusaurus-plugin-typedoc-api": "4.4.0",
@@ -79,6 +80,10 @@
       "last 5 safari version"
     ]
   },
+  "overrides": {
+    "@wdio/cli": "^9.4.1",
+    "webdriverio": "^9.4.1"
+  },
   "engines": {
     "node": ">=18.0"
   }

package.json

@@ -18,6 +18,8 @@ export default {
         { from: '/handbook/about/installation/', to: '/handbook/getting-started/installation' },
         { from: '/handbook/about/serenity-js-v3/', to: '/handbook/getting-started/upgrading-to-serenity-js-3' },
 
+        { from: '/handbook/getting-started/serenity-js-with-webdriverio/', to: '/handbook/test-runners/webdriverio' },
+
         // Old changelog
         { from: '/changelog/', to: '/releases/' },
         { from: '/changelog/3.24.0/', to: 'https://github.com/serenity-js/serenity-js/releases/tag/v3.24.0' },

redirects.config.ts

@@ -19,4 +19,4 @@ Now, we're taking things further with [**Serenity/JS 3.2.0**](https://github.com
 
 Check out our new tutorial where in **less than 5 minutes**, you'll learn how to **integrate Serenity/JS** with your WebdriverIO test suite, **enable Serenity BDD reports**, and start using the **Screenplay Pattern**!
 
-Learn about [Using Serenity/JS with WebdriverIO](/handbook/getting-started/serenity-js-with-webdriverio/)!
+Learn about [Using Serenity/JS with WebdriverIO](/handbook/test-runners/webdriverio/)!

src/blog/2023-05-10-support-for-webdriverio-8/index.md

@@ -0,0 +1,84 @@
+---
+slug: support-for-webdriverio-9
+title: Support for WebdriverIO 9
+authors: [jan-molak]
+tags:
+  - core
+  - webdriverio
+  - web
+  - open-source
+---
+
+We’re thrilled to announce the release of Serenity/JS 3.31, marking a significant step forward for modern test automation.
+This release introduces support for **WebdriverIO 9**,
+while maintaining compatibility with **WebdriverIO 8** for projects that are not yet ready to migrate ([#2572](https://github.com/serenity-js/serenity-js/issues/2572)).
+
+Let’s explore what makes this update exciting!
+
+{/* truncate */}
+
+:::tip New to Serenity/JS?
+New to Serenity/JS or test automation? Start with ["Your first web scenario"](/handbook/web-testing/your-first-web-scenario/),
+praised by our community as "the best guide to take your automation skills to the next level."
+:::
+
+## New in Serenity/JS 3.31
+
+### Support for WebdriverIO 9
+
+The most notable new feature introduced by [WebdriverIO 9](https://webdriver.io/blog/2024/08/15/webdriverio-v9-release/) is support for the **WebDriver BiDi protocol**.
+This new protocol enables modern test automation capabilities like network request mocking and console log inspection,
+which will be progressively supported with dedicated Screenplay Pattern interactions in upcoming Serenity/JS releases.
+
+Thanks to Serenity/JS being an [abstraction over WebdriverIO](/handbook/getting-started/architecture/) (and other [web integration tools](/api/web/)), upgrading to WebdriverIO 9 should require only a few simple configuration updates
+to replace the deprecated configuration properties.
+In most cases, no changes to test code are needed helping your team stay up-to-date with your tools while minimising the maintenance cost of your Serenity/JS-based frameworks.
+
+We owe special thanks to [Christian Bromann](https://github.com/christian-bromann), Head of the WebdriverIO project, for supporting us in integrating Serenity/JS with this new release.
+
+Thank you, Christian!
+
+### Continued support for WebdriverIO 8
+
+Serenity/JS continues to support WebdriverIO 8 via the new [`@serenity-js/webdriverio-8`](/api/webdriverio-8/) module, offering stability for teams not yet ready to upgrade.
+This ensures smooth transition without compromising existing projects.
+
+### Brand new WebdriverIO guide
+
+We've revised, simplified, and updated the [Serenity/JS WebdriverIO integration guide](/handbook/test-runners/webdriverio/) to reflect the latest changes, making it easier for you to get started with Serenity/JS and WebdriverIO 9.
+
+### Updated WebdriverIO Project Templates
+
+[Serenity/JS Project Templates](/handbook/getting-started/project-templates/) now default to WebdriverIO 9, making it easy for new projects to start with the latest features.
+
+## Upgrading to Serenity/JS 3.31
+
+To upgrade your existing project to **Serenity/JS 3.31** and **WebdriverIO 9**, follow our new [WebdriverIO 9 upgrade guide](/handbook/test-runners/webdriverio/#upgrading-to-webdriverio-9).
+
+If you'd like to upgrade Serenity/JS but keep using **WebdriverIO 8**, follow these steps:
+- install the `@serenity-js/webdriverio-8` module instead of `@serenity-js/webdriverio`,
+- replace any imports of `@serenity-js/webdriverio` with `@serenity-js/webdriverio-8`.
+
+## Your feedback matters!
+
+I hope this latest release of Serenity/JS will make it even easier for you and your team to create high-quality test automation.
+
+Let me know what you think of the new features in the [comments below](/blog/better-api-documentation/#giscus-comments) 👇👇👇
+
+### 📣 Stay up to date
+
+New features, tutorials, and demos are coming soon!
+Follow [Serenity/JS on LinkedIn](https://www.linkedin.com/company/serenity-js),
+subscribe to [Serenity/JS channel on YouTube](https://www.youtube.com/@serenity-js) and join the [Serenity/JS Community Chat](https://matrix.to/#/#serenity-js:gitter.im) to stay up to date!
+Please also make sure to star ⭐️ [Serenity/JS on GitHub](https://github.com/serenity-js/serenity-js) to help others discover the framework!
+
+[![Follow Serenity/JS on LinkedIn](https://img.shields.io/badge/Follow-Serenity%2FJS%20-0077B5?logo=linkedin)](https://www.linkedin.com/company/serenity-js)
+[![Watch Serenity/JS on YouTube](https://img.shields.io/badge/Watch-@serenity--js-E62117?logo=youtube)](https://www.youtube.com/@serenity-js)
+[![Join Serenity/JS Community Chat](https://img.shields.io/badge/Chat-Serenity%2FJS%20Community-FBD30B?logo=matrix)](https://matrix.to/#/#serenity-js:gitter.im)
+[![GitHub stars](https://img.shields.io/github/stars/serenity-js/serenity-js?label=Serenity%2FJS&logo=github&style=badge)](https://github.com/serenity-js/serenity-js)
+
+### 💛 Support Serenity/JS
+
+If you appreciate all the effort that goes into making sophisticated tools easy to work with, please support our work and become a Serenity/JS GitHub Sponsor today!
+
+[![GitHub Sponsors](https://img.shields.io/badge/Support%20@serenity%2FJS-703EC8?style=for-the-badge&logo=github&logoColor=white)](https://github.com/sponsors/serenity-js)

src/blog/2024-12-12-support-for-webdriverio-9/index.mdx

@@ -58,7 +58,7 @@ export default function Integrations({ className }: IntegrationsProps): React.JS
                             </p>
                             <p className={ styles.cardActions }>
                                 <Link id="cta-homepage-webdirverio"
-                                      to="/handbook/getting-started/serenity-js-with-webdriverio/">
+                                      to="/handbook/test-runners/webdriverio/">
                                     Learn more
                                 </Link>
                             </p>

src/components/Home/Integrations/index.tsx

@@ -124,6 +124,7 @@ and the [Serenity/JS web testing tutorial](/handbook/web-testing/your-first-web-
             '@serenity-js/playwright',
             '@serenity-js/protractor',
             '@serenity-js/webdriverio',
+            '@serenity-js/webdriverio-8',
         ],
     },
     'REST API Testing': {

src/config/PackageJsonParser.ts

@@ -281,7 +281,7 @@ And so, Serenity/JS adapters for the following test runners will automatically g
     - [`TakeNotes`](/api/core/class/TakeNotes)
 - [WebdriverIO](/handbook/test-runners/webdriverio/) (with [Cucumber](/handbook/test-runners/cucumber), [Jasmine](/handbook/test-runners/jasmine), or [Mocha](/handbook/test-runners/mocha)):
     - [`BrowseTheWebWithWebdriverIO`](/api/webdriverio/class/BrowseTheWebWithWebdriverIO/),
-    - [`CallAnApi`](/api/rest/class/CallAnApi) at [`baseUrl`](/api/webdriverio/interface/WebdriverIOConfig/#baseUrl) configured in the [WebdriverIO config file](https://webdriver.io/docs/configurationfile/),
+    - [`CallAnApi`](/api/rest/class/CallAnApi) at [`baseUrl`](/api/webdriverio/#WebdriverIOConfig) configured in the [WebdriverIO config file](https://webdriver.io/docs/configurationfile/),
     - [`TakeNotes`](/api/core/class/TakeNotes)
 - [Protractor](/handbook/test-runners/protractor/) (with [Cucumber](/handbook/test-runners/cucumber), [Jasmine](/handbook/test-runners/jasmine), or [Mocha](/handbook/test-runners/mocha)):
     - [`BrowseTheWebWithProtractor`](/api/protractor/class/BrowseTheWebWithProtractor/),

src/docs/handbook/design/screenplay-pattern.mdx

@@ -24,7 +24,11 @@ you **safely** and **progressively modernise existing codebases**!
 In the second part of this chapter, I'll show you **how to add Serenity/JS** to an existing automation project and you'll learn about:
 - [**Using Serenity/JS with Playwright Test**](/handbook/getting-started/serenity-js-with-playwright-test/)
 - [**Using Serenity/JS with Protractor**](/handbook/getting-started/serenity-js-with-protractor/)
-- [**Using Serenity/JS with WebdriverIO**](/handbook/getting-started/serenity-js-with-webdriverio/)
+
+:::info Updates are coming!
+We're consolidating this part of the Serenity/JS Handbook to make it easier for you to find the information you need all in one place.
+If you're interested in WebdriverIO, check out our brand new guide on [**Using Serenity/JS with WebdriverIO**](/handbook/test-runners/webdriverio/)
+:::
 
 ## Upgrading from Serenity/JS 2