fix(e2e): cross-protocol browser.execute() — works with both WebDriver + CDP
Root cause: WebDriverIO devtools protocol wraps functions in a polyfill that puts `return` inside eval() (not a function body) → "Illegal return". Fix: exec() wrapper in helpers/execute.ts converts function args to IIFE strings before passing to browser.execute(). Works identically on both WebDriver (Tauri) and CDP/devtools (Electrobun CEF). - 35 spec files updated (browser.execute → exec) - 4 config files updated (string-form expressions) - helpers/actions.ts + assertions.ts updated - 560 vitest + 116 cargo passing
This commit is contained in:
Hibryda
parent
407e49cc32
commit
6a8181f33a
42 changed files with 630 additions and 541 deletions
|
|
@ -1,10 +1,11 @@
|
|||
import { browser, expect } from '@wdio/globals';
|
||||
import { exec } from '../helpers/execute.ts';
|
||||
|
||||
/** Reset UI to home state (close any open panels/overlays). */
|
||||
async function resetToHomeState(): Promise<void> {
|
||||
const panel = await browser.$('.sidebar-panel');
|
||||
if (await panel.isDisplayed().catch(() => false)) {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const btn = document.querySelector('.panel-close');
|
||||
if (btn) (btn as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -19,7 +20,7 @@ async function openSettings(): Promise<void> {
|
|||
const panel = await browser.$('.sidebar-panel');
|
||||
const isOpen = await panel.isDisplayed().catch(() => false);
|
||||
if (!isOpen) {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const btn = document.querySelector('[data-testid="settings-btn"]');
|
||||
if (btn) (btn as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -27,7 +28,7 @@ async function openSettings(): Promise<void> {
|
|||
}
|
||||
await browser.waitUntil(
|
||||
async () => {
|
||||
const has = await browser.execute(() =>
|
||||
const has = await exec(() =>
|
||||
document.querySelector('.settings-panel .settings-content') !== null,
|
||||
);
|
||||
return has as boolean;
|
||||
|
|
@ -41,7 +42,7 @@ async function openSettings(): Promise<void> {
|
|||
async function closeSettings(): Promise<void> {
|
||||
const panel = await browser.$('.sidebar-panel');
|
||||
if (await panel.isDisplayed().catch(() => false)) {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const btn = document.querySelector('.panel-close');
|
||||
if (btn) (btn as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -53,7 +54,7 @@ describe('Agent Orchestrator — Terminal Tabs', () => {
|
|||
before(async () => {
|
||||
await resetToHomeState();
|
||||
// Ensure Model tab is active so terminal section is visible
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const tab = document.querySelector('.project-box .ptab');
|
||||
if (tab) (tab as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -71,7 +72,7 @@ describe('Agent Orchestrator — Terminal Tabs', () => {
|
|||
|
||||
it('should expand terminal area on toggle click', async () => {
|
||||
// Click terminal toggle via JS
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const toggle = document.querySelector('[data-testid="terminal-toggle"]');
|
||||
if (toggle) (toggle as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -92,14 +93,14 @@ describe('Agent Orchestrator — Terminal Tabs', () => {
|
|||
|
||||
it('should add a shell tab', async () => {
|
||||
// Click add tab button via JS
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const btn = document.querySelector('[data-testid="tab-add"]');
|
||||
if (btn) (btn as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(500);
|
||||
|
||||
// Verify tab title via JS to avoid stale element issues
|
||||
const title = await browser.execute(() => {
|
||||
const title = await exec(() => {
|
||||
const el = document.querySelector('.tab-bar .tab-title');
|
||||
return el ? el.textContent : '';
|
||||
});
|
||||
|
|
@ -113,25 +114,25 @@ describe('Agent Orchestrator — Terminal Tabs', () => {
|
|||
|
||||
it('should add a second shell tab and switch between them', async () => {
|
||||
// Add second tab via JS
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const btn = document.querySelector('[data-testid="tab-add"]');
|
||||
if (btn) (btn as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(500);
|
||||
|
||||
const tabCount = await browser.execute(() => {
|
||||
const tabCount = await exec(() => {
|
||||
return document.querySelectorAll('.tab-bar .tab').length;
|
||||
});
|
||||
expect(tabCount as number).toBeGreaterThanOrEqual(2);
|
||||
|
||||
// Click first tab and verify it becomes active with Shell title
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const tabs = document.querySelectorAll('.tab-bar .tab');
|
||||
if (tabs[0]) (tabs[0] as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(300);
|
||||
|
||||
const activeTitle = await browser.execute(() => {
|
||||
const activeTitle = await exec(() => {
|
||||
const active = document.querySelector('.tab-bar .tab.active .tab-title');
|
||||
return active ? active.textContent : '';
|
||||
});
|
||||
|
|
@ -143,7 +144,7 @@ describe('Agent Orchestrator — Terminal Tabs', () => {
|
|||
const countBefore = tabsBefore.length;
|
||||
|
||||
// Close the last tab
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const closeBtns = document.querySelectorAll('.tab-close');
|
||||
if (closeBtns.length > 0) {
|
||||
(closeBtns[closeBtns.length - 1] as HTMLElement).click();
|
||||
|
|
@ -157,14 +158,14 @@ describe('Agent Orchestrator — Terminal Tabs', () => {
|
|||
|
||||
after(async () => {
|
||||
// Clean up: close remaining tabs and collapse terminal
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const closeBtns = document.querySelectorAll('.tab-close');
|
||||
closeBtns.forEach(btn => (btn as HTMLElement).click());
|
||||
});
|
||||
await browser.pause(300);
|
||||
|
||||
// Collapse terminal
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const toggle = document.querySelector('[data-testid="terminal-toggle"]');
|
||||
if (toggle) {
|
||||
const chevron = toggle.querySelector('.toggle-chevron.expanded');
|
||||
|
|
@ -187,7 +188,7 @@ describe('Agent Orchestrator — Theme Switching', () => {
|
|||
|
||||
it('should show theme dropdown with group labels', async () => {
|
||||
// Close any open dropdowns first
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const openMenu = document.querySelector('.dropdown-menu');
|
||||
if (openMenu) {
|
||||
const trigger = openMenu.closest('.custom-dropdown')?.querySelector('.dropdown-btn');
|
||||
|
|
@ -197,7 +198,7 @@ describe('Agent Orchestrator — Theme Switching', () => {
|
|||
await browser.pause(200);
|
||||
|
||||
// Click the theme dropdown button (first dropdown in appearance)
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const trigger = document.querySelector('.appearance .custom-dropdown .dropdown-btn');
|
||||
if (trigger) (trigger as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -211,7 +212,7 @@ describe('Agent Orchestrator — Theme Switching', () => {
|
|||
expect(groupLabels.length).toBeGreaterThanOrEqual(2);
|
||||
|
||||
// Close dropdown
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const trigger = document.querySelector('.appearance .custom-dropdown .dropdown-btn');
|
||||
if (trigger) (trigger as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -220,12 +221,12 @@ describe('Agent Orchestrator — Theme Switching', () => {
|
|||
|
||||
it('should switch theme and update CSS variables', async () => {
|
||||
// Get current base color
|
||||
const baseBefore = await browser.execute(() => {
|
||||
const baseBefore = await exec(() => {
|
||||
return getComputedStyle(document.documentElement).getPropertyValue('--ctp-base').trim();
|
||||
});
|
||||
|
||||
// Open theme dropdown
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const trigger = document.querySelector('.appearance .custom-dropdown .dropdown-btn');
|
||||
if (trigger) (trigger as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -235,7 +236,7 @@ describe('Agent Orchestrator — Theme Switching', () => {
|
|||
await menu.waitForExist({ timeout: 5000 });
|
||||
|
||||
// Click the first non-active theme option
|
||||
const changed = await browser.execute(() => {
|
||||
const changed = await exec(() => {
|
||||
const options = document.querySelectorAll('.dropdown-menu .dropdown-item:not(.active)');
|
||||
if (options.length > 0) {
|
||||
(options[0] as HTMLElement).click();
|
||||
|
|
@ -247,18 +248,18 @@ describe('Agent Orchestrator — Theme Switching', () => {
|
|||
await browser.pause(500);
|
||||
|
||||
// Verify CSS variable changed
|
||||
const baseAfter = await browser.execute(() => {
|
||||
const baseAfter = await exec(() => {
|
||||
return getComputedStyle(document.documentElement).getPropertyValue('--ctp-base').trim();
|
||||
});
|
||||
expect(baseAfter).not.toBe(baseBefore);
|
||||
|
||||
// Switch back to Catppuccin Mocha (first option) to restore state
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const trigger = document.querySelector('.appearance .custom-dropdown .dropdown-btn');
|
||||
if (trigger) (trigger as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(500);
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const options = document.querySelectorAll('.dropdown-menu .dropdown-item');
|
||||
if (options.length > 0) (options[0] as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -266,7 +267,7 @@ describe('Agent Orchestrator — Theme Switching', () => {
|
|||
});
|
||||
|
||||
it('should show active theme option', async () => {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const trigger = document.querySelector('.appearance .custom-dropdown .dropdown-btn');
|
||||
if (trigger) (trigger as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -278,7 +279,7 @@ describe('Agent Orchestrator — Theme Switching', () => {
|
|||
const activeOption = await browser.$('.dropdown-item.active');
|
||||
await expect(activeOption).toBeExisting();
|
||||
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const trigger = document.querySelector('.appearance .custom-dropdown .dropdown-btn');
|
||||
if (trigger) (trigger as HTMLElement).click();
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue