"TypeError: Cannot read property 'style' of null" on close (inconsistent)

[xxx]

I'm currently seeing this issue sometimes when a popover is closing. It happens for multiple popovers in my app, and https://github.com/littlebits/react-popover/issues/147#issuecomment-334311727 indicates that I'm not the only one seeing this.

Below is just a reproduction of the above-linked comment, in case it disappears for some reason.

The null element at line index.js:397 is _this2.containerEl below (first line of the setTimeout callback):

key: "animateExit",
value: function animateExit() {
  var _this2 = this;

  this.setState({ exiting: true });
  this.exitingAnimationTimer2 = setTimeout(function () {
    setTimeout(function () {
      _this2.containerEl.style.transform = flowToPopoverTranslations[_this2.zone.flow] + "(" + _this2.zone.order * 50 + "px)";
      _this2.containerEl.style.opacity = "0";
    }, 0);
  }, 0);

[wouterh]

I only see this error when I set a custom enterExitTransitionDurationMs that is shorter than the default.

[jjvsevilla-intellify]

I got the same error, it tend to occur when I close many Popover components fastly

[drewjenkins]

You can't rely on the ref being around when the component is unmounting if it's in a setTimeout. This just needs a conditional check around it