feat: use more aggressive newlines in html mode tag bodies

marko-js · Mar 16, 2023 · 93ebb54 · 93ebb54
1 parent 6678784
commit 93ebb54
Show file tree

Hide file tree

Showing 49 changed files with 300 additions and 93 deletions.
diff --git a/src/__tests__/__snapshots__/avoid-whitespace.expected/auto.marko b/src/__tests__/__snapshots__/avoid-whitespace.expected/auto.marko
@@ -1 +1,5 @@
-<div>${foo} (<span>${bar}</span>)</div>
+<div>
+  ${foo} (
+  <span>${bar}</span>
+  )
+</div>
diff --git a/src/__tests__/__snapshots__/avoid-whitespace.expected/html.marko b/src/__tests__/__snapshots__/avoid-whitespace.expected/html.marko
@@ -1 +1,5 @@
-<div>${foo} (<span>${bar}</span>)</div>
+<div>
+  ${foo} (
+  <span>${bar}</span>
+  )
+</div>
diff --git a/src/__tests__/__snapshots__/avoid-whitespace.expected/with-parens.marko b/src/__tests__/__snapshots__/avoid-whitespace.expected/with-parens.marko
@@ -1 +1,5 @@
-<div>${foo} (<span>${bar}</span>)</div>
+<div>
+  ${foo} (
+  <span>${bar}</span>
+  )
+</div>
diff --git a/src/__tests__/__snapshots__/comments-inline-complex.expected/html.marko b/src/__tests__/__snapshots__/comments-inline-complex.expected/html.marko
@@ -1,8 +1,10 @@
 <div class="hello">
   // This is a line comment
 
-  <span>Welcome to <b>Marko</b></span>
-
+  <span>
+    Welcome to
+    <b>Marko</b>
+  </span>
   Foo<!--
     This is a multiline HTML comment
       This is indented further

diff --git a/src/__tests__/__snapshots__/comments.expected/html.marko b/src/__tests__/__snapshots__/comments.expected/html.marko
@@ -1,8 +1,10 @@
 <div class="hello">
   // This is a line comment
 
-  <span>Welcome to <b>Marko</b></span>
-
+  <span>
+    Welcome to
+    <b>Marko</b>
+  </span>
   Foo<!--
     This is a multiline HTML comment
       This is indented further

diff --git a/src/__tests__/__snapshots__/component.expected/auto.marko b/src/__tests__/__snapshots__/component.expected/auto.marko
@@ -10,4 +10,6 @@ class {
 }
 
 <div>The current count is ${state.count}</div>
-<button on-click("increment")>+1</button>
+<button on-click("increment")>
+  +1
+</button>
diff --git a/src/__tests__/__snapshots__/component.expected/html.marko b/src/__tests__/__snapshots__/component.expected/html.marko
@@ -10,4 +10,6 @@ class {
 }
 
 <div>The current count is ${state.count}</div>
-<button on-click("increment")>+1</button>
+<button on-click("increment")>
+  +1
+</button>
diff --git a/src/__tests__/__snapshots__/component.expected/with-parens.marko b/src/__tests__/__snapshots__/component.expected/with-parens.marko
@@ -10,4 +10,6 @@ class {
 }
 
 <div>The current count is ${state.count}</div>
-<button on-click("increment")>+1</button>
+<button on-click("increment")>
+  +1
+</button>
diff --git a/src/__tests__/__snapshots__/dynamic-tag-name.expected/auto.marko b/src/__tests__/__snapshots__/dynamic-tag-name.expected/auto.marko
@@ -1,3 +1,5 @@
 <for(element in blah)>
-  <${element.foo}><include("foo")/></>
+  <${element.foo}>
+    <include("foo")/>
+  </>
 </for>
diff --git a/src/__tests__/__snapshots__/dynamic-tag-name.expected/html.marko b/src/__tests__/__snapshots__/dynamic-tag-name.expected/html.marko
@@ -1,3 +1,5 @@
 <for(element in blah)>
-  <${element.foo}><include("foo")/></>
+  <${element.foo}>
+    <include("foo")/>
+  </>
 </for>
diff --git a/src/__tests__/__snapshots__/dynamic-tag-name.expected/with-parens.marko b/src/__tests__/__snapshots__/dynamic-tag-name.expected/with-parens.marko
@@ -1,3 +1,5 @@
 <for(element in blah)>
