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,26 +1,27 @@
|
|||
import { browser, expect } from '@wdio/globals';
|
||||
import { exec } from '../helpers/execute.ts';
|
||||
// Phase A — Navigation: Terminal tabs + command palette + project focus + NEW tests.
|
||||
// Shares a single Tauri app session with other phase-a-* spec files.
|
||||
|
||||
describe('Scenario 4 — Terminal Tab Management (data-testid)', () => {
|
||||
before(async () => {
|
||||
// Ensure Model tab active (terminal section only visible in Model tab)
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const tabs = document.querySelectorAll('[data-testid="project-tabs"] .ptab');
|
||||
if (tabs[0]) (tabs[0] as HTMLElement).click(); // Model is first tab
|
||||
});
|
||||
await browser.pause(300);
|
||||
// Expand terminal section if collapsed
|
||||
const isExpanded = await browser.execute(() =>
|
||||
const isExpanded = await exec(() =>
|
||||
document.querySelector('[data-testid="terminal-tabs"]') !== null
|
||||
);
|
||||
if (!isExpanded) {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const toggle = document.querySelector('[data-testid="terminal-toggle"]');
|
||||
if (toggle) (toggle as HTMLElement).click();
|
||||
});
|
||||
await browser.waitUntil(
|
||||
async () => browser.execute(() =>
|
||||
async () => exec(() =>
|
||||
document.querySelector('[data-testid="terminal-tabs"]') !== null
|
||||
) as Promise<boolean>,
|
||||
{ timeout: 5000, timeoutMsg: 'Terminal tabs did not appear after expanding' },
|
||||
|
|
@ -29,19 +30,19 @@ describe('Scenario 4 — Terminal Tab Management (data-testid)', () => {
|
|||
});
|
||||
|
||||
it('should display terminal tabs container', async () => {
|
||||
const exists = await browser.execute(() =>
|
||||
const exists = await exec(() =>
|
||||
document.querySelector('[data-testid="terminal-tabs"]') !== null
|
||||
);
|
||||
expect(exists).toBe(true);
|
||||
});
|
||||
|
||||
it('should add a shell tab via data-testid button', async () => {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const btn = document.querySelector('[data-testid="tab-add"]');
|
||||
if (btn) (btn as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(500);
|
||||
const tabTitle = await browser.execute(() => {
|
||||
const tabTitle = await exec(() => {
|
||||
const el = document.querySelector('.tab-bar .tab-title');
|
||||
return el?.textContent ?? '';
|
||||
});
|
||||
|
|
@ -50,28 +51,28 @@ describe('Scenario 4 — Terminal Tab Management (data-testid)', () => {
|
|||
|
||||
it('should show active tab styling after adding tab', async () => {
|
||||
// Ensure at least one tab exists (may need to add one)
|
||||
const tabCount = await browser.execute(() =>
|
||||
const tabCount = await exec(() =>
|
||||
document.querySelectorAll('[data-testid="terminal-tabs"] .tab-bar .tab').length
|
||||
);
|
||||
if (tabCount === 0) {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const btn = document.querySelector('[data-testid="tab-add"]') ?? document.querySelector('.add-first');
|
||||
if (btn) (btn as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(500);
|
||||
}
|
||||
const hasActive = await browser.execute(() =>
|
||||
const hasActive = await exec(() =>
|
||||
document.querySelector('[data-testid="terminal-tabs"] .tab.active') !== null
|
||||
);
|
||||
expect(hasActive).toBe(true);
|
||||
});
|
||||
|
||||
it('should close tab and show empty state', async () => {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
document.querySelectorAll('[data-testid="terminal-tabs"] .tab-close').forEach(btn => (btn as HTMLElement).click());
|
||||
});
|
||||
await browser.pause(500);
|
||||
const hasEmpty = await browser.execute(() =>
|
||||
const hasEmpty = await exec(() =>
|
||||
document.querySelector('[data-testid="terminal-tabs"] .add-first') !== null
|
||||
|| document.querySelector('[data-testid="terminal-tabs"] .empty-terminals') !== null
|
||||
);
|
||||
|
|
@ -79,7 +80,7 @@ describe('Scenario 4 — Terminal Tab Management (data-testid)', () => {
|
|||
});
|
||||
|
||||
it('should show terminal toggle chevron', async () => {
|
||||
const has = await browser.execute(() => {
|
||||
const has = await exec(() => {
|
||||
const toggle = document.querySelector('[data-testid="terminal-toggle"]');
|
||||
return toggle?.querySelector('.toggle-chevron') !== null;
|
||||
});
|
||||
|
|
@ -88,12 +89,12 @@ describe('Scenario 4 — Terminal Tab Management (data-testid)', () => {
|
|||
|
||||
it('should show agent preview button (eye icon) if agent session active', async () => {
|
||||
// Preview button presence depends on active agent session — may not be present
|
||||
const hasPreviewBtn = await browser.execute(() => {
|
||||
const hasPreviewBtn = await exec(() => {
|
||||
const tabs = document.querySelector('[data-testid="terminal-tabs"]');
|
||||
return tabs?.querySelector('.tab-add.tab-agent-preview') !== null;
|
||||
});
|
||||
if (hasPreviewBtn) {
|
||||
const withinTabs = await browser.execute(() => {
|
||||
const withinTabs = await exec(() => {
|
||||
const tabs = document.querySelector('[data-testid="terminal-tabs"]');
|
||||
return tabs?.querySelector('.tab-add.tab-agent-preview') !== null;
|
||||
});
|
||||
|
|
@ -103,38 +104,38 @@ describe('Scenario 4 — Terminal Tab Management (data-testid)', () => {
|
|||
|
||||
it('should maintain terminal state across project tab switches', async () => {
|
||||
// Add a shell tab
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const btn = document.querySelector('[data-testid="tab-add"]');
|
||||
if (btn) (btn as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(500);
|
||||
const countBefore = await browser.execute(() =>
|
||||
const countBefore = await exec(() =>
|
||||
document.querySelectorAll('.tab-bar .tab').length,
|
||||
);
|
||||
// Switch to Files tab and back
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const tabs = document.querySelectorAll('[data-testid="project-tabs"] .ptab');
|
||||
if (tabs.length >= 2) (tabs[1] as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(300);
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const tab = document.querySelector('[data-testid="project-tabs"] .ptab');
|
||||
if (tab) (tab as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(300);
|
||||
const countAfter = await browser.execute(() =>
|
||||
const countAfter = await exec(() =>
|
||||
document.querySelectorAll('.tab-bar .tab').length,
|
||||
);
|
||||
expect(countAfter).toBe(countBefore);
|
||||
// Clean up
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
document.querySelectorAll('.tab-close').forEach(btn => (btn as HTMLElement).click());
|
||||
});
|
||||
await browser.pause(300);
|
||||
});
|
||||
|
||||
after(async () => {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const toggle = document.querySelector('[data-testid="terminal-toggle"]');
|
||||
if (toggle?.querySelector('.toggle-chevron.expanded')) (toggle as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -144,7 +145,7 @@ describe('Scenario 4 — Terminal Tab Management (data-testid)', () => {
|
|||
|
||||
describe('Scenario 5 — Command Palette (data-testid)', () => {
|
||||
before(async () => {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const p = document.querySelector('[data-testid="command-palette"]');
|
||||
if (p && (p as HTMLElement).offsetParent !== null)
|
||||
document.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape' }));
|
||||
|
|
@ -153,7 +154,7 @@ describe('Scenario 5 — Command Palette (data-testid)', () => {
|
|||
});
|
||||
|
||||
it('should open palette and show data-testid input', async () => {
|
||||
await browser.execute(() => document.body.focus());
|
||||
await exec(() => document.body.focus());
|
||||
await browser.pause(200);
|
||||
await browser.keys(['Control', 'k']);
|
||||
const palette = await browser.$('[data-testid="command-palette"]');
|
||||
|
|
@ -163,7 +164,7 @@ describe('Scenario 5 — Command Palette (data-testid)', () => {
|
|||
});
|
||||
|
||||
it('should have focused input', async () => {
|
||||
const isFocused = await browser.execute(() => {
|
||||
const isFocused = await exec(() => {
|
||||
const el = document.querySelector('[data-testid="palette-input"]') as HTMLInputElement | null;
|
||||
if (!el) return false;
|
||||
el.focus();
|
||||
|
|
@ -187,14 +188,14 @@ describe('Scenario 5 — Command Palette (data-testid)', () => {
|
|||
|
||||
it('should show command categories in palette', async () => {
|
||||
// Re-open palette if closed by previous test
|
||||
const isOpen = await browser.execute(() =>
|
||||
const isOpen = await exec(() =>
|
||||
document.querySelector('[data-testid="command-palette"]') !== null
|
||||
);
|
||||
if (!isOpen) {
|
||||
await browser.keys(['Control', 'k']);
|
||||
await browser.pause(500);
|
||||
}
|
||||
const catCount = await browser.execute(() =>
|
||||
const catCount = await exec(() =>
|
||||
document.querySelectorAll('.palette-category').length,
|
||||
);
|
||||
expect(catCount).toBeGreaterThanOrEqual(1);
|
||||
|
|
@ -205,14 +206,14 @@ describe('Scenario 5 — Command Palette (data-testid)', () => {
|
|||
await input.clearValue();
|
||||
await input.setValue('settings');
|
||||
await browser.pause(300);
|
||||
const executed = await browser.execute(() => {
|
||||
const executed = await exec(() => {
|
||||
const item = document.querySelector('.palette-item');
|
||||
if (item) { (item as HTMLElement).click(); return true; }
|
||||
return false;
|
||||
});
|
||||
expect(executed).toBe(true);
|
||||
await browser.pause(500);
|
||||
const paletteGone = await browser.execute(() => {
|
||||
const paletteGone = await exec(() => {
|
||||
const p = document.querySelector('[data-testid="command-palette"]');
|
||||
return p === null || (p as HTMLElement).offsetParent === null;
|
||||
});
|
||||
|
|
@ -223,11 +224,11 @@ describe('Scenario 5 — Command Palette (data-testid)', () => {
|
|||
});
|
||||
|
||||
it('should show keyboard shortcut hints in palette items', async () => {
|
||||
await browser.execute(() => document.body.focus());
|
||||
await exec(() => document.body.focus());
|
||||
await browser.pause(200);
|
||||
await browser.keys(['Control', 'k']);
|
||||
await browser.pause(300);
|
||||
const has = await browser.execute(() =>
|
||||
const has = await exec(() =>
|
||||
document.querySelectorAll('.palette-item .cmd-shortcut').length > 0,
|
||||
);
|
||||
expect(has).toBe(true);
|
||||
|
|
@ -242,7 +243,7 @@ describe('Scenario 5 — Command Palette (data-testid)', () => {
|
|||
|
||||
describe('Scenario 6 — Project Focus & Tab Switching', () => {
|
||||
before(async () => {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const tab = document.querySelector('[data-testid="project-tabs"] .ptab');
|
||||
if (tab) (tab as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -250,7 +251,7 @@ describe('Scenario 6 — Project Focus & Tab Switching', () => {
|
|||
});
|
||||
|
||||
it('should focus project on header click', async () => {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const header = document.querySelector('.project-header');
|
||||
if (header) (header as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -260,18 +261,18 @@ describe('Scenario 6 — Project Focus & Tab Switching', () => {
|
|||
});
|
||||
|
||||
it('should switch to Files tab and back without losing agent session', async () => {
|
||||
expect(await browser.execute(() =>
|
||||
expect(await exec(() =>
|
||||
document.querySelector('[data-testid="agent-session"]') !== null,
|
||||
)).toBe(true);
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const tabs = document.querySelectorAll('[data-testid="project-tabs"] .ptab');
|
||||
if (tabs.length >= 2) (tabs[1] as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(500);
|
||||
expect(await browser.execute(() =>
|
||||
expect(await exec(() =>
|
||||
document.querySelector('[data-testid="agent-session"]') !== null,
|
||||
)).toBe(true);
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const tab = document.querySelector('[data-testid="project-tabs"] .ptab');
|
||||
if (tab) (tab as HTMLElement).click();
|
||||
});
|
||||
|
|
@ -281,46 +282,46 @@ describe('Scenario 6 — Project Focus & Tab Switching', () => {
|
|||
});
|
||||
|
||||
it('should preserve agent status across tab switches', async () => {
|
||||
const statusBefore = await browser.execute(() =>
|
||||
const statusBefore = await exec(() =>
|
||||
document.querySelector('[data-testid="agent-pane"]')?.getAttribute('data-agent-status') ?? 'unknown',
|
||||
);
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const tabs = document.querySelectorAll('[data-testid="project-tabs"] .ptab');
|
||||
if (tabs.length >= 3) (tabs[2] as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(300);
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const tab = document.querySelector('[data-testid="project-tabs"] .ptab');
|
||||
if (tab) (tab as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(300);
|
||||
const statusAfter = await browser.execute(() =>
|
||||
const statusAfter = await exec(() =>
|
||||
document.querySelector('[data-testid="agent-pane"]')?.getAttribute('data-agent-status') ?? 'unknown',
|
||||
);
|
||||
expect(statusAfter).toBe(statusBefore);
|
||||
});
|
||||
|
||||
it('should show tab count badge in terminal toggle', async () => {
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const toggle = document.querySelector('[data-testid="terminal-toggle"]');
|
||||
if (toggle) (toggle as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(300);
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const btn = document.querySelector('[data-testid="tab-add"]');
|
||||
if (btn) (btn as HTMLElement).click();
|
||||
});
|
||||
await browser.pause(500);
|
||||
const text = await browser.execute(() =>
|
||||
const text = await exec(() =>
|
||||
document.querySelector('[data-testid="terminal-toggle"]')?.textContent?.trim() ?? '',
|
||||
);
|
||||
expect(text.length).toBeGreaterThan(0);
|
||||
// Clean up
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
document.querySelectorAll('.tab-close').forEach(btn => (btn as HTMLElement).click());
|
||||
});
|
||||
await browser.pause(300);
|
||||
await browser.execute(() => {
|
||||
await exec(() => {
|
||||
const toggle = document.querySelector('[data-testid="terminal-toggle"]');
|
||||
if (toggle?.querySelector('.toggle-chevron.expanded')) (toggle as HTMLElement).click();
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue