Giter Site home page Giter Site logo

Comments (3)

jdrouet avatar jdrouet commented on August 19, 2024 1

interesting! I will move that up then.
I should also put in place some browser testing on the CI

from mrml.

jdrouet avatar jdrouet commented on August 19, 2024

Yeah, the implemented html renderer will write a closing element if there is no children. I understand that it's not consistent in term of html but in term of visual, it should stay the same.
I should mention that in the readme though 👍

If you have another point of view about it, feel free to share it with me, I'd be happy to reconsider my choice 😉

from mrml.

clj avatar clj commented on August 19, 2024

Chrome (and Safari, I guess WebKit, haven't tried Firefox) disagrees on the visual side 😄 (sorry I should have added this to the original ticket)

Here is the HTML that Chrome constructs when rendering the HTML generated by mrml from the above snippet:

<body style="word-spacing:normal;">
  <div>
    <!--[if mso | IE]><table align="center" cellpadding="0" width="600" border="0" role="presentation" cellspacing="0" style="width:600px;"><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="margin:0px auto;max-width:600px;">
      <table cellspacing="0" align="center" role="presentation" cellpadding="0" border="0" style="width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;">
              <!--[if mso | IE]><table border="0" cellpadding="0" role="presentation" cellspacing="0"><![endif]--><!--[if mso | IE]><tr><![endif]--><!--[if mso | IE]><td><![endif]-->
              <script
                src="http://example.com/hello.js"><!--[if mso | IE]></td><![endif]--> <!--[if mso | IE]><td style="vertical-align:top;width:300px;"><![endif]-->
              <div class="mj-outlook-group-fix mj-column-per-50"
                style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table cellspacing="0" role="presentation" width="100%" border="0" cellpadding="0"
                  style="vertical-align:top;">
                  <tbody>
                    <tr>
                      <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
                        <div
                          style="font-family:Ubuntu, Helvetica, Arial, sans-serif;font-size:13px;line-height:1;text-align:left;color:#000000;">
                          Hello World!
                        </div>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
              <!--[if mso | IE]></td><![endif]-- >< !--[if mso | IE]></tr >< ![endif]-- >< !--[if mso | IE]></table >< ![endif]-- >
            </td >
          </tr >
        </tbody >
      </table >
    </div >< !--[if mso | IE]></td ></tr ></table >< ![endif]-- >
  </div >
</body >

</html >
                </script>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>

The browser tries to close the script tag, but in doing so captures the rest of the content. The html generated by mrml therefore renders as a blank page instead of showing "Hello World".

from mrml.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.