fix(tooling): remove wdio & upgrade meeting widget to playwright by Riteshfyi · Pull Request #628 · webex/widgets

Riteshfyi · 2026-02-19T09:52:53Z

COMPLETES #https://jira-eng-gpk2.cisco.com/jira/browse/SPARK-772628

This pull request addresses

Removes Wdio E2E Tests & moves to playwright for meetings widget.

by making the following changes

converting previous tests to typescrip & updating them for palywright

VIDCAST

https://app.vidcast.io/share/efc89d9a-211e-4130-a602-e326ac9f3b43

Change Type

Bug fix (non-breaking change which fixes an issue)
New feature (non-breaking change which adds functionality)
Breaking change (fix or feature that would cause existing functionality to change)
Documentation update
Tooling change
Internal code refactor

The following scenarios were tested

verified locally, will run e2e test as well

The GAI Coding Policy And Copyright Annotation Best Practices

Checklist before merging

I have not skipped any automated checks
All existing and new tests passed
I have updated the testing document
I have tested the functionality with amplify link

Make sure to have followed the contributing guidelines before submitting.

aws-amplify-us-east-2 · 2026-02-19T09:58:36Z

This pull request is automatically being deployed by Amplify Hosting (learn more).

Access this pull request here: https://pr-628.d1b38q61t1z947.amplifyapp.com

Shreyas281299 · 2026-02-20T05:15:12Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 52c36927e5

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

chatgpt-codex-connector · 2026-02-20T05:20:57Z

packages/@webex/widgets/package.json

    "release:dry-run": "semantic-release --dry-run",
    "start": "npm run demo:serve",
-    "test:e2e": "npm run demo:build && wdio wdio.conf.js",
+    "test:e2e": "npm run demo:build && yarn playwright test --project='Meetings Setup' --project='Meetings Widget Test'",


Use the configured setup project name in test:e2e

test:e2e invokes Playwright with --project='Meetings Setup', but the setup project defined in playwright.config.ts is named OAuth: Get Meeting Access Token (line 76). Since Playwright resolves --project by exact project name, this command fails before tests run, which means the e2e_test_meetings workflow path (.github/workflows/pull-request.yml, Test E2E) cannot execute the migrated meetings suite.

Useful? React with 👍 / 👎.

Good Review Codex, it was a silly mistake.

chatgpt-codex-connector · 2026-02-20T05:20:57Z

playwright/meetings/pages/MeetingWidgetPage.ts

+    this.unmuteAudioBtn = this.controls.getByRole('button', {name: 'Unmute'});
+    this.muteVideoBtn = this.controls.getByRole('button', {name: 'Stop video'});
+    this.unmuteVideoBtn = this.controls.getByRole('button', {name: 'Start video'});
+    this.joinMeetingBtn = this.controls.getByRole('button', {name: /^(Muted, video off|Unmuted, video on)$/});


Match the join button’s actual accessible name

The new locator only matches a button named /^(Muted, video off|Unmuted, video on)$/, but the meeting widget code still identifies the pre-join control as button[aria-label="Join meeting"] (packages/@webex/widgets/src/widgets/WebexMeetings/WebexMeetings.jsx), and the prior E2E test also targeted “Join meeting”; in that pre-join state joinMeetingBtn.click() in both suites cannot resolve an element, so the tests fail before joining.

Useful? React with 👍 / 👎.

After leaving & joining again, the name changes

Shreyas281299

Thanks for this upgrade. Changes look good. Lets just ensure that the checks are passing.
And what about the credentials?

Riteshfyi · 2026-02-23T09:00:45Z

Will Move these Changes to a feature branch, before we migrate the meeting widgets to latest version of our Webex

rarajes2

Please add a vidcast

rarajes2 · 2026-02-23T13:46:04Z

packages/@webex/widgets/package.json

    "release:dry-run": "semantic-release --dry-run",
    "start": "npm run demo:serve",
-    "test:e2e": "npm run demo:build && wdio wdio.conf.js",
+    "test:e2e": "npm run demo:build && yarn playwright test --config=../../../playwright.config.ts --project='Meetings Widget Test'",


Why are we using both npm and yarn ? Let's use a single package manager

Do we have to provide the config path ? Is there a way we can use the default path and keep the command to minimum ?

Can we also rename the folder from widgets to meetings-widgets or just meetings? NOT IN THE SCOPE OF THIS PR

I have done the changes for point 1 & 2. will have to see if there are any consequence before we change the name.

rarajes2 · 2026-02-23T13:53:00Z

playwright/meetings/pages/SamplesPage.ts

@@ -0,0 +1,31 @@
+import {Page, Locator, expect} from '@playwright/test';
+
+const TEST_URL = 'https://localhost:9000/';


Should we move this to a constant or config file ?

Will it work in the pipeline ? Maybe this value can come from env variable

Moved to constants

Yeah, this will work. i think env will be an overkill here.

rarajes2 · 2026-02-23T13:55:00Z

playwright/meetings/WebexMeeting.spec.ts

