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

[2.6.13] Node after v-if node inside named slot is not shown anymore #12102

Closed
caugner opened this issue Jun 2, 2021 · 5 comments · Fixed by #12104
Closed

[2.6.13] Node after v-if node inside named slot is not shown anymore #12102

caugner opened this issue Jun 2, 2021 · 5 comments · Fixed by #12104

Comments

@caugner
Copy link

caugner commented Jun 2, 2021

Version

2.6.13

Reproduction link

https://codesandbox.io/s/recursing-dream-0zdf5?file=/src/App.vue

Steps to reproduce

<template>
  <ComponentWithSlot>
    <template #slot-name>
      <span v-if="false">...</span>
      <span>This is shown in 2.6.12, but not in 2.6.13.</span>
    </template>
  </ComponentWithSlot>
</template>

What is expected?

The text after the v-if node should be shown.

What is actually happening?

It was shown in 2.6.12, but isn't shown in 2.6.13 anymore.

@caugner caugner changed the title [2.6.13] Node after v-if node is not shown anymore [2.6.13] Node after v-if node inside named slot is not shown anymore Jun 2, 2021
@ikselll

This comment has been minimized.

@caugner
Copy link
Author

caugner commented Jun 2, 2021

A workaround is to wrap all nodes (inside the slot template) in one node (like a <div> or a <span>), but the Slots documentation doesn't mention this limitation.

@gilles-crealp
Copy link

gilles-crealp commented Jun 2, 2021

Another workaround is to put an empty node first.

<template>
  <ComponentWithSlot>
    <template #slot-name>
      <div /> <!-- HERE -->
      <span v-if="false">...</span>
      <span>This is shown in 2.6.12, but not in 2.6.13.</span>
    </template>
  </ComponentWithSlot>
</template>

@JaviIG
Copy link

JaviIG commented Jun 2, 2021

The issue seems to be with the normalizeScopedSlot function, which is only taking into account the first vnode of the scoped slot for checking it is a comment but not a placeholder.

Something like this does the trick, but I'm not familiar with this part of the source code.

    return res && (
      res.every(vNode => vNode.isComment && !isAsyncPlaceholder(vNode)) // #9658, #10391
    ) ? undefined
      :  res

@caugner
Copy link
Author

caugner commented Jun 2, 2021

The issue seems to be with the normalizeScopedSlot function

Good catch, this would suggest the regression is caused by #11963.

/cc @pi0

edit: My guess would be that this is the solution:

     return res && (
       !vnode ||
-      (vnode.isComment && !isAsyncPlaceholder(vnode)) // #9658, #10391
+      (res.length === 1 && vnode.isComment && !isAsyncPlaceholder(vnode)) // #9658, #10391
     ) ? undefined
      : res

manuelleduc added a commit to xwiki/xwiki-platform that referenced this issue Jun 2, 2021
manuelleduc added a commit to xwiki/xwiki-platform that referenced this issue Jun 3, 2021
plankter added a commit to BodenmillerGroup/histocat-web that referenced this issue Jun 7, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
5 participants