@scrippsproduct/networks-ui-library 1.1.8 → 1.1.10-alpha.0

package/dist/components/PromotionsRowModule/PromotionsRowModule.test.js

@@ -0,0 +1,349 @@
+import { jsx as s, jsxs as B } from "react/jsx-runtime";
+import { v as h, d as m, b as C, a as v, i as l, r as c, g as a, s as n, w as u } from "../../react.esm-DLSrfVwM.mjs";
+import "../../index-BVxBrkZB.mjs";
+import { PromotionsRowModule as r } from "./PromotionsRowModule.js";
+h.mock("../PromotionsRowBlock", () => ({
+  default: ({ children: o, gap: e }) => /* @__PURE__ */ s("div", { "data-gap": e, "data-testid": "promotions-row-block", children: o })
+}));
+h.mock("../ImageCard", () => ({
+  default: ({ image: o, title: e, content: i, cta: p, relatedResourceId: y, classname: T, overlayContent: I }) => /* @__PURE__ */ B(
+    "div",
+    {
+      "data-classname": T,
+      "data-content": i,
+      "data-cta-text": p == null ? void 0 : p.label,
+      "data-image-url": o.url,
+      "data-related-id": y,
+      "data-testid": "image-card",
+      "data-title": e,
+      children: [
+        "ImageCard: ",
+        e,
+        I
+      ]
+    }
+  )
+}));
+h.mock("../Carousel", () => ({
+  default: ({ cells: o, id: e }) => /* @__PURE__ */ B("div", { "data-cells-count": o.length, "data-id": e, "data-testid": "carousel", children: [
+    "Carousel with ",
+    o.length,
+    " cells"
+  ] })
+}));
+h.mock("../CtaBlock", () => ({
+  default: ({ title: o, cta: e }) => /* @__PURE__ */ B("div", { "data-cta-text": e == null ? void 0 : e.label, "data-testid": "cta-block", "data-title": o, children: [
+    "CtaBlock: ",
+    o
+  ] })
+}));
+h.mock("./PromotionRowBlock.scss", () => ({}));
+h.mock("../../utils/helpers", () => ({
+  classes: (o) => o.join(" ")
+}));
+const g = {
+  url: "https://example.com/image1.jpg",
+  altText: "Promo Image 1",
+  aspectRatio: 16 / 9
+}, d = {
+  label: "Learn More",
+  href: "https://example.com/promo1",
+  type: "external-link"
+}, t = (o, e) => ({
+  id: o,
+  title: `Promo ${o}`,
+  content: `Content ${o}`,
+  image: g,
+  cta: d,
+  ...e
+});
+m("PromotionsRowModule", () => {
+  C(() => {
+    h.clearAllMocks();
+  }), v(() => {
+    h.clearAllMocks();
+  }), m("Basic Rendering", () => {
+    l("should render section with promotions-row class", () => {
+      const o = [t("1")], { container: e } = c(/* @__PURE__ */ s(r, { promos: o })), i = e.querySelector("section.promotions-row");
+      a(i).toBeInTheDocument();
+    }), l("should render title when provided", () => {
+      const o = [t("1")];
+      c(/* @__PURE__ */ s(r, { promos: o, title: "Special Offers" })), a(n.getByRole("heading", { name: "Special Offers" })).toBeInTheDocument();
+    }), l("should render title as h2 element", () => {
+      const o = [t("1")];
+      c(/* @__PURE__ */ s(r, { promos: o, title: "Special Offers" }));
+      const e = n.getByRole("heading", { name: "Special Offers", level: 2 });
+      a(e).toBeInTheDocument();
+    }), l("should apply correct classes to title", () => {
+      const o = [t("1")];
+      c(/* @__PURE__ */ s(r, { promos: o, title: "Special Offers" }));
+      const e = n.getByRole("heading", { name: "Special Offers" });
+      a(e).toHaveClass("h2", "promotions-row__header");
+    }), l("should render empty title when not provided", () => {
+      const o = [t("1")], { container: e } = c(/* @__PURE__ */ s(r, { promos: o })), i = e.querySelector("h2");
+      a(i).toHaveTextContent("");
+    });
+  }), m("PromotionsRowBlock Rendering (≤4 promos)", () => {
+    l("should render PromotionsRowBlock with single promo", () => {
+      const o = [t("1")];
+      c(/* @__PURE__ */ s(r, { promos: o })), a(n.getByTestId("promotions-row-block")).toBeInTheDocument();
+    }), l("should render PromotionsRowBlock with 2 promos", () => {
+      const o = [t("1"), t("2")];
+      c(/* @__PURE__ */ s(r, { promos: o })), a(n.getByTestId("promotions-row-block")).toBeInTheDocument();
+    }), l("should render PromotionsRowBlock with exactly 4 promos", () => {
+      const o = [
+        t("1"),
+        t("2"),
+        t("3"),
+        t("4")
+      ];
+      c(/* @__PURE__ */ s(r, { promos: o })), a(n.getByTestId("promotions-row-block")).toBeInTheDocument();
+    }), l("should apply 2rem gap to PromotionsRowBlock", () => {
+      const o = [t("1")];
+      c(/* @__PURE__ */ s(r, { promos: o }));
+      const e = n.getByTestId("promotions-row-block");
+      a(e).toHaveAttribute("data-gap", "2rem");
+    }), l("should not render Carousel when promos ≤ 4", () => {
+      const o = [
+        t("1"),
+        t("2"),
+        t("3"),
+        t("4")
+      ];
+      c(/* @__PURE__ */ s(r, { promos: o })), a(n.queryByTestId("carousel")).not.toBeInTheDocument();
+    });
+  }), m("Carousel Rendering (>4 promos)", () => {
+    l("should render Carousel when promos > 4", async () => {
+      const o = [
+        t("1"),
+        t("2"),
+        t("3"),
+        t("4"),
+        t("5")
+      ];
+      c(/* @__PURE__ */ s(r, { promos: o })), await u(() => {
+        a(n.getByTestId("carousel")).toBeInTheDocument();
+      });
+    }), l("should render h1 title for carousel view", async () => {
+      const o = Array.from({ length: 5 }, (e, i) => t(`${i + 1}`));
+      c(/* @__PURE__ */ s(r, { promos: o, title: "Carousel Title" })), await u(() => {
+        const e = n.getByRole("heading", { name: "Carousel Title", level: 1 });
+        a(e).toBeInTheDocument();
+      });
+    }), l("should apply h3 class to carousel title", async () => {
+      const o = Array.from({ length: 5 }, (e, i) => t(`${i + 1}`));
+      c(/* @__PURE__ */ s(r, { promos: o, title: "Carousel Title" })), await u(() => {
+        const e = n.getByRole("heading", { name: "Carousel Title" });
+        a(e).toHaveClass("h3", "promotions-row__header");
+      });
+    }), l("should not render PromotionsRowBlock when carousel is shown", async () => {
+      const o = Array.from({ length: 5 }, (e, i) => t(`${i + 1}`));
+      c(/* @__PURE__ */ s(r, { promos: o })), await u(() => {
+        a(n.getByTestId("carousel")).toBeInTheDocument();
+      }), a(n.queryByTestId("promotions-row-block")).not.toBeInTheDocument();
+    }), l("should pass correct number of cells to Carousel", async () => {
+      const o = Array.from({ length: 6 }, (e, i) => t(`${i + 1}`));
+      c(/* @__PURE__ */ s(r, { promos: o })), await u(() => {
+        const e = n.getByTestId("carousel");
+        a(e).toHaveAttribute("data-cells-count", "6");
+      });
+    });
+  }), m("ImageCard Rendering", () => {
+    l("should render ImageCard for each promo", () => {
+      const o = [
+        t("1"),
+        t("2"),
+        t("3")
+      ];
+      c(/* @__PURE__ */ s(r, { promos: o }));
+      const e = n.getAllByTestId("image-card");
+      a(e).toHaveLength(3);
+    }), l("should pass image prop to ImageCard", () => {
+      const o = [t("1")];
+      c(/* @__PURE__ */ s(r, { promos: o }));
+      const e = n.getByTestId("image-card");
+      a(e).toHaveAttribute("data-image-url", g.url);
+    }), l("should pass title prop to ImageCard", () => {
+      const o = [t("1", { title: "Special Promo" })];
+      c(/* @__PURE__ */ s(r, { promos: o }));
+      const e = n.getByTestId("image-card");
+      a(e).toHaveAttribute("data-title", "Special Promo");
+    }), l("should pass content prop to ImageCard", () => {
+      const o = [t("1", { content: "Special content" })];
+      c(/* @__PURE__ */ s(r, { promos: o }));
+      const e = n.getByTestId("image-card");
+      a(e).toHaveAttribute("data-content", "Special content");
+    }), l("should pass cta prop to ImageCard", () => {
+      const o = [t("1")];
+      c(/* @__PURE__ */ s(r, { promos: o }));
+      const e = n.getByTestId("image-card");
+      a(e).toHaveAttribute("data-cta-text", d.label);
+    }), l("should pass relatedResourceId to ImageCard", () => {
+      const o = [t("test-id-123")];
+      c(/* @__PURE__ */ s(r, { promos: o }));
+      const e = n.getByTestId("image-card");
+      a(e).toHaveAttribute("data-related-id", "test-id-123");
+    }), l("should pass classname to ImageCard when provided", () => {
+      const o = [t("1", { classname: "custom-class" })];
+      c(/* @__PURE__ */ s(r, { promos: o }));
+      const e = n.getByTestId("image-card");
+      a(e).toHaveAttribute("data-classname", "custom-class");
+    });
+  }), m("CtaBlock Overlay Content", () => {
+    l("should not render CtaBlock when overlayContent is not provided", () => {
+      const o = [t("1")];
+      c(/* @__PURE__ */ s(r, { promos: o })), a(n.queryByTestId("cta-block")).not.toBeInTheDocument();
+    }), l("should render CtaBlock when overlayContent is provided", () => {
+      const o = [t("1", {
+        overlayContent: {
+          title: "Overlay Title",
+          content: "Overlay Content",
+          cta: d
+        }
+      })];
+      c(/* @__PURE__ */ s(r, { promos: o })), a(n.getByTestId("cta-block")).toBeInTheDocument();
+    }), l("should pass overlayContent title to CtaBlock", () => {
+      const o = [t("1", {
+        overlayContent: {
+          title: "Overlay Title",
+          cta: d
+        }
+      })];
+      c(/* @__PURE__ */ s(r, { promos: o }));
+      const e = n.getByTestId("cta-block");
+      a(e).toHaveAttribute("data-title", "Overlay Title");
+    }), l("should pass overlayContent cta to CtaBlock", () => {
+      const o = [t("1", {
+        overlayContent: {
+          cta: d
+        }
+      })];
+      c(/* @__PURE__ */ s(r, { promos: o }));
+      const e = n.getByTestId("cta-block");
+      a(e).toHaveAttribute("data-cta-text", d.label);
+    }), l("should render multiple CtaBlocks for multiple promos with overlayContent", () => {
+      const o = [
+        t("1", { overlayContent: { title: "Overlay 1", cta: d } }),
+        t("2", { overlayContent: { title: "Overlay 2", cta: d } }),
+        t("3", { overlayContent: { title: "Overlay 3", cta: d } })
+      ];
+      c(/* @__PURE__ */ s(r, { promos: o }));
+      const e = n.getAllByTestId("cta-block");
+      a(e).toHaveLength(3);
+    });
+  }), m("HandleClicks Prop", () => {
+    l("should use provided handleClicks function", () => {
+      const o = h.fn(), e = [t("1")];
+      c(/* @__PURE__ */ s(r, { handleClicks: o, promos: e })), a(n.getByTestId("image-card")).toBeInTheDocument();
+    }), l("should use default handleClicks when not provided", () => {
+      const o = [t("1")];
+      c(/* @__PURE__ */ s(r, { promos: o })), a(n.getByTestId("image-card")).toBeInTheDocument();
+    }), l("should use default handleClicks when null", () => {
+      const o = [t("1")];
+      c(/* @__PURE__ */ s(r, { handleClicks: null, promos: o })), a(n.getByTestId("image-card")).toBeInTheDocument();
+    });
+  }), m("Edge Cases", () => {
+    l("should handle empty promos array", () => {
+      const { container: o } = c(/* @__PURE__ */ s(r, { promos: [] })), e = o.querySelector("section.promotions-row");
+      a(e).toBeInTheDocument();
+    }), l("should handle promos without optional fields", () => {
+      c(/* @__PURE__ */ s(r, { promos: [{
+        id: "1",
+        image: g
+      }] })), a(n.getByTestId("image-card")).toBeInTheDocument();
+    }), l("should handle very long title", () => {
+      const o = "This is a very long title ".repeat(10).trim(), e = [t("1")], { container: i } = c(/* @__PURE__ */ s(r, { promos: e, title: o })), p = i.querySelector("h2");
+      a(p).toHaveTextContent(o);
+    }), l("should handle special characters in title", () => {
+      const o = 'Special & "Quoted" Title <test>', e = [t("1")];
+      c(/* @__PURE__ */ s(r, { promos: e, title: o })), a(n.getByRole("heading", { name: o })).toBeInTheDocument();
+    }), l("should handle many promos (>10)", async () => {
+      const o = Array.from({ length: 15 }, (e, i) => t(`${i + 1}`));
+      c(/* @__PURE__ */ s(r, { promos: o })), await u(() => {
+        const e = n.getByTestId("carousel");
+        a(e).toHaveAttribute("data-cells-count", "15");
+      });
+    }), l("should handle promos with undefined overlayContent properties", () => {
+      const o = [t("1", {
+        overlayContent: {
+          title: void 0,
+          content: void 0,
+          cta: void 0
+        }
+      })];
+      c(/* @__PURE__ */ s(r, { promos: o })), a(n.getByTestId("cta-block")).toBeInTheDocument();
+    });
+  }), m("Conditional Rendering Logic", () => {
+    l("should switch from PromotionsRowBlock to Carousel when promos increase", async () => {
+      const { rerender: o } = c(/* @__PURE__ */ s(r, { promos: [t("1")] }));
+      a(n.getByTestId("promotions-row-block")).toBeInTheDocument();
+      const e = Array.from({ length: 5 }, (i, p) => t(`${p + 1}`));
+      o(/* @__PURE__ */ s(r, { promos: e })), await u(() => {
+        a(n.getByTestId("carousel")).toBeInTheDocument();
+      }), a(n.queryByTestId("promotions-row-block")).not.toBeInTheDocument();
+    }), l("should render section element for PromotionsRowBlock view", () => {
+      const o = [t("1")], { container: e } = c(/* @__PURE__ */ s(r, { promos: o })), i = e.querySelector("section");
+      a(i).toBeInTheDocument();
+    }), l("should not render section element for Carousel view", async () => {
+      const o = Array.from({ length: 5 }, (p, y) => t(`${y + 1}`)), { container: e } = c(/* @__PURE__ */ s(r, { promos: o }));
+      await u(() => {
+        a(n.getByTestId("carousel")).toBeInTheDocument();
+      });
+      const i = e.querySelector("section");
+      a(i).not.toBeInTheDocument();
+    });
+  }), m("Integration", () => {
+    l("should render complete module with all elements", () => {
+      const o = [
+        t("1", {
+          title: "Promo 1",
+          content: "Content 1",
+          overlayContent: { title: "Overlay 1", cta: d }
+        }),
+        t("2", {
+          title: "Promo 2",
+          content: "Content 2"
+        })
+      ];
+      c(/* @__PURE__ */ s(r, { promos: o, title: "Test Module" })), a(n.getByRole("heading", { name: "Test Module" })).toBeInTheDocument(), a(n.getByTestId("promotions-row-block")).toBeInTheDocument(), a(n.getAllByTestId("image-card")).toHaveLength(2), a(n.getByTestId("cta-block")).toBeInTheDocument();
+    }), l("should render carousel with all promos when count > 4", async () => {
+      const o = Array.from(
+        { length: 8 },
+        (e, i) => t(`${i + 1}`, { title: `Promo ${i + 1}` })
+      );
+      c(/* @__PURE__ */ s(r, { promos: o, title: "Carousel Module" })), await u(() => {
+        a(n.getByRole("heading", { name: "Carousel Module", level: 1 })).toBeInTheDocument();
+        const e = n.getByTestId("carousel");
+        a(e).toHaveAttribute("data-cells-count", "8");
+      });
+    }), l("should handle mix of promos with and without overlayContent", () => {
+      const o = [
+        t("1", { overlayContent: { title: "Overlay 1", cta: d } }),
+        t("2"),
+        t("3", { overlayContent: { title: "Overlay 3", cta: d } })
+      ];
+      c(/* @__PURE__ */ s(r, { promos: o })), a(n.getAllByTestId("image-card")).toHaveLength(3), a(n.getAllByTestId("cta-block")).toHaveLength(2);
+    });
+  }), m("Type Safety", () => {
+    l("should accept valid Promo array", () => {
+      c(/* @__PURE__ */ s(r, { promos: [
+        {
+          id: "1",
+          title: "Promo 1",
+          content: "Content 1",
+          image: g,
+          cta: d
+        },
+        {
+          id: "2",
+          image: g
+        }
+      ] })), a(n.getAllByTestId("image-card")).toHaveLength(2);
+    }), l("should accept handleClicks function with correct signature", () => {
+      const o = (i) => {
+        console.warn(i);
+      }, e = [t("1")];
+      c(/* @__PURE__ */ s(r, { handleClicks: o, promos: e })), a(n.getByTestId("image-card")).toBeInTheDocument();
+    });
+  });
+});