+import { test, expect } from '@playwright/test';
+import fs from 'fs';
+import path from 'path';
+import { SamplesPage } from './pages/SamplesPage';
+import { MeetingWidgetPage } from './pages/MeetingWidgetPage';
+import dotenv from 'dotenv';


nitpick: Let's re-arrange the imports. Please check other files for reference

rarajes2 · 2026-02-23T13:57:41Z

playwright/meetings/WebexMeeting.spec.ts

+    // Re-read .env fresh so we pick up the token written by Meetings Setup
+    const envPath = path.resolve(__dirname, '../../.env');
+    const envConfig = dotenv.parse(fs.readFileSync(envPath));
+    for (const key in envConfig) {
+      process.env[key] = envConfig[key];
+    }


Why do we need to do this? We are calling the dotenv.config() at the top. Please verify if it's require

Playwright test files were reading older environment variable values. For example, after OAuth, the tests were reading an empty string instead of the newly written access token. To address this issue, this change has been made.

we have to update the process with the new variables, because the meetings-setup has updated the token in the .env, therefore we have to update the variables cached in the process.

I tried with upgrading the dot-env to version 18 & using override : true, it was working directly. but too much logs are being printed by dot-env, in the latest version. so decide to move with the less hectic solution

rarajes2 · 2026-02-23T13:59:59Z

playwright/meetings/WebexMeeting.spec.ts

+test.describe('Meeting Widget', () => {
+  let samplesPage: SamplesPage;
+  let meetingPage: MeetingWidgetPage;
+  let accessToken: string;


Are we changing the value of accessToken anywhere? If not, this can be const and value can be assigned here itself from the env variable

Updated, since access token & meeting destination are only being used once, they directly initialized as const in the test itself now.

rarajes2 · 2026-02-23T14:01:35Z

playwright/meetings.setup.ts

+
+
+


nitpick: remove unnecessary newlines.

Applicable everywhere in this file

rarajes2 · 2026-02-23T14:02:56Z

playwright/meetings.setup.ts

+  const envPath = path.resolve(__dirname, '../.env');
+  let envContent = '';
+  if (fs.existsSync(envPath)) {
+    envContent = fs.readFileSync(envPath, 'utf8');
+  }
+
+
+  const tokenPattern = /^PW_MEETING_ACCESS_TOKEN=.*$/m;
+  if (tokenPattern.test(envContent)) {
+    envContent = envContent.replace(tokenPattern, `PW_MEETING_ACCESS_TOKEN=${accessToken}`);
+  } else {
+    if (!envContent.endsWith('\n') && envContent.length > 0) envContent += '\n';
+    envContent += `PW_MEETING_ACCESS_TOKEN=${accessToken}\n`;
+  }
+
+  fs.writeFileSync(envPath, envContent, 'utf8');
+  console.log('Access token written to .env');
+});


Why do we have to do all this if we are using dotenv package ?

dotenv doesn't have the feature option to update env file, it is read only.
so to update or write the access token, we are handling it using this way.

rarajes2 · 2026-02-23T14:04:31Z

playwright.config.ts

+const e2eConfig = [
+  `--disable-site-isolation-trials`,
+  `--disable-web-security`,
+  `--no-sandbox`,
+  `--disable-features=WebRtcHideLocalIpsWithMdns`,
+  `--allow-file-access-from-files`,
+  `--use-fake-ui-for-media-stream`,
+  `--use-fake-device-for-media-stream`,
+  `--use-file-for-fake-audio-capture=${dummyAudioPath}`,
+  `--disable-extensions`,
+  `--disable-plugins`,
+  `--window-size=1280,720`,
+];


Let's add a comment at the end of each config for what they are being used

rarajes2 · 2026-02-23T14:05:18Z

playwright.config.ts

