microsoft/playwright
1
1
Fork 0
mirror of https://github.com/microsoft/playwright.git synced 2024-12-12 11:50:22 +03:00
Code Issues Projects Releases Wiki Activity

chore(trace): render drawer as a sidebar in the tv mode (#23451)

Browse Source 
Fixes: https://github.com/microsoft/playwright/issues/23227
This commit is contained in:
Pavel Feldman 2023-06-01 15:49:48 -07:00 committed by GitHub
parent 0a6fe3fac5
commit b99c214b29
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 6 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/trace-viewer/src/ui/sourceTab.tsx
View File

@ -75,7 +75,7 @@ export const SourceTab: React.FunctionComponent<{
return { source, highlight, targetLine, fileName };
}, [action, selectedFrame, rootDir, fallbackLocation], { source: { errors: [], content: 'Loading\u2026' }, highlight: [] });
return <SplitView sidebarSize={200} orientation='horizontal' sidebarHidden={hideStackFrames}>
return <SplitView sidebarSize={200} orientation='vertical' sidebarHidden={hideStackFrames}>
<div className='vbox' data-testid='source-code'>
{fileName && <div className='source-tab-file-name'>{fileName}</div>}
<CodeMirrorWrapper text={source.content || ''} language='javascript' highlight={highlight} revealLine={targetLine} readOnly={true} lineNumbers={true} />

3
packages/trace-viewer/src/ui/uiModeView.tsx
View File

@ -557,7 +557,8 @@ const TraceView: React.FC<{
initialSelection={initialSelection}
onSelectionChanged={onSelectionChanged}
fallbackLocation={item.testFile}
isLive={model?.isLive} />;
isLive={model?.isLive}
drawer='bottom' />;
};
declare global {

5
packages/trace-viewer/src/ui/workbench.tsx
View File

@ -41,7 +41,8 @@ export const Workbench: React.FunctionComponent<{
initialSelection?: ActionTraceEventInContext,
onSelectionChanged?: (action: ActionTraceEventInContext) => void,
isLive?: boolean,
}> = ({ model, hideTimelineBars, hideStackFrames, showSourcesFirst, rootDir, fallbackLocation, initialSelection, onSelectionChanged, isLive }) => {
drawer?: 'bottom' | 'right',
}> = ({ model, hideTimelineBars, hideStackFrames, showSourcesFirst, rootDir, fallbackLocation, initialSelection, onSelectionChanged, isLive, drawer }) => {
const [selectedAction, setSelectedAction] = React.useState<ActionTraceEventInContext | undefined>(undefined);
const [highlightedAction, setHighlightedAction] = React.useState<ActionTraceEventInContext | undefined>();
const [selectedNavigatorTab, setSelectedNavigatorTab] = React.useState<string>('actions');
@ -126,7 +127,7 @@ export const Workbench: React.FunctionComponent<{
onSelected={onActionSelected}
hideTimelineBars={hideTimelineBars}
/>
<SplitView sidebarSize={250} orientation='vertical'>
<SplitView sidebarSize={250} orientation={drawer === 'bottom' ? 'vertical' : 'horizontal'}>
<SplitView sidebarSize={250} orientation='horizontal' sidebarIsFirst={true}>
<SnapshotTab action={activeAction} sdkLanguage={sdkLanguage} testIdAttributeName={model?.testIdAttributeName || 'data-testid'} />
<TabbedPane tabs={