fix(ssr): fix rendering of spellcheck attribute (#4868)

salesforce · Nov 14, 2024 · 7d7dea4 · 7d7dea4
1 parent 574ffbd
commit 7d7dea4
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/packages/@lwc/ssr-compiler/src/__tests__/utils/expected-failures.ts b/packages/@lwc/ssr-compiler/src/__tests__/utils/expected-failures.ts
@@ -32,7 +32,6 @@ export const expectedFailures = new Set([
     'dynamic-components/index.js',
     'dynamic-slots/index.js',
     'empty-text-with-comments-non-static-optimized/index.js',
-    'global-html-attributes/index.js',
     'if-conditional-slot-content/index.js',
     'rehydration/index.js',
     'render-dynamic-value/index.js',

diff --git a/packages/@lwc/ssr-compiler/src/compile-template/transformers/component.ts b/packages/@lwc/ssr-compiler/src/compile-template/transformers/component.ts
@@ -101,14 +101,18 @@ function getChildAttrsOrProps(
         .map(({ name, value, type }) => {
             const key = isValidIdentifier(name) ? b.identifier(name) : b.literal(name);
             if (value.type === 'Literal' && typeof value.value === 'string') {
-                let literalValue = value.value;
+                let literalValue: string | boolean = value.value;
                 if (name === 'style') {
                     literalValue = normalizeStyleAttributeValue(literalValue);
                 } else if (name === 'class') {
                     literalValue = normalizeClassAttributeValue(literalValue);
                     if (literalValue === '') {
                         return; // do not render empty `class=""`
                     }
+                } else if (name === 'spellcheck') {
+                    // `spellcheck` string values are specially handled to massage them into booleans:
+                    // https://github.com/salesforce/lwc/blob/574ffbd/packages/%40lwc/template-compiler/src/codegen/index.ts#L445-L448
+                    literalValue = literalValue.toLowerCase() !== 'false';
                 }
                 return b.property('init', key, b.literal(literalValue));
             } else if (value.type === 'Literal' && typeof value.value === 'boolean') {