Flush nodes cache when roots prop is updated.

Fixes #904.
Add a test to make sure we don't regress this.

Author: nchevobbe

packages/devtools-reps/src/object-inspector/index.js

@@ -162,8 +162,15 @@ class ObjectInspector extends Component {
       expandedPaths,
       loadedProperties
     } = this.state;
-    return this.props.roots !== nextProps.roots
-      || expandedPaths.size !== nextState.expandedPaths.size
+
+    if (this.props.roots !== nextProps.roots) {
+      // Since the roots changed, we assume the properties did as well. Thus we can clear
+      // the cachedNodes to avoid bugs and memory leaks.
+      this.cachedNodes.clear();
+      return true;
+    }
+
+    return expandedPaths.size !== nextState.expandedPaths.size
       || loadedProperties.size !== nextState.loadedProperties.size
       || [...expandedPaths].some(key => !nextState.expandedPaths.has(key));
   }

packages/devtools-reps/src/object-inspector/tests/component/basic.js

@@ -261,4 +261,40 @@ describe("ObjectInspector - renders", () => {
     }]});
     expect(formatObjectInspector(oi)).toMatchSnapshot();
   });
+
+  it("updates when the root changes but has same path", () => {
+    let oi = mount(ObjectInspector(generateDefaults({
+      roots: [{
+        path: "root",
+        name: "root",
+        contents: [{
+          name: "a",
+          contents: {
+            value: 30,
+          }
+        }, {
+          name: "b",
+          contents: {
+            value: 32,
+          }
+        }]
+      }],
+      mode: MODE.LONG,
+    })));
+    oi.find(".node").at(0).simulate("click");
+
+    const oldTree = formatObjectInspector(oi);
+    oi.setProps({roots: [{
+        path: "root",
+        name: "root",
+        contents: [{
+          name: "c",
+          contents: {
+            value: "i'm the new node",
+          }
+        }]
+    }]});
+
+    expect(formatObjectInspector(oi)).not.toBe(oldTree);
+  });
 });