Skip to content

Commit 2f20901

Browse files
committed
Wdio retain and rerun final commit
1 parent cef289c commit 2f20901

15 files changed

Lines changed: 836 additions & 360 deletions

File tree

packages/app/src/app.ts

Lines changed: 44 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,17 +6,49 @@ import { TraceType, type TraceLog } from '@wdio/devtools-service/types'
66
import { Element } from '@core/element'
77
import { DataManagerController } from './controller/DataManager.js'
88
import { DragController, Direction } from './utils/DragController.js'
9-
import { SIDEBAR_MIN_WIDTH } from './controller/constants.js'
9+
import { SIDEBAR_MIN_WIDTH, DARK_MODE_KEY } from './controller/constants.js'
10+
import { POPOUT_QUERY } from './components/workbench/compare/constants.js'
11+
12+
// Bootstrap the dark-mode class on <body> as early as possible so popout
13+
// windows (which don't render the header) still get themed consistently
14+
// with the main dashboard. The header still owns the toggle.
15+
const darkModeInit = localStorage.getItem(DARK_MODE_KEY)
16+
const isDarkMode =
17+
typeof darkModeInit === 'string'
18+
? darkModeInit === 'true'
19+
: window.matchMedia('(prefers-color-scheme: dark)').matches
20+
if (isDarkMode) {
21+
document.body.classList.add('dark')
22+
}
23+
// Cross-window sync: when the user toggles dark mode in the main dashboard,
24+
// the storage event fires in OTHER windows (popouts) and we mirror the
25+
// theme change there too.
26+
window.addEventListener('storage', (e) => {
27+
if (e.key === DARK_MODE_KEY) {
28+
document.body.classList.toggle('dark', e.newValue === 'true')
29+
}
30+
})
1031

1132
import './components/header.js'
1233
import './components/sidebar.js'
1334
import './components/workbench.js'
1435
import './components/onboarding/start.js'
36+
import './components/workbench/compare.js'
1537

1638
@customElement('wdio-devtools')
1739
export class WebdriverIODevtoolsApplication extends Element {
1840
dataManager = new DataManagerController(this)
1941

42+
// Popout mode: when opened via the Compare tab's "↗ Pop out" button the
43+
// URL carries ?view=compare&uid=<testUid>. The app then renders only the
44+
// Compare panel full-viewport (no header, no sidebar, no workbench tabs).
45+
#popoutMode =
46+
new URLSearchParams(window.location.search).get(POPOUT_QUERY.viewKey) ===
47+
POPOUT_QUERY.viewValue
48+
#popoutUid =
49+
new URLSearchParams(window.location.search).get(POPOUT_QUERY.uidKey) ||
50+
undefined
51+
2052
static styles = [
2153
...Element.styles,
2254
css`
@@ -56,9 +88,20 @@ export class WebdriverIODevtoolsApplication extends Element {
5688
'clear-execution-data',
5789
this.#clearExecutionData.bind(this)
5890
)
91+
// In popout mode, the URL carries the test uid the parent window was
92+
// viewing. Push it into the context so the Compare component finds the
93+
// matching baseline as soon as the WS reconnects in this new window.
94+
if (this.#popoutMode && this.#popoutUid) {
95+
this.dataManager.setSelectedTestUid(this.#popoutUid)
96+
}
5997
}
6098

6199
render() {
100+
if (this.#popoutMode) {
101+
return html`
102+
<wdio-devtools-compare style="flex:1 1 auto;"></wdio-devtools-compare>
103+
`
104+
}
62105
return html`
63106
<wdio-devtools-header></wdio-devtools-header>
64107
${this.#mainContent()}

packages/app/src/components/sidebar/explorer.ts

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import {
2121
FRAMEWORK_CAPABILITIES,
2222
STATE_MAP
2323
} from './constants.js'
24+
import { BASELINE_API } from '../workbench/compare/constants.js'
2425

2526
import '~icons/mdi/play.js'
2627
import '~icons/mdi/stop.js'
@@ -125,14 +126,16 @@ export class DevtoolsSidebarExplorer extends CollapseableEntry {
125126
})
126127
)
127128

129+
// Forward preserveBaseline so the backend knows whether to drop baselines.
128130
const payload = {
129131
...detail,
130132
runAll: detail.uid === '*',
131133
framework: this.#getFramework(),
132134
specFile: detail.specFile || this.#deriveSpecFile(detail),
133135
configFile: this.#getConfigPath(),
134136
rerunCommand: this.#getRerunCommand(),
135-
launchCommand: this.#getLaunchCommand()
137+
launchCommand: this.#getLaunchCommand(),
138+
preserveBaseline: detail.preserveBaseline === true
136139
}
137140
await this.#postToBackend('/api/tests/run', payload)
138141
}
@@ -150,10 +153,9 @@ export class DevtoolsSidebarExplorer extends CollapseableEntry {
150153
return
151154
}
152155

153-
// Preserve the current run's captured data BEFORE clearing it, so the
154-
// baseline can be compared against the upcoming rerun's live capture.
156+
// Snapshot the current run BEFORE the rerun clears live data.
155157
try {
156-
const response = await fetch('/api/baseline/preserve', {
158+
const response = await fetch(BASELINE_API.preserve, {
157159
method: 'POST',
158160
headers: { 'content-type': 'application/json' },
159161
body: JSON.stringify({
@@ -168,8 +170,7 @@ export class DevtoolsSidebarExplorer extends CollapseableEntry {
168170
detail: `Failed to preserve baseline: ${errorText}`
169171
})
170172
)
171-
// Don't trigger rerun if preserve failed — would lose comparison value.
172-
return
173+
return // skip rerun if preserve failed — no comparison value
173174
}
174175
} catch (error) {
175176
window.dispatchEvent(
@@ -180,10 +181,10 @@ export class DevtoolsSidebarExplorer extends CollapseableEntry {
180181
return
181182
}
182183

183-
// Hand off to the existing rerun flow now that the baseline is pinned.
184+
// Flag the rerun so #handleTestRun doesn't wipe the baseline we just saved.
184185
this.dispatchEvent(
185186
new CustomEvent<TestRunDetail>('app-test-run', {
186-
detail,
187+
detail: { ...detail, preserveBaseline: true },
187188
bubbles: true,
188189
composed: true
189190
})

packages/app/src/components/sidebar/types.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ export interface TestRunDetail {
3838
featureFile?: string
3939
featureLine?: number
4040
suiteType?: string
41+
preserveBaseline?: boolean
4142
}
4243

4344
export enum TestState {

0 commit comments

Comments
 (0)