+
Failed to load receipt statuses
diff --git a/src/pages/__tests__/ReceiptShare.print.test.tsx b/src/pages/__tests__/ReceiptShare.print.test.tsx
new file mode 100644
index 0000000..b6f8110
--- /dev/null
+++ b/src/pages/__tests__/ReceiptShare.print.test.tsx
@@ -0,0 +1,67 @@
+/**
+ * @file src/pages/__tests__/ReceiptShare.print.test.tsx
+ *
+ * Focused tests for ReceiptShare print styles (GrantFox FWC26 b#031).
+ *
+ * Strategy
+ * --------
+ * CSS @media print rules are not evaluated by jsdom, so we verify that:
+ * 1. src/styles/print.css exists and contains the required .receiptshare-page
+ * and .receiptshare-chrome selectors.
+ * 2. src/pages/ReceiptShare.tsx applies the expected print-oriented class
+ * names to the root container and chrome elements.
+ * 3. The print stylesheet is imported/loaded globally.
+ */
+
+import fs from "node:fs";
+import path from "node:path";
+
+const read = (relPath: string) =>
+ fs.readFileSync(path.join(process.cwd(), relPath), "utf8");
+
+describe("src/styles/print.css — ReceiptShare print rules", () => {
+ const CSS_PATH = "src/styles/print.css";
+ let css: string;
+
+ beforeAll(() => {
+ css = read(CSS_PATH);
+ });
+
+ it("file exists under src/styles/", () => {
+ expect(fs.existsSync(path.join(process.cwd(), CSS_PATH))).toBe(true);
+ });
+
+ it("contains a @media print block for .receiptshare-page", () => {
+ expect(css).toContain(".receiptshare-page");
+ });
+
+ it("hides chrome via .receiptshare-chrome", () => {
+ expect(css).toContain(".receiptshare-chrome");
+ });
+
+ it("hides the live region via data-testid", () => {
+ expect(css).toContain('receiptshare-live-region');
+ });
+
+ it("resets background/color to light-mode values", () => {
+ expect(css).toContain("background: #fff !important");
+ expect(css).toContain("color: #000 !important");
+ });
+});
+
+describe("src/pages/ReceiptShare.tsx — print-oriented class names", () => {
+ const TSX_PATH = "src/pages/ReceiptShare.tsx";
+ let tsx: string;
+
+ beforeAll(() => {
+ tsx = read(TSX_PATH);
+ });
+
+ it("applies .receiptshare-page on the root container", () => {
+ expect(tsx).toContain("receiptshare-page");
+ });
+
+ it("applies .receiptshare-chrome on the header", () => {
+ expect(tsx).toContain("receiptshare-chrome");
+ });
+});
diff --git a/src/styles/print.css b/src/styles/print.css
index 8ecc56c..90126d6 100644
--- a/src/styles/print.css
+++ b/src/styles/print.css
@@ -76,3 +76,43 @@
height: auto !important;
}
}
+
+/* ReceiptShare print presentation. The header, chrome, and live-region are
+ * hidden; receipt cards retain their structure and break gracefully. */
+@media print {
+ .receiptshare-page {
+ max-width: none !important;
+ padding: 0 !important;
+ background: #fff !important;
+ color: #000 !important;
+ }
+
+ .receiptshare-page [class*="text-muted-foreground"] {
+ color: #374151 !important;
+ }
+
+ .receiptshare-page [class*="bg-card"],
+ .receiptshare-page [class*="bg-background"],
+ .receiptshare-page [class*="bg-muted"] {
+ background: #fff !important;
+ }
+
+ .receiptshare-chrome,
+ .receiptshare-page [data-testid="receiptshare-live-region"] {
+ display: none !important;
+ }
+
+ .receiptshare-page ul {
+ margin: 0;
+ padding: 0;
+ }
+
+ .receiptshare-page li {
+ break-inside: avoid;
+ }
+
+ .receiptshare-page a {
+ color: #000 !important;
+ text-decoration: none !important;
+ }
+}