Subscribe on changes!

defineAsyncComponent custom element emit not firing

avatar
Dec 7th 2022

Vue version

3.2.45

Link to minimal reproduction

https://github.com/funkso2010/vue3-cus-el-emit

Steps to reproduce

Pull project locally. npm install (this installs the latest vue version) npm run preview

What is expected?

dist/index.html for both buttons to trigger console.log()

What is actually happening?

A button that uses defineAsyncComponent is not firing console.log()

System Info

System:
    OS: macOS 12.6
    CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 1.05 GB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 14.20.0 - /usr/local/bin/node
    Yarn: 1.22.17 - ~/.npm-global/bin/yarn
    npm: 6.14.17 - /usr/local/bin/npm
  Browsers:
    Chrome: 108.0.5359.94
    Safari: 16.1

Any additional comments?

This is intended for breaking large library into small files, instead of loading one giant file.

avatar
Dec 8th 2022

I think this is a bug. In the process of rendering the content of the custom element wrapped by defineAsyncComponent, if it is bound to an attribute, such as id, then its vnode will be used by the cloneVNode method Cloning, but the cloning of the ce attribute was omitted during cloning, resulting in being parsed into a normal component, and finally the event could not be triggered。 wdyt?@sxzz

avatar
Dec 8th 2022

Hello @baiwusanyu-c @LinusBorg ,

Thanks for being so prompt on solving the issue. Hopefully PR will be merged in the next release :).

Regards, Taras

avatar
Dec 20th 2022

Hello @baiwusanyu-c , I hope you are well.

Is that an issue that the e2e test failed per your change?

Thanks, Taras