FI-1434 feat: add links to trace.zip in HTML report

src/actions/waitFor/waitForNewTab.ts

@@ -30,7 +30,7 @@ export const waitForNewTab = async (options?: Options): Promise<Tab> => {
   const url = page.url();
 
   log(
-    `Have waited for new tab for ${waitWithUnits} on ${url}`,
+    `Have waited for new tab for ${waitWithUnits} at ${url}`,
     {timeout},
     LogEventType.InternalCore,
   );

src/constants/internal.ts

@@ -49,6 +49,7 @@ export {
   DOT_ENV_PATH,
   EVENTS_DIRECTORY_PATH,
   INSTALLED_E2ED_DIRECTORY_PATH,
+  INTERNAL_DIRECTORY_NAME,
   INTERNAL_REPORTS_DIRECTORY_PATH,
   REPORTS_DIRECTORY_PATH,
   SCREENSHOTS_DIRECTORY_PATH,

src/constants/paths.ts

@@ -52,12 +52,18 @@ export const REPORTS_DIRECTORY_PATH = join(
 ) as DirectoryPathFromRoot;
 
 /**
- * Relative (from root) path to reports directory.
+ * Name of internal directory with tests artifacts.
+ * @internal
+ */
+export const INTERNAL_DIRECTORY_NAME = 'internal';
+
+/**
+ * Relative (from root) path to internal directory with tests artifacts.
  * @internal
  */
 export const INTERNAL_REPORTS_DIRECTORY_PATH = join(
   REPORTS_DIRECTORY_PATH,
-  'internal',
+  INTERNAL_DIRECTORY_NAME,
 ) as DirectoryPathFromRoot;
 
 /**

src/types/report.ts

@@ -88,6 +88,7 @@ export type TestRunButtonProps = Readonly<{
 export type ReportClientState = {
   clickListeners?: Record<string, (event: HTMLElement) => void>;
   readonly fullTestRuns: readonly FullTestRun[];
+  readonly internalDirectoryName: string;
   lengthOfReadedJsonReportDataParts: number;
   readonly pathToScreenshotsDirectoryForReport: string | null;
   readonly readJsonReportDataObservers: MutationObserver[];

src/utils/report/client/render/renderTestRunDescription.ts

@@ -7,22 +7,24 @@ import {
 import {renderDatesInterval as clientRenderDatesInterval} from './renderDatesInterval';
 import {renderDuration as clientRenderDuration} from './renderDuration';
 
-import type {FullTestRun, SafeHtml} from '../../../../types/internal';
+import type {FullTestRun, ReportClientState, SafeHtml} from '../../../../types/internal';
 
 const createSafeHtmlWithoutSanitize = clientCreateSafeHtmlWithoutSanitize;
 const parseMarkdownLinks = clientParseMarkdownLinks;
 const renderDatesInterval = clientRenderDatesInterval;
 const renderDuration = clientRenderDuration;
 const sanitizeHtml = clientSanitizeHtml;
 
+declare const reportClientState: ReportClientState;
+
 /**
  * Renders tag `<dl class="test-description">` with test run description.
  * The value strings of meta can contain links in markdown format.
  * This base client function should not use scope variables (except other base functions).
  * @internal
  */
 export function renderTestRunDescription(fullTestRun: FullTestRun): SafeHtml {
-  const {endTimeInMs, startTimeInMs} = fullTestRun;
+  const {endTimeInMs, outputDirectoryName, runError, startTimeInMs} = fullTestRun;
   const durationInMs = endTimeInMs - startTimeInMs;
   const {meta} = fullTestRun.options;
   const metaHtmls: SafeHtml[] = [];
@@ -36,11 +38,27 @@ export function renderTestRunDescription(fullTestRun: FullTestRun): SafeHtml {
     metaHtmls.push(metaHtml);
   }
 
+  let traceHtml: SafeHtml = createSafeHtmlWithoutSanitize``;
+
+  if (runError !== undefined) {
+    const {internalDirectoryName} = reportClientState;
+    const traceLabel = 'Download trace';
+    const traceName = 'trace.zip';
+    const traceUrl = `./${internalDirectoryName}/${outputDirectoryName}/${traceName}`;
+
+    traceHtml = sanitizeHtml`
+<dt class="test-description__term">${traceLabel}</dt>
+<dd class="test-description__definition">
+  <a href="${traceUrl}" aria-label="${traceLabel}" download="${traceName}">${traceName}</a>
+</dd>`;
+  }
+
   const metaProperties = createSafeHtmlWithoutSanitize`${metaHtmls.join('')}`;
 
   return sanitizeHtml`
 <dl class="test-description test-description_type_meta">
   ${metaProperties}
+  ${traceHtml}
   <dt class="test-description__term">Date</dt>
   <dd class="test-description__definition">
     ${renderDatesInterval({endTimeInMs, startTimeInMs})}

src/utils/report/render/renderScriptConstants.ts

@@ -1,3 +1,5 @@
+import {INTERNAL_DIRECTORY_NAME} from '../../../constants/internal';
+
 import {getFullPackConfig} from '../../config';
 
 import {createSafeHtmlWithoutSanitize} from '../client';
@@ -15,6 +17,7 @@ export const renderScriptConstants = (): SafeHtml => {
 
   const reportClientState: ReportClientState = {
     fullTestRuns: [],
+    internalDirectoryName: INTERNAL_DIRECTORY_NAME,
     lengthOfReadedJsonReportDataParts: 0,
     pathToScreenshotsDirectoryForReport,
     readJsonReportDataObservers: [],