vnode.component is null, inside a custom directive's hooks, when it is used onto a Vue component

[jfet97]

Version

3.0.0-rc.4

Reproduction links

codesandbox
codepen

P.S. you should use the browser console

Steps to reproduce

1. Create a custom directive
2. Use it onto a Vue component, logging the arguments of the directive's hooks
3. Expand the vnodes inside the browser console, .component will be null

What is expected?

Is vnode.component the v3 corresponding of v2 vnode.componentInstance, isn't it?
If a custom directive is used onto a Vue component, the vnode.component shouldn't be a reference to it?

What is actually happening?

It is null 😕

---

Maybe is related to the fact that v3 allows more than one root node, but as you can see the problem persists when there is only one root node as well.

For the sake of completeness, here it is a codepen where v2 is used and vnode.componentInstance is what it is expected.
I don't know why, but you have to keep the codepen console open to properly see the logged vnodes inside the browser console.

[Picknight]

Anyway I've tried to add a prop: nothing changes.

I tried it and it work fine.

[jfet97]

@Picknight could you provide a codesandbox like I did? You can fork mine as well.

Because mine contradics what you are saying, but perhaps you are using a different version of Vue 3 or you are doing something different.

Thanks 🙂

[briosheje]

I can confirm that component seems to be null on chrome 84.0.4147.89 and also has the same behavior in firefox.
Perhaps should this be marked as a possible regression issue?

[Picknight]

Sorry, I misunderstood your question. My fault. Let me see what I can do to help you. @jfet97

[yyx990803]

This is expected behavior.

Directives are meant for DOM manipulations. When they are used on a component, they fallthrough like attributes (e.g. class and style) to the root of the component's sub tree. In this case, the vnode you are getting is the vnode representing the child component's root element, not the vnode representing the component itself.