From 128b68aefcec8d99b7c508e4cea2336207f574da Mon Sep 17 00:00:00 2001
From: Dylan Piercey <dpiercey@ebay.com>
Date: Fri, 24 Apr 2020 16:41:45 -0700
Subject: [PATCH] fix: regression with unquoted attribute with trailing slash
 (#1561)

(cherry picked from commit 5c26b9b3ec6f5e8847ffe43e99f7593da806932a)
---
 .../marko/src/runtime/components/beginComponent.js |  6 +++---
 .../marko/src/runtime/components/endComponent.js   |  2 +-
 packages/marko/src/runtime/html/AsyncStream.js     |  4 ++--
 packages/marko/src/runtime/html/helpers/attr.js    |  2 +-
 .../render/fixtures/attr-unquoted/expected.html    |  2 ++
 .../render/fixtures/attr-unquoted/template.marko   | 14 ++++++++++++++
 .../test/render/fixtures/attr-unquoted/test.js     |  1 +
 .../fixtures/attr-unquoted/vdom-expected.html      |  2 ++
 .../fixtures/component-aria-key/expected.html      |  2 +-
 .../component-file-export-class/expected.html      |  2 +-
 .../fixtures/component-label-for/expected.html     |  2 +-
 .../fixtures/component-safe-json/expected.html     |  2 +-
 .../components-await-beginAsync/expected.html      |  2 +-
 .../fixtures/components-await-title/expected.html  |  2 +-
 .../render/fixtures/components-await/expected.html |  2 +-
 .../test/render/fixtures/components/expected.html  |  2 +-
 .../fixtures/dynamic-split-component/expected.html |  2 +-
 .../fixtures/dynamic-tag-arguments/expected.html   |  2 +-
 .../fixtures/global-runtime-id/expected.html       |  2 +-
 19 files changed, 37 insertions(+), 18 deletions(-)
 create mode 100644 packages/marko/test/render/fixtures/attr-unquoted/expected.html
 create mode 100644 packages/marko/test/render/fixtures/attr-unquoted/template.marko
 create mode 100644 packages/marko/test/render/fixtures/attr-unquoted/test.js
 create mode 100644 packages/marko/test/render/fixtures/attr-unquoted/vdom-expected.html

diff --git a/packages/marko/src/runtime/components/beginComponent.js b/packages/marko/src/runtime/components/beginComponent.js
index beb9eba49..b393edb75 100644
--- a/packages/marko/src/runtime/components/beginComponent.js
+++ b/packages/marko/src/runtime/components/beginComponent.js
@@ -54,7 +54,7 @@ module.exports = function beginComponent(
 
   if ((ownerIsRenderBoundary || ownerWillRerender) && key != null) {
     out.w(
-      "<!" +
+      "<!--" +
         runtimeId +
         "^" +
         componentId +
@@ -62,10 +62,10 @@ module.exports = function beginComponent(
         ownerComponentDef.id +
         " " +
         key +
-        ">"
+        "-->"
     );
   } else {
-    out.w("<!" + runtimeId + "#" + componentId + ">");
+    out.w("<!--" + runtimeId + "#" + componentId + "-->");
   }
 
   return componentDef;
diff --git a/packages/marko/src/runtime/components/endComponent.js b/packages/marko/src/runtime/components/endComponent.js
index 56025bd6a..8296cc1e9 100644
--- a/packages/marko/src/runtime/components/endComponent.js
+++ b/packages/marko/src/runtime/components/endComponent.js
@@ -5,7 +5,7 @@ var getComponentsContext = ComponentsContext.___getComponentsContext;
 
 module.exports = function endComponent(out, componentDef) {
   if (componentDef.___renderBoundary) {
-    out.w("<!" + out.global.runtimeId + "/>");
+    out.w("<!--" + out.global.runtimeId + "/-->");
     getComponentsContext(out).___isPreserved = componentDef.___parentPreserved;
   }
 };
diff --git a/packages/marko/src/runtime/html/AsyncStream.js b/packages/marko/src/runtime/html/AsyncStream.js
index ce98d6a28..286028f46 100644
--- a/packages/marko/src/runtime/html/AsyncStream.js
+++ b/packages/marko/src/runtime/html/AsyncStream.js
@@ -571,7 +571,7 @@ var proto = (AsyncStream.prototype = {
 
   ___beginFragment: function(key, component, preserve) {
     if (preserve) {
-      this.write("<!F#" + escapeXmlString(key) + ">");
+      this.write("<!--F#" + escapeXmlString(key) + "-->");
     }
     if (this._elStack) {
       this._elStack.push(preserve);
@@ -583,7 +583,7 @@ var proto = (AsyncStream.prototype = {
   ___endFragment: function() {
     var preserve = this._elStack.pop();
     if (preserve) {
-      this.write("<!F/>");
+      this.write("<!--F/-->");
     }
   },
 
diff --git a/packages/marko/src/runtime/html/helpers/attr.js b/packages/marko/src/runtime/html/helpers/attr.js
index b7856819c..47278873f 100644
--- a/packages/marko/src/runtime/html/helpers/attr.js
+++ b/packages/marko/src/runtime/html/helpers/attr.js
@@ -62,5 +62,5 @@ function guessQuotes(value) {
     }
   }
 
-  return value && "=" + value;
+  return value && "=" + (value[len - 1] === "/" ? value + " " : value);
 }
diff --git a/packages/marko/test/render/fixtures/attr-unquoted/expected.html b/packages/marko/test/render/fixtures/attr-unquoted/expected.html
new file mode 100644
index 000000000..e9f48cf7e
--- /dev/null
+++ b/packages/marko/test/render/fixtures/attr-unquoted/expected.html
@@ -0,0 +1,2 @@
+<div a=abc b="abc " c="abc'" d='abc"' e="abc'&#34;" f='abc"&#39;' g="abc	" h="abc
+" i="abc
" j="abc" l=/abc k=abc/ ></div>
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/attr-unquoted/template.marko b/packages/marko/test/render/fixtures/attr-unquoted/template.marko
new file mode 100644
index 000000000..460fcf245
--- /dev/null
+++ b/packages/marko/test/render/fixtures/attr-unquoted/template.marko
@@ -0,0 +1,14 @@
+<div
+  a="abc"
+  b="abc "
+  c="abc'"
+  d='abc"'
+  e="abc'\""
+  f="abc\"'"
+  g="abc\t"
+  h="abc\n"
+  i="abc\r"
+  j="abc\f"
+  l="/abc"
+  k="abc/"
+/>
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/attr-unquoted/test.js b/packages/marko/test/render/fixtures/attr-unquoted/test.js
new file mode 100644
index 000000000..c4013b344
--- /dev/null
+++ b/packages/marko/test/render/fixtures/attr-unquoted/test.js
@@ -0,0 +1 @@
+exports.templateData = {};
diff --git a/packages/marko/test/render/fixtures/attr-unquoted/vdom-expected.html b/packages/marko/test/render/fixtures/attr-unquoted/vdom-expected.html
new file mode 100644
index 000000000..98c918726
--- /dev/null
+++ b/packages/marko/test/render/fixtures/attr-unquoted/vdom-expected.html
@@ -0,0 +1,2 @@
+<DIV a="abc" b="abc " c="abc'" d="abc"" e="abc'"" f="abc"'" g="abc	" h="abc
+" i="abc
" j="abc" k="abc/" l="/abc">
diff --git a/packages/marko/test/render/fixtures/component-aria-key/expected.html b/packages/marko/test/render/fixtures/component-aria-key/expected.html
index ee0c4bb50..2ab2e0a79 100644
--- a/packages/marko/test/render/fixtures/component-aria-key/expected.html
+++ b/packages/marko/test/render/fixtures/component-aria-key/expected.html
@@ -1 +1 @@
-<!M#s0><div id="s0-buttonDescription">Submit the form thing</div><button aria-described-by="s0-buttonDescription">Submit</button><!M/>
\ No newline at end of file
+<!--M#s0--><div id=s0-buttonDescription>Submit the form thing</div><button aria-described-by=s0-buttonDescription>Submit</button><!--M/-->
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/component-file-export-class/expected.html b/packages/marko/test/render/fixtures/component-file-export-class/expected.html
index 4860619b9..22d361194 100644
--- a/packages/marko/test/render/fixtures/component-file-export-class/expected.html
+++ b/packages/marko/test/render/fixtures/component-file-export-class/expected.html
@@ -1 +1 @@
-<div><!M#s0-1><div class=hello>Hello Frank!</div><!M/></div>
\ No newline at end of file
+<div><!--M#s0-1--><div class=hello>Hello Frank!</div><!--M/--></div>
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/component-label-for/expected.html b/packages/marko/test/render/fixtures/component-label-for/expected.html
index 6e10fc96a..e5ad8636a 100644
--- a/packages/marko/test/render/fixtures/component-label-for/expected.html
+++ b/packages/marko/test/render/fixtures/component-label-for/expected.html
@@ -1 +1 @@
-<!M#s0><label for="s0-submitButton">Submit</label><button id="s0-submitButton">Submit</button><!M/>
\ No newline at end of file
+<!--M#s0--><label for=s0-submitButton>Submit</label><button id=s0-submitButton>Submit</button><!--M/-->
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/component-safe-json/expected.html b/packages/marko/test/render/fixtures/component-safe-json/expected.html
index 321f383c0..9c0ff1039 100644
--- a/packages/marko/test/render/fixtures/component-safe-json/expected.html
+++ b/packages/marko/test/render/fixtures/component-safe-json/expected.html
@@ -1 +1 @@
-<!M#s0><!DOCTYPE html><html lang=en><body>Hello<script>$MC=(window.$MC||[]).concat({"l":1,"w":[["s0",0,{"foo-0":"bar\u2028","foo-1":"bar\u2029","foo-2":"\u2028bar\u2029","foo-3":"Hello \u003C/script> \u2028bar\u2029"},{"f":1}]],"t":["5hvxGDmQ"]})</script></body></html><!M/>
\ No newline at end of file
+<!--M#s0--><!DOCTYPE html><html lang=en><body>Hello<script>$MC=(window.$MC||[]).concat({"l":1,"w":[["s0",0,{"foo-0":"bar\u2028","foo-1":"bar\u2029","foo-2":"\u2028bar\u2029","foo-3":"Hello \u003C/script> \u2028bar\u2029"},{"f":1}]],"t":["5hvxGDmQ"]})</script></body></html><!--M/-->
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/components-await-beginAsync/expected.html b/packages/marko/test/render/fixtures/components-await-beginAsync/expected.html
index 34156dd70..3bbaff503 100644
--- a/packages/marko/test/render/fixtures/components-await-beginAsync/expected.html
+++ b/packages/marko/test/render/fixtures/components-await-beginAsync/expected.html
@@ -1 +1 @@
-<html><body><!--FLUSH--><div class=inner><div class=inner-inner><!M#s0-7><div>Hello inner-inner</div><!M/></div><!M#s0-8><div>Hello inner</div><!M/></div><!M#s0-9><div>Hello outer</div><!M/><script>$MC=(window.$MC||[]).concat({"l":1,"w":[["s0-8",0,{"name":"inner"},{"f":1}],["s0-7",0,{"name":"inner-inner"},{"f":1}],["s0-9",0,{"name":"outer"},{"f":1}]],"t":["3fH9fWWr"]})</script></body></html>
\ No newline at end of file
+<html><body><!--FLUSH--><div class=inner><div class=inner-inner><!--M#s0-7--><div>Hello inner-inner</div><!--M/--></div><!--M#s0-8--><div>Hello inner</div><!--M/--></div><!--M#s0-9--><div>Hello outer</div><!--M/--><script>$MC=(window.$MC||[]).concat({"l":1,"w":[["s0-8",0,{"name":"inner"},{"f":1}],["s0-7",0,{"name":"inner-inner"},{"f":1}],["s0-9",0,{"name":"outer"},{"f":1}]],"t":["3fH9fWWr"]})</script></body></html>
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/components-await-title/expected.html b/packages/marko/test/render/fixtures/components-await-title/expected.html
index e30554cbc..3d4e1b9ea 100644
--- a/packages/marko/test/render/fixtures/components-await-title/expected.html
+++ b/packages/marko/test/render/fixtures/components-await-title/expected.html
@@ -1 +1 @@
-<html><head><title><!--FLUSH-->Welcome Frank</title></head><body><!M#s0-0-5-5><div>Hello</div><!M/><script>$MC=(window.$MC||[]).concat({"l":1,"w":[["s0-0-5-5",0,{},{"f":1}]],"t":["2tNfdcYI"]})</script></body></html>
\ No newline at end of file
+<html><head><title><!--FLUSH-->Welcome Frank</title></head><body><!--M#s0-0-5-5--><div>Hello</div><!--M/--><script>$MC=(window.$MC||[]).concat({"l":1,"w":[["s0-0-5-5",0,{},{"f":1}]],"t":["2tNfdcYI"]})</script></body></html>
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/components-await/expected.html b/packages/marko/test/render/fixtures/components-await/expected.html
index e6cfb9fec..4e84ff077 100644
--- a/packages/marko/test/render/fixtures/components-await/expected.html
+++ b/packages/marko/test/render/fixtures/components-await/expected.html
@@ -1 +1 @@
-<html><body><!--FLUSH--><div class=inner><!--FLUSH--><div class=inner-inner><!M#s0-8><div>Hello inner-inner</div><!M/></div><!M#s0-9><div>Hello inner</div><!M/></div><!M#s0-10><div>Hello outer</div><!M/><script>$MC=(window.$MC||[]).concat({"l":1,"w":[["s0-8",0,{"name":"inner-inner"},{"f":1}],["s0-9",0,{"name":"inner"},{"f":1}],["s0-10",0,{"name":"outer"},{"f":1}]],"t":["2u6T2uUb"]})</script></body></html>
\ No newline at end of file
+<html><body><!--FLUSH--><div class=inner><!--FLUSH--><div class=inner-inner><!--M#s0-8--><div>Hello inner-inner</div><!--M/--></div><!--M#s0-9--><div>Hello inner</div><!--M/--></div><!--M#s0-10--><div>Hello outer</div><!--M/--><script>$MC=(window.$MC||[]).concat({"l":1,"w":[["s0-8",0,{"name":"inner-inner"},{"f":1}],["s0-9",0,{"name":"inner"},{"f":1}],["s0-10",0,{"name":"outer"},{"f":1}]],"t":["2u6T2uUb"]})</script></body></html>
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/components/expected.html b/packages/marko/test/render/fixtures/components/expected.html
index 07737571b..9f2b773b6 100644
--- a/packages/marko/test/render/fixtures/components/expected.html
+++ b/packages/marko/test/render/fixtures/components/expected.html
@@ -1 +1 @@
-<html><head>Components</head><body><!M#s0-3><div><h1>foo1</h1><div><h1>bar1</h1></div><div><h1>bar2</h1></div><div><h1>foo-split1</h1><div><h1>split-child1</h1></div><div><h1>split-child2</h1></div></div><div><h1>foo-split2</h1><div><h1>split-child1</h1></div><div><h1>split-child2</h1></div></div></div><!M/><!M#s0-4><div><h1>foo2</h1><div><h1>bar1</h1></div><div><h1>bar2</h1></div><div><h1>foo-split1</h1><div><h1>split-child1</h1></div><div><h1>split-child2</h1></div></div><div><h1>foo-split2</h1><div><h1>split-child1</h1></div><div><h1>split-child2</h1></div></div></div><!M/><!M#s0-5><div><h1>split1</h1><!M^s0-5-@split-child1 s0-5 @split-child1><div><h1>split-child1</h1></div><!M/><!M^s0-5-@split-child2 s0-5 @split-child2><div><h1>split-child2</h1></div><!M/></div><!M/><!M#s0-6><div><h1>split2</h1><!M^s0-6-@split-child1 s0-6 @split-child1><div><h1>split-child1</h1></div><!M/><!M^s0-6-@split-child2 s0-6 @split-child2><div><h1>split-child2</h1></div><!M/></div><!M/><script>$MC=(window.$MC||[]).concat({"l":1,"w":[["s0-3",0,{"name":"foo1"},{"f":1}],["s0-4",0,{"name":"foo2"},{"f":1}],["s0-5",1,{"name":"split1"}],["s0-5-@split-child1",2,{"name":"split-child1"}],["s0-5-@split-child2",2,{"name":"split-child2"}],["s0-6",1,{"name":"split2"}],["s0-6-@split-child1",2,{"name":"split-child1"}],["s0-6-@split-child2",2,{"name":"split-child2"}]],"t":["EMljIY5B","30jLCJ__","IdzCtSbr"]})</script></body></html>
\ No newline at end of file
+<html><head>Components</head><body><!--M#s0-3--><div><h1>foo1</h1><div><h1>bar1</h1></div><div><h1>bar2</h1></div><div><h1>foo-split1</h1><div><h1>split-child1</h1></div><div><h1>split-child2</h1></div></div><div><h1>foo-split2</h1><div><h1>split-child1</h1></div><div><h1>split-child2</h1></div></div></div><!--M/--><!--M#s0-4--><div><h1>foo2</h1><div><h1>bar1</h1></div><div><h1>bar2</h1></div><div><h1>foo-split1</h1><div><h1>split-child1</h1></div><div><h1>split-child2</h1></div></div><div><h1>foo-split2</h1><div><h1>split-child1</h1></div><div><h1>split-child2</h1></div></div></div><!--M/--><!--M#s0-5--><div><h1>split1</h1><!--M^s0-5-@split-child1 s0-5 @split-child1--><div><h1>split-child1</h1></div><!--M/--><!--M^s0-5-@split-child2 s0-5 @split-child2--><div><h1>split-child2</h1></div><!--M/--></div><!--M/--><!--M#s0-6--><div><h1>split2</h1><!--M^s0-6-@split-child1 s0-6 @split-child1--><div><h1>split-child1</h1></div><!--M/--><!--M^s0-6-@split-child2 s0-6 @split-child2--><div><h1>split-child2</h1></div><!--M/--></div><!--M/--><script>$MC=(window.$MC||[]).concat({"l":1,"w":[["s0-3",0,{"name":"foo1"},{"f":1}],["s0-4",0,{"name":"foo2"},{"f":1}],["s0-5",1,{"name":"split1"}],["s0-5-@split-child1",2,{"name":"split-child1"}],["s0-5-@split-child2",2,{"name":"split-child2"}],["s0-6",1,{"name":"split2"}],["s0-6-@split-child1",2,{"name":"split-child1"}],["s0-6-@split-child2",2,{"name":"split-child2"}]],"t":["EMljIY5B","30jLCJ__","IdzCtSbr"]})</script></body></html>
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/dynamic-split-component/expected.html b/packages/marko/test/render/fixtures/dynamic-split-component/expected.html
index 0d6f5401a..4f0d4972b 100644
--- a/packages/marko/test/render/fixtures/dynamic-split-component/expected.html
+++ b/packages/marko/test/render/fixtures/dynamic-split-component/expected.html
@@ -1 +1 @@
-<!M#s0-0><div data-marko-key="@test s0-0">Body data</div><!M/><!M#s0-1><div>Body data</div><!M/><!M#s0-2><div data-marko-key="@test s0-2"></div><!M/><!M#s0-3><div></div><!M/>
\ No newline at end of file
+<!--M#s0-0--><div data-marko-key="@test s0-0">Body data</div><!--M/--><!--M#s0-1--><div>Body data</div><!--M/--><!--M#s0-2--><div data-marko-key="@test s0-2"></div><!--M/--><!--M#s0-3--><div></div><!--M/-->
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/dynamic-tag-arguments/expected.html b/packages/marko/test/render/fixtures/dynamic-tag-arguments/expected.html
index b15e3c9e7..5cf81ce4b 100644
--- a/packages/marko/test/render/fixtures/dynamic-tag-arguments/expected.html
+++ b/packages/marko/test/render/fixtures/dynamic-tag-arguments/expected.html
@@ -1 +1 @@
-<!M#s0><!F#0>testPage http://ebay.com<div style="color:green"></div><!F/><!M/>
\ No newline at end of file
+<!--M#s0--><!--F#0-->testPage http://ebay.com<div style=color:green></div><!--F/--><!--M/-->
\ No newline at end of file
diff --git a/packages/marko/test/render/fixtures/global-runtime-id/expected.html b/packages/marko/test/render/fixtures/global-runtime-id/expected.html
index 895936a28..7e37ecba4 100644
--- a/packages/marko/test/render/fixtures/global-runtime-id/expected.html
+++ b/packages/marko/test/render/fixtures/global-runtime-id/expected.html
@@ -1 +1 @@
-<!FOO#s0><div></div><!FOO/>
\ No newline at end of file
+<!--FOO#s0--><div></div><!--FOO/-->
\ No newline at end of file