@manufac/general-tests 0.0.1-alpha → 0.0.1

package/dist/specs/shared/media-embeds/third-party-embeds.spec.js

@@ -11,8 +11,11 @@ fixtures_1.test.describe("Media Embeds - Third Party", () => {
         fixtures_1.test.skip(embedCount === 0, "No third-party embeds present on this page");
         const isOverflowing = await (0, utils_1.hasHorizontalScrollbar)(page);
         (0, test_1.expect)(isOverflowing, "Page should not have horizontal overflow with embeds present").toBe(false);
-        const collapsedEmbeds = await (0, utils_1.findCollapsedEmbeds)(page);
-        (0, test_1.expect)(collapsedEmbeds, `Embed(s) collapsed to zero size:\n${collapsedEmbeds.join("\n")}`).toEqual([]);
+        // Note: MD-03 specifies that broken embeds shouldn't leave a "giant empty gap [that] breaks the layout".
+        // Detecting "blank because the embed failed to load" vs "legitimately blank/white content" purely
+        // from the outer element's geometry isn't reliably possible without provider-specific knowledge.
+        // If an embed shrinks to 0x0, that is considered a graceful failure, not a bug.
+        // This is a known automation limitation (P2). We rely on the layout/overflow checks above and below.
         const heading = page.getByRole("heading", { level: 1 }).first();
         await (0, test_1.expect)(heading, "Main heading should remain visible with embeds present").toBeVisible();
         for (let embedIndex = 0; embedIndex < embedCount; embedIndex++) {

package/dist/specs/sticky-utils.d.ts

@@ -1,9 +1,4 @@
 import type { Page } from "@playwright/test";
-export interface ScrollMetrics {
-    scrollHeight: number;
-    scrollY: number;
-}
-export declare function getScrollMetrics(page: Page): Promise<ScrollMetrics>;
 export interface StickyIssues {
     stickyElementCount: number;
     flicker: string[];

package/dist/specs/sticky-utils.js

@@ -1,16 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getScrollMetrics = getScrollMetrics;
 exports.checkStickyElements = checkStickyElements;
 const utils_1 = require("./utils");
-async function getScrollMetrics(page) {
-    return page.evaluate(() => {
-        return {
-            scrollHeight: document.documentElement.scrollHeight,
-            scrollY: window.scrollY,
-        };
-    });
-}
 // Each page.evaluate call runs in a fresh browser-side context, so a DOM element found in one
 // can't be referenced from the next — this attribute gives each sticky a stable ID to re-select
 // by across the many separate evaluate calls this check makes while scrolling.
@@ -66,24 +57,46 @@ async function sampleStickyPositions(page) {
         });
     }, { markerAttribute: StickyMarkerAttribute, contentSelector: ContentSelector });
 }