+  webServer: [
+    {
+      command: 'yarn workspace samples-cc-react-app serve',
+      url: 'http://localhost:3000',


This can come from constant or cofing file.

Applicable everywhere in this file

rarajes2 · 2026-02-23T14:05:44Z

playwright.config.ts

-  },
+  webServer: [
+    {
+      command: 'yarn workspace samples-cc-react-app serve',


Let's ensure we are using either npm or yarn throughout the codebase

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: cb168355e5

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

chatgpt-codex-connector · 2026-02-27T02:13:31Z

playwright/meetings/pages/MeetingWidgetPage.ts

+    this.unmuteAudioBtn = this.controls.getByRole('button', { name: 'Unmute' });
+    this.muteVideoBtn = this.controls.getByRole('button', { name: 'Stop video' });
+    this.unmuteVideoBtn = this.controls.getByRole('button', { name: 'Start video' });
+    this.joinMeetingBtn = this.controls.getByRole('button', { name: /^(Muted, video off|Unmuted, video on)$/ });


Include "Join meeting" in join button locator

The new join-button locator only accepts Muted, video off or Unmuted, video on, but the meeting widget still treats the pre-join control as button[aria-label="Join meeting"] (see WebexMeetings focus logic), so on the initial join flow joinMeetingBtn.click() can fail to resolve any element before the test even enters the meeting. This makes the migrated Playwright suite flaky/failing whenever the control still exposes the standard "Join meeting" accessible name.

Useful? React with 👍 / 👎.

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 31ce16db2b

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

chatgpt-codex-connector · 2026-02-27T04:35:09Z

packages/@webex/widgets/package.json

    "release:dry-run": "semantic-release --dry-run",
    "start": "npm run demo:serve",
-    "test:e2e": "npm run demo:build && wdio wdio.conf.js",
+    "test:e2e": "npm run demo:build && cd ../../.. && yarn run test:e2e:meetings",


Install Playwright deps before running meetings E2E

This script now runs the meetings suite through Playwright, but the e2e_test_meetings workflow path (.github/workflows/pull-request.yml, step Test E2E at line 193) invokes it without the npx playwright install --with-deps step that the CC Playwright job uses at lines 220-221. On fresh GitHub runners (empty Playwright browser cache), the setup project will fail before tests because required browser binaries/system deps are missing, so this change breaks the meetings E2E pipeline unless that install step is added.

Useful? React with 👍 / 👎.

Noted, will raise separate PR for this.

Riteshfyi · 2026-02-27T04:51:04Z

NOTE : before merging this PR, we have to create a feature branch, there we will update the .yml & the webex resolution for testing the tests on CI before merging.

Riteshfyi and others added 15 commits February 6, 2026 11:52

fix(tooling): remove rollup

2eb4b1d

fix(tooling): remove rollup dependencies

5386b17

fix(tooling): update .esm.js output to .mjs

5d7c01c

fix(tooling): update formatting

bc1e670

fix(tooling): add new docs

cf1f834

Merge branch 'next' into wp

3bebaee

Merge remote-tracking branch 'upstream/next' into wp

81d1d4e

fix(tooling): move to earlier docs

5328b6d

Merge remote-tracking branch 'origin/wp' into wp

bd8c91d

fix(tooling): remove wdio & upgrade to playwright

895331e

fix(tooling) remove unnecessary dependencies

bbb91b6

merge next into pw

922024f

fix(tooling): update TEST URL

330dc68

fix(tooling): update TEST URL

a1fe393

Merge branch 'next' into pw

52c3692

Riteshfyi changed the title ~~fix(tooling) : Remove Wdio & Upgrade to Meeting Widget to Playwright~~ fix(tooling) : Remove Wdio & Upgrade Meeting Widget to Playwright Feb 19, 2026

akulakum added validated Indicates that the PR is ready for actions run_e2e Add this label to run E2E test for meeting and CC widgets and removed validated Indicates that the PR is ready for actions labels Feb 19, 2026

Riteshfyi changed the title ~~fix(tooling) : Remove Wdio & Upgrade Meeting Widget to Playwright~~ fix(tooling): Remove Wdio & Upgrade Meeting Widget to Playwright Feb 19, 2026

chatgpt-codex-connector bot reviewed Feb 20, 2026

View reviewed changes

rarajes2 changed the title ~~fix(tooling): Remove Wdio & Upgrade Meeting Widget to Playwright~~ fix(tooling): remove wdio & upgrade meeting widget to playwright Feb 20, 2026

Shreyas281299 approved these changes Feb 20, 2026

View reviewed changes

Shreyas281299 closed this Feb 20, 2026

Shreyas281299 reopened this Feb 20, 2026

Riteshfyi added 2 commits February 23, 2026 14:15

fix(tooling): update script

f6ef235

Merge remote-tracking branch 'origin/pw' into pw

818f27e

fix(tooling): update yarn.lock

ef80ca5

rarajes2 requested changes Feb 23, 2026

View reviewed changes

Riteshfyi and others added 2 commits February 27, 2026 07:33

fix(tooling): refactor changes

8b2ccee

Merge branch 'next' into pw

cb16835

chatgpt-codex-connector bot reviewed Feb 27, 2026

View reviewed changes

Riteshfyi added 2 commits February 27, 2026 09:53

fix(tooling): update playwright config

0d73442

Merge 'origin/pw' into pw

31ce16d

chatgpt-codex-connector bot reviewed Feb 27, 2026

View reviewed changes

		@@ -0,0 +1,31 @@
		import {Page, Locator, expect} from '@playwright/test';

		const TEST_URL = 'https://localhost:9000/';

Conversation

Riteshfyi commented Feb 19, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

COMPLETES #https://jira-eng-gpk2.cisco.com/jira/browse/SPARK-772628

This pull request addresses

by making the following changes

VIDCAST

Change Type

The following scenarios were tested

The GAI Coding Policy And Copyright Annotation Best Practices

Checklist before merging

Uh oh!

aws-amplify-us-east-2 bot commented Feb 19, 2026

Uh oh!

Shreyas281299 commented Feb 20, 2026

Uh oh!

chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector bot Feb 20, 2026

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector bot Feb 20, 2026

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Shreyas281299 left a comment

Choose a reason for hiding this comment

Uh oh!

Riteshfyi commented Feb 23, 2026

Uh oh!

rarajes2 left a comment

Choose a reason for hiding this comment

Uh oh!

rarajes2 Feb 23, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Riteshfyi commented Feb 19, 2026 •

edited

Loading

rarajes2 Feb 23, 2026 •

edited

Loading