[handlebars] Named blocks can't be self closing

prettier · Dec 1, 2021 · 65751bf · 65751bf
1 parent d095459
commit 65751bf
Show file tree

Hide file tree

Showing 4 changed files with 58 additions and 0 deletions.
diff --git a/changelog_unreleased/handlebars/11899.md b/changelog_unreleased/handlebars/11899.md
@@ -0,0 +1,23 @@
+#### Support Glimmer's named blocks (#11899 by @duailibe)
+
+Prettier already supported this feature, but it converted empty named blocks to self-closing, which is not supported by the Glimmer compiler.
+
+See: [Glimmer's named blocks](https://emberjs.github.io/rfcs/0460-yieldable-named-blocks.html).
+
+<!-- prettier-ignore -->
+```jsx
+// Input
+<Component>
+  <:named></:named>
+</Component>
+
+// Prettier stable
+<Component>
+  <:named />
+</Component>
+
+// Prettier main
+<Component>
+  <:named></:named>
+</Component>
+```
diff --git a/src/language-handlebars/utils.js b/src/language-handlebars/utils.js
@@ -36,10 +36,15 @@ function isGlimmerComponent(node) {
   );
 }
 
+function isNamedBlock(node) {
+  return node.tag[0] === ":";
+}
+
 const voidTags = new Set(htmlVoidElements);
 function isVoid(node) {
   return (
     (isGlimmerComponent(node) &&
+      !isNamedBlock(node) &&
       node.children.every((node) => isWhitespaceNode(node))) ||
     voidTags.has(node.tag)
   );

diff --git a/tests/format/handlebars/basics/__snapshots__/jsfmt.spec.js.snap b/tests/format/handlebars/basics/__snapshots__/jsfmt.spec.js.snap
@@ -93,6 +93,30 @@ printWidth: 80
 ================================================================================
 `;
 
+exports[`named-block.hbs format 1`] = `
+====================================options=====================================
+parsers: ["glimmer"]
+printWidth: 80
+                                                                                | printWidth
+=====================================input======================================
+<ComponentWithNamedBlocks>
+  <:first-named-block></:first-named-block>
+  <:second-named-block> </:second-named-block>
+  <:named-block-with-comment>{{! Do not convert to an empty element}}</:named-block-with-comment>
+  <:named-block-with-content>Hello</:named-block-with-content>
+</ComponentWithNamedBlocks>
+
+=====================================output=====================================
+<ComponentWithNamedBlocks>
+  <:first-named-block></:first-named-block>
+  <:second-named-block> </:second-named-block>
+  <:named-block-with-comment
+  >{{! Do not convert to an empty element}}</:named-block-with-comment>
+  <:named-block-with-content>Hello</:named-block-with-content>
+</ComponentWithNamedBlocks>
+================================================================================
+`;
+
 exports[`nested-path.hbs format 1`] = `
 ====================================options=====================================
 parsers: ["glimmer"]

diff --git a/tests/format/handlebars/basics/named-block.hbs b/tests/format/handlebars/basics/named-block.hbs
@@ -0,0 +1,6 @@
+<ComponentWithNamedBlocks>
+  <:first-named-block></:first-named-block>
+  <:second-named-block> </:second-named-block>
+  <:named-block-with-comment>{{! Do not convert to an empty element}}</:named-block-with-comment>
+  <:named-block-with-content>Hello</:named-block-with-content>
+</ComponentWithNamedBlocks>