From 98d548a21e2b30c138eb8e2aa8eea7551344f6d8 Mon Sep 17 00:00:00 2001 From: Tito Bouzout Date: Fri, 24 Jan 2025 00:53:18 -0300 Subject: [PATCH 1/3] avoids empty `=""` on ssr and templates --- .../src/dom/element.js | 6 ++-- .../src/ssr/element.js | 30 +++++++++++++------ .../attributeExpressions/output.js | 18 +++++------ .../attributeExpressions/code.js | 2 ++ .../attributeExpressions/output.js | 13 ++++++-- .../attributeExpressions/output.js | 2 +- .../attributeExpressions/code.js | 2 ++ .../attributeExpressions/output.js | 13 ++++++-- .../attributeExpressions/output.js | 4 +-- 9 files changed, 60 insertions(+), 30 deletions(-) diff --git a/packages/babel-plugin-jsx-dom-expressions/src/dom/element.js b/packages/babel-plugin-jsx-dom-expressions/src/dom/element.js index 4528e8b4..67f61be0 100644 --- a/packages/babel-plugin-jsx-dom-expressions/src/dom/element.js +++ b/packages/babel-plugin-jsx-dom-expressions/src/dom/element.js @@ -831,10 +831,8 @@ function transformAttributes(path, results) { } if (!text.length) { - needsSpacing = false; - results.template += `=""`; - // https://github.com/solidjs/solid/issues/2338 - // results.templateWithClosingTags += `=""`; + needsSpacing = true; + results.template += ``; return; } diff --git a/packages/babel-plugin-jsx-dom-expressions/src/ssr/element.js b/packages/babel-plugin-jsx-dom-expressions/src/ssr/element.js index 64bd7a60..bbef730f 100644 --- a/packages/babel-plugin-jsx-dom-expressions/src/ssr/element.js +++ b/packages/babel-plugin-jsx-dom-expressions/src/ssr/element.js @@ -240,10 +240,7 @@ function normalizeAttributes(path) { const prev = quasis.pop(); quasis.push( t.templateElement({ - raw: - (prev ? prev.value.raw : "") + - `${attr.value.value}` + - (isLast ? "" : " ") + raw: (prev ? prev.value.raw : "") + `${attr.value.value}` + (isLast ? "" : " ") }) ); } else { @@ -276,7 +273,9 @@ function transformAttributes(path, results, info) { attributes = normalizeAttributes(path); let children; - attributes.forEach(attribute => { + attributes.forEach((attribute, i) => { + const isLast = attributes.length - 1 === i; + const node = attribute.node; let value = node.value, @@ -296,7 +295,11 @@ function transformAttributes(path, results, info) { t.isJSXExpressionContainer(value) && (reservedNameSpace || ChildProperties.has(key) || - !(t.isStringLiteral(value.expression) || t.isNumericLiteral(value.expression) || t.isBooleanLiteral(value.expression))) + !( + t.isStringLiteral(value.expression) || + t.isNumericLiteral(value.expression) || + t.isBooleanLiteral(value.expression) + )) ) { if ( key === "ref" || @@ -395,7 +398,16 @@ function transformAttributes(path, results, info) { text = text.replace(/; /g, ";").replace(/: /g, ":"); } } - appendToTemplate(results.template, `="${escapeHTML(text, true)}"`); + + appendToTemplate( + results.template, + // `typeof text === "string"``is needed, `attr=10>` becomes `attr>` without it + typeof text === "string" && !text.length + ? isLast + ? `` + : ` ` + : `="${escapeHTML(text, true)}"` + ); } }); if (!hasChildren && children) { @@ -592,8 +604,8 @@ function createElement(path, { topLevel, hydratable }) { childNodes.length === 1 ? childNodes[0] : t.arrayExpression(childNodes) ) : childNodes.length === 1 - ? childNodes[0] - : t.arrayExpression(childNodes) + ? childNodes[0] + : t.arrayExpression(childNodes) : t.identifier("undefined"), t.booleanLiteral(Boolean(topLevel && config.hydratable)) ]) diff --git a/packages/babel-plugin-jsx-dom-expressions/test/__dom_fixtures__/attributeExpressions/output.js b/packages/babel-plugin-jsx-dom-expressions/test/__dom_fixtures__/attributeExpressions/output.js index ea25c8cb..62e5f415 100644 --- a/packages/babel-plugin-jsx-dom-expressions/test/__dom_fixtures__/attributeExpressions/output.js +++ b/packages/babel-plugin-jsx-dom-expressions/test/__dom_fixtures__/attributeExpressions/output.js @@ -22,7 +22,7 @@ var _tmpl$ = /*#__PURE__*/ _$template(`

Write`), _tmpl$9 = /*#__PURE__*/ _$template(`