Bug 1579422 - Disconnect FilterBar resize observer when observed node is disconnected. r=jdescottes.

Since we don't properly unmount the Console React app,
FilterBar's componentWillUnmount is never called.
This was where we planned to disconnect the resize observer,
but it was in fact never called.
So what we do in this patch instead is in the resize observer
callback, check if the observed node is connected, and if
it's not, we disconnect the resize observer.

This prevent the console from dispatching an action, that
may slow down closing the console.

Differential Revision: https://phabricator.services.mozilla.com/D45006

--HG--
extra : moz-landing-system : lando

devtools/client/webconsole/components/FilterBar/FilterBar.js

@@ -134,10 +134,6 @@ class FilterBar extends Component {
     return false;
   }
 
-  componentWillUnmount() {
-    this.resizeObserver.disconnect();
-  }
-
   /**
    * Update the boolean state that informs where the filter buttons should be rendered.
    * If the filter buttons are rendered inline with the filter input and the filter
@@ -149,6 +145,14 @@ class FilterBar extends Component {
   maybeUpdateLayout() {
     const { dispatch, displayMode } = this.props;
 
+    // If we don't have the wrapperNode reference, or if the wrapperNode isn't connected
+    // anymore, we disconnect the resize observer (componentWillUnmount is never called
+    // on this component, so we have to do it here).
+    if (!this.wrapperNode || !this.wrapperNode.isConnected) {
+      this.resizeObserver.disconnect();
+      return;
+    }
+
     const filterInput = this.wrapperNode.querySelector(".devtools-searchbox");
     const { width: filterInputWidth } = filterInput.getBoundingClientRect();