fix(jsx-email): bump minify-preset, add tests

shellscape · Feb 23, 2024 · 51304c8 · 51304c8
1 parent b65103b
commit 51304c8
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 2 deletions.
diff --git a/packages/jsx-email/src/render/process.ts b/packages/jsx-email/src/render/process.ts
@@ -26,7 +26,7 @@ export const processHtml = async ({ html, minify, pretty }: ProcessOptions) => {
   }
 
   function rehypeMoveStyle() {
-    return function (tree: Root) {
+    return function moveStyle(tree: Root) {
       const matches: ElementWithParent[] = [];
       let head: Element | undefined;
 
@@ -58,7 +58,10 @@ export const processHtml = async ({ html, minify, pretty }: ProcessOptions) => {
   }
 
   let processor = rehype().data('settings', settings).use(rehypeMoveStyle);
-  if (minify) processor = processor.use(await minifyPreset());
+  if (minify) {
+    const preset = await minifyPreset();
+    processor = processor.use(preset);
+  }
 
   const doc = await processor
     .use(stringify, {

diff --git a/packages/jsx-email/test/debug.test.tsx b/packages/jsx-email/test/debug.test.tsx
@@ -1,3 +1,6 @@
+// @ts-ignore
+import React from 'react';
+
 import { d, debug } from '../src/debug';
 import { render } from '../src/render';
 

diff --git a/packages/jsx-email/test/render/.snapshots/render.test.tsx.snap b/packages/jsx-email/test/render/.snapshots/render.test.tsx.snap
@@ -423,4 +423,6 @@ exports[`render > renders the vercel demo template 2`] = `
 </html>"
 `;
 
+exports[`render > renders with minifying 1`] = `"<!DOCTYPE html PUBLIC \\"-//W3C//DTD XHTML 1.0 Transitional//EN\\" \\"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\\"><html dir=ltr lang=en><meta charset=utf8><body style=background-color:#fff;font-family:HelveticaNeue,Helvetica,Arial,sans-serif><table align=center border=0 cellpadding=0 cellspacing=0 role=presentation style=\\"max-width:37.5em;background-color:#fff;border:1px solid #eee;border-radius:5px;box-shadow:0 5px 10px rgba(20,50,70,.2);margin-top:20px;width:360px;margin:0 auto;padding:68px 0 130px\\"width=100%><tr style=width:100%><td><img alt=Plaid height=88 src=https://jsx.email/assets/demo/plaid-logo.png style=\\"border:none;display:block;outline:0;text-decoration:none;margin:0 auto\\"width=212><p style=\\"font-size:11px;line-height:16px;margin:16px 8px 8px 8px;color:#0a85ea;font-weight:700;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;height:16px;letter-spacing:0;text-transform:uppercase;text-align:center\\">Verify Your Identity<h1 style=color:#000;display:inline-block;font-family:HelveticaNeue-Medium,Helvetica,Arial,sans-serif;font-size:20px;font-weight:500;line-height:24px;margin-bottom:0;margin-top:0;text-align:center>Enter the following code to finish linking Venmo.</h1><table align=center border=0 cellpadding=0 cellspacing=0 role=presentation style=\\"background:rgba(0,0,0,.05);border-radius:4px;margin:16px auto 14px;vertical-align:middle;width:280px\\"width=100%><tr><td><p style=\\"font-size:32px;line-height:40px;margin:0 auto;color:#000;display:inline-block;font-family:HelveticaNeue-Bold;font-weight:700;letter-spacing:6px;padding-bottom:8px;padding-top:8px;width:100%;text-align:center\\"></table><p style=\\"font-size:15px;line-height:23px;margin:0;color:#444;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;letter-spacing:0;padding:0 40px;text-align:center\\">Not expecting this email?<p style=\\"font-size:15px;line-height:23px;margin:0;color:#444;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;letter-spacing:0;padding:0 40px;text-align:center\\">Contact <a href=mailto:login@plaid.com style=color:#444;text-decoration:underline>login@plaid.com</a> if you did not request this code.</table><p style=font-size:12px;line-height:23px;margin:0;color:#000;font-weight:800;letter-spacing:0;margin-top:20px;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;text-align:center;text-transform:uppercase>Securely powered by Plaid."`;
+
 exports[`render > renders without minifying 1`] = `"<!DOCTYPE html PUBLIC \\"-//W3C//DTD XHTML 1.0 Transitional//EN\\" \\"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\\"><html lang=\\"en\\" dir=\\"ltr\\"><head><meta http-equiv=\\"Content-Type\\" content=\\"text/html; charset=UTF-8\\"></head><body style=\\"background-color:#ffffff;font-family:HelveticaNeue,Helvetica,Arial,sans-serif\\"><table align=\\"center\\" width=\\"100%\\" role=\\"presentation\\" cellspacing=\\"0\\" cellpadding=\\"0\\" border=\\"0\\" style=\\"max-width:37.5em;background-color:#ffffff;border:1px solid #eee;border-radius:5px;box-shadow:0 5px 10px rgba(20,50,70,.2);margin-top:20px;width:360px;margin:0 auto;padding:68px 0 130px\\"><tbody><tr style=\\"width:100%\\"><td><img alt=\\"Plaid\\" src=\\"https://jsx.email/assets/demo/plaid-logo.png\\" width=\\"212\\" height=\\"88\\" style=\\"border:none;display:block;outline:none;text-decoration:none;margin:0 auto\\"><p style=\\"font-size:11px;line-height:16px;margin:16px 8px 8px 8px;color:#0a85ea;font-weight:700;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;height:16px;letter-spacing:0;text-transform:uppercase;text-align:center\\">Verify Your Identity</p><h1 style=\\"color:#000;display:inline-block;font-family:HelveticaNeue-Medium,Helvetica,Arial,sans-serif;font-size:20px;font-weight:500;line-height:24px;margin-bottom:0;margin-top:0;text-align:center\\">Enter the following code to finish linking Venmo.</h1><table align=\\"center\\" width=\\"100%\\" style=\\"background:rgba(0,0,0,.05);border-radius:4px;margin:16px auto 14px;vertical-align:middle;width:280px\\" border=\\"0\\" cellpadding=\\"0\\" cellspacing=\\"0\\" role=\\"presentation\\"><tbody><tr><td><p style=\\"font-size:32px;line-height:40px;margin:0 auto;color:#000;display:inline-block;font-family:HelveticaNeue-Bold;font-weight:700;letter-spacing:6px;padding-bottom:8px;padding-top:8px;width:100%;text-align:center\\"></p></td></tr></tbody></table><p style=\\"font-size:15px;line-height:23px;margin:0;color:#444;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;letter-spacing:0;padding:0 40px;text-align:center\\">Not expecting this email?</p><p style=\\"font-size:15px;line-height:23px;margin:0;color:#444;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;letter-spacing:0;padding:0 40px;text-align:center\\">Contact <a href=\\"mailto:login@plaid.com\\" style=\\"color:#444;text-decoration:underline\\">login@plaid.com</a> if you did not request this code.</p></td></tr></tbody></table><p style=\\"font-size:12px;line-height:23px;margin:0;color:#000;font-weight:800;letter-spacing:0;margin-top:20px;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;text-align:center;text-transform:uppercase\\">Securely powered by Plaid.</p></body></html>"`;
diff --git a/packages/jsx-email/test/render/render.test.tsx b/packages/jsx-email/test/render/render.test.tsx
@@ -46,6 +46,10 @@ describe('render', () => {
     expect(await render(<PlaidEmail />, { pretty: true })).toMatchSnapshot();
   });
 
+  it('renders with minifying', async () => {
+    expect(await render(<PlaidEmail />, { minify: true })).toMatchSnapshot();
+  });
+
   it('renders without minifying', async () => {
     expect(await render(<PlaidEmail />, { minify: false })).toMatchSnapshot();
   });