@percy/dom 1.22.0-alpha.0 → 1.22.0

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.
package/README.md CHANGED
@@ -37,7 +37,7 @@ const domSnapshot = await page.evaluate(() => PercyDOM.serialize(options))
37
37
 
38
38
  - `enableJavaScript` — When true, does not serialize some DOM elements
39
39
  - `domTransformation` — Function to transform the DOM after serialization
40
- - `disableShadowDOMSerialization` — disable shadow DOM capturing, this option can be passed to `percySnapshot` its part of per-snapshot config.
40
+ - `disableShadowDOM` — disable shadow DOM capturing, this option can be passed to `percySnapshot` its part of per-snapshot config.
41
41
 
42
42
  ## Serialized Content
43
43
 
package/dist/bundle.js CHANGED
@@ -60,7 +60,7 @@
60
60
  warnings,
61
61
  resources,
62
62
  enableJavaScript,
63
- disableShadowDOMSerialization
63
+ disableShadowDOM
64
64
  } = _ref;
65
65
  for (let frame of dom.querySelectorAll('iframe')) {
66
66
  var _clone$head;
@@ -86,7 +86,7 @@
86
86
  domTransformation: setBaseURI,
87
87
  dom: frame.contentDocument,
88
88
  enableJavaScript,
89
- disableShadowDOMSerialization
89
+ disableShadowDOM
90
90
  });
91
91
 
92
92
  // append serialized warnings and resources
@@ -159,7 +159,7 @@
159
159
  function uid() {
160
160
  return `_${Math.random().toString(36).substr(2, 9)}`;
161
161
  }
162
- function markElement(domElement, disableShadowDOMSerialization) {
162
+ function markElement(domElement, disableShadowDOM) {
163
163
  var _domElement$tagName;
164
164
  // Mark elements that are to be serialized later with a data attribute.
165
165
  if (['input', 'textarea', 'select', 'iframe', 'canvas', 'video', 'style'].includes((_domElement$tagName = domElement.tagName) === null || _domElement$tagName === void 0 ? void 0 : _domElement$tagName.toLowerCase())) {
@@ -169,7 +169,7 @@
169
169
  }
170
170
 
171
171
  // add special marker for shadow host
172
- if (!disableShadowDOMSerialization && domElement.shadowRoot) {
172
+ if (!disableShadowDOM && domElement.shadowRoot) {
173
173
  domElement.setAttribute('data-percy-shadow-host', '');
174
174
  if (!domElement.getAttribute('data-percy-element-id')) {
175
175
  domElement.setAttribute('data-percy-element-id', uid());
@@ -341,7 +341,7 @@
341
341
  function cloneNodeAndShadow(_ref) {
342
342
  let {
343
343
  dom,
344
- disableShadowDOMSerialization
344
+ disableShadowDOM
345
345
  } = _ref;
346
346
  // clones shadow DOM and light DOM for a given node
347
347
  let cloneNode = (node, parent) => {
@@ -353,12 +353,12 @@
353
353
  };
354
354
 
355
355
  // mark the node before cloning
356
- markElement(node, disableShadowDOMSerialization);
356
+ markElement(node, disableShadowDOM);
357
357
  let clone = node.cloneNode();
358
358
  parent.appendChild(clone);
359
359
 
360
360
  // clone shadow DOM
361
- if (node.shadowRoot && !disableShadowDOMSerialization) {
361
+ if (node.shadowRoot && !disableShadowDOM) {
362
362
  // create shadowRoot
363
363
  if (clone.shadowRoot) {
364
364
  // it may be set up in a custom element's constructor
@@ -386,16 +386,14 @@
386
386
  /**
387
387
  * Use `getInnerHTML()` to serialize shadow dom as <template> tags. `innerHTML` and `outerHTML` don't do this. Buzzword: "declarative shadow dom"
388
388
  */
389
- function getOuterHTML(ctx) {
390
- const docElement = ctx.clone.documentElement;
389
+ function getOuterHTML(docElement) {
391
390
  // firefox doesn't serialize shadow DOM, we're awaiting API's by firefox to become ready and are not polyfilling it.
392
391
  if (!docElement.getInnerHTML) {
393
392
  return docElement.outerHTML;
394
393
  }
395
394
  // chromium gives us declarative shadow DOM serialization API
396
-
397
395
  let innerHTML = docElement.getInnerHTML({
398
- includeShadowRoots: !ctx.disableShadowDOMSerialization
396
+ includeShadowRoots: true
399
397
  });
400
398
  docElement.textContent = '';
401
399
  return docElement.outerHTML.replace('</html>', `${innerHTML}</html>`);
@@ -451,7 +449,7 @@
451
449
 
452
450
  // Serializes and returns the cloned DOM as an HTML string
453
451
  function serializeHTML(ctx) {
454
- let html = getOuterHTML(ctx);
452
+ let html = getOuterHTML(ctx.clone.documentElement);
455
453
  // replace serialized data attributes with real attributes
456
454
  html = html.replace(/ data-percy-serialized-attribute-(\w+?)=/ig, ' $1=');
457
455
  // include the doctype with the html string
@@ -488,7 +486,7 @@
488
486
  enableJavaScript = options === null || options === void 0 ? void 0 : options.enable_javascript,
489
487
  domTransformation = options === null || options === void 0 ? void 0 : options.dom_transformation,
490
488
  stringifyResponse = options === null || options === void 0 ? void 0 : options.stringify_response,
491
- disableShadowDOMSerialization = options === null || options === void 0 ? void 0 : options.disable_shadow_dom_serialization
489
+ disableShadowDOM = options === null || options === void 0 ? void 0 : options.disable_shadow_dom
492
490
  } = options || {};
493
491
 
494
492
  // keep certain records throughout serialization
@@ -497,7 +495,7 @@
497
495
  warnings: new Set(),
498
496
  cache: new Map(),
499
497
  enableJavaScript,
500
- disableShadowDOMSerialization
498
+ disableShadowDOM
501
499
  };
502
500
  ctx.dom = dom;
503
501
  ctx.clone = cloneNodeAndShadow(ctx);
@@ -513,7 +511,7 @@
513
511
  console.error(errorMessage);
514
512
  }
515
513
  }
516
- if (!disableShadowDOMSerialization) {
514
+ if (!disableShadowDOM) {
517
515
  injectDeclarativeShadowDOMPolyfill(ctx);
518
516
  }
519
517
  let result = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@percy/dom",
3
- "version": "1.22.0-alpha.0",
3
+ "version": "1.22.0",
4
4
  "license": "MIT",
5
5
  "repository": {
6
6
  "type": "git",
@@ -34,5 +34,5 @@
34
34
  "devDependencies": {
35
35
  "interactor.js": "^2.0.0-beta.10"
36
36
  },
37
- "gitHead": "5928e586c401ac10840d1ec6219875526e45d100"
37
+ "gitHead": "473ae8925585bc77f584bbcaa7058fc967bd3c61"
38
38
  }