From 72874653449b8f059a11caab10df700ef3d599bc Mon Sep 17 00:00:00 2001 From: John Hefferman Date: Tue, 3 Dec 2024 09:02:16 -0700 Subject: [PATCH 1/7] fix: correctly render foreign element closing tags --- .../render-correct-closing-tags/error.txt | 0 .../render-correct-closing-tags/expected.html | 24 +++++++++++++++++++ .../render-correct-closing-tags/index.js | 3 +++ .../modules/x/elements/elements.html | 19 +++++++++++++++ .../modules/x/elements/elements.js | 6 +++++ .../src/__tests__/utils/expected-failures.ts | 2 -- .../compile-template/transformers/element.ts | 7 ++++++ 7 files changed, 59 insertions(+), 2 deletions(-) create mode 100644 packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/error.txt create mode 100644 packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/expected.html create mode 100644 packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/index.js create mode 100644 packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.html create mode 100644 packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.js diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/error.txt b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/error.txt new file mode 100644 index 0000000000..e69de29bb2 diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/expected.html new file mode 100644 index 0000000000..62e7bec7a5 --- /dev/null +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/expected.html @@ -0,0 +1,24 @@ + + + \ No newline at end of file diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/index.js b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/index.js new file mode 100644 index 0000000000..99eaa6cf88 --- /dev/null +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/index.js @@ -0,0 +1,3 @@ +export const tagName = 'x-elements'; +export { default } from 'x/elements'; +export * from 'x/elements'; diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.html new file mode 100644 index 0000000000..3c1665d9c6 --- /dev/null +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.html @@ -0,0 +1,19 @@ + diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.js b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.js new file mode 100644 index 0000000000..618a7df159 --- /dev/null +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.js @@ -0,0 +1,6 @@ +import { LightningElement, api } from 'lwc'; + +export default class extends LightningElement { + @api innerHtml = + ''; +} diff --git a/packages/@lwc/ssr-compiler/src/__tests__/utils/expected-failures.ts b/packages/@lwc/ssr-compiler/src/__tests__/utils/expected-failures.ts index 8a090f1ecc..d5c9a9f161 100644 --- a/packages/@lwc/ssr-compiler/src/__tests__/utils/expected-failures.ts +++ b/packages/@lwc/ssr-compiler/src/__tests__/utils/expected-failures.ts @@ -15,7 +15,6 @@ export const expectedFailures = new Set([ 'attribute-component-global-html/index.js', 'attribute-global-html/as-component-prop/undeclared/index.js', 'attribute-global-html/as-component-prop/without-@api/index.js', - 'attribute-namespace/index.js', 'attribute-style/basic/index.js', 'attribute-style/dynamic/index.js', 'dynamic-slots/index.js', @@ -38,7 +37,6 @@ export const expectedFailures = new Set([ 'superclass/render-in-superclass/no-template-in-subclass/index.js', 'superclass/render-in-superclass/unused-default-in-subclass/index.js', 'superclass/render-in-superclass/unused-default-in-superclass/index.js', - 'svgs/index.js', 'wire/errors/throws-when-computed-prop-is-expression/index.js', 'wire/errors/throws-when-computed-prop-is-let-variable/index.js', 'wire/errors/throws-when-computed-prop-is-regexp-literal/index.js', diff --git a/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts b/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts index 7c39a30d1a..5e5e8df1a0 100644 --- a/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts +++ b/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts @@ -246,6 +246,13 @@ export const Element: Transformer = fu childContent = []; } + const isForeignElement = node.namespace !== HTML_NAMESPACE; + const hasChildren = childContent.length > 0; + + if (isForeignElement && !hasChildren) { + return [bYield(b.literal(`<${node.name}`)), ...yieldAttrsAndProps, bYield(b.literal(`/>`))]; + } + return [ bYield(b.literal(`<${node.name}`)), // If we haven't already prefixed the scope token to an existing class, add an explicit class here From 6ea8218cf8ba13627e7890613255506371e9c134 Mon Sep 17 00:00:00 2001 From: John Hefferman Date: Tue, 3 Dec 2024 17:15:01 -0700 Subject: [PATCH 2/7] fix: properly handle scoped class for void and foreign elements --- .../render-correct-closing-tags/expected.html | 24 ----------------- .../modules/x/elements/elements.js | 6 ----- .../error.txt | 0 .../render-correct-tags/expected.html | 26 +++++++++++++++++++ .../index.js | 0 .../modules/x/elements/elements.html | 5 +++- .../modules/x/elements/elements.js | 5 ++++ .../modules/x/elements/elements.scoped.css | 3 +++ .../compile-template/transformers/element.ts | 19 +++++--------- 9 files changed, 44 insertions(+), 44 deletions(-) delete mode 100644 packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/expected.html delete mode 100644 packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.js rename packages/@lwc/engine-server/src/__tests__/fixtures/{render-correct-closing-tags => render-correct-tags}/error.txt (100%) create mode 100644 packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html rename packages/@lwc/engine-server/src/__tests__/fixtures/{render-correct-closing-tags => render-correct-tags}/index.js (100%) rename packages/@lwc/engine-server/src/__tests__/fixtures/{render-correct-closing-tags => render-correct-tags}/modules/x/elements/elements.html (82%) create mode 100644 packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.js create mode 100644 packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.scoped.css diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/expected.html deleted file mode 100644 index 62e7bec7a5..0000000000 --- a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/expected.html +++ /dev/null @@ -1,24 +0,0 @@ - - - \ No newline at end of file diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.js b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.js deleted file mode 100644 index 618a7df159..0000000000 --- a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.js +++ /dev/null @@ -1,6 +0,0 @@ -import { LightningElement, api } from 'lwc'; - -export default class extends LightningElement { - @api innerHtml = - ''; -} diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/error.txt b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/error.txt similarity index 100% rename from packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/error.txt rename to packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/error.txt diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html new file mode 100644 index 0000000000..bc933da888 --- /dev/null +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html @@ -0,0 +1,26 @@ + + + \ No newline at end of file diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/index.js b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/index.js similarity index 100% rename from packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/index.js rename to packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/index.js diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html similarity index 82% rename from packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.html rename to packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html index 3c1665d9c6..db8cc11e8a 100644 --- a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-closing-tags/modules/x/elements/elements.html +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html @@ -15,5 +15,8 @@ - + + + + diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.js b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.js new file mode 100644 index 0000000000..c9952ab5c6 --- /dev/null +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.js @@ -0,0 +1,5 @@ +import { LightningElement, api } from 'lwc'; + +export default class extends LightningElement { + @api foreignNamespaceInnerHtml = ''; +} diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.scoped.css b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.scoped.css new file mode 100644 index 0000000000..dd8d0c84a6 --- /dev/null +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.scoped.css @@ -0,0 +1,3 @@ +:host { + background: blue; +} diff --git a/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts b/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts index 5e5e8df1a0..a6b04ce6a2 100644 --- a/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts +++ b/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts @@ -227,10 +227,6 @@ export const Element: Transformer = fu return result; }); - if (isVoidElement(node.name, HTML_NAMESPACE)) { - return [bYield(b.literal(`<${node.name}`)), ...yieldAttrsAndProps, bYield(b.literal(`>`))]; - } - let childContent: EsStatement[]; // An element can have children or lwc:inner-html, but not both // If it has both, the template compiler will throw an error before reaching here @@ -246,20 +242,17 @@ export const Element: Transformer = fu childContent = []; } - const isForeignElement = node.namespace !== HTML_NAMESPACE; - const hasChildren = childContent.length > 0; - - if (isForeignElement && !hasChildren) { - return [bYield(b.literal(`<${node.name}`)), ...yieldAttrsAndProps, bYield(b.literal(`/>`))]; - } + const isForeignSelfClosingElement = + node.namespace !== HTML_NAMESPACE && childContent.length === 0; + const isSelfClosingElement = + isVoidElement(node.name, HTML_NAMESPACE) || isForeignSelfClosingElement; return [ bYield(b.literal(`<${node.name}`)), // If we haven't already prefixed the scope token to an existing class, add an explicit class here ...(hasClassAttribute ? [] : [bConditionallyYieldScopeTokenClass()]), ...yieldAttrsAndProps, - bYield(b.literal(`>`)), - ...childContent, - bYield(b.literal(``)), + isForeignSelfClosingElement ? bYield(b.literal(`/>`)) : bYield(b.literal(`>`)), + ...(isSelfClosingElement ? [] : [...childContent, bYield(b.literal(``))]), ].filter(Boolean); }; From 66b4a37ebc021f00dd12ce57894c5a1edf8af527 Mon Sep 17 00:00:00 2001 From: John Hefferman Date: Wed, 4 Dec 2024 13:36:25 -0700 Subject: [PATCH 3/7] fix: address review comments --- .../fixtures/render-correct-tags/expected.html | 16 ++++++++++++++++ .../modules/x/elements/elements.html | 9 +++++++++ .../src/compile-template/transformers/element.ts | 2 +- 3 files changed, 26 insertions(+), 1 deletion(-) diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html index bc933da888..475863caae 100644 --- a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html @@ -15,6 +15,22 @@ + + + π + + + ⁢ + + + + r + + + 2 + + + diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html index db8cc11e8a..964304f14f 100644 --- a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html @@ -14,9 +14,18 @@ + + π + ⁢ + + r + 2 + + + diff --git a/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts b/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts index a6b04ce6a2..b41fd77360 100644 --- a/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts +++ b/packages/@lwc/ssr-compiler/src/compile-template/transformers/element.ts @@ -252,7 +252,7 @@ export const Element: Transformer = fu // If we haven't already prefixed the scope token to an existing class, add an explicit class here ...(hasClassAttribute ? [] : [bConditionallyYieldScopeTokenClass()]), ...yieldAttrsAndProps, - isForeignSelfClosingElement ? bYield(b.literal(`/>`)) : bYield(b.literal(`>`)), + bYield(b.literal(isForeignSelfClosingElement ? `/>` : `>`)), ...(isSelfClosingElement ? [] : [...childContent, bYield(b.literal(``))]), ].filter(Boolean); }; From ff5fe946a627ece347fcecdc4991fadf2148b5a2 Mon Sep 17 00:00:00 2001 From: John Hefferman Date: Wed, 4 Dec 2024 17:29:30 -0700 Subject: [PATCH 4/7] fix: remove math example for now --- .../fixtures/render-correct-tags/expected.html | 16 ---------------- .../modules/x/elements/elements.html | 9 --------- 2 files changed, 25 deletions(-) diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html index 475863caae..bc933da888 100644 --- a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html @@ -15,22 +15,6 @@ - - - π - - - ⁢ - - - - r - - - 2 - - - diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html index 964304f14f..db8cc11e8a 100644 --- a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html @@ -14,18 +14,9 @@ - - π - ⁢ - - r - 2 - - - From 35d57975261627d7e49e23b83358b673997eb2bb Mon Sep 17 00:00:00 2001 From: John Hefferman Date: Wed, 4 Dec 2024 17:47:17 -0700 Subject: [PATCH 5/7] fix: ignore UNKNOWN_HTML_TAG_IN_TEMPLATE warning to allow for MathML test --- .../engine-server/src/__tests__/fixtures.spec.ts | 4 +++- .../fixtures/render-correct-tags/expected.html | 16 ++++++++++++++++ .../modules/x/elements/elements.html | 8 ++++++++ 3 files changed, 27 insertions(+), 1 deletion(-) diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures.spec.ts b/packages/@lwc/engine-server/src/__tests__/fixtures.spec.ts index 3c542787c5..4a44096eea 100755 --- a/packages/@lwc/engine-server/src/__tests__/fixtures.spec.ts +++ b/packages/@lwc/engine-server/src/__tests__/fixtures.spec.ts @@ -80,7 +80,9 @@ async function compileFixture({ // IGNORED_SLOT_ATTRIBUTE_IN_CHILD is fine; it is used in some of these tests message.includes('LWC1201') || message.includes('-h-t-m-l') || - code === 'CIRCULAR_DEPENDENCY'; + code === 'CIRCULAR_DEPENDENCY' || + // template-compiler -> index -> validateElement generates UNKNOWN_HTML_TAG_IN_TEMPLATE for MathML elements + message.includes('LWC1123'); if (!shouldIgnoreWarning) { throw new Error(message); } diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html index bc933da888..475863caae 100644 --- a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html @@ -15,6 +15,22 @@ + + + π + + + ⁢ + + + + r + + + 2 + + + diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html index db8cc11e8a..0cba2532a3 100644 --- a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html @@ -14,6 +14,14 @@ + + π + ⁢ + + r + 2 + + From 8d6d2e4704944bf46a9ec9cf942f9f9be950c2a9 Mon Sep 17 00:00:00 2001 From: John Hefferman Date: Thu, 5 Dec 2024 16:10:10 -0700 Subject: [PATCH 6/7] fix: update tag warning suppression to reference issue --- packages/@lwc/engine-server/src/__tests__/fixtures.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures.spec.ts b/packages/@lwc/engine-server/src/__tests__/fixtures.spec.ts index 4a44096eea..0889ac7a4a 100755 --- a/packages/@lwc/engine-server/src/__tests__/fixtures.spec.ts +++ b/packages/@lwc/engine-server/src/__tests__/fixtures.spec.ts @@ -81,7 +81,7 @@ async function compileFixture({ message.includes('LWC1201') || message.includes('-h-t-m-l') || code === 'CIRCULAR_DEPENDENCY' || - // template-compiler -> index -> validateElement generates UNKNOWN_HTML_TAG_IN_TEMPLATE for MathML elements + // TODO [#5010]: template-compiler -> index -> validateElement generates UNKNOWN_HTML_TAG_IN_TEMPLATE for MathML elements message.includes('LWC1123'); if (!shouldIgnoreWarning) { throw new Error(message); From 5c6bfe635f7ab17ee87c0b99e6c113cbc7f48a55 Mon Sep 17 00:00:00 2001 From: John Hefferman Date: Fri, 6 Dec 2024 09:56:17 -0700 Subject: [PATCH 7/7] fix: simpler MathML example --- .../render-correct-tags/expected.html | 21 ++++++++----------- .../modules/x/elements/elements.html | 14 ++++++------- 2 files changed, 16 insertions(+), 19 deletions(-) diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html index 475863caae..862326ccfa 100644 --- a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/expected.html @@ -16,20 +16,17 @@ - - π - - - ⁢ - - + - r + a - - 2 - - + + + + + + b + + diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html index 0cba2532a3..00c96652f4 100644 --- a/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html +++ b/packages/@lwc/engine-server/src/__tests__/fixtures/render-correct-tags/modules/x/elements/elements.html @@ -15,16 +15,16 @@ - π - ⁢ - - r - 2 - + + + a + + + b + - + \ No newline at end of file