Update WebdriverIO to v9 for FURN tests

.ado/templates/setup-repo.yml

@@ -5,6 +5,11 @@ steps:
       versionSpec: '5.6.0'
     displayName: 'Install Nuget'
 
+  - task: UseNode@1
+    inputs:
+      version: '22.x'
+    displayName: 'Use Node.js 22.x'
+
   - script: |
       yarn
     displayName: 'yarn install'

apps/E2E/package.json

@@ -40,13 +40,13 @@
     "@types/jasmine": "5.1.4",
     "@types/node": "^22.2.0",
     "@types/react": "^18.2.0",
-    "@wdio/appium-service": "^8.40.0",
-    "@wdio/cli": "^8.40.0",
-    "@wdio/globals": "^8.40.0",
-    "@wdio/jasmine-framework": "^8.40.0",
-    "@wdio/json-reporter": "^8.40.0",
-    "@wdio/local-runner": "^8.40.0",
-    "@wdio/spec-reporter": "^8.40.0",
+    "@wdio/appium-service": "^9.12.6",
+    "@wdio/cli": "^9.12.6",
+    "@wdio/globals": "^9.12.6",
+    "@wdio/jasmine-framework": "^9.12.6",
+    "@wdio/json-reporter": "^9.12.6",
+    "@wdio/local-runner": "^9.12.6",
+    "@wdio/spec-reporter": "^9.12.6",
     "appium": "^2.11.2",
     "appium-mac2-driver": "^1.12.0",
     "appium-uiautomator2-driver": "^3.0.5",
@@ -56,7 +56,7 @@
     "rimraf": "^5.0.1",
     "ts-node": "^10.7.0",
     "typescript": "4.9.4",
-    "webdriverio": "^8.40.0"
+    "webdriverio": "^9.12.6"
   },
   "installConfig": {
     "hoistingLimits": "dependencies"

apps/E2E/src/common/BasePage.ts

@@ -20,7 +20,7 @@ const PLATFORM = process.env['E2ETEST_PLATFORM'] as Platform;
 const NATIVE_TESTING = process.env['NATIVE_TESTING'] == 'true';
 export const COMPONENT_SCROLL_COORDINATES = { x: -0, y: -100 }; // These are the offsets. Y is negative because we want the touch to move up (and thus it scrolls down)
 
-let rootView: WebdriverIO.Element | null = null;
+let rootView: WebdriverIO.Element | ChainablePromiseElement | null = null;
 
 /* Win32/UWP-Specific Selector. We use this to get elements on the test page */
 export async function By(identifier: string) {
@@ -37,7 +37,7 @@ async function QueryWithChaining(identifier) {
     rootView = await $('~' + ROOT_VIEW);
   }
   const selector = '~' + identifier;
-  let queryResult: WebdriverIO.Element;
+  let queryResult: WebdriverIO.Element | ChainablePromiseElement;
   queryResult = await rootView.$(selector);
   if (queryResult.error) {
     // In some cases, such as opened ContextualMenu items, the element nodes are not children of the rootView node, meaning we need to start our search from the top of the tree.
@@ -133,7 +133,7 @@ export abstract class BasePage {
    * The advantage to this over testing using .isEqual in a spec is that this throws a detailed error if
    * the expected and actual values don't match. This should be called for attribute tests in specs. */
   async compareAttribute(
-    element: Promise<WebdriverIO.Element>,
+    element: WebdriverIO.Element | ChainablePromiseElement,
     attribute: Attribute | AndroidAttribute,
     expectedValue: any,
   ): Promise<boolean> {

change/@fluentui-react-native-e2e-testing-d29a7d09-1c67-4089-b849-50933e6b1ef5.json

@@ -0,0 +1,7 @@
+{
+  "type": "minor",
+  "comment": "updated wdio versions and fixed tests",
+  "packageName": "@fluentui-react-native/e2e-testing",
+  "email": "gulnazsayed@microsoft.com",
+  "dependentChangeType": "patch"
+}