Feat : Adding Cross Iframe Feature by yashmahamulkar-bs · Pull Request #720 · percy/percy-selenium-js

yashmahamulkar-bs · 2026-03-15T16:43:10Z

This pull request introduces significant improvements to cross-origin iframe handling and responsive DOM capture in the Selenium WebDriver integration, along with some code cleanup and dependency updates. The main focus is on enabling the serialization and stitching of cross-origin iframes into the main DOM snapshot, ensuring more accurate visual testing of pages with embedded content from different origins.

Cross-origin iframe handling:

Added a new captureSerializedDOM function that serializes the main DOM and then processes cross-origin iframes by capturing their DOM snapshots and injecting them back into the main snapshot using a new stitchCorsIframes function. This ensures that cross-origin iframe content is included in Percy snapshots by setting the srcdoc attribute on the relevant iframe elements.
Introduced a processFrame utility to handle the switching of frame contexts, execute serialization scripts, and robustly handle errors and context switching for cross-origin iframes.

Responsive DOM capture improvements:

Replaced the old getWidthsForMultiDOM function with utils.getResponsiveWidths, and updated the responsive DOM capture logic to support per-width height values, improving flexibility and accuracy for responsive snapshots. [1] [2] [3]

Dependency updates:

Updated dependencies to the latest alpha versions of @percy/sdk-utils and @percy/cli in package.json for compatibility with new features and bug fixes.

Other improvements:

Added explicit logging when responsive capture is disabled due to deferUploads being true, improving debuggability.

index.js

Copilot

Pull request overview

This PR enhances the Selenium WebDriver Percy integration by adding cross-origin iframe DOM capture + stitching into the main DOM snapshot, and by updating responsive snapshot capture to use utils.getResponsiveWidths() (supporting per-width heights). It also adds unit tests around these behaviors and updates Percy-related dependencies.

Changes:

Added cross-origin iframe processing (captureSerializedDOM + processFrame) and stitching via exported stitchCorsIframes().
Updated responsive DOM capture to use utils.getResponsiveWidths() and support { width, height } tuples.
Updated @percy/sdk-utils and @percy/cli versions and added extensive new tests.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 7 comments.

File	Description
`index.js`	Adds cross-origin iframe DOM serialization/stitching; switches responsive widths logic to `utils.getResponsiveWidths()`; adds logging when responsive capture is disabled due to `deferUploads`.
`test/index.test.mjs`	Adds tests for cross-origin iframe processing, iframe src filtering, and responsive width/height handling.
`package.json`	Updates Percy dependency versions to `1.31.10-alpha.0`.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

test/index.test.mjs

