fix(compiler-dom): avoid stringify option with null value (vuejs#12096)

close vuejs#12093
ishowman · Oct 11, 2024 · f6d9926 · f6d9926
1 parent 7ad289e
commit f6d9926
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 2 deletions.
diff --git a/packages/compiler-dom/__tests__/transforms/__snapshots__/stringifyStatic.spec.ts.snap b/packages/compiler-dom/__tests__/transforms/__snapshots__/stringifyStatic.spec.ts.snap
@@ -32,6  32,23 @@ return function render(_ctx, _cache) {
 }"
 `;
 
 exports[`stringify static html > should bail for <option> elements with null values 1`] = `
 "const { createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
 
 return function render(_ctx, _cache) {
   return (_openBlock(), _createElementBlock("div", null, _cache[0] || (_cache[0] = [
     _createElementVNode("select", null, [
       _createElementVNode("option", { value: null }),
       _createElementVNode("option", { value: "1" }),
       _createElementVNode("option", { value: "1" }),
       _createElementVNode("option", { value: "1" }),
       _createElementVNode("option", { value: "1" }),
       _createElementVNode("option", { value: "1" })
     ], -1 /* HOISTED */)
   ])))
 }"
 `;
 
 exports[`stringify static html > should bail for <option> elements with number values 1`] = `
 "const { createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = Vue
 

diff --git a/packages/compiler-dom/__tests__/transforms/stringifyStatic.spec.ts b/packages/compiler-dom/__tests__/transforms/stringifyStatic.spec.ts
@@ -470,6  470,17 @@ describe('stringify static html', () => {
     expect(code).toMatchSnapshot()
   })
 
   test('should bail for <option> elements with null values', () => {
     const { ast, code } = compileWithStringify(
       `<div><select><option :value="null" />${repeat(
         `<option value="1" />`,
         StringifyThresholds.ELEMENT_WITH_BINDING_COUNT,
       )}</select></div>`,
     )
     expect(ast.cached).toMatchObject([cachedArrayBailedMatcher()])
     expect(code).toMatchSnapshot()
   })
 
   test('eligible content (elements > 20)   non-eligible content', () => {
     const { code } = compileWithStringify(
       `<div>${repeat(

diff --git a/packages/compiler-dom/src/transforms/stringifyStatic.ts b/packages/compiler-dom/src/transforms/stringifyStatic.ts
@@ -261,8  261,7 @@ function analyzeNode(node: StringifiableNode): [number, number] | false {
           isOptionTag &&
           isStaticArgOf(p.arg, 'value') &&
           p.exp &&
-          p.exp.ast &&
-          p.exp.ast.type !== 'StringLiteral'
           !p.exp.isStatic
         ) {
           return bail()
         }