fix(compiler-ssr): expand v-model option selected inclusion logic
#13963
+245
−12
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
WalkthroughAdds SSR v-model handling for Changes
Sequence Diagram(s)sequenceDiagram
autonumber
participant T as Template (AST)
participant C as SSR Compiler
participant X as ssrVModel Transform
participant G as Codegen
participant H as SSR Helpers
T->>C: parse template -> AST
C->>X: apply v-model transform for <select>/<option>
X->>X: findOptionValue()\n- if value binding -> bound expr (maybeArray = true)\n- else if text directive -> text node (maybeArray = false)\n- else collapse text/interpolations -> TemplateLiteral (maybeArray = false)
X->>G: emit selected logic\n- if maybeArray -> Array.isArray(model) ? _ssrLooseContain(value) : _ssrLooseEqual(value)\n- else -> _ssrLooseEqual(value)
G-->>T: SSR render code referencing helpers (loose contain/equal)
Note right of H: Helpers evaluate at render time to set `selected`
Estimated code review effort🎯 4 (Complex) | ⏱️ ~60 minutes Suggested labels
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Size ReportBundles
Usages
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
packages/compiler-ssr/__tests__/ssrVModel.spec.ts(1 hunks)packages/compiler-ssr/src/transforms/ssrVModel.ts(4 hunks)
🧰 Additional context used
🧬 Code graph analysis (1)
packages/compiler-ssr/src/transforms/ssrVModel.ts (3)
packages/compiler-core/src/ast.ts (9)
createConditionalExpression(758-772)createCallExpression(728-739)ExpressionNode(91-91)TemplateLiteral(449-452)PlainElementNode(140-149)createSimpleExpression(685-698)createTemplateLiteral(801-809)TemplateChildNode(93-102)TextNode(176-179)packages/compiler-ssr/src/runtimeHelpers.ts (3)
SSR_INCLUDE_BOOLEAN_ATTR(15-17)SSR_LOOSE_CONTAIN(19-19)SSR_LOOSE_EQUAL(18-18)packages/compiler-core/src/utils.ts (2)
findProp(299-320)findDir(282-297)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)
- GitHub Check: Redirect rules
- GitHub Check: Header rules
- GitHub Check: Pages changed
- GitHub Check: test / unit-test-windows
@vue/compiler-core
@vue/compiler-dom
@vue/compiler-sfc
@vue/compiler-ssr
@vue/reactivity
@vue/runtime-core
@vue/runtime-dom
@vue/server-renderer
@vue/shared
vue
@vue/compat
commit: |
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
packages/compiler-ssr/__tests__/ssrVModel.spec.ts(1 hunks)packages/compiler-ssr/src/transforms/ssrVModel.ts(4 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- packages/compiler-ssr/tests/ssrVModel.spec.ts
🧰 Additional context used
🧬 Code graph analysis (1)
packages/compiler-ssr/src/transforms/ssrVModel.ts (3)
packages/compiler-core/src/ast.ts (8)
createConditionalExpression(758-772)createCallExpression(728-739)ExpressionNode(91-91)TemplateLiteral(449-452)createSimpleExpression(685-698)createTemplateLiteral(801-809)TemplateChildNode(93-102)TextNode(176-179)packages/compiler-ssr/src/runtimeHelpers.ts (3)
SSR_INCLUDE_BOOLEAN_ATTR(15-17)SSR_LOOSE_CONTAIN(19-19)SSR_LOOSE_EQUAL(18-18)packages/compiler-core/src/utils.ts (2)
findProp(299-320)findDir(282-297)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: Redirect rules
- GitHub Check: Header rules
- GitHub Check: Pages changed
Comment on lines
+66
to
+80
| ? createConditionalExpression( | ||
| createCallExpression(`Array.isArray`, [model]), | ||
| createCallExpression(context.helper(SSR_LOOSE_CONTAIN), [ | ||
| model, | ||
| value.node, | ||
| ]), | ||
| createCallExpression(context.helper(SSR_LOOSE_EQUAL), [ | ||
| model, | ||
| value.node, | ||
| ]), | ||
| ) | ||
| : createCallExpression(context.helper(SSR_LOOSE_EQUAL), [ | ||
| model, | ||
| value.node, | ||
| ]), |
There was a problem hiding this comment.
Restore array-model handling for text-derived option values
When an <select multiple v-model="array"> option relies on collapsed text / interpolation (no explicit value attribute), findOptionValue() sets maybeArray = false, so we never run the Array.isArray branch. As a result the SSR output compares the array model against a string template literal via ssrLooseEqual, which always fails and the selected attribute is omitted. This regresses multi-select parity for the very cases this PR extends. Please mark these derived values as maybeArray (or otherwise keep the array containment path) so multiple-selection continues to work.
🤖 Prompt for AI Agents
In packages/compiler-ssr/src/transforms/ssrVModel.ts around lines 66-80, the
generated code skips the Array.isArray containment branch for option values
derived from collapsed text/interpolation (maybeArray was set false), causing
multi-selects to never mark selected; restore array-model handling by treating
these derived text/interpolation option values as maybeArray (or otherwise
ensure the Array.isArray conditional call path is used) so the generated
expression keeps the Array.isArray ? ssrLooseContain : ssrLooseEqual logic for
those cases; implement by setting maybeArray = true for derived/text-based
option values (or by forcing the conditional expression to include the
Array.isArray branch) so SSR selected attributes are produced correctly for
multiple selects.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
close #13436
Expand cases under which the
selectedattribute is added onto anoptiontag in SSR:optionv-textAn additional side effect of this PR is to fix the current behavior showcased by this playground example, which I believe to be a bug: link
Example
Summary by CodeRabbit
New Features
Bug Fixes
Tests