-async function collectStickySamples(page, scrollHeight, steps) {
+async function waitForScrollToSettle(page) {
+    let previousScrollY = await page.evaluate(() => {
+        return window.scrollY;
+    });
+    let isSettled = false;
+    let attempt = 0;
+    while (!isSettled && attempt < 20) {
+        await page.waitForTimeout(100);
+        const currentScrollY = await page.evaluate(() => {
+            return window.scrollY;
+        });
+        isSettled = Math.abs(currentScrollY - previousScrollY) < 1;
+        previousScrollY = currentScrollY;
+        attempt += 1;
+    }
+}
+async function collectStickySamples(page, steps) {
     const samplesByElement = new Map();
     const coversContent = [];
-    const down = Array.from({ length: steps + 1 }, (_, i) => {
-        return Math.floor((scrollHeight / steps) * i);
+    const maxScrollY = await page.evaluate(() => {
+        return document.documentElement.scrollHeight - document.documentElement.clientHeight;
+    });
+    const down = Array.from({ length: steps + 1 }, (_, stepIndex) => {
+        return Math.min(Math.floor((maxScrollY / steps) * stepIndex), maxScrollY);
     });
-    const up = Array.from({ length: steps + 1 }, (_, i) => {
-        return Math.floor((scrollHeight / steps) * (steps - i));
+    const up = Array.from({ length: steps + 1 }, (_, stepIndex) => {
+        return Math.min(Math.floor((maxScrollY / steps) * (steps - stepIndex)), maxScrollY);
     });
-    for (const scrollY of [...down, ...up]) {
+    for (const targetScrollY of [...down, ...up]) {
         await page.evaluate((y) => {
             window.scrollTo(0, y);
-        }, scrollY);
-        await page.waitForTimeout(100);
+        }, targetScrollY);
+        await waitForScrollToSettle(page);
+        const actualScrollY = await page.evaluate(() => {
+            return window.scrollY;
+        });
         const sample = await sampleStickyPositions(page);
         for (const entry of sample) {
             const samples = samplesByElement.get(entry.stickyID) ?? [];
-            samples.push({ scrollY, top: entry.top });
+            samples.push({ scrollY: actualScrollY, top: entry.top });
             samplesByElement.set(entry.stickyID, samples);
             coversContent.push(...entry.covered);
         }
@@ -94,12 +107,17 @@ async function collectStickySamples(page, scrollHeight, steps) {
 // ways: it's currently pinned, so top stays put (delta ~0); or it's still in normal flow (not yet
 // engaged), so top moves in exact lockstep with scroll (delta ~ -scrollDelta). Anything else is an
 // unexplained jump — the actual flicker/jank this check is meant to catch.
+//
+// Limitation (RS-06 / #162): This is a false-positive risk for JS-driven sticky toggles where the
+// CSS `position` value changes (e.g. from static to fixed). A discrete state change causes a large
+// top jump which computeFlicker currently flags as a flicker. A full fix requires tracking `position`
+// and ignoring jumps when the position value changes. Tracked as a P2 limitation for a future pass.
 function computeFlicker(samplesByElement) {
     const flicker = [];
     for (const [stickyID, samples] of samplesByElement) {
-        for (let i = 1; i < samples.length; i++) {
-            const topDelta = samples[i].top - samples[i - 1].top;
-            const scrollDelta = samples[i].scrollY - samples[i - 1].scrollY;
+        for (let sampleIndex = 1; sampleIndex < samples.length; sampleIndex++) {
+            const topDelta = samples[sampleIndex].top - samples[sampleIndex - 1].top;
+            const scrollDelta = samples[sampleIndex].scrollY - samples[sampleIndex - 1].scrollY;
             const isPinned = Math.abs(topDelta) <= utils_1.ResponsiveConfig.PinFlickerTolerancePX;
             const isFollowingScroll = Math.abs(topDelta + scrollDelta) <= utils_1.ResponsiveConfig.PinFlickerTolerancePX;
             if (!isPinned && !isFollowingScroll) {
@@ -121,15 +139,15 @@ async function findFooterOverlaps(page) {
         const stickies = await page.$$(`[${StickyMarkerAttribute}]`);
         for (const sticky of stickies) {
             const rect = await sticky.boundingBox();
-            if (footerRect === null || rect === null)
-                continue;
-            const overlapWidth = Math.min(rect.x + rect.width, footerRect.x + footerRect.width) - Math.max(rect.x, footerRect.x);
-            const overlapHeight = Math.min(rect.y + rect.height, footerRect.y + footerRect.height) - Math.max(rect.y, footerRect.y);
-            if (overlapWidth > 0 && overlapHeight > 0) {
-                const description = await sticky.evaluate((element) => {
-                    return `<${element.tagName.toLowerCase()} class="${element.className}">`;
-                });
-                conflicts.push(description);
+            if (footerRect !== null && rect !== null) {
+                const overlapWidth = Math.min(rect.x + rect.width, footerRect.x + footerRect.width) - Math.max(rect.x, footerRect.x);
+                const overlapHeight = Math.min(rect.y + rect.height, footerRect.y + footerRect.height) - Math.max(rect.y, footerRect.y);
+                if (overlapWidth > 0 && overlapHeight > 0) {
+                    const description = await sticky.evaluate((element) => {
+                        return `<${element.tagName.toLowerCase()} class="${element.className}">`;
+                    });
+                    conflicts.push(description);
+                }
             }
         }
     }
@@ -142,9 +160,8 @@ async function checkStickyElements(page) {
         result = { stickyElementCount: 0, flicker: [], coversContent: [], overlapsFooter: [] };
     }
     else {
-        const { scrollHeight } = await getScrollMetrics(page);
         const steps = 20;
-        const { samplesByElement, coversContent } = await collectStickySamples(page, scrollHeight, steps);
+        const { samplesByElement, coversContent } = await collectStickySamples(page, steps);
         const flicker = computeFlicker(samplesByElement);
         const overlapsFooter = await findFooterOverlaps(page);
         result = {

package/dist/specs/utils.d.ts

@@ -4,8 +4,8 @@ export declare const ResponsiveConfig: {
     readonly ScrollStepDelayMs: 100;
     readonly ViewPortWidth: 1440;
     readonly ViewPortHeight: 900;
-    readonly ZoomLevel: "200%";
-    readonly ZoomSettleDelayMs: 200;
+    readonly ZoomFactor: 2;
+    readonly ZoomSettleDelayMs: 300;
     readonly UpscaleTolerance: 1.05;
     readonly OversizeTolerance: 2;
     readonly ScrollDriftTolerance: 0.15;
@@ -13,6 +13,7 @@ export declare const ResponsiveConfig: {
     readonly PinFlickerTolerancePX: 2;
     readonly MinTouchTargetSizePX: 44;
     readonly KeyboardOcclusionRatio: 0.4;
+    readonly CutoffTolerancePX: 5;
 };
 export interface ScrollMetrics {
     scrollHeight: number;
@@ -41,7 +42,6 @@ export declare function getScrollMetrics(page: Page): Promise<ScrollMetrics>;
 export declare function scrollThroughPage(page: Page): Promise<void>;
 export declare function findTruncatedOrOverflowingText(page: Page): Promise<string[]>;
 export declare function findOverlappingElements(page: Page, containerSelector: string): Promise<string[]>;
-export declare function findOverlappingTapTargets(page: Page): Promise<string[]>;
 export declare const ContentOverlapSelector: string;
 export interface ImageSizeIssue {
     src: string;
@@ -66,28 +66,55 @@ export interface ViewportSize {
     width: number;
     height: number;
 }
-export declare function isCutoffAtViewportEdge(rect: ElementRect, viewport: ViewportSize): boolean;
+interface RenderedElementSnapshot extends ElementDescriptor {
+    rect: ElementRect;
+    isFixedOrSticky: boolean;
+}
+export declare function isCutoffAtViewportEdge(snapshot: RenderedElementSnapshot, viewport: ViewportSize): boolean;
 export declare function findElementsCutoffAtViewportEdge(page: Page, containerSelector?: string): Promise<string[]>;
 export declare function findUndersizedBodyText(page: Page): Promise<string[]>;
 export declare function findUndersizedTouchTargets(page: Page, containerSelector: string): Promise<string[]>;
 export declare function hasHorizontalScrollbar(page: Page): Promise<boolean>;
-export declare function findCollapsedEmbeds(page: Page): Promise<string[]>;
 export declare function isVideoAutoplaying(video: Locator): Promise<boolean>;
 export declare function isVideoMuted(video: Locator): Promise<boolean>;
-export declare const ValidUserInfo: {
-    readonly ValidTestName: "Jane Doe";
-    readonly ValidTestEmail: "test@test.com";
-    readonly ValidTestPhone: "9876543210";
-    readonly LongNameCharacterCount: 250;
-    readonly EmojiTestName: "Jane 😀 Doe";
-    readonly PaddedTestEmail: "   test@test.com   ";
-};
+export interface UserInfoShape {
+    ValidTestName: string;
+    ValidTestEmail: string;
+    ValidTestPhone: string;
+    ValidTestCompany: string;
+    ValidTestProjectDescription: string;
+    ValidTestPreferredDate: string;
+    ValidTestPreferredTime: string;
+    LongNameCharacterCount: number;
+    EmojiTestName: string;
+    PaddedTestEmail: string;
+    InvalidTestEmail: string;
+}
+export declare const ValidUserInfo: UserInfoShape;
 export interface RequiredField {
     label: RegExp;
     validValue: string;
 }
-export declare const RequiredFields: RequiredField[];
-export declare function fillAllFieldsValidly(page: Page): Promise<void>;
+export declare function isFieldRequired(fieldLocator: Locator): Promise<boolean>;
+export declare const FieldInteractions: {
+    readonly Fill: "fill";
+    readonly Datetime: "datetime";
+};
+export type FieldInteraction = (typeof FieldInteractions)[keyof typeof FieldInteractions];
+export interface FieldValueMapping {
+    label: RegExp;
+    validValue: string;
+    interaction: FieldInteraction;
+}
+/**
+ * Maps a detected field (by its label) to the valid test value used
+ * to fill it. Presence here does NOT imply the field is required —
+ * required-ness is determined dynamically per field via
+ * `isFieldRequired`. Email is the only field that is always required.
+ */
+export declare const FieldValueMappings: FieldValueMapping[];
+export declare function fillDateTimePicker(locator: Locator, fallbackValue: string): Promise<void>;
+export declare function fillFormFields(page: Page): Promise<void>;
 export declare function hasVisibleErrorNearField(fieldLocator: Locator): Promise<boolean>;
 export interface InvalidInputCase {
     fieldLabel: RegExp;
@@ -117,3 +144,16 @@ export declare function swipeToPreviousSlide(carousel: Locator): Promise<boolean
 export declare function traverseSlidesForward(carousel: Locator, carouselIndex: number, isMobile: boolean): Promise<void>;
 export declare function checkSwipeBackward(carousel: Locator, carouselIndex: number): Promise<void>;
 export declare function checkAllDots(carousel: Locator, carouselIndex: number): Promise<void>;
+export declare const SafeAreaZones: {
+    readonly Top: "top";
+    readonly Bottom: "bottom";
+    readonly Left: "left";
+    readonly Right: "right";
+};
+export type SafeAreaZone = (typeof SafeAreaZones)[keyof typeof SafeAreaZones];
+export interface SafeAreaOverlap extends ElementDescriptor {
+    text: string;
+    overlapZone: SafeAreaZone;
+}
+export declare function findSafeAreaOverlaps(page: Page): Promise<SafeAreaOverlap[]>;
+export {};