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

fix double state update by introducing completed flag to mark difference between "not yet started" and "completed"

Browse source
This commit is contained in:
Simon Knott 2024-08-08 17:08:57 +02:00
parent 3711474682
commit 785293fac8
No known key found for this signature in database
GPG key ID: 8CEDC00028084AEC
2 changed files with 12 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
packages/trace-viewer/src/ui/uiModeTestListView.tsx
View file

@ -40,7 +40,7 @@ export const TestListView: React.FC<{
testServerConnection: TestServerConnection | undefined,
testModel?: TestModel,
runTests: (mode: 'bounce-if-busy' | 'queue-if-busy', testIds: Set<string>) => void,
runningState?: { testIds: Set<string>, itemSelectedByUser?: boolean },
runningState?: { testIds: Set<string>, itemSelectedByUser?: boolean, completed?: boolean },
watchAll: boolean,
watchedTreeIds: { value: Set<string> },
setWatchedTreeIds: (ids: { value: Set<string> }) => void,
@ -154,7 +154,7 @@ export const TestListView: React.FC<{
</div>
{!!treeItem.duration && treeItem.status !== 'skipped' && <div className='ui-mode-list-item-time'>{msToString(treeItem.duration)}</div>}
<Toolbar noMinHeight={true} noShadow={true}>
<ToolbarButton icon='play' title='Run' onClick={() => runTreeItem(treeItem)} disabled={!!runningState}></ToolbarButton>
<ToolbarButton icon='play' title='Run' onClick={() => runTreeItem(treeItem)} disabled={!!runningState && !runningState.completed}></ToolbarButton>
<ToolbarButton icon='go-to-file' title='Show source' onClick={onRevealSource} style={(treeItem.kind === 'group' && treeItem.subKind === 'folder') ? { visibility: 'hidden' } : {}}></ToolbarButton>
{!watchAll && <ToolbarButton icon='eye' title='Watch' onClick={() => {
if (watchedTreeIds.value.has(treeItem.id))

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

@ -85,7 +85,9 @@ export const UIModeView: React.FC<{}> = ({
const [selectedItem, setSelectedItem] = React.useState<{ treeItem?: TreeItem, testFile?: SourceLocation, testCase?: reporterTypes.TestCase }>({});
const [visibleTestIds, setVisibleTestIds] = React.useState<Set<string>>(new Set());
const [isLoading, setIsLoading] = React.useState<boolean>(false);
const [runningState, setRunningState] = React.useState<{ testIds: Set<string>, itemSelectedByUser?: boolean } | undefined>();
const [runningState, setRunningState] = React.useState<{ testIds: Set<string>, itemSelectedByUser?: boolean, completed?: boolean } | undefined>();
const isRunningTest = runningState && !runningState.completed;
const [watchAll, setWatchAll] = useSetting<boolean>('watch-all', false);
const [watchedTreeIds, setWatchedTreeIds] = React.useState<{ value: Set<string> }>({ value: new Set() });
const commandQueue = React.useRef(Promise.resolve());
@ -251,29 +253,29 @@ export const UIModeView: React.FC<{}> = ({
// Update progress.
React.useEffect(() => {
if (runningState && testModel?.progress)
if (isRunningTest && testModel?.progress)
setProgress(testModel.progress);
else if (!testModel)
setProgress(undefined);
}, [testModel, runningState]);
}, [testModel, isRunningTest]);
// Test tree is built from the model and filters.
const { testTree } = React.useMemo(() => {
if (!testModel)
return { testTree: new TestTree('', new TeleSuite('', 'root'), [], projectFilters, pathSeparator) };
const testTree = new TestTree('', testModel.rootSuite, testModel.loadErrors, projectFilters, pathSeparator);
testTree.filterTree(filterText, statusFilters, runningState?.testIds);
testTree.filterTree(filterText, statusFilters, isRunningTest ? runningState?.testIds : undefined);
testTree.sortAndPropagateStatus();
testTree.shortenRoot();
testTree.flattenForSingleProject();
setVisibleTestIds(testTree.testIds());
return { testTree };
}, [filterText, testModel, statusFilters, projectFilters, setVisibleTestIds, runningState]);
}, [filterText, testModel, statusFilters, projectFilters, setVisibleTestIds, runningState, isRunningTest]);
const runTests = React.useCallback((mode: 'queue-if-busy' | 'bounce-if-busy', testIds: Set<string>) => {
if (!testServerConnection || !testModel)
return;
if (mode === 'bounce-if-busy' && runningState)
if (mode === 'bounce-if-busy' && isRunningTest)
return;
runTestBacklog.current = new Set([...runTestBacklog.current, ...testIds]);
@ -320,9 +322,9 @@ export const UIModeView: React.FC<{}> = ({
test.results = [];
}
setTestModel({ ...testModel });
setRunningState(undefined);
setRunningState(oldState => oldState ? ({ ...oldState, completed: true }) : undefined);
});
}, [projectFilters, runningState, testModel, testServerConnection, runWorkers, runHeaded, runUpdateSnapshots]);
}, [projectFilters, isRunningTest, testModel, testServerConnection, runWorkers, runHeaded, runUpdateSnapshots]);
React.useEffect(() => {
if (!testServerConnection || !teleSuiteUpdater)
@ -396,7 +398,6 @@ export const UIModeView: React.FC<{}> = ({
};
}, [runTests, reloadTests, testServerConnection, visibleTestIds, isShowingOutput]);
const isRunningTest = !!runningState;
const dialogRef = React.useRef<HTMLDialogElement>(null);
const openInstallDialog = React.useCallback((e: React.MouseEvent) => {
e.preventDefault();