feat(testing): expose captureBeyondViewport in pageCompareScreenshot (#5828)

Author: christian-bromann

src/declarations/stencil-private.ts

@@ -1848,6 +1848,12 @@ export interface ScreenshotOptions {
  * more sensitive. Defaults to the testing config `pixelmatchThreshold` value;
  */
  pixelmatchThreshold?: number;
+ /**
+ * Capture the screenshot beyond the viewport.
+ *
+ * @defaultValue `false` if there is no `clip`. `true` otherwise.
+ */
+ captureBeyondViewport?: boolean;
 }
 
 export interface ScreenshotBoundingBox {

src/testing/puppeteer/puppeteer-screenshot.ts

@@ -159,13 +159,17 @@ export function createPuppeteerScreenshotOptions(
  };
 
  if (opts.clip) {
+ puppeteerOpts.captureBeyondViewport =
+ typeof opts.captureBeyondViewport === 'boolean' ? opts.captureBeyondViewport : true;
  puppeteerOpts.clip = {
  x: opts.clip.x,
  y: opts.clip.y,
  width: opts.clip.width,
  height: opts.clip.height,
  };
  } else {
+ puppeteerOpts.captureBeyondViewport =
+ typeof opts.captureBeyondViewport === 'boolean' ? opts.captureBeyondViewport : false;
  puppeteerOpts.clip = {
  x: 0,
  y: 0,

src/testing/puppeteer/test/puppeteer-screenshot.spec.ts

@@ -11,6 +11,7 @@ describe('Puppeteer Screenshot', () => {
  width: 800,
  height: 600,
  });
+ expect(options.captureBeyondViewport).toBe(false);
  });
 
  it('should use clip options if provided', () => {
@@ -32,6 +33,7 @@ describe('Puppeteer Screenshot', () => {
  width: 100,
  height: 200,
  });
+ expect(options.captureBeyondViewport).toBe(true);
  });
  });
 });