-  <${element.foo}><include("foo")/></>
+  <${element.foo}>
+    <include("foo")/>
+  </>
 </for>
diff --git a/src/__tests__/__snapshots__/formating-tags-multiline.expected/html.marko b/src/__tests__/__snapshots__/formating-tags-multiline.expected/html.marko
@@ -1,3 +1,6 @@
 <div class="hello">
-  <span>Welcome to the wonderful world of <b>Marko</b></span>
+  <span>
+    Welcome to the wonderful world of
+    <b>Marko</b>
+  </span>
 </div>
diff --git a/src/__tests__/__snapshots__/formating-tags-single-line.expected/html.marko b/src/__tests__/__snapshots__/formating-tags-single-line.expected/html.marko
@@ -1 +1,6 @@
-<div class="hello"><span>Welcome to the <b>Marko</b></span></div>
+<div class="hello">
+  <span>
+    Welcome to the
+    <b>Marko</b>
+  </span>
+</div>
diff --git a/src/__tests__/__snapshots__/formatting-tag-with-content.expected/auto.marko b/src/__tests__/__snapshots__/formatting-tag-with-content.expected/auto.marko
@@ -1 +1,4 @@
-<b><i/><span/></b>
+<b>
+  <i/>
+  <span/>
+</b>
diff --git a/src/__tests__/__snapshots__/formatting-tag-with-content.expected/html.marko b/src/__tests__/__snapshots__/formatting-tag-with-content.expected/html.marko
@@ -1 +1,4 @@
-<b><i/><span/></b>
+<b>
+  <i/>
+  <span/>
+</b>
diff --git a/src/__tests__/__snapshots__/formatting-tag-with-content.expected/with-parens.marko b/src/__tests__/__snapshots__/formatting-tag-with-content.expected/with-parens.marko
@@ -1 +1,4 @@
-<b><i/><span/></b>
+<b>
+  <i/>
+  <span/>
+</b>
diff --git a/src/__tests__/__snapshots__/indent.expected/html.marko b/src/__tests__/__snapshots__/indent.expected/html.marko
@@ -6,8 +6,12 @@
   <body>
     <h1>Hello ${data.name}!</h1>
     <ul if(notEmpty(data.colors))>
-      <li for(color in data.colors)>${color}</li>
+      <li for(color in data.colors)>
+        ${color}
+      </li>
     </ul>
-    <div else>No colors!</div>
+    <div else>
+      No colors!
+    </div>
   </body>
 </html>
diff --git a/src/__tests__/__snapshots__/markdown.expected/html.marko b/src/__tests__/__snapshots__/markdown.expected/html.marko
@@ -5,6 +5,5 @@
   <title>Marko Templating Engine</title>
    body
   <h1>Hello ${data.name}!</h1>
