zendeskgarden/react-components

findDOMNode error when using the DrawerModal

armandabric opened this issue · 6 comments

armandabric commented

Expectations

When I'm using the DrawerModal, I'm expecting to have no error 😆 and a production build that works.

Reality

When I open the drawer in development I get this error in the console (and the drawer works):

image

In production build I get the same error, but the application is crashing (no drawer open).

Steps to Reproduce

Just use the component: https://codesandbox.io/s/zendesk-garden-drawer-modal-finddomnode-bug-rmvkw

Fine Print

  • Component: Modal
  • Version: 8.33.0
  • Browsers: all
austingreendev commented

Interesting. I believe this is coming from our dependency on react-transition-group. I wasn't aware that they were using findDOMNode internally by default.

@hzhu did you look into using the nodeRef API for CSSTransition? It looks like it was added in response to this issue https://github.com/reactjs/react-transition-group/releases/tag/v4.4.0

hzhu commented

Oh, had no idea react-transition-group used findDOMNode internally.

@armandabric @austingreendev

austingreendev commented

Let's sync up on this. We will need to handle this across all react-transition-group usages. I'm also not sure handing modalRef will work as expected since the ref can be reassigned before the animation is complete.

austingreendev commented

@armandabric we will be releasing this fix during todays release. Let us know if you notice anything else come up.

  • 👍3
armandabric commented

Thanks guys for this really quick fix! I will try it tomorrow morning.

armandabric commented

We tested the new release in production it works perfectly 👌

  • ❤️1