[pull] main from microsoft:main

.azure-pipelines/publish.yml

@@ -99,15 +99,6 @@ extends:
               set -e
               mkdir -p "$(Build.ArtifactStagingDirectory)/esrp-build"
               node utils/workspace.js --list-public-package-paths | while read package; do
-                # ESRP runs `npm publish` without a --tag argument, so the dist-tag
-                # has to be baked into each tarball via publishConfig.tag.
-                node -e "
-                  const fs = require('fs');
-                  const file = process.argv[1] + '/package.json';
-                  const pkg = JSON.parse(fs.readFileSync(file, 'utf8'));
-                  pkg.publishConfig = { ...pkg.publishConfig, tag: 'next' };
-                  fs.writeFileSync(file, JSON.stringify(pkg, null, 2) + '\n');
-                " "$package"
                 npm pack --pack-destination="$(Build.ArtifactStagingDirectory)/esrp-build" "$package"
               done
               ls -la "$(Build.ArtifactStagingDirectory)/esrp-build"
@@ -133,6 +124,8 @@ extends:
               clientid: '13434a40-7de4-4c23-81a3-d843dc81c2c5'
               intent: 'PackageDistribution'
               contenttype: 'npm'
+              # npm dist-tag to publish with.
+              productstate: 'next'
               folderlocation: '$(Build.ArtifactStagingDirectory)/esrp-build'
               waitforreleasecompletion: true
               owners: 'yurys@microsoft.com'

packages/html-reporter/src/chip.css

@@ -15,21 +15,31 @@
 */
 
 .chip-header {
+  display: block;
+  width: 100%;
   border: 1px solid var(--color-border-default);
   border-top-left-radius: 6px;
   border-top-right-radius: 6px;
   background-color: var(--color-canvas-subtle);
   padding: 0 8px;
   border-bottom: none;
   margin-top: 12px;
+  color: inherit;
+  font: inherit;
   font-weight: 600;
   line-height: 38px;
+  text-align: left;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   user-select: none;
 }
 
+.chip-header:focus-visible {
+  outline: 1px solid var(--color-accent-fg);
+  outline-offset: -1px;
+}
+
 .chip-header-allow-selection {
   user-select: text;
 }

packages/html-reporter/src/chip.spec.ts

@@ -16,7 +16,7 @@
 
 import { expect, test } from '@playwright/test';
 
-import type { Auto, AutoCollapsed, Stateful, WithBody } from './chip.story';
+import type { Auto, AutoCollapsed, NotExpandable, Stateful, WithBody } from './chip.story';
 
 test.use({ viewport: { width: 500, height: 500 } });
 
@@ -50,6 +50,23 @@ test('body render prop is rendered', async ({ mount }) => {
   await expect(component.getByText('Chip children')).toBeVisible();
 });
 
