PRO-14812 fix: really skip skipped tests in Playwright

Author: uid11

src/utils/report/client/render/TestRunDescription.tsx

@@ -31,7 +31,7 @@ export const TestRunDescription: JSX.Component<Props> = ({fullTestRun}) => {
     const valueWithLinks = parseMarkdownLinks`${value}`;
     const metaHtml = (
       <>
-        <dt class="test-description__term">{key}</dt>
+        <dt class="test-description__term">{key}</dt>{' '}
         <dd class="test-description__definition">{valueWithLinks}</dd>
       </>
     );
@@ -49,7 +49,7 @@ export const TestRunDescription: JSX.Component<Props> = ({fullTestRun}) => {
 
     traceHtml = (
       <>
-        <dt class="test-description__term">{traceLabel}</dt>
+        <dt class="test-description__term">{traceLabel}</dt>{' '}
         <dd class="test-description__definition">
           <a href={traceUrl} download={traceName} aria-label={traceLabel}>
             {traceName}
@@ -63,11 +63,11 @@ export const TestRunDescription: JSX.Component<Props> = ({fullTestRun}) => {
     <dl class="test-description" aria-label="Test meta data">
       <List elements={metaHtmls} />
       {traceHtml}
-      <dt class="test-description__term">Date</dt>
+      <dt class="test-description__term">Date</dt>{' '}
       <dd class="test-description__definition">
         <DatesInterval endTimeInMs={endTimeInMs} startTimeInMs={startTimeInMs} />
       </dd>
-      <dt class="test-description__term">Duration</dt>
+      <dt class="test-description__term">Duration</dt>{' '}
       <dd class="test-description__definition">
         <Duration durationInMs={endTimeInMs - startTimeInMs} />
       </dd>

src/utils/test/beforeTest.ts

@@ -75,6 +75,7 @@ export const beforeTest = ({
   const {onlog, reject, testFnWithReject} = getTestFnAndReject({
     isSkipped,
     runId,
+    skipReason,
     testFn,
     testIdleTimeout,
     testTimeout,

src/utils/test/getTestFnAndReject.ts

@@ -8,22 +8,19 @@ import {getPromiseWithResolveAndReject} from '../promise';
 
 import type {Onlog, RejectTestRun, RunId, TestFn, Void} from '../../types/internal';
 
+import {test as playwrightTest} from '@playwright/test';
+
 type Options = Readonly<{
   isSkipped: boolean;
   runId: RunId;
+  skipReason: string | undefined;
   testFn: TestFn;
   testIdleTimeout: number;
   testTimeout: number;
 }>;
 
 type Return = Readonly<{onlog: Onlog; reject: RejectTestRun; testFnWithReject: TestFn}>;
 
-const skippedTestFnAndReject: Return = {
-  onlog: () => undefined,
-  reject: () => undefined,
-  testFnWithReject: () => RESOLVED_PROMISE,
-};
-
 /**
  * Get test function with execution timeout, idle timeout, reject and onlog functions,
  * by isSkipped flag, test function, runId, test execution timeout and test idle timeouts.
@@ -32,12 +29,23 @@ const skippedTestFnAndReject: Return = {
 export const getTestFnAndReject = ({
   isSkipped,
   runId,
+  skipReason,
   testFn,
   testIdleTimeout,
   testTimeout,
 }: Options): Return => {
   if (isSkipped) {
-    return skippedTestFnAndReject;
+    return {
+      onlog: () => undefined,
+      reject: () => undefined,
+      testFnWithReject: () => {
+        try {
+          playwrightTest.skip(true, skipReason);
+        } catch {}
+
+        return RESOLVED_PROMISE;
+      },
+    };
   }
 
   const {

styles/report.css

@@ -553,7 +553,7 @@ a:visited {
   color: var(--subtitle-color);
 }
 .test-description__term::after {
-  content: ':\00a0';
+  content: ':';
 }
 .test-description__definition {
   margin: 0;