Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(runtime-core): patchChildren first in patchElement #4313

Merged
merged 1 commit into from
Aug 16, 2021

Conversation

leaon4
Copy link
Contributor

@leaon4 leaon4 commented Aug 11, 2021

In mountElement of "renderer.ts", mountChildren will run before mountProps
https://github.com/vuejs/vue-next/blob/7ffa225aa334f0fd7da6ba30bee9109de3597643/packages/runtime-core/src/renderer.ts#L652-L657

But in patchElement, patchProps will run before patchChildren.
I think it is wrong.

for example:

test('patch innerHTML', () => {
  const root = document.createElement('div')
  render(
    h('div', { innerHTML: 'foo' }, 'hello'),
    root
  )
  const el = root.children[0]
  expect(el.innerHTML).toBe('foo') // props has higher priority

  render(
    h('div', { innerHTML: 'bar' }, 'world'),
    root
  )
  expect(el.innerHTML).toBe('bar') // error, received 'world', children has higher priority
})

another:

test('patch value for select', () => {
  const root = document.createElement('div')
  render(
    h('select', { value: 'foo' }, [
      h('option', { value: 'foo' }, 'foo'),
      h('option', { value: 'bar' }, 'bar')
    ]),
    root
  )
  const el = root.children[0] as HTMLSelectElement
  expect(el.value).toBe('foo') // correct, received "foo", because mountChildren first
  
  // bar to baz
  render(
    h('select', { value: 'baz' }, [
      h('option', { value: 'foo' }, 'foo'),
      h('option', { value: 'baz' }, 'baz')
    ]),
    root
  )
  expect(el.value).toBe('baz') // error, received "", because patchProps first
})

@yyx990803 yyx990803 merged commit 5b3f1e8 into vuejs:master Aug 16, 2021
@yyx990803
Copy link
Member

Good catch and thanks for the test cases!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants