diff --git a/packages/runtime-core/src/renderer.ts b/packages/runtime-core/src/renderer.ts index e289fbcb9ff..4703236b832 100644 --- a/packages/runtime-core/src/renderer.ts +++ b/packages/runtime-core/src/renderer.ts @@ -712,6 +712,16 @@ function baseCreateRenderer( optimized || !!vnode.dynamicChildren ) } + + /** + * When select is mounted with props.value, + * select won't be able to set any value because + * the options are not rendered yet. + */ + if (props && props.value && el.value !== props.value) { + hostPatchProp(el, 'value', null, props.value, isSVG) + } + if (transition && !transition.persisted) { transition.beforeEnter(el) } diff --git a/packages/runtime-dom/__tests__/render.spec.ts b/packages/runtime-dom/__tests__/render.spec.ts new file mode 100644 index 00000000000..05abfa0abb3 --- /dev/null +++ b/packages/runtime-dom/__tests__/render.spec.ts @@ -0,0 +1,25 @@ +import { render, h } from '../src' + +describe('runtime-dom: render', () => { + // #1318 + test('set value of select', () => { + const root = document.createElement('div') + /** + + */ + render( + h('select', { value: 'B' }, [ + h('option', { value: 'A' }), + h('option', { value: 'B' }), + h('option', { value: 'C' }) + ]), + root + ) + + expect((root.firstChild! as any).value).toBe('B') + }) +})