28 lines
1.1 KiB
TypeScript
28 lines
1.1 KiB
TypeScript
import { expect, test } from "bun:test";
|
|
import { buttonBlock, ampLayoutCss } from "../src/blocks.ts";
|
|
|
|
test("button visuals target the clickable surface rather than the full-width wrapper", async () => {
|
|
const node = {
|
|
id: "cta",
|
|
type: "content.button",
|
|
version: 1,
|
|
props: { label: "Act", href: "https://example.com" },
|
|
styles: {
|
|
backgroundColor: { base: "#123456" },
|
|
padding: { base: "8px 32px" },
|
|
borderRadius: { base: "20px" },
|
|
},
|
|
slots: {},
|
|
};
|
|
const context = { node, context: {}, slots: {} } as never;
|
|
const html = String(await buttonBlock.renderers!.emailHtml!(context));
|
|
const wrapper = html.match(/<td data-block-id="cta"[^>]*>/)![0];
|
|
expect(wrapper).not.toContain("#123456");
|
|
expect(wrapper).not.toContain("20px");
|
|
expect(wrapper).not.toContain("32px");
|
|
expect(html).toContain('bgcolor="#123456"');
|
|
expect(html.match(/<a [^>]*>/)![0]).toContain("padding:8px 32px");
|
|
expect(ampLayoutCss(node)).toContain("padding:8px 32px");
|
|
expect(String(await buttonBlock.renderers!.mjml!(context))).toContain('inner-padding="8px 32px"');
|
|
});
|