Apply brand defaults to MJML survey and product buttons
This commit is contained in:
1 parent
07ed6b2596
commit
b0fca36bca
5 files changed
+23
-3
No files matched your search
@@ -8,7 +8,7 @@ const compile = createRequire(import.meta.url)("mjml");
|
||||
test("MJML preserves document metadata and global typography in compiled HTML", async () => {
|
||||
const document: BlockDocument = {
|
||||
schemaVersion: 1, kind: "email", meta: { subject: 'Brand & "News" <today>', preheader: 'Preview <safe> & useful', lang: "en" }, theme: { tokens: {} },
|
||||
root: { id: "root", type: "layout.email-document", version: 1, props: { width: "600", fontFamily: "Georgia, serif", textColor: "#123456" }, styles: {}, slots: {
|
||||
root: { id: "root", type: "layout.email-document", version: 1, props: { width: "600", fontFamily: "Georgia, serif", textColor: "#123456", linkColor: "#a12345" }, styles: {}, slots: {
|
||||
content: [{ id: "text", type: "content.text", version: 1, props: { text: "Brand text" }, styles: {}, slots: {} }, { id: "button", type: "content.button", version: 1, props: { label: "Brand action", href: "https://example.com" }, styles: {}, slots: {} }],
|
||||
} },
|
||||
};
|
||||
@@ -35,6 +35,7 @@ test("MJML preserves document metadata and global typography in compiled HTML",
|
||||
expect(imported.value.meta.preheader).toBe(document.meta.preheader);
|
||||
expect(imported.value.root.props.fontFamily).toBe("Georgia, serif");
|
||||
expect(imported.value.root.props.textColor).toBe("#123456");
|
||||
expect(imported.value.root.props.linkColor).toBe("#a12345");
|
||||
const rerendered = await renderEmail(imported.value, { mjml: true });
|
||||
expect(rerendered.ok).toBe(true);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
import { expect, test } from "bun:test";
|
||||
import { createRequire } from "node:module";
|
||||
import type { BlockDocument } from "@wrnexus/blocks";
|
||||
import { renderEmail } from "../src/index.ts";
|
||||
const compile = createRequire(import.meta.url)("mjml");
|
||||
|
||||
test("survey MJML button inherits brand color and preserves safe text fallback", async () => {
|
||||
const document: BlockDocument = { schemaVersion: 1, kind: "email", meta: { subject: "Survey" }, theme: { tokens: {} }, root: { id: "root", type: "layout.email-document", version: 1, props: { width: "600", linkColor: "#a12345" }, styles: {}, slots: { content: [{ id: "survey", type: "content.survey", version: 1, props: { question: "How was your visit?", buttonLabel: "Answer & share", href: "https://example.com/survey" }, styles: {}, slots: {} }] } } };
|
||||
const result = await renderEmail(document, { mjml: true });
|
||||
if (!result.ok) throw new Error("Render failed");
|
||||
expect(result.value.parts.text.content).toContain("How was your visit?\nAnswer & share: https://example.com/survey");
|
||||
const compiled = await compile(result.value.exports!.mjml!, { validationLevel: "strict" });
|
||||
expect(compiled.errors).toEqual([]);
|
||||
expect(compiled.html).toContain("background:#a12345");
|
||||
expect(compiled.html).toContain("Answer & share");
|
||||
});
|
||||
Reference in new issue
Block a user