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

feat(ui): highlight output toggle button if terminal contains error

Browse source
This commit is contained in:
Simon Knott 2024-08-30 13:22:29 +02:00
parent ed5c21b827
commit 00cad0ec15
No known key found for this signature in database
GPG key ID: 8CEDC00028084AEC
1 changed files with 7 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
packages/trace-viewer/src/ui/uiModeView.tsx
View file

@ -73,6 +73,7 @@ export const UIModeView: React.FC<{}> = ({
}) => {
const [filterText, setFilterText] = React.useState<string>('');
const [isShowingOutput, setIsShowingOutput] = React.useState<boolean>(false);
const [outputContainsError, setOutputContainsError] = React.useState(false);
const [statusFilters, setStatusFilters] = React.useState<Map<string, boolean>>(new Map([
['passed', false],
['failed', false],
@ -156,6 +157,9 @@ export const UIModeView: React.FC<{}> = ({
} else {
xtermDataSource.write(params.text!);
}
if (params.type === 'stderr')
setOutputContainsError(true);
}),
testServerConnection.onClose(() => setIsDisconnected(true))
];
@ -190,6 +194,7 @@ export const UIModeView: React.FC<{}> = ({
},
onError: error => {
xtermDataSource.write((error.stack || error.value || '') + '\n');
setOutputContainsError(true);
},
pathSeparator,
});
@ -446,7 +451,7 @@ export const UIModeView: React.FC<{}> = ({
<div className={clsx('vbox', !isShowingOutput && 'hidden')}>
<Toolbar>
<div className='section-title' style={{ flex: 'none' }}>Output</div>
<ToolbarButton icon='circle-slash' title='Clear output' onClick={() => xtermDataSource.clear()}></ToolbarButton>
<ToolbarButton icon='circle-slash' title='Clear output' onClick={() => { xtermDataSource.clear(); setOutputContainsError(false); }}></ToolbarButton>
<div className='spacer'></div>
<ToolbarButton icon='close' title='Close' onClick={() => setIsShowingOutput(false)}></ToolbarButton>
</Toolbar>
@ -466,7 +471,7 @@ export const UIModeView: React.FC<{}> = ({
<img src='playwright-logo.svg' alt='Playwright logo' />
<div className='section-title'>Playwright</div>
<ToolbarButton icon='refresh' title='Reload' onClick={() => reloadTests()} disabled={isRunningTest || isLoading}></ToolbarButton>
<ToolbarButton icon='terminal' title={'Toggle output — ' + (isMac ? '⌃`' : 'Ctrl + `')} toggled={isShowingOutput} onClick={() => { setIsShowingOutput(!isShowingOutput); }} />
<ToolbarButton icon={'terminal'} title={'Toggle output — ' + (isMac ? '⌃`' : 'Ctrl + `')} toggled={isShowingOutput} onClick={() => { setIsShowingOutput(!isShowingOutput); }} style={outputContainsError ? { color: 'var(--vscode-minimap-errorHighlight)' } : undefined}/>
{!hasBrowsers && <ToolbarButton icon='lightbulb-autofix' style={{ color: 'var(--vscode-list-warningForeground)' }} title='Playwright browsers are missing' onClick={openInstallDialog} />}
</Toolbar>
<FiltersView