package/dist/components/RescanInstructions/RescanInstructions.test.js

@@ -0,0 +1,218 @@
+import { jsxs as h, jsx as e } from "react/jsx-runtime";
+import { v as d, d as c, b as m, i as s, r as o, g as n, s as a } from "../../react.esm-DLSrfVwM.mjs";
+import { RescanInstructions as i } from "./RescanInstructions.js";
+d.mock("../InstructionsList", () => ({
+  default: ({ headerHtml: t, instructions: r }) => /* @__PURE__ */ h(
+    "div",
+    {
+      "data-header-html": t,
+      "data-instructions-count": r.length,
+      "data-testid": "instructions-list",
+      children: [
+        /* @__PURE__ */ e("div", { "data-testid": "header-html", children: t }),
+        /* @__PURE__ */ e("ul", { children: r.map(
+          (u, l) => /* @__PURE__ */ e("li", { "data-testid": `instruction-${l}`, children: u }, l)
+        ) })
+      ]
+    }
+  )
+}));
+d.mock("./RescanInstructions.module.scss", () => ({
+  default: {
+    "rescan-instructions": "rescan-instructions-module",
+    rescan__header: "rescan-header-module"
+  }
+}));
+c("RescanInstructions", () => {
+  m(() => {
+    d.clearAllMocks();
+  }), c("Basic Rendering", () => {
+    s("should render section element", () => {
+      const { container: t } = o(/* @__PURE__ */ e(i, {})), r = t.querySelector("section");
+      n(r).toBeInTheDocument();
+    }), s("should apply correct classes to section", () => {
+      const { container: t } = o(/* @__PURE__ */ e(i, {})), r = t.querySelector("section");
+      n(r).toHaveClass("rescan-instructions-module", "rescan-instructions");
+    }), s("should render h3 header", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByRole("heading", { level: 3, name: "LEARN HOW TO RESCAN" });
+      n(t).toBeInTheDocument();
+    }), s("should apply correct classes to header", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByRole("heading", { level: 3 });
+      n(t).toHaveClass("rescan-header-module", "rescan__header");
+    }), s("should render exactly two InstructionsList components", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getAllByTestId("instructions-list");
+      n(t).toHaveLength(2);
+    });
+  }), c("BrandName Prop", () => {
+    s("should use brandName in first InstructionsList header when provided", () => {
+      o(/* @__PURE__ */ e(i, { brandName: "NBC" }));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[0]).toHaveAttribute(
+        "data-header-html",
+        "Watching NBC with an antenna? You may need to rescan your TV."
+      );
+    }), s("should handle empty brandName in header", () => {
+      o(/* @__PURE__ */ e(i, { brandName: "" }));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[0]).toHaveAttribute(
+        "data-header-html",
+        "Watching  with an antenna? You may need to rescan your TV."
+      );
+    }), s("should use empty string as default brandName", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[0]).toHaveAttribute(
+        "data-header-html",
+        "Watching  with an antenna? You may need to rescan your TV."
+      );
+    }), s("should handle special characters in brandName", () => {
+      o(/* @__PURE__ */ e(i, { brandName: "ABC & XYZ" }));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[0]).toHaveAttribute(
+        "data-header-html",
+        "Watching ABC & XYZ with an antenna? You may need to rescan your TV."
+      );
+    }), s("should handle very long brandName", () => {
+      const t = "This is a Very Long Brand Name Network".repeat(3);
+      o(/* @__PURE__ */ e(i, { brandName: t }));
+      const u = a.getAllByTestId("instructions-list")[0].getAttribute("data-header-html");
+      n(u).toContain(t);
+    });
+  }), c("First InstructionsList (Basic Rescan)", () => {
+    s("should pass correct headerHtml to first InstructionsList", () => {
+      o(/* @__PURE__ */ e(i, { brandName: "FOX" }));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[0]).toHaveAttribute(
+        "data-header-html",
+        "Watching FOX with an antenna? You may need to rescan your TV."
+      );
+    }), s("should pass 5 instructions to first InstructionsList", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[0]).toHaveAttribute("data-instructions-count", "5");
+    }), s("should include Menu button instruction", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByText(/Press the.*Menu.*button/i);
+      n(t).toBeInTheDocument();
+    }), s("should include Setup or Settings instruction", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByText(/Go to.*Setup.*or.*Settings/i);
+      n(t).toBeInTheDocument();
+    }), s("should include Installation/System/Channels instruction", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByText(/Go to.*Installation.*or.*System.*or.*Channels/i);
+      n(t).toBeInTheDocument();
+    }), s("should include Scan Channels instruction", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByText(/Go to.*Scan Channels.*or.*Program Channels/i);
+      n(t).toBeInTheDocument();
+    }), s("should include Select/Enter/OK instruction", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByText(/Press.*Select.*or.*Enter.*or.*OK.*to scan/i);
+      n(t).toBeInTheDocument();
+    });
+  }), c("Second InstructionsList (Double Rescan)", () => {
+    s("should pass correct headerHtml to second InstructionsList", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[1]).toHaveAttribute(
+        "data-header-html",
+        "Sometimes, a double rescan is needed to clear the memory of your Digital TV or Converter Box:"
+      );
+    }), s("should pass 5 instructions to second InstructionsList", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[1]).toHaveAttribute("data-instructions-count", "5");
+    }), s("should include disconnect antenna instruction", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByText(/Disconnect the antenna from the Digital TV/i);
+      n(t).toBeInTheDocument();
+    }), s("should include rescan without antenna instruction", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByText(/Rescan without the antenna connected/i);
+      n(t).toBeInTheDocument();
+    }), s("should include unplug for one minute instruction", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByText(/Unplug the Digital TV or Converter Box from the electrical outlet for one minute/i);
+      n(t).toBeInTheDocument();
+    }), s("should include reconnect antenna instruction", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByText(/Reconnect the antenna to the Digital TV or Converter Box/i);
+      n(t).toBeInTheDocument();
+    }), s("should include final rescan instruction", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getByText(/Rescan the Digital TV or Converter Box one more time/i);
+      n(t).toBeInTheDocument();
+    });
+  }), c("Instructions Content Verification", () => {
+    s("should pass first set of instructions with HTML tags", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const r = a.getAllByTestId(/^instruction-/).slice(0, 5);
+      n(r[0]).toHaveTextContent("Press the <strong>Menu</strong> button"), n(r[1]).toHaveTextContent("Go to <strong>Setup</strong> or <strong>Settings</strong>"), n(r[2]).toHaveTextContent("Go to <strong>Installation</strong>"), n(r[3]).toHaveTextContent("Go to <strong>Scan Channels</strong>"), n(r[4]).toHaveTextContent("Press <strong>Select</strong>");
+    }), s("should pass second set of instructions with escaped apostrophe", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const r = a.getAllByTestId(/^instruction-/).slice(5, 10);
+      n(r[0]).toHaveTextContent("Disconnect the antenna"), n(r[1]).toHaveTextContent("owner's manual"), n(r[2]).toHaveTextContent("Unplug the Digital TV"), n(r[3]).toHaveTextContent("Reconnect the antenna"), n(r[4]).toHaveTextContent("Rescan the Digital TV or Converter Box one more time");
+    });
+  }), c("Integration", () => {
+    s("should render complete module with all elements", () => {
+      const { container: t } = o(/* @__PURE__ */ e(i, { brandName: "CBS" })), r = t.querySelector("section");
+      n(r).toBeInTheDocument(), n(a.getByRole("heading", { level: 3 })).toBeInTheDocument();
+      const u = a.getAllByTestId("instructions-list");
+      n(u).toHaveLength(2), n(u[0]).toHaveAttribute(
+        "data-header-html",
+        "Watching CBS with an antenna? You may need to rescan your TV."
+      ), n(u[1]).toHaveAttribute(
+        "data-header-html",
+        "Sometimes, a double rescan is needed to clear the memory of your Digital TV or Converter Box:"
+      );
+      const l = a.getAllByTestId(/^instruction-/);
+      n(l).toHaveLength(10);
+    }), s("should maintain instruction order", () => {
+      o(/* @__PURE__ */ e(i, {}));
+      const t = a.getAllByTestId(/^instruction-/);
+      n(t[0]).toHaveTextContent("Menu"), n(t[5]).toHaveTextContent("Disconnect the antenna");
+    });
+  }), c("Type Safety", () => {
+    s("should accept valid brandName string", () => {
+      n(() => o(/* @__PURE__ */ e(i, { brandName: "NBC" }))).not.toThrow();
+    }), s("should accept undefined brandName", () => {
+      n(() => o(/* @__PURE__ */ e(i, { brandName: void 0 }))).not.toThrow();
+    }), s("should render without any props", () => {
+      n(() => o(/* @__PURE__ */ e(i, {}))).not.toThrow();
+    });
+  }), c("Edge Cases", () => {
+    s("should handle brandName with numbers", () => {
+      o(/* @__PURE__ */ e(i, { brandName: "Channel 7" }));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[0]).toHaveAttribute(
+        "data-header-html",
+        "Watching Channel 7 with an antenna? You may need to rescan your TV."
+      );
+    }), s("should handle brandName with hyphens", () => {
+      o(/* @__PURE__ */ e(i, { brandName: "NBC-TV" }));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[0]).toHaveAttribute(
+        "data-header-html",
+        "Watching NBC-TV with an antenna? You may need to rescan your TV."
+      );
+    }), s("should handle brandName with unicode characters", () => {
+      o(/* @__PURE__ */ e(i, { brandName: "Telemundo™" }));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[0]).toHaveAttribute(
+        "data-header-html",
+        "Watching Telemundo™ with an antenna? You may need to rescan your TV."
+      );
+    }), s("should handle whitespace in brandName", () => {
+      o(/* @__PURE__ */ e(i, { brandName: "  FOX  " }));
+      const t = a.getAllByTestId("instructions-list");
+      n(t[0]).toHaveAttribute(
+        "data-header-html",
+        "Watching   FOX   with an antenna? You may need to rescan your TV."
+      );
+    });
+  });
+});