-
    ul if(notEmpty(data.colors)) li for(color in data.colors) ${color}${" "}div else - No colors! ```
 </app-markdown>
diff --git a/src/__tests__/__snapshots__/marko-prettyprint-file.expected/html.marko b/src/__tests__/__snapshots__/marko-prettyprint-file.expected/html.marko
@@ -1 +1,3 @@
-<div><span>Hello World</span></div>
+<div>
+  <span>Hello World</span>
+</div>
diff --git a/src/__tests__/__snapshots__/max-line-length.expected/auto.marko b/src/__tests__/__snapshots__/max-line-length.expected/auto.marko
@@ -4,7 +4,9 @@
     <title>Marko Templating Engine</title>
   </head>
   <body>
-    <h1 class="super-duper-long__class-name">Hello ${data.name}!</h1>
+    <h1 class="super-duper-long__class-name">
+      Hello ${data.name}!
+    </h1>
     <h2
       class="super-duper-long__class-name"
       data-test="test attribute data"

diff --git a/src/__tests__/__snapshots__/max-line-length.expected/html.marko b/src/__tests__/__snapshots__/max-line-length.expected/html.marko
@@ -4,7 +4,9 @@
     <title>Marko Templating Engine</title>
   </head>
   <body>
-    <h1 class="super-duper-long__class-name">Hello ${data.name}!</h1>
+    <h1 class="super-duper-long__class-name">
+      Hello ${data.name}!
+    </h1>
     <h2
       class="super-duper-long__class-name"
       data-test="test attribute data"

diff --git a/src/__tests__/__snapshots__/max-line-length.expected/with-parens.marko b/src/__tests__/__snapshots__/max-line-length.expected/with-parens.marko
@@ -4,7 +4,9 @@
     <title>Marko Templating Engine</title>
   </head>
   <body>
-    <h1 class="super-duper-long__class-name">Hello ${data.name}!</h1>
+    <h1 class="super-duper-long__class-name">
+      Hello ${data.name}!
+    </h1>
     <h2
       class="super-duper-long__class-name"
       data-test="test attribute data"

diff --git a/src/__tests__/__snapshots__/params-destructured.expected/auto.marko b/src/__tests__/__snapshots__/params-destructured.expected/auto.marko
@@ -2,9 +2,15 @@
   <await(generator.next())>
     <@then|{ value, done }|>
       <div>
-        <ul><li>${value}</li></ul>
-        <ul><li>${value}</li></ul>
-        <ul><li>${value}</li></ul>
+        <ul>
+          <li>${value}</li>
+        </ul>
+        <ul>
+          <li>${value}</li>
+        </ul>
+        <ul>
+          <li>${value}</li>
+        </ul>
       </div>
     </@then>
   </await>

diff --git a/src/__tests__/__snapshots__/params-destructured.expected/html.marko b/src/__tests__/__snapshots__/params-destructured.expected/html.marko
@@ -2,9 +2,15 @@
   <await(generator.next())>
     <@then|{ value, done }|>
       <div>
-        <ul><li>${value}</li></ul>
-        <ul><li>${value}</li></ul>
-        <ul><li>${value}</li></ul>
+        <ul>
+          <li>${value}</li>
+        </ul>
+        <ul>
+          <li>${value}</li>
+        </ul>
+        <ul>
+          <li>${value}</li>
+        </ul>
       </div>
     </@then>
   </await>

diff --git a/src/__tests__/__snapshots__/params-destructured.expected/with-parens.marko b/src/__tests__/__snapshots__/params-destructured.expected/with-parens.marko
@@ -2,9 +2,15 @@
   <await(generator.next())>
     <@then|{ value, done }|>
       <div>
-        <ul><li>${value}</li></ul>
-        <ul><li>${value}</li></ul>
-        <ul><li>${value}</li></ul>
+        <ul>
+          <li>${value}</li>
+        </ul>
+        <ul>
+          <li>${value}</li>
+        </ul>
+        <ul>
+          <li>${value}</li>
+        </ul>
       </div>
     </@then>
   </await>

diff --git a/src/__tests__/__snapshots__/shorthand-body.expected/html.marko b/src/__tests__/__snapshots__/shorthand-body.expected/html.marko
@@ -1 +1,3 @@
-<div id="foo">Hello World</div>
+<div id="foo">
+  Hello World
+</div>
diff --git a/src/__tests__/__snapshots__/single-line.expected/auto.marko b/src/__tests__/__snapshots__/single-line.expected/auto.marko
@@ -1 +1,10 @@
-<div><span>Hello <b><a href="#">World</a></b></span></div>
+<div>
+  <span>
+    Hello
+    <b>
+      <a href="#">
+        World
+      </a>
+    </b>
+  </span>
+</div>
diff --git a/src/__tests__/__snapshots__/single-line.expected/html.marko b/src/__tests__/__snapshots__/single-line.expected/html.marko
@@ -1 +1,10 @@
-<div><span>Hello <b><a href="#">World</a></b></span></div>
+<div>
+  <span>
+    Hello
+    <b>
+      <a href="#">
+        World
+      </a>
+    </b>
+  </span>
+</div>
diff --git a/src/__tests__/__snapshots__/single-line.expected/with-parens.marko b/src/__tests__/__snapshots__/single-line.expected/with-parens.marko
@@ -1 +1,10 @@
-<div><span>Hello <b><a href="#">World</a></b></span></div>
+<div>
+  <span>
+    Hello
+    <b>
+      <a href="#">
+        World
+      </a>
+    </b>
+  </span>
+</div>
diff --git a/src/__tests__/__snapshots__/something-wrong.expected/auto.marko b/src/__tests__/__snapshots__/something-wrong.expected/auto.marko
@@ -18,6 +18,10 @@ $ var count = state.count;
   ]>
     ${count}
   </div>
-  <button on-click("increment", -1)>-1</button>
-  <button on-click("increment", 1)>+1</button>
+  <button on-click("increment", -1)>
+    -1
+  </button>
+  <button on-click("increment", 1)>
+    +1
+  </button>
 </div>
diff --git a/src/__tests__/__snapshots__/something-wrong.expected/html.marko b/src/__tests__/__snapshots__/something-wrong.expected/html.marko
@@ -18,6 +18,10 @@ $ var count = state.count;
   ]>
     ${count}
   </div>
-  <button on-click("increment", -1)>-1</button>
-  <button on-click("increment", 1)>+1</button>
+  <button on-click("increment", -1)>
+    -1
+  </button>
+  <button on-click("increment", 1)>
+    +1
+  </button>
 </div>
diff --git a/src/__tests__/__snapshots__/something-wrong.expected/with-parens.marko b/src/__tests__/__snapshots__/something-wrong.expected/with-parens.marko
@@ -18,6 +18,10 @@ $ var count = state.count;
   ]>
     ${count}
   </div>
-  <button on-click("increment", -1)>-1</button>
-  <button on-click("increment", 1)>+1</button>
+  <button on-click("increment", -1)>
+    -1
+  </button>
+  <button on-click("increment", 1)>
+    +1
+  </button>
 </div>
diff --git a/src/__tests__/__snapshots__/static-function.expected/auto.marko b/src/__tests__/__snapshots__/static-function.expected/auto.marko
@@ -10,14 +10,20 @@ static function getAnchorName(section) {
   <div class="tableOfContents">
     <ul>
       <li for(section in data.sections)>
-        <a href="#${getAnchorName(section)}">${section.title}</a>
+        <a href="#${getAnchorName(section)}">
+          ${section.title}
+        </a>
       </li>
     </ul>
   </div>
   <div class="sections-ctr">
     <div class="section" for(section in data.sections)>
-      <h2 id=getAnchorName(section)>${section.title}</h2>
-      <div class="section-body"><include(section)/></div>
+      <h2 id=getAnchorName(section)>
+        ${section.title}
+      </h2>
+      <div class="section-body">
+        <include(section)/>
+      </div>
     </div>
   </div>
 </div>
diff --git a/src/__tests__/__snapshots__/static-function.expected/html.marko b/src/__tests__/__snapshots__/static-function.expected/html.marko
@@ -10,14 +10,20 @@ static function getAnchorName(section) {
   <div class="tableOfContents">
     <ul>
       <li for(section in data.sections)>
-        <a href="#${getAnchorName(section)}">${section.title}</a>
+        <a href="#${getAnchorName(section)}">
+          ${section.title}
+        </a>
       </li>
     </ul>
   </div>
   <div class="sections-ctr">
     <div class="section" for(section in data.sections)>
-      <h2 id=getAnchorName(section)>${section.title}</h2>
-      <div class="section-body"><include(section)/></div>
+      <h2 id=getAnchorName(section)>
+        ${section.title}
+      </h2>
+      <div class="section-body">
+        <include(section)/>
+      </div>
     </div>
   </div>
 </div>
diff --git a/src/__tests__/__snapshots__/static-function.expected/with-parens.marko b/src/__tests__/__snapshots__/static-function.expected/with-parens.marko
@@ -10,14 +10,20 @@ static function getAnchorName(section) {
   <div class="tableOfContents">
     <ul>
       <li for(section in data.sections)>
-        <a href="#${getAnchorName(section)}">${section.title}</a>
+        <a href="#${getAnchorName(section)}">
+          ${section.title}
+        </a>
       </li>
     </ul>
   </div>
   <div class="sections-ctr">
     <div class="section" for(section in data.sections)>
-      <h2 id=getAnchorName(section)>${section.title}</h2>
-      <div class="section-body"><include(section)/></div>
+      <h2 id=getAnchorName(section)>
+        ${section.title}
+      </h2>
+      <div class="section-body">
+        <include(section)/>
+      </div>
     </div>
   </div>
 </div>