@argos-ci/browser - npm Package Compare versions

Comparing version 1.1.1 to 1.2.0

dist/global.d.ts

@@ -1,7 +0,13 @@
-type PrepareForScreenshotOptions = {
+type SetupOptions = {
     fullPage?: boolean;
+    argosCSS?: string;
 };
+type TeardownOptions = {
+    fullPage?: boolean;
+    argosCSS?: string;
+};
 declare const ArgosGlobal: {
     waitForStability: () => boolean;
-    prepareForScreenshot: (options?: PrepareForScreenshotOptions) => void;
+    setup: (options?: SetupOptions) => void;
+    teardown: (options?: TeardownOptions) => void;
     getColorScheme: () => "dark" | "light";
@@ -8,0 +14,0 @@ getMediaType: () => "print" | "screen";

dist/global.js

@@ -39,15 +39,46 @@ (function () {
   /**
+   * Set the position of an element and backup the previous one.
+   */ function setAndBackupSpellcheck(element, spellcheck) {
+      element.setAttribute("data-argos-bck-position", element.getAttribute("spellcheck") ?? "unset");
+      element.setAttribute("spellcheck", spellcheck);
+  }
+  const SPELL_CHECK_QUERY = "[contenteditable]:not([contenteditable=false]):not([spellcheck=false]), input:not([spellcheck=false]), textarea:not([spellcheck=false])";
+  /**
    * Disable spellcheck to avoid displaying markers.
    */ function disableSpellCheck(document) {
-      const query = "[contenteditable]:not([contenteditable=false]):not([spellcheck=false]), input:not([spellcheck=false]), textarea:not([spellcheck=false])";
-      const inputs = document.querySelectorAll(query);
-      inputs.forEach((input)=>input.setAttribute("spellcheck", "false"));
+      const inputs = document.querySelectorAll(SPELL_CHECK_QUERY);
+      inputs.forEach((element)=>{
+          if (!checkIsHTMLElement(element)) return;
+          setAndBackupSpellcheck(element, "false");
+      });
   }
   /**
+   * Restore spellcheck attribute.
+   */ function restoreSpellCheck(document) {
+      const inputs = document.querySelectorAll(SPELL_CHECK_QUERY);
+      inputs.forEach((input)=>{
+          const spellcheck = input.getAttribute("data-argos-bck-spellcheck");
+          if (spellcheck === "unset") {
+              input.removeAttribute("spellcheck");
+          } else if (spellcheck) {
+              input.setAttribute("spellcheck", spellcheck);
+          }
+      });
+  }
+  /**
    * Inject global styles in the DOM.
-   */ function injectGlobalStyles(document) {
+   */ function injectGlobalStyles(document, css, id) {
       const style = document.createElement("style");
-      style.textContent = GLOBAL_CSS;
+      style.textContent = css;
+      style.id = id;
       document.head.appendChild(style);
   }
+  /**
+   * Remove global styles from the DOM.
+   */ function removeGlobalStyles(document, id) {
+      const style = document.getElementById(id);
+      if (style) {
+          style.remove();
+      }
+  }
   const checkIsHTMLElement = (element)=>{
@@ -57,2 +88,8 @@ return "style" in element;
   /**
+   * Set the position of an element and backup the previous one.
+   */ function setAndBackupPosition(element, position) {
+      element.setAttribute("data-argos-bck-position", element.style.position ?? "unset");
+      element.style.position = position;
+  }
+  /**
    * Stabilize sticky and fixed elements.
@@ -68,5 +105,5 @@ */ function stabilizeElementPositions(document) {
           if (position === "fixed") {
-              element.style.position = "absolute";
+              setAndBackupPosition(element, "absolute");
           } else if (position === "sticky") {
-              element.style.position = "relative";
+              setAndBackupPosition(element, "relative");
           }
@@ -76,5 +113,31 @@ });
   /**
-   * Prepare the document for a screenshot.
-   */ function prepareForScreenshot(document, { fullPage } = {}) {
-      injectGlobalStyles(document);
+   * Restore the position of elements.
+   */ function restoreElementPositions(document) {
+      const window = document.defaultView;
+      if (!window) return;
+      const elements = Array.from(document.querySelectorAll("*"));
+      elements.forEach((element)=>{
+          if (!checkIsHTMLElement(element)) return;
+          const position = element.getAttribute("data-argos-bck-position");
+          if (position === "unset") {
+              element.style.removeProperty("position");
+          } else if (position) {
+              element.style.position = position;
+          }
+      });
+  }
+  function addGlobalClass(document, className) {
+      document.documentElement.classList.add(className);
+  }
+  function removeGlobalClass(document, className) {
+      document.documentElement.classList.remove(className);
+  }
+  /**
+   * Setup the document for screenshots.
+   */ function setup(document, { fullPage, argosCSS } = {}) {
+      addGlobalClass(document, "__argos__");
+      injectGlobalStyles(document, GLOBAL_CSS, "argos-reset-style");
+      if (argosCSS) {
+          injectGlobalStyles(document, argosCSS, "argos-user-style");
+      }
       disableSpellCheck(document);
@@ -86,2 +149,15 @@ if (fullPage) {
   /**
+   * Restore the document after screenshots.
+   */ function teardown(document, { fullPage, argosCSS } = {}) {
+      removeGlobalClass(document, "__argos__");
+      removeGlobalStyles(document, "argos-reset-style");
+      if (argosCSS) {
+          removeGlobalStyles(document, "argos-user-style");
+      }
+      restoreSpellCheck(document);
+      if (fullPage) {
+          restoreElementPositions(document);
+      }
+  }
+  /**
    * Wait for the fonts to be loaded.
@@ -136,3 +212,4 @@ */ function waitForFontsToLoad(document) {
       waitForStability: ()=>waitForStability(document),
-      prepareForScreenshot: (options = {})=>prepareForScreenshot(document, options),
+      setup: (options = {})=>setup(document, options),
+      teardown: (options = {})=>teardown(document, options),
       getColorScheme: ()=>getColorScheme(window),
@@ -139,0 +216,0 @@ getMediaType: ()=>getMediaType(window)

package.json

 {
   "name": "@argos-ci/browser",
   "description": "Browser utilities to stabilize visual testing.",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "author": "Smooth Code",
@@ -49,3 +49,3 @@ "license": "MIT",
   },
-  "gitHead": "27c07b619069353c2a8c8c98203b9c27b4e2bed0"
+  "gitHead": "ad3ddc6e774f2b6e381259b4bfae72855326246b"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

14806

increased by24.52%

Lines of code

407

increased by25.62%

No dependency changes