chakra-ui-vue icon indicating copy to clipboard operation
chakra-ui-vue copied to clipboard

BUG: Collapse not emitting `finish` event after completing animation.

Open philwolstenholme opened this issue 4 years ago • 1 comments

Describe the bug I'm not sure if I'm doing something wrong or if there's a bug here, but with this code:

<c-button mb="4" variant-color="blue" @click="show = !show">
        Show {{ show ? "Less" : "More" }} (expanding should open the toast)
      </c-button>
      <c-collapse :starting-height="20" :is-open="show" @finish="showToast">
        Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus
        terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer
        labore wes anderson cred nesciunt sapiente ea proident.
      </c-collapse>

showToast does not seem to be firing when the collapse is expanded/contracted.

To Reproduce Steps to reproduce the behavior:

  1. Visit https://codesandbox.io/s/zealous-wilbur-qvwny?file=/src/App.vue
  2. Check code
  3. Expand/contract the collapse
  4. Note that the showToast method does not seem to fire

Expected behavior I am trying to call a method once the Collapse has expanded

Screenshots

Please see https://codesandbox.io/s/zealous-wilbur-qvwny?file=/src/App.vue

philwolstenholme avatar Mar 24 '21 18:03 philwolstenholme

Thanks for capturing this issue @philwolstenholme I also appreciate the reproduction.

I just realized that we didn't write a test for the emission of the @finish event. So it must have broken when we refactored to using functional components in v0.

for now I'm focusing efforts on cranking out v1. I'll be able to find time to go through this issue at the end of the week or so. But if you are able to debug it and come up with a fix, I'll be happy to review it and release a patch version for you 🙏🏽

codebender828 avatar Mar 24 '21 19:03 codebender828