feat(playwright-html-report): Added snippet parameter to playwright config (#36464)

Signed-off-by: Simon Knott <info@simonknott.de>
Co-authored-by: Simon Knott <info@simonknott.de>

packages/playwright/src/reporters/html.ts

@@ -125,7 +125,7 @@ class HtmlReporter implements ReporterV2 {
   async onEnd(result: api.FullResult) {
     const projectSuites = this.suite.suites;
     await removeFolders([this._outputFolder]);
-    const builder = new HtmlBuilder(this.config, this._outputFolder, this._attachmentsBaseURL, process.env.PLAYWRIGHT_HTML_TITLE || this._options.title);
+    const builder = new HtmlBuilder(this.config, this._outputFolder, this._attachmentsBaseURL, process.env.PLAYWRIGHT_HTML_TITLE || this._options.title, this._options.snippets);
     this._buildResult = await builder.build(this.config.metadata, projectSuites, result, this._topLevelErrors);
   }
 
@@ -223,10 +223,12 @@ class HtmlBuilder {
   private _hasTraces = false;
   private _attachmentsBaseURL: string;
   private _title: string | undefined;
+  private _snippets: boolean;
 
-  constructor(config: api.FullConfig, outputDir: string, attachmentsBaseURL: string, title: string | undefined) {
+  constructor(config: api.FullConfig, outputDir: string, attachmentsBaseURL: string, title: string | undefined, snippets: boolean = true) {
     this._config = config;
     this._reportFolder = outputDir;
+    this._snippets = snippets;
     fs.mkdirSync(this._reportFolder, { recursive: true });
     this._dataZipFile = new yazl.ZipFile();
     this._attachmentsBaseURL = attachmentsBaseURL;
@@ -256,6 +258,7 @@ class HtmlBuilder {
         }
       }
     }
+    if (this._snippets)
       createSnippets(this._stepsInFile);
 
     let ok = true;

packages/playwright/types/test.d.ts

@@ -22,7 +22,7 @@ export type BlobReporterOptions = { outputDir?: string, fileName?: string };
 export type ListReporterOptions = { printSteps?: boolean };
 export type JUnitReporterOptions = { outputFile?: string, stripANSIControlSequences?: boolean, includeProjectInTestName?: boolean };
 export type JsonReporterOptions = { outputFile?: string };
-export type HtmlReporterOptions = { outputFolder?: string, open?: 'always' | 'never' | 'on-failure', host?: string, port?: number, attachmentsBaseURL?: string, title?: string };
+export type HtmlReporterOptions = { outputFolder?: string, open?: 'always' | 'never' | 'on-failure', host?: string, port?: number, attachmentsBaseURL?: string, title?: string, snippets?: boolean };
 
 export type ReporterDescription = Readonly<
   ['blob'] | ['blob', BlobReporterOptions] |

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

@@ -3045,6 +3045,22 @@ for (const useIntermediateMergeReport of [true, false] as const) {
         - treeitem "Click Click me"
       `);
     });
+
+    test('should respect snippets configuration option', async ({ runInlineTest, showReport, page }) => {
+      const result = await runInlineTest({
+        'playwright.config.ts': `
+          export default { reporter: [['html', { snippets: false }]] }
+        `,
+        'example.spec.ts': `
+          import { test, expect } from '@playwright/test';
+          test('fail without snippet', () => { expect(1).toBe(2); });
+        `,
+      }, { reporter: 'dot,html' }, { PLAYWRIGHT_HTML_OPEN: 'never' });
+      expect(result.exitCode).toBe(1);
+      await showReport();
+      await page.getByRole('link', { name: 'fail without snippet' }).click();
+      await expect(page.getByTestId('test-snippet')).not.toBeVisible();
+    });
   });
 }
 

utils/generate_types/overrides-test.d.ts

@@ -21,7 +21,7 @@ export type BlobReporterOptions = { outputDir?: string, fileName?: string };
 export type ListReporterOptions = { printSteps?: boolean };
 export type JUnitReporterOptions = { outputFile?: string, stripANSIControlSequences?: boolean, includeProjectInTestName?: boolean };
 export type JsonReporterOptions = { outputFile?: string };
-export type HtmlReporterOptions = { outputFolder?: string, open?: 'always' | 'never' | 'on-failure', host?: string, port?: number, attachmentsBaseURL?: string, title?: string };
+export type HtmlReporterOptions = { outputFolder?: string, open?: 'always' | 'never' | 'on-failure', host?: string, port?: number, attachmentsBaseURL?: string, title?: string, snippets?: boolean };
 
 export type ReporterDescription = Readonly<
   ['blob'] | ['blob', BlobReporterOptions] |