@session-services/web-elements 0.1.23 → 0.1.25

package/dist/collection/components/session-services-ticketing/session-services-ticketing.logic.test.js

@@ -42,6 +42,7 @@ function section(data = {}) {
         reserved: 0,
         limit: 10,
         order: 2,
+        visibility: "ALWAYS",
         teamId: "team_1",
         promoterId: "pro_1",
         eventId: "evt_1",
@@ -113,6 +114,25 @@ function quoteItem(data = {}) {
         ...data,
     };
 }
+function quote(items) {
+    return {
+        items,
+        price: {
+            base: 0,
+            booking: 0,
+            currency: "AUD",
+            discount: 0,
+            dispute: 0,
+            gateway: 0,
+            gross: 0,
+            net: 0,
+            refunded: 0,
+            shipping: 0,
+            sms: 0,
+            total: 0,
+        },
+    };
+}
 describe("session-services-ticketing logic", () => {
     it("reads discount coupon codes from query strings", () => {
         expect(discountCouponFromSearch("?discount=save20")).toBe("save20");
@@ -255,6 +275,169 @@ describe("session-services-ticketing logic", () => {
         const items = topLevelTicketItems([main], [sectioned, early]);
         expect(items.map((item) => item.type)).toEqual(["admission", "section"]);
     });
+    it("lists every visible admission in list sections", () => {
+        const main = section({ id: "sec_main", visibility: "ALWAYS" });
+        const first = admission({ id: "adm_first", order: 2, sectionId: main.id });
+        const second = admission({
+            id: "adm_second",
+            order: 1,
+            sectionId: main.id,
+        });
+        const [item] = topLevelTicketItems([main], [first, second]);
+        expect(item?.type).toBe("section");
+        expect(item?.type === "section" ? item.admissions.map((adm) => adm.id) : []).toEqual(["adm_second", "adm_first"]);
+    });
+    it("shows the cheapest base-price admission in stacked sections", () => {
+        const main = section({ visibility: "STACKED" });
+        const expensive = admission({
+            id: "adm_expensive",
+            order: 1,
+            price: { base: 3000, booking: 300, currency: "AUD" },
+            sectionId: main.id,
+        });
+        const cheap = admission({
+            id: "adm_cheap",
+            order: 2,
+            price: { base: 1500, booking: 150, currency: "AUD" },
+            sectionId: main.id,
+        });
+        const [item] = topLevelTicketItems([main], [expensive, cheap]);
+        expect(item?.type).toBe("section");
+        expect(item?.type === "section" ? item.admissions.map((adm) => adm.id) : []).toEqual(["adm_cheap"]);
+    });
+    it("skips sold-out admissions when stacking sections", () => {
+        const main = section({ visibility: "STACKED" });
+        const soldOut = admission({
+            id: "adm_sold_out",
+            available: 0,
+            capacity: 1,
+            order: 1,
+            price: { base: 1000, booking: 100, currency: "AUD" },
+            sectionId: main.id,
+            sold: 1,
+        });
+        const available = admission({
+            id: "adm_available",
+            order: 2,
+            price: { base: 2000, booking: 200, currency: "AUD" },
+            sectionId: main.id,
+        });
+        const data = event({
+            admissions: [soldOut, available],
+            sections: [main],
+        });
+        const [item] = topLevelTicketItems([main], data.admissions, {
+            event: data,
+            mode: "default",
+        });
+        expect(item?.type).toBe("section");
+        expect(item?.type === "section" ? item.admissions.map((adm) => adm.id) : []).toEqual(["adm_available"]);
+    });
+    it("shows the next stacked admission when the cheapest has fewer tickets than its per-order limit", () => {
+        const main = section({ visibility: "STACKED" });
+        const lowRemaining = admission({
+            id: "adm_low_remaining",
+            available: 3,
+            limit: 4,
+            price: { base: 1000, booking: 100, currency: "AUD" },
+            sectionId: main.id,
+        });
+        const next = admission({
+            id: "adm_next",
+            order: 2,
+            price: { base: 2000, booking: 200, currency: "AUD" },
+            sectionId: main.id,
+        });
+        const [item] = topLevelTicketItems([main], [lowRemaining, next]);
+        expect(item?.type).toBe("section");
+        expect(item?.type === "section" ? item.admissions.map((adm) => adm.id) : []).toEqual(["adm_low_remaining", "adm_next"]);
+    });
+    it("shows the next stacked admission when an unlimited per-order limit has fewer than ten tickets left", () => {
+        const main = section({ visibility: "STACKED" });
+        const lowRemaining = admission({
+            id: "adm_low_remaining",
+            available: 9,
+            limit: -1,
+            price: { base: 1000, booking: 100, currency: "AUD" },
+            sectionId: main.id,
+        });
+        const next = admission({
+            id: "adm_next",
+            order: 2,
+            price: { base: 2000, booking: 200, currency: "AUD" },
+            sectionId: main.id,
+        });
+        const [item] = topLevelTicketItems([main], [lowRemaining, next]);
+        expect(item?.type).toBe("section");
+        expect(item?.type === "section" ? item.admissions.map((adm) => adm.id) : []).toEqual(["adm_low_remaining", "adm_next"]);
+    });
+    it("keeps stacked admissions collapsed when an unlimited per-order limit has ten tickets left", () => {
+        const main = section({ visibility: "STACKED" });
+        const current = admission({
+            id: "adm_current",
+            available: 10,
+            limit: -1,
+            price: { base: 1000, booking: 100, currency: "AUD" },
+            sectionId: main.id,
+        });
+        const next = admission({
+            id: "adm_next",
+            order: 2,
+            price: { base: 2000, booking: 200, currency: "AUD" },
+            sectionId: main.id,
+        });
+        const [item] = topLevelTicketItems([main], [current, next]);
+        expect(item?.type).toBe("section");
+        expect(item?.type === "section" ? item.admissions.map((adm) => adm.id) : []).toEqual(["adm_current"]);
+    });
+    it("uses coupon-adjusted base prices when stacking sections", () => {
+        const main = section({ visibility: "STACKED" });
+        const general = admission({
+            id: "adm_general",
+            order: 1,
+            price: { base: 2000, booking: 200, currency: "AUD" },
+            sectionId: main.id,
+        });
+        const vip = admission({
+            id: "adm_vip",
+            order: 2,
+            price: { base: 3000, booking: 300, currency: "AUD" },
+            sectionId: main.id,
+        });
+        const [item] = topLevelTicketItems([main], [general, vip], {
+            mode: "default",
+            previewQuote: quote([
+                quoteItem({
+                    admissionId: "adm_vip",
+                    sectionId: main.id,
+                    price: {
+                        base: 3000,
+                        booking: 300,
+                        currency: "AUD",
+                        discount: -2500,
+                        gross: 3300,
+                        net: 800,
+                        refunded: 0,
+                        total: 800,
+                    },
+                }),
+            ]),
+        });
+        expect(item?.type).toBe("section");
+        expect(item?.type === "section" ? item.admissions.map((adm) => adm.id) : []).toEqual(["adm_vip"]);
+    });
+    it("does not stack unsectioned admissions", () => {
+        const main = section({ visibility: "STACKED", order: 2 });
+        const sectioned = admission({
+            id: "adm_sectioned",
+            order: 1,
+            sectionId: main.id,
+        });
+        const unsectioned = admission({ id: "adm_unsectioned", order: 1 });
+        const items = topLevelTicketItems([main], [sectioned, unsectioned]);
+        expect(items.map((item) => item.type)).toEqual(["admission", "section"]);
+        expect(items[0]?.type === "admission" ? items[0].admission.id : "").toBe("adm_unsectioned");
+    });
     it("caps unlimited admission quantity at the selector limit", () => {
         const data = event({
             admissions: [admission({ available: -1, capacity: -1 })],

package/dist/collection/components/session-services-ticketing/session-services-ticketing.test.js

@@ -138,6 +138,10 @@ function widget() {
     const item = new SessionsTicketing();
     item.eventId = "evt_1";
     item.event = event();
+    item.enableAnalytics = true;
+    item.host = {
+        getBoundingClientRect: () => ({ top: 0 }),
+    };
     item.selectedItems = new Map();
     item.quote = null;
     item.previewQuote = null;
@@ -194,6 +198,44 @@ describe("session-services-ticketing component", () => {
         expect(item.couponError).toBe("Failed to apply coupon. Please check the code.");
         expect(item.client.order.quote).toHaveBeenCalledWith(expect.objectContaining({ couponCode: "BAD" }));
     });
+    it("does not commit preview coupons when event reload fails", async () => {
+        const item = widget();
+        item.appliedCouponCode = "SAVE10";
+        item.couponInput = "bad";
+        item.loadEventData = vi.fn().mockRejectedValue(new Error("Down"));
+        await item.applyCoupon();
+        expect(item.appliedCouponCode).toBe("SAVE10");
+        expect(item.couponInput).toBe("BAD");
+        expect(item.couponError).toBe("Failed to apply coupon. Please check the code.");
+    });
+    it("does not apply stale cart coupons as preview coupons", async () => {
+        const item = widget();
+        const firstLoad = deferred();
+        const secondLoad = deferred();
+        item.couponInput = "old";
+        item.selectedItems = new Map([[selectionKey("adm_general", null), 1]]);
+        item.loadEventData = vi
+            .fn()
+            .mockReturnValueOnce(firstLoad.promise)
+            .mockReturnValueOnce(secondLoad.promise)
+            .mockResolvedValue(undefined);
+        item.client.order.quote = vi.fn().mockResolvedValue({ quote: quote() });
+        const stale = item.applyCoupon();
+        await Promise.resolve();
+        expect(item.appliedCouponCode).toBe("OLD");
+        item.couponInput = "new";
+        const latest = item.applyCoupon();
+        await Promise.resolve();
+        expect(item.appliedCouponCode).toBe("NEW");
+        item.selectedItems = new Map();
+        firstLoad.resolve();
+        await stale;
+        expect(item.appliedCouponCode).toBe("NEW");
+        expect(item.client.order.quote).not.toHaveBeenCalledWith(expect.objectContaining({ couponCode: "OLD" }));
+        secondLoad.resolve();
+        await latest;
+        expect(item.appliedCouponCode).toBe("NEW");
+    });
     it("keeps preview quote loading separate from cart quote loading", async () => {
         const item = widget();
         const next = deferred();
@@ -266,6 +308,18 @@ describe("session-services-ticketing component", () => {
         });
         expect(item.getCheckoutButtonText()).toBe("Continue");
     });
+    it("renders stable checkout e2e hooks", () => {
+        const item = widget();
+        const view = item.renderReadyState();
+        const cards = rendered(view, (node) => node.props["data-testid"] === "event-admission-card");
+        const inputs = rendered(view, (node) => node.props["data-testid"] === "event-admission-quantity-input");
+        const increments = rendered(view, (node) => node.props["data-testid"] === "event-admission-increment");
+        const checkout = rendered(view, (node) => node.props["data-testid"] === "event-checkout-cta-desktop");
+        expect(cards[0].props["data-admission-id"]).toBe("adm_general");
+        expect(inputs).toHaveLength(1);
+        expect(increments).toHaveLength(1);
+        expect(checkout).toHaveLength(1);
+    });
     it("renders external ticketing in the sticky checkout bar", () => {
         const item = widget();
         item.event = event({ url: "https://tickets.example" });
@@ -276,6 +330,9 @@ describe("session-services-ticketing component", () => {
         expect(links[0].props.href).toBe("https://tickets.example");
         expect(hasClass(links[0], "external-ticket-button")).toBe(true);
         expect(hasClass(links[0], "sticky-checkout-btn")).toBe(true);
+        expect(rendered(links[0], (node) => node.tag === "span" &&
+            hasClass(node, "external-ticket-domain") &&
+            node.children.join("") === "via tickets.example")).toHaveLength(1);
     });
     it("keeps external ticketing under the sticky checkout host state", () => {
         const item = widget();
@@ -290,6 +347,55 @@ describe("session-services-ticketing component", () => {
         expect(links.some((link) => hasClass(link, "inline-external-ticket-button"))).toBe(true);
         expect(links.some((link) => hasClass(link, "sticky-checkout-btn"))).toBe(true);
     });
+    it("tracks external ticket clicks by surface", () => {
+        const item = widget();
+        const track = vi.fn();
+        item.analytics = { track };
+        item.event = event({ url: "https://tickets.example/event" });
+        item.stickyCheckout = true;
+        const links = rendered(item.renderReadyState(), (node) => node.tag === "a");
+        const inline = links.find((link) => hasClass(link, "inline-external-ticket-button"));
+        const sticky = links.find((link) => hasClass(link, "sticky-checkout-btn"));
+        expect(typeof inline?.props.onClick).toBe("function");
+        expect(typeof sticky?.props.onClick).toBe("function");
+        (inline?.props.onClick)();
+        (sticky?.props.onClick)();
+        expect(track).toHaveBeenCalledWith("Checkout Started", expect.objectContaining({
+            event_id: "evt_1",
+            team_id: "team_1",
+            promoter_id: "pro_1",
+            ticketing_mode: "external",
+            external_ticket_url: "https://tickets.example/event",
+            external_ticket_domain: "tickets.example",
+            cta_surface: "inline",
+        }));
+        expect(track).toHaveBeenCalledWith("Checkout Started", expect.objectContaining({
+            ticketing_mode: "external",
+            external_ticket_url: "https://tickets.example/event",
+            external_ticket_domain: "tickets.example",
+            cta_surface: "sticky",
+        }));
+    });
+    it("scrolls to the ticket selector with a 100px top offset", () => {
+        const item = widget();
+        const scrollTo = vi.fn();
+        const tickets = {
+            getBoundingClientRect: () => ({ top: 420 }),
+        };
+        item.host = {
+            shadowRoot: {
+                querySelector: vi.fn().mockReturnValue(tickets),
+            },
+            getBoundingClientRect: () => ({ top: 900 }),
+        };
+        vi.stubGlobal("window", { scrollY: 250, scrollTo });
+        item.handleStickyCheckoutClick(getTicketingState(item.event));
+        expect(scrollTo).toHaveBeenCalledWith({
+            behavior: "smooth",
+            top: 570,
+        });
+        vi.unstubAllGlobals();
+    });
     it("classifies only passcode access failures as passcode errors", async () => {
         const item = widget();
         item.client.event.get = vi