fix(dupe): render dupe test error indicator (#32303)

Fixes https://github.com/microsoft/playwright/issues/32093

packages/trace-viewer/src/ui/workbench.tsx

@@ -83,7 +83,7 @@ export const Workbench: React.FunctionComponent<{
     setRevealedStack(action?.stack);
   }, [setSelectedActionImpl, setRevealedStack]);
 
-  const sources = React.useMemo(() => model?.sources || new Map(), [model]);
+  const sources = React.useMemo(() => model?.sources || new Map<string, modelUtil.SourceModel>(), [model]);
 
   React.useEffect(() => {
     setSelectedTime(undefined);
@@ -179,9 +179,17 @@ export const Workbench: React.FunctionComponent<{
       selectPropertiesTab('source');
     }} />
   };
+
+  // Fallback location w/o action stands for file / test.
+  // Render error count on Source tab for that case.
+  let fallbackSourceErrorCount: number | undefined = undefined;
+  if (!selectedAction && fallbackLocation)
+    fallbackSourceErrorCount = fallbackLocation.source?.errors.length;
+
   const sourceTab: TabbedPaneTabModel = {
     id: 'source',
     title: 'Source',
+    errorCount: fallbackSourceErrorCount,
     render: () => <SourceTab
       stack={revealedStack}
       sources={sources}

tests/playwright-test/ui-mode-test-source.spec.ts

@@ -128,3 +128,31 @@ test('should show syntax errors in file', async ({ runUITest }) => {
     /Missing semicolon./
   ]);
 });
+
+test('should load error (dupe tests) indicator on sources', async ({ runUITest }) => {
+  const { page } = await runUITest({
+    'a.test.ts': `
+      import { test } from '@playwright/test';
+      test('first', () => {});
+      test('first', () => {});
+    `,
+  });
+  await expect.poll(dumpTestTree(page)).toBe(`
+    ▼ ◯ a.test.ts
+        ◯ first
+  `);
+
+  await page.getByTestId('test-tree').getByText('a.test.ts').click();
+  await expect(page.getByText('Source1')).toBeVisible();
+
+  await expect(
+      page.locator('.CodeMirror .source-line-running'),
+  ).toHaveText(`4      test('first', () => {});`);
+
+  await expect(
+      page.locator('.CodeMirror-linewidget')
+  ).toHaveText([
+    '                              ',
+    /Error: duplicate test title "first", first declared in a.test.ts:3/
+  ]);
+});