Markbind: Modal content disppearing after reopening

[ang-zeyu]

Tell us about your environment

• MarkBind Version: since https://github.com/MarkBind/markbind/commit/c417d681f3744ad92db6fb21faa0a731d1523eb3

What did you do? Please include the actual source code causing the issue.

What did you expect to happen?

The slot (Rainbow) inside the panel should re-render when reopening as well.

[ang-zeyu]

@wxwxwxwx9 I missed this out while reviewing. Any idea what's causing this? 🤔

[wxwxwxwx9]

@ang-zeyu my bad! I missed out on this as well. This is rather weird. Let me look into this!

[wxwxwxwx9]

After investigating, I discovered that the problem lies with our usage of $slots instead of $scopedSlots.

Using the example that you have provided in the post, it appears that any named slots passed into panel would disappear upon the second expansion of the modal. Here's a screenshot of the testing that I've done.

As you can see for the first expansion, the named slots header and alt exist in both this.$slots and this.$scopedSlots.
However, for the second expansion, the named slots header and alt disappear from this.$slots but still remain in this.$scopedSlots.

So it does seems like we can fix this by using $scopedSlots instead of $slots in Panel.vue, as shown below.

I tried researching around this issue to understand what may cause this problem but I couldn't find a convincing answer. Here are some of what I have looked at:
Slot wrapped in v-if disappears after re-render #11084
template slot content disappears on subsequent visit #2837
Why Vue regular slots also available in this.$scopedSlots?
Scoped slot always present in $scopedSlots even when v-if'd away #8305
Vue API -- $slots

@ang-zeyu It seems to me like the problem stems from Vue's new syntax / new way of doing things (internal implementation) rather than our implementation. What do you think?

[ang-zeyu]

Thanks for the thorough investigation! @wxwxwxwx9

Let's go with $scopedSlots then, per your testing.

Also related (let's make a note / open a new issue) - we'd have to change it back then, and hopefully it dosen't break =P.
https://v3.vuejs.org/guide/migration/slots-unification.html