npm - @percy/dom - Versions diffs - 1.32.8-beta.3 → 1.32.8-beta.4 - Mend

@percy/dom 1.32.8-beta.3 → 1.32.8-beta.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2) hide show

package/dist/bundle.js +21 -17
package/package.json +2 -2

package/dist/bundle.js CHANGED Viewed

@@ -364,12 +364,7 @@
       // Custom elements with ElementInternals or closed shadow roots also get
       // stamped so the post-clone state-fallback can locate their clones.
       let tagName = (_domElement$tagName = domElement.tagName) === null || _domElement$tagName === void 0 ? void 0 : _domElement$tagName.toLowerCase();
-      // Stylesheet <link>s are stamped so the pseudo-class serializer can locate
-      // the sheet's clone element and anchor its rewritten interactive-state rules
-      // immediately after it — preserving the sheet's original cascade position
-      // instead of appending at the end of <head> (PER-10077).
-      let isStylesheetLink = tagName === 'link' && /(^|\s)stylesheet(\s|$)/i.test(domElement.getAttribute('rel') || '');
-      if (['input', 'textarea', 'select', 'iframe', 'canvas', 'video', 'style', 'dialog'].includes(tagName) || isStylesheetLink || isCustomElement(domElement)) {
+      if (['input', 'textarea', 'select', 'iframe', 'canvas', 'video', 'style', 'dialog'].includes(tagName) || isCustomElement(domElement)) {
         if (!domElement.getAttribute('data-percy-element-id')) {
           domElement.setAttribute('data-percy-element-id', uid());
         }
@@ -437,7 +432,8 @@
         resources,
         cache,
         warnings,
-        ignoreStyleSheetSerializationErrors
+        ignoreStyleSheetSerializationErrors,
+        styleSheetClones
       } = ctx;
       // in-memory CSSOM into their respective DOM nodes.
       let styleSheets = null;
@@ -466,6 +462,7 @@
               style.textContent = Array.from(styleSheet.cssRules).map(cssRule => cssRule.cssText).join('\n');
               cloneOwnerNode.parentNode.insertBefore(style, cloneOwnerNode.nextSibling);
               cloneOwnerNode.remove();
+              styleSheetClones === null || styleSheetClones === void 0 || styleSheetClones.set(styleSheet.ownerNode, style);
             } catch (err) {
               handleErrors(err, 'Error serializing stylesheet: ', cloneOwnerNode, {
                 styleId: styleId
@@ -1190,11 +1187,11 @@
         // nosemgrep: javascript.browser.security.insecure-document-method.insecure-document-method
         styleElement.textContent = rewrittenRules.join('\n');
         if (owner === null) {
-          injectAtSheetPosition(ctx.clone, sheet, styleElement, ctx.clone.head || ctx.clone.querySelector('head'));
+          injectAtSheetPosition(ctx, ctx.clone, sheet, styleElement, ctx.clone.head || ctx.clone.querySelector('head'));
         } else {
           const cloneHost = cloneByPercyId.get(owner.getAttribute('data-percy-element-id'));
           if (cloneHost && cloneHost.shadowRoot) {
-            injectAtSheetPosition(cloneHost.shadowRoot, sheet, styleElement, cloneHost.shadowRoot);
+            injectAtSheetPosition(ctx, cloneHost.shadowRoot, sheet, styleElement, cloneHost.shadowRoot);
           }
         }
       }
@@ -1203,13 +1200,15 @@
     // Insert an interactive-states <style> immediately AFTER its source sheet's
     // clone element so the copy keeps the sheet's original source-order rank —
     // later stylesheets still win equal-specificity ties, exactly as on the live
-    // page (PER-10077). The sheet's ownerNode (<style> / <link rel=stylesheet>) is
-    // stamped with a data-percy-element-id, which serialize-cssom preserves on any
-    // node it rebuilds in place. Falls back to appending at the scope's end when
-    // the sheet has no locatable clone anchor.
-    function injectAtSheetPosition(scopeRoot, sheet, styleElement, fallbackTarget) {
-      const anchorId = sheet.ownerNode.getAttribute('data-percy-element-id');
-      const anchor = anchorId ? scopeRoot.querySelector(`[data-percy-element-id="${anchorId}"]`) : null;
+    // page (PER-10077).
+    function injectAtSheetPosition(ctx, scopeRoot, sheet, styleElement, fallbackTarget) {
+      var _ctx$styleSheetClones, _anchor;
+      const ownerNode = sheet.ownerNode;
+      let anchor = ownerNode ? (_ctx$styleSheetClones = ctx.styleSheetClones) === null || _ctx$styleSheetClones === void 0 ? void 0 : _ctx$styleSheetClones.get(ownerNode) : null;
+      if (!((_anchor = anchor) !== null && _anchor !== void 0 && _anchor.parentNode) && ownerNode) {
+        const anchorId = ownerNode.getAttribute('data-percy-element-id');
+        anchor = anchorId ? scopeRoot.querySelector(`[data-percy-element-id="${anchorId}"]`) : null;
+      }
       const anchorParent = anchor ? anchor.parentNode : null;
       if (anchorParent) {
         anchorParent.insertBefore(styleElement, anchor.nextSibling);
@@ -1419,7 +1418,8 @@
         forceShadowAsLightDOM,
         resources,
         cache,
-        enableJavaScript
+        enableJavaScript,
+        styleSheetClones
       } = ctx;
       // clones shadow DOM and light DOM for a given node
       let cloneNode = (node, parent) => {
@@ -1441,6 +1441,9 @@
           // mark the node before cloning
           markElement(node, disableShadowDOM, forceShadowAsLightDOM);
           let clone = cloneElementWithoutLifecycle(node);
+          if (styleSheetClones && (node.nodeName === 'LINK' || node.nodeName === 'STYLE')) {
+            styleSheetClones.set(node, clone);
+          }
           // Custom-element :state() is captured by the fallback path in
           // serialize-custom-states.js (live el.matches against state names
@@ -1660,6 +1663,7 @@
         warnings: new Set(),
         hints: new Set(),
         cache: new Map(),
+        styleSheetClones: new WeakMap(),
         shadowRootElements: [],
         enableJavaScript,
         disableShadowDOM,

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@percy/dom",
-  "version": "1.32.8-beta.3",
+  "version": "1.32.8-beta.4",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -35,5 +35,5 @@
   "devDependencies": {
     "interactor.js": "^2.0.0-beta.10"
   },
-  "gitHead": "719021a0565d18a6b47d9d494961eaccb6d63009"
+  "gitHead": "8cb91228f629119207fa169f8db8388d66e0c2e0"
 }