+describe('stitchCorsIframes', () => {
+  let switchSpies;
+  let frameElement;
+  let iframeDriver;


test/index.test.mjs

+    let callCount = 0;
+    return {
+      getCurrentUrl: jasmine.createSpy().and.returnValue(Promise.resolve('https://host.example.com/')),
+      findElements: jasmine.createSpy().and.returnValue(Promise.resolve([frameElement])),
+      switchTo: jasmine.createSpy().and.returnValue(switchSpies),
+      executeScript: jasmine.createSpy('executeScript').and.callFake(async () => {
+        callCount++;
+        if (callCount === 1) return { domSnapshot: { html: mainHtml, resources: [] } };
+        return iframeHtml ? { html: iframeHtml, resources: [] } : { resources: [] };


test/index.test.mjs

+});
+
+describe('captureSerializedDOM - iframe src filtering', () => {
+  let baseDriver;


index.js

+    const currentUrl = new URL(await driver.getCurrentUrl());
+    const iframes = await driver.findElements({ css: 'iframe' });
+    const processedFrames = [];


index.js

+function stitchCorsIframes(domSnapshot, processedFrames) {
+  let html = domSnapshot.html;
+  for (const { iframeData: { percyElementId }, iframeSnapshot } of processedFrames) {
+    if (!iframeSnapshot?.html) continue;
+    const srcdocValue = iframeSnapshot.html
+      .replace(/&/g, '&amp;')
+      .replace(/"/g, '&quot;');
+    html = html.replace(
+      new RegExp(`(<iframe\\b[^>]*?data-percy-element-id="${percyElementId}"[^>]*?)(/?>)`, 's'),
+      `$1 srcdoc="${srcdocValue}">`
+    );


index.js

package.json

Copilot

Pull request overview

This PR enhances Percy’s Selenium WebDriver DOM capture to better include cross-origin iframe content in serialized DOM snapshots, while also improving responsive snapshot capture width/height handling and adding unit tests.

Changes:

Added cross-origin iframe serialization flow (captureSerializedDOM + processFrame) and HTML stitching via exported stitchCorsIframes().
Updated responsive DOM capture to use utils.getResponsiveWidths() with per-width height support.
Added extensive Jasmine tests around iframe stitching/switching and responsive capture behavior; updated Percy dependencies to alpha versions.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 6 comments.

File	Description
`index.js`	Implements cross-origin iframe capture + stitching, responsive width/height updates, and new logging/export.
`test/index.test.mjs`	Adds integration/unit tests for iframe processing/stitching and responsive capture resizing behavior.
`package.json`	Updates `@percy/sdk-utils` and `@percy/cli` versions to `1.31.10-alpha.0`.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

yashmahamulkar-bs · 2026-03-15T21:15:27Z

index.js

+  for (const { iframeData: { percyElementId }, iframeSnapshot } of processedFrames) {
+    if (!iframeSnapshot?.html) continue;
+    const srcdocValue = iframeSnapshot.html
+      .replace(/&/g, '&amp;')
+      .replace(/"/g, '&quot;');
+    const escapedId = escapeRegExp(percyElementId);
+    const iframeRegex = new RegExp(
+       `(<iframe\\b[^>]*?data-percy-element-id="${escapedId}"[^>]*?)(/?>)`,
+       's'
+    );
+    html = html.replace(
+      iframeRegex,
+      (match, iframeStart, iframeEnd) => `${iframeStart} srcdoc="${srcdocValue}">`
+    );
+  }
+  return { ...domSnapshot, html };


index.js

pankaj443 · 2026-03-19T08:28:45Z

package.json

  "name": "@percy/selenium-webdriver",
  "description": "Selenium client library for visual testing with Percy",
-  "version": "2.2.5",
+  "version": "2.2.6-alpha.0",


update tag as well

yashmahamulkar-bs added 7 commits March 14, 2026 20:46

adding cross iframe fea

507d52c

fixing lint issues

2ed2328

adding unit testcases

a53d63d

fixing cli packages

42bc7f3

fixing package issue

acc40f9

adding modified package

4b141e2

adding more test coverage

9999759

yashmahamulkar-bs requested a review from a team as a code owner March 15, 2026 16:43

yashmahamulkar-bs requested review from Copilot, ninadbstack and prklm10 March 15, 2026 16:43

Copilot started reviewing on behalf of yashmahamulkar-bs March 15, 2026 16:43 View session

github-advanced-security bot found potential problems Mar 15, 2026

View reviewed changes

index.js Fixed Show fixed Hide fixed

Copilot AI reviewed Mar 15, 2026

View reviewed changes

yashmahamulkar-bs added 2 commits March 16, 2026 00:19

resolved copilot reviews

41b7c54

fixing lint issues

c0c3be0

yashmahamulkar-bs requested a review from Copilot March 15, 2026 19:06

Copilot started reviewing on behalf of yashmahamulkar-bs March 15, 2026 19:07 View session

Copilot AI reviewed Mar 15, 2026

View reviewed changes

yashmahamulkar-bs added 4 commits March 16, 2026 02:28

fixing copilot reviews

4456e22

adding new test cases

c57a719

fixing test coverage

01efe43

adding cli comman features for cross iframe

def8c6c

yashmahamulkar-bs changed the title ~~Enhance cross-iframe feature with lint fixes and unit tests~~ Feat : Adding Cross Iframe Feature Mar 18, 2026

yashmahamulkar-bs requested a review from pankaj443 March 18, 2026 07:07

prklm10 approved these changes Mar 18, 2026

View reviewed changes

pankaj443 reviewed Mar 18, 2026

View reviewed changes

index.js Outdated Show resolved Hide resolved

pankaj443 reviewed Mar 18, 2026

View reviewed changes

index.js Show resolved Hide resolved

yashmahamulkar-bs added the ✨ enhancement New feature or request label Mar 18, 2026

resolving comments

ff23b9f

pankaj443 approved these changes Mar 19, 2026

View reviewed changes

yashmahamulkar-bs added 2 commits March 19, 2026 13:32

Alpha release 2.2.6

2e76294

Lint issue fixed

747643e

pankaj443 reviewed Mar 19, 2026

View reviewed changes

adding alpha tag

64f0b49

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Feat : Adding Cross Iframe Feature#720

Feat : Adding Cross Iframe Feature#720
yashmahamulkar-bs wants to merge 17 commits intomasterfrom
PPLT-5012

yashmahamulkar-bs commented Mar 15, 2026 •

edited

Loading

Uh oh!

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Uh oh!

yashmahamulkar-bs Mar 15, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

pankaj443 Mar 19, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

yashmahamulkar-bs commented Mar 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

yashmahamulkar-bs Mar 15, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

pankaj443 Mar 19, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

yashmahamulkar-bs commented Mar 15, 2026 •

edited

Loading