fixes incorrectly closed <v:rect> tag for Outlook

FelixSchwarz · Jan 9, 2025 · 350d072 · 350d072
1 parent 905013b
commit 350d072
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 3 deletions.
diff --git a/mjml/elements/mj_section.py b/mjml/elements/mj_section.py
@@ -360,7 +360,7 @@ def renderWithBackground(self, content):
         })
         return f'''
           <!--[if mso | IE]>
-            <v:rect {vrect_attrs} />
+            <v:rect {vrect_attrs} >
             <v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0">
             <v:fill {vfill_attrs} />
           <![endif]-->

diff --git a/tests/testdata/mj-section-with-background-expected.html b/tests/testdata/mj-section-with-background-expected.html
@@ -89,7 +89,7 @@
 
 <body style="word-spacing:normal;">
   <div style="">
-    <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><v:rect style="width:600px;" xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false"><v:fill origin="0.5, 0" position="0.5, 0" src="http://site.example/test.png" type="tile" size="1,1" aspect="atmost" /><v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0"><![endif]-->
+    <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><v:rect style="width:600px;" xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false"><v:fill origin="0.5, 0" position="0.5, 0" src="http://site.example/test.png" type="tile" size="1,1" aspect="atmost" ><v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0"><![endif]-->
     <div style="background:url('http://site.example/test.png') center top / contain repeat;background-position:center top;background-repeat:repeat;background-size:contain;margin:0px auto;max-width:600px;">
       <div style="line-height:0;font-size:0;">
         <table align="center" background="http://site.example/test.png" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:url('http://site.example/test.png') center top / contain repeat;background-position:center top;background-repeat:repeat;background-size:contain;width:100%;">

diff --git a/tests/testdata/mj-section-with-background-url-expected.html b/tests/testdata/mj-section-with-background-url-expected.html
@@ -88,7 +88,7 @@
 
 <body style="word-spacing:normal;">
   <div style="">
-    <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><v:rect style="width:600px;" xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false"><v:fill origin="0.5, 0" position="0.5, 0" src="http://site.example/bg-url.jpg" type="tile" /><v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0"><![endif]-->
+    <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><v:rect style="width:600px;" xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false"><v:fill origin="0.5, 0" position="0.5, 0" src="http://site.example/bg-url.jpg" type="tile" ><v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0"><![endif]-->
     <div style="background:url('http://site.example/bg-url.jpg') center top / auto repeat;background-position:center top;background-repeat:repeat;background-size:auto;margin:0px auto;max-width:600px;">
       <div style="line-height:0;font-size:0;">
         <table align="center" background="http://site.example/bg-url.jpg" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:url('http://site.example/bg-url.jpg') center top / auto repeat;background-position:center top;background-repeat:repeat;background-size:auto;width:100%;">