flexysnap 0.4.0 → 0.4.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flexysnap",
-  "version": "0.4.0",
+  "version": "0.4.2",
   "description": "Flexible visual snapshot testing for Playwright, built for e-commerce.",
   "keywords": [
     "playwright",

package/src/wireframeComparison.js

@@ -260,7 +260,7 @@ function compareTexts(baselineTexts, currentTexts, options) {
         }
     }
 
-    const allowExtraText = options?.allowExtra === true;
+    const allowExtraText = options?.extraAllowed === true;
     for (const currentIndex of unmatchedCurrent) {
         const currentText = currentTexts[currentIndex];
         currentText.differences = [{
@@ -269,7 +269,7 @@ function compareTexts(baselineTexts, currentTexts, options) {
         }];
     }
 
-    const allowMissingText = options?.allowMissing === true;
+    const allowMissingText = options?.missingAllowed === true;
     for (const baselineIndex of unmatchedBaseline) {
         const baselineText = baselineTexts[baselineIndex];
         currentTexts.push(baselineText);
@@ -335,7 +335,7 @@ function compareWireframes(baselineWireframe, currentWireframe) {
             }
         }
 
-        const allowExtraElements = currentElementGroup.options?.allowExtra === true;
+        const allowExtraElements = currentElementGroup.options?.extraAllowed === true;
         for (const currentIndex of unmatchedCurrent) {
             const currentElement = currentElementGroup.elements[currentIndex];
             currentElement.differences = [{
@@ -344,7 +344,7 @@ function compareWireframes(baselineWireframe, currentWireframe) {
             }];
         }
 
-        const allowMissingElements = currentElementGroup.options?.allowMissing === true;
+        const allowMissingElements = currentElementGroup.options?.missingAllowed === true;
         for (const baselineIndex of unmatchedBaseline) {
             const baselineElement = baselineElementGroup.elements[baselineIndex];
             currentElementGroup.elements.push(baselineElement);

package/src/wireframeUtils.js

@@ -109,8 +109,8 @@ function createEmptyElementGroupResult(elementGroup) {
             strictPosition: elementGroup.options?.strictPosition !== false,
             strictSize: elementGroup.options?.strictSize !== false,
             maskDigits: elementGroup.options?.maskDigits !== false,
-            allowExtra: elementGroup.options?.allowExtra === true,
-            allowMissing: elementGroup.options?.allowMissing === true
+            extraAllowed: elementGroup.options?.extraAllowed === true,
+            missingAllowed: elementGroup.options?.missingAllowed === true
         },
         elements: []
     };
@@ -145,6 +145,13 @@ async function extractElementGroupData(page, elementGroup, groupIndex, elementId
                     };
                 }
 
+                function isRectWithinViewport(rect) {
+                    return rect.right >= 0 &&
+                        rect.left < window.innerWidth &&
+                        rect.bottom >= 0 &&
+                        rect.top < window.innerHeight;
+                }
+
                 function isElementVisible(element) {
                     const style = window.getComputedStyle(element);
                     if (style.display === 'none' ||
@@ -155,12 +162,9 @@ async function extractElementGroupData(page, elementGroup, groupIndex, elementId
                         return false;
                     }
 
-                    const rect = element.getBoundingClientRect()
+                    const rect = element.getBoundingClientRect();
 
-                    return rect.right >= 0 &&
-                        rect.left < window.innerWidth &&
-                        rect.bottom >= 0 &&
-                        rect.top < window.innerHeight;
+                    return isRectWithinViewport(rect);
                 }
 
                 function getElementsWithDirectText(root, textIgnoreClasses) {
@@ -205,8 +209,8 @@ async function extractElementGroupData(page, elementGroup, groupIndex, elementId
                 elementGroup.options.strictPosition = elementGroup.options.strictPosition !== false;
                 elementGroup.options.strictSize = elementGroup.options.strictSize !== false;
                 elementGroup.options.maskDigits = elementGroup.options.maskDigits !== false;
-                elementGroup.options.allowExtra = elementGroup.options.allowExtra === true;
-                elementGroup.options.allowMissing = elementGroup.options.allowMissing === true;
+                elementGroup.options.extraAllowed = elementGroup.options.extraAllowed === true;
+                elementGroup.options.missingAllowed = elementGroup.options.missingAllowed === true;
                 elementGroup.elements = [];
 
                 let index = 0;
@@ -237,9 +241,14 @@ async function extractElementGroupData(page, elementGroup, groupIndex, elementId
                             if (isNested)
                                 continue;
 
+                            const boundingRect = getTextNodeBoundingBox(descendant);
+
+                            if (!isRectWithinViewport(boundingRect))
+                                continue;
+
                             texts.push({
                                 text: text,
-                                boundingRect: getTextNodeBoundingBox(descendant)
+                                boundingRect: boundingRect
                             });
                         }
                     }