@manufac/general-tests 0.1.0 → 0.2.0

package/dist/config/projects.d.ts

@@ -1,26 +1,9 @@
-import { devices } from "@playwright/test";
-import type { Project } from "@playwright/test";
 export interface Breakpoint {
     name: string;
     width: number;
     height: number;
 }
-export declare const Breakpoints: {
-    readonly MobileS: {
-        readonly name: "Mobile S";
-        readonly width: 320;
-        readonly height: 568;
-    };
-    readonly MobileM: {
-        readonly name: "Mobile M";
-        readonly width: 390;
-        readonly height: 844;
-    };
-    readonly Tablet: {
-        readonly name: "Tablet";
-        readonly width: 768;
-        readonly height: 1024;
-    };
+export declare const DesktopBreakpoints: {
     readonly Laptop: {
         readonly name: "Laptop";
         readonly width: 1280;
@@ -37,23 +20,29 @@ export declare const Breakpoints: {
         readonly height: 1080;
     };
 };
-declare const ProjectTypes: {
+export declare const MobileBreakpoints: {
+    readonly MobileS: {
+        readonly name: "Mobile S";
+        readonly width: 320;
+        readonly height: 568;
+    };
+    readonly MobileM: {
+        readonly name: "Mobile M";
+        readonly width: 390;
+        readonly height: 844;
+    };
+    readonly Tablet: {
+        readonly name: "Tablet";
+        readonly width: 768;
+        readonly height: 1024;
+    };
+};
+export declare const ProjectTypes: {
     readonly Mobile: "mobile";
     readonly Desktop: "desktop";
+    readonly Shared: "shared";
 };
-export type ProjectType = (typeof ProjectTypes)[keyof typeof ProjectTypes];
-export interface MobileConfig {
-    projectType: typeof ProjectTypes.Mobile;
-    breakpoint: typeof Breakpoints.MobileM;
-}
-export interface DesktopConfig {
-    projectType: typeof ProjectTypes.Desktop;
-    breakpoint: typeof Breakpoints.Desktop;
-}
-export interface CreateProjectParams {
-    name: string;
-    device: keyof typeof devices;
-    configuration: MobileConfig | DesktopConfig;
-}
-export declare function createProject({ configuration, device, name }: CreateProjectParams): Project;
-export {};
+export declare const SharedTestMatch = "shared/**/*.spec.js";
+export declare const DesktopOnlyTestMatch = "desktop-only/**/*.spec.js";
+export declare const MobileOnlyTestMatch = "mobile-only/**/*.spec.js";
+export declare const SiteWideTestMatch = "site-wide/**/*.spec.js";

package/dist/config/projects.js

@@ -1,38 +1,23 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Breakpoints = void 0;
-exports.createProject = createProject;
-const test_1 = require("@playwright/test");
-const node_path_1 = require("node:path");
+exports.SiteWideTestMatch = exports.MobileOnlyTestMatch = exports.DesktopOnlyTestMatch = exports.SharedTestMatch = exports.ProjectTypes = exports.MobileBreakpoints = exports.DesktopBreakpoints = void 0;
 // Section 3 of the Landing Page Test Plan — breakpoints / viewports.
-exports.Breakpoints = {
-    MobileS: { name: "Mobile S", width: 320, height: 568 },
-    MobileM: { name: "Mobile M", width: 390, height: 844 },
-    Tablet: { name: "Tablet", width: 768, height: 1024 },
+exports.DesktopBreakpoints = {
     Laptop: { name: "Laptop", width: 1280, height: 800 },
     Desktop: { name: "Desktop", width: 1440, height: 900 },
     Wide: { name: "Wide", width: 1920, height: 1080 },
 };
-// Resolves to dist/specs at runtime so projects work regardless of the consuming app's own testDir.
-const SpecsDirectory = (0, node_path_1.join)(__dirname, "..", "specs");
-const SharedTestMatch = "shared/**/*.spec.js";
-const DesktopOnlyTestMatch = "desktop-only/**/*.spec.js";
-const MobileOnlyTestMatch = "mobile-only/**/*.spec.js";
-const ProjectTypes = {
+exports.MobileBreakpoints = {
+    MobileS: { name: "Mobile S", width: 320, height: 568 },
+    MobileM: { name: "Mobile M", width: 390, height: 844 },
+    Tablet: { name: "Tablet", width: 768, height: 1024 },
+};
+exports.ProjectTypes = {
     Mobile: "mobile",
     Desktop: "desktop",
+    Shared: "shared",
 };
-function createProject({ configuration, device, name }) {
-    return {
-        name,
-        testDir: SpecsDirectory,
-        testMatch: [
-            SharedTestMatch,
-            configuration.projectType === ProjectTypes.Desktop ? DesktopOnlyTestMatch : MobileOnlyTestMatch,
-        ],
-        use: {
-            ...test_1.devices[device],
-            viewport: { width: configuration.breakpoint.width, height: configuration.breakpoint.height },
-        },
-    };
-}
+exports.SharedTestMatch = "shared/**/*.spec.js";
+exports.DesktopOnlyTestMatch = "desktop-only/**/*.spec.js";
+exports.MobileOnlyTestMatch = "mobile-only/**/*.spec.js";
+exports.SiteWideTestMatch = "site-wide/**/*.spec.js";

package/dist/schema/index.d.ts

@@ -1,5 +1,89 @@
 import { z } from "zod";
+/** Interaction kind for filling a form field. */
+export declare const FieldInteractions: {
+    /** A plain input */
+    readonly Fill: "fill";
+    /** A popup-based date/time picker widget */
+    readonly Datetime: "datetime";
+};
+export type FieldInteraction = (typeof FieldInteractions)[keyof typeof FieldInteractions];
+/**
+ * One field within one form.
+ * A field only needs the properties relevant to what should be tested on it .
+ * (e.g. a field with no `invalidValue` is simply skipped by the invalid-input check for that form).
+ */
+declare const FormFieldSchema: z.ZodObject<{
+    testID: z.ZodString;
+    validValue: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+    interaction: z.ZodOptional<z.ZodNullable<z.ZodEnum<{
+        /** A plain input */
+        readonly Fill: "fill";
+        /** A popup-based date/time picker widget */
+        readonly Datetime: "datetime";
+    }>>>;
+    invalidValue: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+    expectedAutocomplete: z.ZodOptional<z.ZodNullable<z.ZodCustom<import("react").HTMLInputAutoCompleteAttribute | undefined, import("react").HTMLInputAutoCompleteAttribute | undefined>>>;
+    expectedInputMode: z.ZodOptional<z.ZodNullable<z.ZodCustom<"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url" | undefined, "decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url" | undefined>>>;
+}, z.core.$strip>;
+export type ManufacTestFormField = z.infer<typeof FormFieldSchema>;
+/**
+ * Represents One form to be tested
+ */
+declare const FormSchema: z.ZodObject<{
+    testID: z.ZodString;
+    fields: z.ZodArray<z.ZodObject<{
+        testID: z.ZodString;
+        validValue: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+        interaction: z.ZodOptional<z.ZodNullable<z.ZodEnum<{
+            /** A plain input */
+            readonly Fill: "fill";
+            /** A popup-based date/time picker widget */
+            readonly Datetime: "datetime";
+        }>>>;
+        invalidValue: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+        expectedAutocomplete: z.ZodOptional<z.ZodNullable<z.ZodCustom<import("react").HTMLInputAutoCompleteAttribute | undefined, import("react").HTMLInputAutoCompleteAttribute | undefined>>>;
+        expectedInputMode: z.ZodOptional<z.ZodNullable<z.ZodCustom<"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url" | undefined, "decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url" | undefined>>>;
+    }, z.core.$strip>>;
+}, z.core.$strip>;
+export type ManufacTestForm = z.infer<typeof FormSchema>;
+/**
+ * Defines selectors for commonly tested components.
+ */
+declare const ManufacTestSelectorsSchema: z.ZodObject<{
+    hamburgerTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+    ctaTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+    cookieAcceptTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+    homeLinkTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+    carouselSlideTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+    carouselDotTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+}, z.core.$strip>;
+export type ManufacTestSelectors = z.infer<typeof ManufacTestSelectorsSchema>;
 export declare const ManufacTestConfigSchema: z.ZodObject<{
     pages: z.ZodArray<z.ZodString>;
+    selectors: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+        hamburgerTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+        ctaTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+        cookieAcceptTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+        homeLinkTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+        carouselSlideTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+        carouselDotTestID: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+    }, z.core.$strip>>>;
+    forms: z.ZodOptional<z.ZodNullable<z.ZodArray<z.ZodObject<{
+        testID: z.ZodString;
+        fields: z.ZodArray<z.ZodObject<{
+            testID: z.ZodString;
+            validValue: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            interaction: z.ZodOptional<z.ZodNullable<z.ZodEnum<{
+                /** A plain input */
+                readonly Fill: "fill";
+                /** A popup-based date/time picker widget */
+                readonly Datetime: "datetime";
+            }>>>;
+            invalidValue: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+            expectedAutocomplete: z.ZodOptional<z.ZodNullable<z.ZodCustom<import("react").HTMLInputAutoCompleteAttribute | undefined, import("react").HTMLInputAutoCompleteAttribute | undefined>>>;
+            expectedInputMode: z.ZodOptional<z.ZodNullable<z.ZodCustom<"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url" | undefined, "decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url" | undefined>>>;
+        }, z.core.$strip>>;
+    }, z.core.$strip>>>>;
 }, z.core.$strip>;
 export type ManufacTestConfig = z.infer<typeof ManufacTestConfigSchema>;
+export {};

package/dist/schema/index.js

@@ -1,7 +1,68 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ManufacTestConfigSchema = void 0;
+exports.ManufacTestConfigSchema = exports.FieldInteractions = void 0;
 const zod_1 = require("zod");
+/** Interaction kind for filling a form field. */
+exports.FieldInteractions = {
+    /** A plain input */
+    Fill: "fill",
+    /** A popup-based date/time picker widget */
+    Datetime: "datetime",
+};
+/**
+ * One field within one form.
+ * A field only needs the properties relevant to what should be tested on it .
+ * (e.g. a field with no `invalidValue` is simply skipped by the invalid-input check for that form).
+ */
+const FormFieldSchema = zod_1.z.object({
+    /** data-testid of the input element itself. */
+    testID: zod_1.z.string().min(1),
+    /** Value used to fill this field on the happy path. Omit to skip filling this field. */
+    validValue: zod_1.z.string().nullish(),
+    /** How to interact with (or fill) this input */
+    interaction: zod_1.z.enum(exports.FieldInteractions).nullish(),
+    /**
+     * Deliberately invalid value used by the invalid-input check. Omit to skip that check for this field.
+     *  - The check only verifies the field is left in an invalid state (`aria-invalid` or a failing native `checkValidity()`).
+     */
+    invalidValue: zod_1.z.string().nullish(),
+    // `autoComplete` and `inputMode` values are not validated by schema. Only type inference is added.
+    /** Expected `autocomplete` attribute value, checked by the autofill spec. Omit to skip that check. */
+    expectedAutocomplete: zod_1.z.custom().nullish(),
+    /** Expected `inputmode` attribute value, checked by the soft-keyboard spec. Omit to skip that check. */
+    expectedInputMode: zod_1.z.custom().nullish(),
+});
+/**
+ * Represents One form to be tested
+ */
+const FormSchema = zod_1.z.object({
+    /** data-testid of the `<form>` element (or its closest wrapping container). */
+    testID: zod_1.z.string().min(1),
+    /** Fields belonging to this form. */
+    fields: zod_1.z.array(FormFieldSchema).min(1),
+});
+/**
+ * Defines selectors for commonly tested components.
+ */
+const ManufacTestSelectorsSchema = zod_1.z.object({
+    /** Mobile nav hamburger/menu-toggle button. Single element — this testid must be unique on the page. */
+    hamburgerTestID: zod_1.z.string().min(1).nullish(),
+    /** Primary CTA button/link checked by CT-01. Single element — this testid must be unique on the page. */
+    ctaTestID: zod_1.z.string().min(1).nullish(),
+    /** Cookie-consent banner's accept/dismiss button. Single element — this testid must be unique on the page. */
+    cookieAcceptTestID: zod_1.z.string().min(1).nullish(),
+    /** "Back to home" link shown on the 404 page. Single element — this testid must be unique on the page. */
+    homeLinkTestID: zod_1.z.string().min(1).nullish(),
+    /** Shared testID present on every carousel slide — a group, not one element: put the SAME testid on every slide. */
+    carouselSlideTestID: zod_1.z.string().min(1).nullish(),
+    /** Shared testID present on every carousel pagination dot — a group, not one element: put the SAME testid on every dot. */
+    carouselDotTestID: zod_1.z.string().min(1).nullish(),
+});
 exports.ManufacTestConfigSchema = zod_1.z.object({
+    /** Pages this suite should run against. */
     pages: zod_1.z.array(zod_1.z.string()).min(1, "At least one page is required"),
+    /** Defines selectors for commonly tested components. */
+    selectors: ManufacTestSelectorsSchema.nullish(),
+    /** Forms this suite should exercise, keyed by their own data-testid. Omit to skip form-related checks. */
+    forms: zod_1.z.array(FormSchema).nullish(),
 });

package/dist/specs/shared/forms/input-edge.spec.js

@@ -16,10 +16,10 @@ fixtures_1.test.describe("Forms - Input Edge Cases", () => {
         await nameField.first().fill(longName);
         const isOverflowingBeforeSubmit = await (0, utils_1.hasHorizontalScrollbar)(page);
         (0, test_1.expect)(isOverflowingBeforeSubmit, "Page should not have overflowing/broken layout after a very long name is entered").toBe(false);
-        const submitButton = page.getByRole("button", { name: /submit/i });
+        const submitButton = page.locator('button[type="submit"], input[type="submit"]').first();
         await (0, test_1.expect)(submitButton, "Submit button should remain visible with a long name entered").toBeVisible();
         await submitButton.click();
-        const successState = page.getByText(/thank you|success|confirmation/i);
+        const successState = page.getByText(/thank you|success|confirmation/i).first();
         await (0, test_1.expect)(successState, "Form should submit successfully with a very long name entered").toBeVisible();
         const isOverflowingAfterSubmit = await (0, utils_1.hasHorizontalScrollbar)(page);
         (0, test_1.expect)(isOverflowingAfterSubmit, "Confirmation should not have overflowing/broken layout after a very long name was submitted").toBe(false);
@@ -41,6 +41,10 @@ fixtures_1.test.describe("Forms - Input Edge Cases", () => {
     });
     (0, fixtures_1.test)("FM-08 Email with leading/trailing spaces is trimmed and submits successfully", async ({ page, targetPage }) => {
         await page.goto(targetPage);
+        const form = page.locator("form");
+        if ((await form.count()) === 0) {
+            fixtures_1.test.skip(true, "No form present on this page");
+        }
         await (0, utils_1.fillFormFields)(page);
         const emailField = page.getByLabel(/email/i);
         await emailField.fill(utils_1.ValidUserInfo.PaddedTestEmail);
@@ -49,8 +53,8 @@ fixtures_1.test.describe("Forms - Input Edge Cases", () => {
         // server-side at submission time (also valid per the plan's wording) wouldn't show it here.
         const trimmedEmail = await emailField.inputValue();
         (0, test_1.expect)(trimmedEmail, `Leading/trailing spaces around the email should be trimmed; field still shows "${trimmedEmail}"`).toBe(utils_1.ValidUserInfo.PaddedTestEmail.trim());
-        await page.getByRole("button", { name: /submit/i }).click();
-        const successState = page.getByText(/thank you|success|confirmation/i);
+        await page.locator('button[type="submit"], input[type="submit"]').first().click();
+        const successState = page.getByText(/thank you|success|confirmation/i).first();
         await (0, test_1.expect)(successState, "Form should submit successfully after trimming leading/trailing spaces around the email").toBeVisible();
     });
 });

package/dist/specs/shared/forms/invalid-input.spec.js

@@ -21,9 +21,7 @@ fixtures_1.test.describe("Forms - Invalid Input", () => {
             // Fill invalid value in the field under test
             await fieldLocator.first().fill(invalidCase.invalidValue);
             // Attempt submit
-            const submitButton = form.getByRole("button", {
-                name: /(schedule discovery call|submit|send|book|request|get in touch)/i,
-            });
+            const submitButton = form.locator('button[type="submit"], input[type="submit"]');
             await submitButton.click();
             // Assert rejection - confirmation should NOT appear
             const confirmation = page.getByText(/thank you|success|confirmation/i);

package/dist/specs/shared/forms/required-field.spec.js

@@ -18,12 +18,19 @@ fixtures_1.test.describe("Forms", () => {
             if (!isRequired && !isEmailField) {
                 fixtures_1.test.skip(true, `${targetField.label.source} field is not marked required on this page`);
             }
-            await (0, utils_1.fillFormFields)(page);
-            await fieldLocator.first().clear();
+            // Fill every OTHER required field validly and deliberately leave the target field
+            // untouched, rather than filling it and clearing it afterward — some picker widgets
+            // (e.g. a date/time field backed by a <button>, not a native input) can't be cleared
+            // with .clear() at all, so never filling them in the first place avoids that entirely.
+            await (0, utils_1.fillOtherRequiredFieldsValidly)(page, targetField.label);
             const submitButtons = page.locator('button[type="submit"], input[type="submit"]');
             await submitButtons.first().click();
-            const isErrorPresent = await (0, utils_1.hasVisibleErrorNearField)(fieldLocator.first());
-            (0, test_1.expect)(isErrorPresent, `No visible inline error next to the empty ${targetField.label.source} field after submit`).toBe(true);
+            // The error may render a moment after the click resolves (e.g. a brief re-render before
+            // the field's aria-describedby/error text attaches), so poll rather than check once.
+            await (0, test_1.expect)(async () => {
+                const isErrorPresent = await (0, utils_1.hasVisibleErrorNearField)(fieldLocator.first());
+                (0, test_1.expect)(isErrorPresent, `No visible inline error next to the empty ${targetField.label.source} field after submit`).toBe(true);
+            }).toPass({ timeout: 5000 });
             const genericError = page.getByText(/form error/i);
             const genericErrorCount = await genericError.count();
             (0, test_1.expect)(genericErrorCount, `Error message for ${targetField.label.source} should be specific (e.g. "Email is required"), not a generic "form error"`).toBe(0);

package/dist/specs/shared/forms/thankyou-confirm.spec.js

@@ -6,9 +6,16 @@ const test_1 = require("@playwright/test");
 fixtures_1.test.describe("Forms - Thank You Confirm", () => {
     (0, fixtures_1.test)("FM-07 Confirmation state matches spec and does not resubmit on Back/Forward", async ({ page, targetPage }) => {
         await page.goto(targetPage);
+        const form = page.locator("form");
+        if ((await form.count()) === 0) {
+            fixtures_1.test.skip(true, "No form present on this page");
+        }
         await (0, utils_1.fillFormFields)(page);
-        await page.getByRole("button", { name: /submit/i }).click();
-        const confirmation = page.getByText(/thank you|success|confirmation/i);
+        await page.locator('button[type="submit"], input[type="submit"]').first().click();
+        // A toast/notification commonly has both a title and a description that separately match
+        // this pattern (e.g. "Success" + "...submitted successfully") — .first() avoids a strict-mode
+        // violation when that happens, rather than assuming there's ever only one matching element.
+        const confirmation = page.getByText(/thank you|success|confirmation/i).first();
         await (0, test_1.expect)(confirmation, "Confirmation message/page did not appear or did not match the design spec").toBeVisible({ timeout: 10_000 });
         let hasResubmitDialog = false;
         page.on("dialog", (dialog) => {
@@ -17,8 +24,11 @@ fixtures_1.test.describe("Forms - Thank You Confirm", () => {
         });
         await page.goBack();
         (0, test_1.expect)(hasResubmitDialog, 'Browser Back should NOT show a "resubmit form?" dialog').toBe(false);
+        // Not re-checking that the confirmation is still visible here: a toast-style confirmation
+        // (as opposed to a persistent thank-you page) is expected to auto-dismiss after a few
+        // seconds, and the Back/Forward round trip can easily take longer than that. The actual
+        // FM-07 concern — no resubmission — is fully covered by the dialog check below.
         await page.goForward();
-        await (0, test_1.expect)(confirmation, "Confirmation should still be shown after pressing Forward").toBeVisible();
         (0, test_1.expect)(hasResubmitDialog, 'Browser Forward should NOT show a "resubmit form?" dialog').toBe(false);
     });
 });

package/dist/specs/shared/landing-page.spec.js

@@ -2,152 +2,30 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const fixtures_1 = require("../../fixtures");
 const test_1 = require("@playwright/test");
-fixtures_1.test.describe("Landing Page Automated Smoke Suite", () => {
-    (0, fixtures_1.test)("LP-01: Page returns 200, renders H1, and has no console errors", async ({ page, consoleErrors, targetPage, }) => {
+fixtures_1.test.describe("Page load and structure", () => {
+    (0, fixtures_1.test)("LP-01: Page loads without errors", async ({ page, consoleErrors, targetPage }) => {
         let failedNetworkRequests = 0;
         page.on("response", (response) => {
             const status = response.status();
-            // Track any 4xx or 5xx responses (except for the 404 test itself, but this is LP-01)
             if (status >= 400) {
                 failedNetworkRequests += 1;
             }
         });
         const response = await page.goto(targetPage);
-        // Page returns 200
         (0, test_1.expect)(response?.ok()).toBe(true);
-        // Renders main heading (H1)
-        const h1 = page.getByRole("heading", { level: 1 }).first();
-        await (0, test_1.expect)(h1).toBeVisible();
-        // No console errors on load
         (0, test_1.expect)(consoleErrors).toHaveLength(0);
-        // No failed asset/network requests
         (0, test_1.expect)(failedNetworkRequests, "Page should load without any failed network requests (404/500)").toBe(0);
     });
-    (0, fixtures_1.test)("LP-02: Correct page metadata (title and favicon)", async ({ page, targetPage }) => {
+    (0, fixtures_1.test)("LP-02: Correct page metadata", async ({ page, targetPage }) => {
         await page.goto(targetPage);
-        // Title should not be empty, a raw URL, or a placeholder
         const title = await page.title();
         const hasTitle = title.trim().length > 0;
         (0, test_1.expect)(hasTitle, "Page title should not be empty").toBe(true);
         (0, test_1.expect)(title).not.toMatch(/^http/i);
         (0, test_1.expect)(title).not.toMatch(/untitled/i);
-        // Favicon should be present
         const favicon = page.locator('link[rel="icon"], link[rel="shortcut icon"]');
         await (0, test_1.expect)(favicon.first()).toBeAttached();
-    });
-    (0, fixtures_1.test)("LP-03: HTTPS enforced", async ({ page, targetPage }) => {
-        // We can only reliably test HTTPS redirection if we have an absolute URL pointing to a remote environment.
-        // If targetPage is a relative path (like '/'), we skip because local dev servers usually run on HTTP.
-        const isRelativePath = targetPage.startsWith("/");
-        const isLocalhost = targetPage.includes("localhost");
-        const isLocalIP = targetPage.includes("127.0.0.1");
-        const isLocalEnvironment = isRelativePath || isLocalhost || isLocalIP;
-        if (isLocalEnvironment) {
-            fixtures_1.test.skip(true, "HTTPS redirection is only testable on remote staging/production environments");
-        }
-        let httpURL = targetPage;
-        const isHTTPS = targetPage.startsWith("https://");
-        const isHTTP = targetPage.startsWith("http://");
-        if (isHTTPS) {
-            httpURL = targetPage.replace("https://", "http://");
-        }
-        else if (!isHTTP) {
-            // isHTTP is true when the targetPage already explicitly defines the HTTP protocol
-            httpURL = `http://${targetPage}`;
-        }
-        await page.goto(httpURL);
-        // Address bar shows https:// (auto-redirected)
-        (0, test_1.expect)(page.url()).toMatch(/^https:\/\//);
-    });
-    (0, fixtures_1.test)("LP-04: 404/error handling", async ({ page, targetPage }) => {
-        let notFoundURL = `${targetPage}/thispagedoesnotexist`;
-        const hasTrailingSlash = targetPage.endsWith("/");
-        if (hasTrailingSlash) {
-            notFoundURL = `${targetPage}thispagedoesnotexist`;
-        }
-        await page.goto(notFoundURL);
-        // Check that it's a branded/styled 404 page, NOT a plain white server error page or a stack trace
-        const content = await page.content();
-        (0, test_1.expect)(content).not.toMatch(/stack trace/i);
-        // Look for common 404 indicators
-        const errorHeading = page.getByRole("heading").filter({ hasText: /404|not found|does not exist|not available/i });
-        const errorText = page.locator("text=/404|not found|does not exist|not available/i");
-        const hasErrorHeading = (await errorHeading.count()) > 0;
-        const hasErrorText = (await errorText.count()) > 0;
-        const isBranded404 = hasErrorHeading || hasErrorText;
-        (0, test_1.expect)(isBranded404, "Page should display a branded 404 error message").toBe(true);
-        // 404 page should have a link back to the home page
-        const homeLink = page.getByRole("link", { name: /home|back|return/i }).or(page.locator('a[href="/"]'));
-        const homeLinkCount = await homeLink.count();
-        const hasHomeLink = homeLinkCount > 0;
-        (0, test_1.expect)(hasHomeLink, "404 page should have a link back to the home page").toBe(true);
-    });
-    (0, fixtures_1.test)("RS-01: No horizontal overflow (responsive layout stability)", async ({ page, targetPage }) => {
-        await page.goto(targetPage);
-        const hasHorizontalOverflow = await page.evaluate(() => {
-            return document.documentElement.scrollWidth > document.documentElement.clientWidth;
-        });
-        (0, test_1.expect)(hasHorizontalOverflow).toBe(false);
-    });
-    (0, fixtures_1.test)("FM-01: Form happy path submits successfully", async ({ page, targetPage, consoleErrors }) => {
-        await page.goto(targetPage);
-        const forms = page.locator("form");
-        const totalFormCount = await forms.count();
-        if (totalFormCount === 0) {
-            // test.skip aborts execution internally, so no else block is needed
-            fixtures_1.test.skip(true, "No form found on the page");
-        }
-        const allForms = await forms.all();
-        await Promise.all(allForms.map(async (form) => {
-            // Attempt to fill email inputs
-            const emailInputs = await form.getByRole("textbox", { name: /email/i }).all();
-            await Promise.all(emailInputs.map(async (emailInput) => {
-                const email = `qa+${Date.now().toString()}@manufacanalytics.com`;
-                await emailInput.fill(email);
-            }));
-            // Fill required text inputs
-            const textInputs = await form
-                .getByRole("textbox")
-                .filter({ hasNot: form.getByRole("textbox", { name: /email/i }) })
-                .all();
-            await Promise.all(textInputs.map(async (textInput) => {
-                const isRequired = await textInput.evaluate((element) => {
-                    let isElementRequired = false;
-                    if (element instanceof HTMLInputElement) {
-                        isElementRequired = element.required;
-                    }
-                    return isElementRequired;
-                });
-                if (isRequired) {
-                    await textInput.fill("Test User");
-                }
-            }));
-            // Set up the network response listener before submitting
-            const responsePromise = page.waitForResponse((response) => {
-                const method = response.request().method();
-                return ["POST", "PUT", "PATCH"].includes(method) || response.request().isNavigationRequest();
-            });
-            // Submit form
-            const submitButton = form.getByRole("button", { name: /submit|send|join|subscribe|save|draft|sign/i });
-            const submitButtonCount = await submitButton.count();
-            // It is possibility that form might have multiple submit buttons Ref: bud time entry form has 2 submit buttons
-            if (submitButtonCount > 0) {
-                await submitButton.first().click();
-            }
-            else {
-                await form.evaluate((formElement) => {
-                    if (formElement instanceof HTMLFormElement) {
-                        formElement.submit();
-                    }
-                });
-            }
-            // Wait for the response and verify it was successful
-            const response = await responsePromise;
-            (0, test_1.expect)(response.ok()).toBe(true);
-        }));
-        // Brief settle time for post-submit JS (redirects, toasts, error handlers)
-        await page.waitForTimeout(1000);
-        // No console errors after any form submission
-        (0, test_1.expect)(consoleErrors).toHaveLength(0);
+        const href = await favicon.first().getAttribute("href");
+        (0, test_1.expect)(href, "Favicon href should not be empty").toBeTruthy();
     });
 });

package/dist/specs/site-wide/landing-page.spec.d.ts

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

package/dist/specs/site-wide/landing-page.spec.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const fixtures_1 = require("../../fixtures");
+const test_1 = require("@playwright/test");
+fixtures_1.test.describe("Page load and structure - site-wide", () => {
+    (0, fixtures_1.test)("LP-03: HTTPS enforced", async ({ page, targetPage, baseURL }) => {
+        const isLocalhost = baseURL?.includes("localhost");
+        const isLocalIP = baseURL?.includes("127.0.0.1");
+        const isLocalEnvironment = isLocalhost === true || isLocalIP === true;
+        if (isLocalEnvironment) {
+            fixtures_1.test.skip(true, "HTTPS redirection is only testable on remote staging/production environments");
+        }
+        let httpBaseURL = baseURL;
+        const isHTTPS = baseURL?.startsWith("https://");
+        const isHTTP = baseURL?.startsWith("http://");
+        if (isHTTPS === true && baseURL !== undefined) {
+            httpBaseURL = baseURL.replace("https://", "http://");
+        }
+        else if (isHTTP === false && baseURL !== undefined) {
+            httpBaseURL = `http://${baseURL}`;
+        }
+        const httpURL = new URL(targetPage, httpBaseURL).toString();
+        await page.goto(httpURL);
+        (0, test_1.expect)(page.url()).toMatch(/^https:\/\//);
+    });
+    (0, fixtures_1.test)("LP-04: 404/error handling", async ({ page, targetPage }) => {
+        // Avoid a doubled leading slash (e.g. "/" + "/x" -> "//x"), which browsers resolve as
+        // protocol-relative and treat "x" as a hostname instead of a path on this site.
+        const normalizedTargetPage = targetPage.endsWith("/") ? targetPage.slice(0, -1) : targetPage;
+        const notFoundURL = `${normalizedTargetPage}/thispagedoesnotexist`;
+        await page.goto(notFoundURL);
+        const content = await page.content();
+        (0, test_1.expect)(content).not.toMatch(/stack trace/i);
+        await (0, test_1.expect)(page.getByText("Page not found"), "404 page should show a branded message").toBeVisible();
+        await (0, test_1.expect)(page.getByRole("img", { name: /manufac|logo/i }), "404 page should show the company logo").toBeVisible();
+        await (0, test_1.expect)(page.getByRole("link", { name: /home|back|return/i }), "404 page should have a link back to the home page").toBeVisible();
+    });
+});

package/dist/specs/utils.js

@@ -462,12 +462,13 @@ exports.FieldValueMappings = [
     { label: /date/i, validValue: exports.ValidUserInfo.ValidTestPreferredDate, interaction: exports.FieldInteractions.Datetime },
     { label: /time/i, validValue: exports.ValidUserInfo.ValidTestPreferredTime, interaction: exports.FieldInteractions.Datetime },
 ];
-// Some date/time fields are plain inputs (a direct .fill() works); others are picker widgets that
-// open a popup and reject typed text. This tries the plain-input path first, and only falls back
-// to interacting with a popup if the value didn't actually take. The fallback uses WAI-ARIA roles
-// (grid/gridcell for calendar days, spinbutton for numeric steppers) rather than any specific UI
-// library's class names, since this package runs against apps that don't all use the same one —
-// it degrades to a no-op if neither the plain-input path nor these ARIA patterns match anything.
+// Some date/time fields are plain inputs; others are picker widgets that open a popup and
+// reject typed text. Tries .fill() first, falling back to ARIA roles (grid/gridcell, spinbutton)
+// if the value didn't take, since apps vary in UI library. No-ops if nothing matches.
+//
+// Mantine's DateTimePicker doesn't use role=gridcell for its calendar days (just plain <button>
+// elements labeled by day number), so the day selector also falls back to any enabled button
+// with a 1-2 digit label.
 async function fillDateTimePicker(locator, fallbackValue) {
     await locator.fill(fallbackValue).catch(() => {
         return undefined;
@@ -478,7 +479,19 @@ async function fillDateTimePicker(locator, fallbackValue) {
     if (filledValue.length === 0) {
         await locator.click();
         const page = locator.page();
-        const dayCells = page.locator('[role="gridcell"]:not([aria-disabled="true"])');
+        // Give the popup a moment to finish laying out before interacting — clicking immediately
+        // can hit a day cell while another control (e.g. an AM/PM toggle) is still animating into
+        // place on top of it, intercepting the click.
+        await page.waitForTimeout(300);
+        // Scope the numeric-button fallback to an open popup/dialog when one exists, rather than the
+        // whole page, so it can't accidentally match an unrelated numeric button elsewhere (e.g. a
+        // pagination control or step counter).
+        const popup = page.locator('[role="dialog"], [role="listbox"], [aria-modal="true"]').first();
+        const hasPopup = (await popup.count()) > 0;
+        const numericDayButtons = (hasPopup ? popup : page)
+            .locator("button:not([disabled]):not([aria-disabled='true'])")
+            .filter({ hasText: /^\d{1,2}$/ });
+        const dayCells = page.locator('[role="gridcell"]:not([aria-disabled="true"])').or(numericDayButtons);
         const dayCellCount = await dayCells.count();
         for (let index = 0; index < dayCellCount; index++) {
             const cell = dayCells.nth(index);
@@ -519,7 +532,10 @@ async function fillDateTimePicker(locator, fallbackValue) {
     }
 }
 async function fillFormFields(page) {
-    await Promise.all(exports.FieldValueMappings.map(async (field) => {
+    // Filled sequentially, not concurrently — see the same note in fillOtherRequiredFieldsValidly:
+    // a popup-based widget open in one field can lose focus and close mid-interaction if another
+    // field is filled at the same time.
+    for (const field of exports.FieldValueMappings) {
         const locator = page.getByLabel(field.label);
         if ((await locator.count()) > 0) {
             if (field.interaction === exports.FieldInteractions.Datetime) {
@@ -529,7 +545,7 @@ async function fillFormFields(page) {
                 await locator.first().fill(field.validValue);
             }
         }
-    }));
+    }
 }
 async function hasVisibleErrorNearField(fieldLocator) {
     const fieldID = await fieldLocator.getAttribute("id");
@@ -560,16 +576,35 @@ exports.InvalidInputCases = [
     { fieldLabel: /phone/i, invalidValue: "12", expectedErrorText: /enter a valid phone number/i },
 ];
 async function fillOtherRequiredFieldsValidly(page, skipLabel) {
-    await Promise.all(exports.FieldValueMappings.map(async (field) => {
+    const skipLocator = page.getByLabel(skipLabel);
+    const skipFieldCount = await skipLocator.count();
+    // Some combined widgets (e.g. a single "Preferred Time & Date" picker) match more than one
+    // FieldValueMappings label at once — comparing by element id, not just label text, catches
+    // that case so filling the "other" field doesn't silently fill the one under test too.
+    const skipFieldID = skipFieldCount > 0 ? await skipLocator.first().getAttribute("id") : null;
+    // Filled sequentially, not concurrently: a popup-based widget (like a date/time picker) opens
+    // on focus and closes on blur, so filling a different field at the same time can steal focus
+    // and close it mid-interaction, detaching whatever this was about to click inside it.
+    for (const field of exports.FieldValueMappings) {
         const isSkippedField = field.label.source === skipLabel.source;
         const locator = page.getByLabel(field.label);
         let isFieldPresent = false;
         if (!isSkippedField) {
             isFieldPresent = (await locator.count()) > 0;
         }
+        let isSameElementAsSkipped = false;
+        if (isFieldPresent && skipFieldID !== null) {
+            const fieldID = await locator.first().getAttribute("id");
+            isSameElementAsSkipped = fieldID !== null && fieldID === skipFieldID;
+        }
+        // Email is always treated as required (see the FieldValueMappings doc comment above),
+        // regardless of whether it carries a native `required`/`aria-required` attribute — the
+        // same rule the isEmailField check in required-field.spec.ts applies for its own skip
+        // decision, so filling here needs to agree with it or both can end up empty at once.
+        const isEmailField = field.label.source === "email";
         let isRequired = false;
-        if (isFieldPresent) {
-            isRequired = await isFieldRequired(locator.first());
+        if (isFieldPresent && !isSameElementAsSkipped) {
+            isRequired = isEmailField || (await isFieldRequired(locator.first()));
         }
         if (isRequired) {
             if (field.interaction === exports.FieldInteractions.Datetime) {
@@ -579,7 +614,7 @@ async function fillOtherRequiredFieldsValidly(page, skipLabel) {
                 await locator.first().fill(field.validValue);
             }
         }
-    }));
+    }
 }
 exports.AutofillFields = [
     { label: /name/i, expectedAutocomplete: /name/i },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@manufac/general-tests",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "A library for general tests for landing pages",
   "repository": {
     "type": "git",
@@ -26,7 +26,8 @@
   "devDependencies": {
     "@manufac/eslint-config": "*",
     "@manufac/prettier-config": "*",
-    "@playwright/test": "^1.62.0",
+    "@playwright/test": "^1.62.1",
+    "@types/react": "^19.2.18",
     "typescript": "^7.0.2"
   },
   "peerDependencies": {