+test('chip without setExpanded is not a button', async ({ mount }) => {
+  const component = await mount<typeof NotExpandable>('chip/NotExpandable');
+  await expect(component.getByRole('button')).toHaveCount(0);
+  await expect(component.getByText('Body')).toBeVisible();
+});
+
+test('expand collapse with the keyboard', async ({ mount, page }) => {
+  const component = await mount<typeof AutoCollapsed>('chip/AutoCollapsed');
+  const header = component.getByRole('button', { name: 'Title' });
+  await header.focus();
+  await expect(header).toBeFocused();
+  await page.keyboard.press('Enter');
+  await expect(component.getByText('Body')).toBeVisible();
+  await page.keyboard.press('Space');
+  await expect(component.getByText('Body')).not.toBeVisible();
+});
+
 test('setExpanded should work', async ({ mount }) => {
   const component = await mount<typeof AutoCollapsed>('chip/AutoCollapsed');
   await component.getByText('Title').click();

packages/html-reporter/src/chip.story.tsx

@@ -33,3 +33,6 @@ export const Stateful = () => {
 
 export const WithBody = () =>
   <AutoChip header='Title' body={() => 'Body from render prop'}>Chip children</AutoChip>;
+
+export const NotExpandable = () =>
+  <Chip header='Title'>Body</Chip>;

packages/html-reporter/src/chip.tsx

@@ -33,17 +33,23 @@ export const Chip: React.FC<{
   dataTestId?: string,
 }> = ({ header, footer, expanded, setExpanded, children, noInsets, body, dataTestId }) => {
   const id = React.useId();
+  const title = typeof header === 'string' ? header : undefined;
+  const headerContent = <>
+    {setExpanded ? (expanded ? <icons.downArrow /> : <icons.rightArrow />) : <icons.spacer />}
+    {header}
+  </>;
   return <div className='chip' data-testid={dataTestId}>
-    <div
-      role='button'
+    {setExpanded ? <button
+      type='button'
       aria-expanded={!!expanded}
       aria-controls={id}
-      className={clsx('chip-header', setExpanded && ' expanded-' + expanded)}
-      onClick={() => setExpanded?.(!expanded)}
-      title={typeof header === 'string' ? header : undefined}>
-      {setExpanded ? (expanded ? <icons.downArrow /> : <icons.rightArrow />) : <icons.spacer />}
-      {header}
-    </div>
+      className={clsx('chip-header', 'expanded-' + expanded)}
+      onClick={() => setExpanded(!expanded)}
+      title={title}>
+      {headerContent}
+    </button> : <div className='chip-header' title={title}>
+      {headerContent}
+    </div>}
     {(!setExpanded || expanded) && <div id={id} role='region' className={clsx('chip-body', noInsets && 'chip-body-no-insets')}>
       {children}
       {body && body()}

packages/playwright-core/src/tools/backend/devtools.ts

@@ -135,7 +135,7 @@ const annotate = defineTabTool({
     const daemonArgs = [daemonScript, `--pageId=${pageId}`];
 
     // Spawn the dashboard daemon (idempotent — the singleton socket guards against duplicates).
-    const daemon = spawn(process.execPath, daemonArgs, { detached: true, stdio: 'ignore' });
+    const daemon = spawn(process.execPath, daemonArgs, { detached: true, stdio: 'ignore', windowsHide: true });
     daemon.unref();
 
     // Spawn the annotate client in JSON mode to capture the raw payload over stdout.

packages/playwright-core/src/tools/cli-client/program.ts

@@ -248,6 +248,7 @@ export async function program(options?: { embedderVersion?: string}) {
       const child = spawn(process.execPath, daemonArgs, {
         detached: !foreground,
         stdio: foreground ? 'inherit' : ['pipe', 'pipe', 'ignore'],
+        windowsHide: true,
       });
       if (foreground) {
         await new Promise<void>(resolve => child.on('exit', () => resolve()));

packages/playwright-core/src/tools/cli-client/session.ts

@@ -148,6 +148,7 @@ export class Session {
       detached: true,
       stdio: ['ignore', 'pipe', err],
       cwd: process.cwd(), // Will be used as root.
+      windowsHide: true,
     });
 
     let signalled = false;

packages/utils/processLauncher.ts

@@ -233,7 +233,7 @@ export async function launchProcess(options: LaunchProcessOptions): Promise<Laun
       // Force kill the browser.
       try {
         if (process.platform === 'win32') {
-          const taskkillProcess = childProcess.spawnSync(`taskkill /pid ${spawnedProcess.pid} /T /F`, { shell: true });
+          const taskkillProcess = childProcess.spawnSync(`taskkill /pid ${spawnedProcess.pid} /T /F`, { shell: true, windowsHide: true });
           const [stdout, stderr] = [taskkillProcess.stdout.toString(), taskkillProcess.stderr.toString()];
           if (stdout)
             options.log(`[pid=${spawnedProcess.pid}] taskkill stdout: ${stdout}`);

tests/playwright-test/reporter-html.spec.ts

@@ -3431,7 +3431,7 @@ for (const useIntermediateMergeReport of [true, false] as const) {
         await expect(page.getByRole('link', { name: 'Speedboard' })).toHaveAttribute('aria-selected', 'true');
 
         await expect(page).toMatchAriaSnapshot(`
-          - button "Slowest Tests"
+          - text: /Slowest Tests/
           - region:
             - list:
               - listitem:
@@ -3455,7 +3455,7 @@ for (const useIntermediateMergeReport of [true, false] as const) {
         `);
         await page.getByText('foo').first().click();
         await expect(page).toMatchAriaSnapshot(`
-          - button "Slowest Tests"
+          - text: /Slowest Tests/
         `);
 
         await page.getByRole('link', { name: 'Failed' }).click();