MJML5.0 Replace html-minifier and js-beautify

[iRyusa]

Edit: Available on MJML on v5 for now on experimental tag

[marvin-wtt]

I currently get the error nullTypeError: Cannot destructure property 'children' of 'element' as it is undefined. When compiling with CLI

[iRyusa]

Make sure to have no global install, clean your node modules + lockfile

…

On Sun, May 5, 2024 at 12:48 AM marvin-wtt ***@***.***> wrote: I currently get the error nullTypeError: Cannot destructure property 'children' of 'element' as it is undefined. When compiling with CLI — Reply to this email directly, view it on GitHub <#2858 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAELHTLDV3KHE7TT6KCZ7Y3ZAVQUBAVCNFSM6AAAAABGYUNVXSVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDAOJUGQ4TGNBRGQ> . You are receiving this because you authored the thread.Message ID: ***@***.***>

[marvin-wtt]

Make sure to have no global install, clean your node modules + lockfile

Just tried it with a fresh project and only the Black Friday template as test. Still fails.
It also fails in CI, so this can't be a global install issue.

[iRyusa]

@marvin-wtt found out the issue thanks for reporting check the latest version (alpha.2) should be good now 👍

[thewilkybarkid]

How experimental is this now? I see there have been alpha releases. Looks like CI isn't working as support for Node 16 needs to be dropped (cssnano doesn't support it as it's unmaintained).

[iRyusa]

I don't think we'll find some alternative to those lib now. I still need some work tho to bring back the CI to a green state

[AaronMoat]

@iRyusa for what it's worth, the CI commands locally seem happy enough if packages/mjml/test/html-attributes.test.js is updated to await mjml instead of just mjml; something similar to test.js seems to work:

async function run() {
  const { html } = await mjml(input)

  ... existing ... 
}

run();

[iRyusa]

Tried with a global await but it need to be converted to module. I'll try your solution thanks !

…

On Sat, Aug 3, 2024 at 1:47 PM Aaron Moat ***@***.***> wrote: @iRyusa <https://github.com/iRyusa> for what it's worth, the CI commands locally seem happy enough if packages/mjml/test/html-attributes.test.js is updated to await mjml instead of just mjml; something similar to test.js seems to work: async function run() { const { html } = await mjml(input) ... existing ... } run(); — Reply to this email directly, view it on GitHub <#2858 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAELHTNMZAFNPNWTKMTCQL3ZPS7LTAVCNFSM6AAAAABGYUNVXSVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDENRWGY4DMNRVHA> . You are receiving this because you were mentioned.Message ID: ***@***.***>

[AaronMoat]

Is there any other support that you might want to get this over the line from experimental to shipped @iRyusa? 😄

[iRyusa]

Alpha 6 might be the last alpha version. Then I'll push it to the "live".

[robkorv]

@iRyusa thank you for this change. It's going to be deployed to our production on Monday 🤞🏽

[iRyusa]

Feel free to reach me on slack if you find any issues 👍

[jwaterworth]

@robkorv How was your deployment? Anything we need to be aware of in using this release?

Thanks @iRyusa for making this available! 🙏

[robkorv]

@robkorv How was your deployment? Anything we need to be aware of in using this release?

Without any problems. About 415.358 mail build with "5.0.0-alpha.6" since the deploy. The only thing that is changed is that mjml2html is now asynchronous. Everything else is still the same.

I use mjml in a microservice build with hapi. I only needed this change in a hapi route to make it work.

@@ -1,37 +1,40 @@
 "use strict";
 
 const Boom = require("@hapi/boom");
 const Mjml = require("mjml");
 
 module.exports = [
   {
     method: ["get", "post"],
     path: "/mjml",
-    handler: (request, h) => {
+    handler: async (request, h) => {
       if (request.method === "post") {
         try {
-          const result = Mjml(request.payload.mjml, request.payload.options);
+          const result = await Mjml(
+            request.payload.mjml,
+            request.payload.options
+          );
 
           if (request.payload.return_html) {
             const formattedMessages = result.errors
               .filter((x) => x.formattedMessage)
               .map((x) => x.formattedMessage);
             if (formattedMessages.length) {
               request.logger.warn(formattedMessages.join("\n"));
             }
 
             return result.html;
           }
 
           return result;
         } catch (err) {
           const boom = new Boom.Boom(err.toString());
           boom.reformat(true);
           return boom;
         }
       } else {
         return "post mjml and I will return html";
       }
     },
   },
 ];