Filip/playwright
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

address feedback

Browse source
This commit is contained in:
Simon Knott 2024-09-06 10:16:11 +02:00
parent 4630f20f69
commit 0430b84841
No known key found for this signature in database
GPG key ID: 8CEDC00028084AEC
2 changed files with 12 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
packages/trace-viewer/src/ui/modelUtil.ts
View file

@ -356,6 +356,10 @@ export function prevInList(action: ActionTraceEvent): ActionTraceEvent {
return (action as any)[prevInListSymbol]; return (action as any)[prevInListSymbol];
} }
export function pageForAction(action: ActionTraceEvent): PageEntry {
return context(action).pages[0]; // TODO: figure out what to do about multiple pages.
}
export function stats(action: ActionTraceEvent): { errors: number, warnings: number } { export function stats(action: ActionTraceEvent): { errors: number, warnings: number } {
let errors = 0; let errors = 0;
let warnings = 0; let warnings = 0;

15
packages/trace-viewer/src/ui/snapshotTab.tsx
View file

@ -17,7 +17,7 @@
import './snapshotTab.css'; import './snapshotTab.css';
import * as React from 'react'; import * as React from 'react';
import type { ActionTraceEvent } from '@trace/trace'; import type { ActionTraceEvent } from '@trace/trace';
import { context, type MultiTraceModel, prevInList } from './modelUtil'; import { context, type MultiTraceModel, pageForAction, prevInList } from './modelUtil';
import { Toolbar } from '@web/components/toolbar'; import { Toolbar } from '@web/components/toolbar';
import { ToolbarButton } from '@web/components/toolbarButton'; import { ToolbarButton } from '@web/components/toolbarButton';
import { clsx, useMeasure, useSetting } from '@web/uiUtils'; import { clsx, useMeasure, useSetting } from '@web/uiUtils';
@ -166,12 +166,13 @@ export const SnapshotTab: React.FunctionComponent<{
y: (measure.height - snapshotContainerSize.height) / 2, y: (measure.height - snapshotContainerSize.height) / 2,
}; };
const page = model?.pages[0]; // TODO: figure out what to do about multiple pages. const page = action ? pageForAction(action) : undefined;
const screencastFrame = React.useMemo( const screencastFrame = React.useMemo(
() => snapshotInfo.timestamp && page?.screencastFrames () => {
? findClosest(page.screencastFrames, snapshotInfo.timestamp) if (snapshotInfo.timestamp && page?.screencastFrames)
: undefined return findClosest(page.screencastFrames, snapshotInfo.timestamp);
, [page?.screencastFrames, snapshotInfo.timestamp] },
[page?.screencastFrames, snapshotInfo.timestamp]
); );
return <div return <div
@ -201,7 +202,7 @@ export const SnapshotTab: React.FunctionComponent<{
iframe={iframeRef1.current} iframe={iframeRef1.current}
iteration={loadingRef.current.iteration} /> iteration={loadingRef.current.iteration} />
<Toolbar> <Toolbar>
<ToolbarButton className='pick-locator' title={showScreenshotInsteadOfSnapshot ? 'Locators not available when showing screenshot' : 'Pick locator'} icon='target' toggled={isInspecting} onClick={() => setIsInspecting(!isInspecting)} disabled={showScreenshotInsteadOfSnapshot} /> <ToolbarButton className='pick-locator' title={showScreenshotInsteadOfSnapshot ? 'Disable "screenshots instead of snapshots" to pick a locator' : 'Pick locator'} icon='target' toggled={isInspecting} onClick={() => setIsInspecting(!isInspecting)} disabled={showScreenshotInsteadOfSnapshot} />
{['action', 'before', 'after'].map(tab => { {['action', 'before', 'after'].map(tab => {
return <TabbedPaneTab return <TabbedPaneTab
key={tab} key={tab}