@manufac/general-tests 0.5.1 → 0.9.0

package/dist/specs/sticky-utils.js

@@ -1,175 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.checkStickyElements = checkStickyElements;
-const utils_1 = require("./utils");
-// 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.
-const StickyMarkerAttribute = "data-rs06-sticky-id";
-// Content worth checking that a sticky element doesn't cover: body text and form fields.
-const ContentSelector = "p, li, td, th, label, input, textarea, select, button, a, h1, h2, h3, h4, h5, h6";
-// Marks by computed position alone, not current visibility — a sticky/fixed element that's
-// hidden at page load (e.g. a CTA bar that only appears after scrolling past the hero) must
-// still be tracked once it shows up later, not excluded from the whole test up front.
-async function markStickyElements(page) {
-    return page.evaluate((markerAttribute) => {
-        const candidates = Array.from(document.querySelectorAll("body *")).filter((element) => {
-            const style = window.getComputedStyle(element);
-            return style.position === "fixed" || style.position === "sticky";
-        });
-        candidates.forEach((element, index) => {
-            element.setAttribute(markerAttribute, String(index));
-        });
-        return candidates.length;
-    }, StickyMarkerAttribute);
-}
-async function sampleStickyPositions(page) {
-    return page.evaluate(({ markerAttribute, contentSelector }) => {
-        function isRendered(element) {
-            const style = window.getComputedStyle(element);
-            const rect = element.getBoundingClientRect();
-            return (style.display !== "none" &&
-                style.visibility !== "hidden" &&
-                Number.parseFloat(style.opacity) !== 0 &&
-                rect.width > 0 &&
-                rect.height > 0);
-        }
-        // Only currently-visible stickies contribute a sample this step — a sticky bar that's
-        // hidden right now (not yet triggered, or already dismissed) simply isn't sampled here.
-        const stickies = Array.from(document.querySelectorAll(`[${markerAttribute}]`)).filter(isRendered);
-        const contentElements = Array.from(document.querySelectorAll(contentSelector)).filter(isRendered);
-        return stickies.map((element) => {
-            const stickyID = Number(element.getAttribute(markerAttribute));
-            const rect = element.getBoundingClientRect();
-            const desc = `<${element.tagName.toLowerCase()} class="${element.className}">`;
-            const covered = contentElements
-                .filter((content) => {
-                const isNested = element.contains(content);
-                const contentRect = content.getBoundingClientRect();
-                const overlapWidth = Math.min(rect.right, contentRect.right) - Math.max(rect.left, contentRect.left);
-                const overlapHeight = Math.min(rect.bottom, contentRect.bottom) - Math.max(rect.top, contentRect.top);
-                return !isNested && overlapWidth > 0 && overlapHeight > 0;
-            })
-                .map((content) => {
-                return `${desc} covers <${content.tagName.toLowerCase()} class="${content.className}">`;
-            });
-            return { stickyID, top: rect.top, covered };
-        });
-    }, { markerAttribute: StickyMarkerAttribute, contentSelector: ContentSelector });
-}
-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 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 }, (_, stepIndex) => {
-        return Math.min(Math.floor((maxScrollY / steps) * (steps - stepIndex)), maxScrollY);
-    });
-    for (const targetScrollY of [...down, ...up]) {
-        await page.evaluate((y) => {
-            window.scrollTo(0, y);
-        }, 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: actualScrollY, top: entry.top });
-            samplesByElement.set(entry.stickyID, samples);
-            coversContent.push(...entry.covered);
-        }
-    }
-    return { samplesByElement, coversContent };
-}
-// A well-behaved sticky/fixed element's top can only change between two samples in one of two
-// 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 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) {
-                flicker.push(`sticky element #${String(stickyID)} jumped ${Math.abs(topDelta).toFixed(0)}px between consecutive scroll samples`);
-            }
-        }
-    }
-    return flicker;
-}
-async function findFooterOverlaps(page) {
-    await page.evaluate(() => {
-        window.scrollTo(0, document.documentElement.scrollHeight);
-    });
-    await page.waitForTimeout(100);
-    const conflicts = [];
-    const footer = await page.$("footer, [role='contentinfo']");
-    if (footer !== null) {
-        const footerRect = await footer.boundingBox();
-        const stickies = await page.$$(`[${StickyMarkerAttribute}]`);
-        for (const sticky of stickies) {
-            const rect = await sticky.boundingBox();
-            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);
-                }
-            }
-        }
-    }
-    return conflicts;
-}
-async function checkStickyElements(page) {
-    const stickyElementCount = await markStickyElements(page);
-    let result;
-    if (stickyElementCount === 0) {
-        result = { stickyElementCount: 0, flicker: [], coversContent: [], overlapsFooter: [] };
-    }
-    else {
-        const steps = 20;
-        const { samplesByElement, coversContent } = await collectStickySamples(page, steps);
-        const flicker = computeFlicker(samplesByElement);
-        const overlapsFooter = await findFooterOverlaps(page);
-        result = {
-            stickyElementCount,
-            flicker,
-            coversContent: [...new Set(coversContent)],
-            overlapsFooter,
-        };
-    }
-    return result;
-}

package/dist/specs/visual-regression.spec.d.ts

@@ -1 +0,0 @@
-export {};