$attrs are not triggering render update when inside slots

[AlexandreBonaventure]

Version

3.0.0-beta.14

Reproduction link

https://jsfiddle.net/Lvo5aks1/

Steps to reproduce

Rendering $attrs inside a wrapper component (with default slot).
It does not seem to be collected as a reactive dependency.

What is expected?

$attrs should be reactive like any other reactive object
see here https://jsfiddle.net/tpewsd71/

What is actually happening?

It does not update/trigger a re-render of the slot

Comment

Maybe this is expected, because I think in Vue3 $attrs is not actually a reactive object but just a proxy, thus this is why it is not triggering update. However, coming from Vue 2 where this was a reactive object, it is confusing that it is not anymore and is probably going to break some components.
I wonder then if there is an official recommendation when dealing with this kind of use-case.

[underfin]

I debuged for this.The slot not updated because patch wrapper-component is skiped.The shouldUpdateComponent returned false.

Maybe we should marked patch flag DYNAMIC_SLOTS for wrapper-component vnode when compiled the slot which has dynamic content.

<wrapper-component>
          <p>
            attrs inside slot: {{ $attrs }}
          </p>
        </wrapper-component>

 return (_openBlock(), _createBlock(_component_wrapper_component, null, {
    default: _withCtx(($attrs) => [
      _createVNode("p", null, " attrs inside slot: " + _toDisplayString($attrs), 1 /* TEXT */)
    ]),
    _: 1
  }))

[AlexandreBonaventure]

As a workaround one can force the update of the wrapper component by updating an attribute:

<wrapper-component :trigger="() => Symbol('')">
     <p>
            attrs inside slot: {{ $attrs }}
     </p>
</wrapper-component>

https://jsfiddle.net/7exn32Lo/