Support printing inline handlebars in html (through embed function) (#…

…7306) * Move old handlebars to html file This kind of handlebars code is supposed to be in html files. * Remove useless file * Uglify our old handlebars file * Move venerable hbs tests to their folder Because of their config * html: Use glimmer for script tags of type handlebars * Record snapshots * Add CHANGELOG entry * Add the CHANGELOG test * Make the PR changes more obvious
prettier · Jan 21, 2020 · 97a8786 · 97a8786
1 parent 4ba0fc7
commit 97a8786
Show file tree

Hide file tree

Showing 7 changed files with 121 additions and 77 deletions.
diff --git a/changelog_unreleased/handlebars/pr-7306.md b/changelog_unreleased/handlebars/pr-7306.md
@@ -0,0 +1,24 @@
+#### Support printing inline handlebars in html (through embed function) ([#7306](https://github.com/prettier/prettier/pull/7306) by [@dcyriller](https://github.com/dcyriller))
+
+<!-- prettier-ignore -->
+```
+<!-- Input -->
+<script type="text/x-handlebars-template">
+  {{component arg1='hey' arg2=(helper this.arg7 this.arg4) arg3=anotherone arg6=this.arg8}}
+</script>
+
+<!-- Output (Prettier stable) -->
+<script type="text/x-handlebars-template">
+  {{component arg1='hey' arg2=(helper this.arg7 this.arg4) arg3=anotherone arg6=this.arg8}}
+</script>
+
+<!-- Output (Prettier master) -->
+<script type="text/x-handlebars-template">
+  {{component
+    arg1='hey'
+    arg2=(helper this.arg7 this.arg4)
+    arg3=anotherone
+    arg6=this.arg8
+  }}
+</script>
+```
diff --git a/src/language-html/utils.js b/src/language-html/utils.js
@@ -390,6 +390,10 @@ function inferScriptParser(node) {
     ) {
       return "json";
     }
+
+    if (node.attrMap.type === "text/x-handlebars-template") {
+      return "glimmer";
+    }
   }
 
   if (node.name === "style") {

diff --git a/tests/handlebars-basics/__snapshots__/jsfmt.spec.js.snap b/tests/handlebars-basics/__snapshots__/jsfmt.spec.js.snap
@@ -1,72 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`basic-handlebars.hbs 1`] = `
-====================================options=====================================
-parsers: ["glimmer"]
-printWidth: 80
-                                                                                | printWidth
-=====================================input======================================
-<script id="entry-template" type="text/x-handlebars-template">
-  <div class="entry">
-    <h1>{{title}}</h1>
-    <div class="body">
-      {{body}}
-    </div>
-  </div>
-</script>
-
-<div class="{{hello}} {{world}}"></div>
-
-=====================================output=====================================
-<script id="entry-template" type="text/x-handlebars-template">
-  <div class="entry">
-    <h1>
-      {{title}}
-    </h1>
-    <div class="body">
-      {{body}}
-    </div>
-  </div>
-</script>
-
-<div class="{{hello}} {{world}}"></div>
-================================================================================
-`;
-
-exports[`basic-handlebars.hbs 2`] = `
-====================================options=====================================
-parsers: ["glimmer"]
-printWidth: 80
-singleQuote: true
-                                                                                | printWidth
-=====================================input======================================
-<script id="entry-template" type="text/x-handlebars-template">
-  <div class="entry">
-    <h1>{{title}}</h1>
-    <div class="body">
-      {{body}}
-    </div>
-  </div>
-</script>
-
-<div class="{{hello}} {{world}}"></div>
-
-=====================================output=====================================
-<script id='entry-template' type='text/x-handlebars-template'>
-  <div class='entry'>
-    <h1>
-      {{title}}
-    </h1>
-    <div class='body'>
-      {{body}}
-    </div>
-  </div>
-</script>
-
-<div class="{{hello}} {{world}}"></div>
-================================================================================
-`;
-
 exports[`component.hbs 1`] = `
 ====================================options=====================================
 parsers: ["glimmer"]

diff --git a/tests/handlebars-basics/basic-handlebars.hbs b/tests/handlebars-basics/basic-handlebars.hbs
diff --git a/tests/handlebars-venerable/__snapshots__/jsfmt.spec.js.snap b/tests/handlebars-venerable/__snapshots__/jsfmt.spec.js.snap
@@ -0,0 +1,82 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`template.html 1`] = `
+====================================options=====================================
+parsers: ["html"]
+printWidth: 80
+                                                                                | printWidth
+=====================================input======================================
+<script id="entry-template" type="text/x-handlebars-template">
+<div class="entry">
+<h1>{{title}}</h1>
+<div class="body">{{body}}</div></div>
+</script>
+
+<script type="text/x-handlebars-template">
+  {{component arg1='hey' arg2=(helper this.arg7 this.arg4) arg3=anotherone arg6=this.arg8}}
+</script>
+
+=====================================output=====================================
+<script id="entry-template" type="text/x-handlebars-template">
+  <div class="entry">
+    <h1>
+      {{title}}
+    </h1>
+    <div class="body">
+      {{body}}
+    </div>
+  </div>
+</script>
+
+<script type="text/x-handlebars-template">
+  {{component
+    arg1="hey"
+    arg2=(helper this.arg7 this.arg4)
+    arg3=anotherone
+    arg6=this.arg8
+  }}
+</script>
+
+================================================================================
+`;
+
+exports[`template.html 2`] = `
+====================================options=====================================
+parsers: ["html"]
+printWidth: 80
+singleQuote: true
+                                                                                | printWidth
+=====================================input======================================
+<script id="entry-template" type="text/x-handlebars-template">
+<div class="entry">
+<h1>{{title}}</h1>
+<div class="body">{{body}}</div></div>
+</script>
+
+<script type="text/x-handlebars-template">
+  {{component arg1='hey' arg2=(helper this.arg7 this.arg4) arg3=anotherone arg6=this.arg8}}
+</script>
+
+=====================================output=====================================
+<script id="entry-template" type="text/x-handlebars-template">
+  <div class='entry'>
+    <h1>
+      {{title}}
+    </h1>
+    <div class='body'>
+      {{body}}
+    </div>
+  </div>
+</script>
+
+<script type="text/x-handlebars-template">
+  {{component
+    arg1='hey'
+    arg2=(helper this.arg7 this.arg4)
+    arg3=anotherone
+    arg6=this.arg8
+  }}
+</script>
+
+================================================================================
+`;
diff --git a/tests/handlebars-venerable/jsfmt.spec.js b/tests/handlebars-venerable/jsfmt.spec.js
@@ -0,0 +1,2 @@
+run_spec(__dirname, ["html"]);
+run_spec(__dirname, ["html"], { singleQuote: true });
diff --git a/tests/handlebars-venerable/template.html b/tests/handlebars-venerable/template.html
@@ -0,0 +1,9 @@
+<script id="entry-template" type="text/x-handlebars-template">
+<div class="entry">
+<h1>{{title}}</h1>
+<div class="body">{{body}}</div></div>
+</script>
+
+<script type="text/x-handlebars-template">
+  {{component arg1='hey' arg2=(helper this.arg7 this.arg4) arg3=anotherone arg6=this.arg8}}
+</script>