From f55fe84d809d536a6dae5b148572d8a209341a24 Mon Sep 17 00:00:00 2001
From: fisker <lionkay@gmail.com>
Date: Tue, 31 Mar 2020 18:43:28 +0800
Subject: [PATCH] Fix script inside HTML tag with colon

---
 src/language-html/utils.js                    |  4 +-
 .../__snapshots__/jsfmt.spec.js.snap          | 60 ++++++++++++++++++-
 tests/html_basics/with-colon.html             | 15 +++++
 3 files changed, 77 insertions(+), 2 deletions(-)

diff --git a/src/language-html/utils.js b/src/language-html/utils.js
index 978c69785b45..94dd4434e8ba 100644
--- a/src/language-html/utils.js
+++ b/src/language-html/utils.js
@@ -135,7 +135,9 @@ function isScriptLikeTag(node) {
     node.type === "element" &&
     (node.fullName === "script" ||
       node.fullName === "style" ||
-      node.fullName === "svg:style")
+      node.fullName === "svg:style" ||
+      (isUnknownNamespace(node) &&
+        (node.name === "script" || node.fullName === "style")))
   );
 }
 
diff --git a/tests/html_basics/__snapshots__/jsfmt.spec.js.snap b/tests/html_basics/__snapshots__/jsfmt.spec.js.snap
index 83fd2e1cbb1b..deecf6caef0a 100644
--- a/tests/html_basics/__snapshots__/jsfmt.spec.js.snap
+++ b/tests/html_basics/__snapshots__/jsfmt.spec.js.snap
@@ -623,6 +623,21 @@ e-wrap </html:textarea>
   </script>
   </with:colon>
 
+<!-- script like -->
+<with:colon>
+<style>.a{color:#f00}</style>
+  <SCRIPT>
+  const func = function() { console.log('Hello, there');}
+  </SCRIPT>
+<STYLE>.A{COLOR:#F00}</STYLE>
+<html:script>const func = function() { console.log('Hello, there');}</html:script>
+<html:style>.a{color:#f00}</html:style>
+<svg><style>.a{color:#f00}</style></svg>
+<svg><style>.a{color:#f00}</style></svg>
+</with:colon>
+<html:script>const func = function() { console.log('Hello, there');}</html:script>
+<html:style>.a{color:#f00}</html:style>
+
 =====================================output=====================================
 <!-- unknown tag with colon -->
 <div>
@@ -832,9 +847,52 @@ e-wrap </textarea
     </h1>
   </div>
   <script>
-    const func = function() { console.log('Hello, there');}
+    const func = function () {
+      console.log("Hello, there");
+    };
   </script>
 </with:colon>
 
+<!-- script like -->
+<with:colon>
+  <style>
+    .a{color:#f00}
+  </style>
+  <script>
+    const func = function () {
+      console.log("Hello, there");
+    };
+  </script>
+  <style>
+    .A{COLOR:#F00}
+  </style>
+  <html:script
+    >const func = function() { console.log('Hello, there');}</html:script
+  >
+  <html:style
+    >.a{color:#f00}</html:style
+  >
+  <svg>
+    <style>
+      .a {
+        color: #f00;
+      }
+    </style>
+  </svg>
+  <svg>
+    <style>
+      .a {
+        color: #f00;
+      }
+    </style>
+  </svg>
+</with:colon>
+<html:script
+  >const func = function() { console.log('Hello, there');}</html:script
+>
+<html:style
+  >.a{color:#f00}</html:style
+>
+
 ================================================================================
 `;
diff --git a/tests/html_basics/with-colon.html b/tests/html_basics/with-colon.html
index aad6b41583cb..29ca0989dc95 100644
--- a/tests/html_basics/with-colon.html
+++ b/tests/html_basics/with-colon.html
@@ -110,3 +110,18 @@
   const func = function() { console.log('Hello, there');}
   </script>
   </with:colon>
+
+<!-- script like -->
+<with:colon>
+<style>.a{color:#f00}</style>
+  <SCRIPT>
+  const func = function() { console.log('Hello, there');}
+  </SCRIPT>
+<STYLE>.A{COLOR:#F00}</STYLE>
+<html:script>const func = function() { console.log('Hello, there');}</html:script>
+<html:style>.a{color:#f00}</html:style>
+<svg><style>.a{color:#f00}</style></svg>
+<svg><style>.a{color:#f00}</style></svg>
+</with:colon>
+<html:script>const func = function() { console.log('Hello, there');}</html:script>
+<html:style>.a{color:#f00}</html:style>