(fix) adjust snip regex (sveltejs#216)

Account for the script/style being inside a comment Fixes sveltejs#212
Developyn · Apr 23, 2021 · a441372 · a441372
1 parent 61d8114
commit a441372
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 2 deletions.
diff --git a/src/lib/snipTagContent.ts b/src/lib/snipTagContent.ts
@@ -1,8 +1,11 @@
 export const snippedTagContentAttribute = '✂prettier:content✂';
 
 export function snipTagContent(tagName: string, source: string, placeholder = ''): string {
-    const regex = new RegExp(`<${tagName}([^]*?)>([^]*?)<\/${tagName}>`, 'g');
-    return source.replace(regex, (_, attributes, content) => {
+    const regex = new RegExp(`<!--[^]*?-->|<${tagName}([^]*?)>([^]*?)<\/${tagName}>`, 'g');
+    return source.replace(regex, (match, attributes, content) => {
+        if (match.startsWith('<!--')) {
+            return match;
+        }
         const encodedContent = Buffer.from(content).toString('base64');
         return `<${tagName}${attributes} ${snippedTagContentAttribute}="${encodedContent}">${placeholder}</${tagName}>`;
     });

diff --git a/test/printer/samples/style-script-commented-out.html b/test/printer/samples/style-script-commented-out.html
@@ -0,0 +1,15 @@
+<!-- <script>
+    const a = true;
+</script> -->
+<script>
+    const a = true;
+</script>
+
+<!-- <style>
+    a { color: true }
+</style> -->
+<style>
+    a {
+        color: true;
+    }
+</style>