Update profiling-supported status each time roots change (and added tests)

src/__tests__/profilerContext-test.js

@@ -65,6 +65,41 @@ describe('ProfilerContext', () => {
     </BridgeContext.Provider>
   );
 
+  it('updates updates profiling support based on the attached roots', async done => {
+    const Component = () => null;
+
+    let context: Context = ((null: any): Context);
+
+    function ContextReader() {
+      context = React.useContext(ProfilerContext);
+      return null;
+    }
+    await utils.actAsync(() => {
+      TestRenderer.create(
+        <Contexts>
+          <ContextReader />
+        </Contexts>
+      );
+    });
+
+    expect(context.supportsProfiling).toBe(false);
+
+    const containerA = document.createElement('div');
+    const containerB = document.createElement('div');
+
+    await utils.actAsync(() => ReactDOM.render(<Component />, containerA));
+    expect(context.supportsProfiling).toBe(true);
+
+    await utils.actAsync(() => ReactDOM.render(<Component />, containerB));
+    await utils.actAsync(() => ReactDOM.unmountComponentAtNode(containerA));
+    expect(context.supportsProfiling).toBe(true);
+
+    await utils.actAsync(() => ReactDOM.unmountComponentAtNode(containerB));
+    expect(context.supportsProfiling).toBe(false);
+
+    done();
+  });
+
   it('should gracefully handle an empty profiling session (with no recorded commits)', async done => {
     const Example = () => null;
 

src/__tests__/store-test.js

@@ -778,4 +778,23 @@ describe('Store', () => {
       }
     });
   });
+
+  it('detects and updates profiling support based on the attached roots', () => {
+    const Component = () => null;
+
+    const containerA = document.createElement('div');
+    const containerB = document.createElement('div');
+
+    expect(store.supportsProfiling).toBe(false);
+
+    act(() => ReactDOM.render(<Component />, containerA));
+    expect(store.supportsProfiling).toBe(true);
+
+    act(() => ReactDOM.render(<Component />, containerB));
+    act(() => ReactDOM.unmountComponentAtNode(containerA));
+    expect(store.supportsProfiling).toBe(true);
+
+    act(() => ReactDOM.unmountComponentAtNode(containerB));
+    expect(store.supportsProfiling).toBe(false);
+  });
 });

src/devtools/store.js

@@ -859,20 +859,26 @@ export default class Store extends EventEmitter {
     this._revision++;
 
     if (haveRootsChanged) {
+      const prevSupportsProfiling = this._supportsProfiling;
+
       this._hasOwnerMetadata = false;
+      this._supportsProfiling = false;
       this._rootIDToCapabilities.forEach(
         ({ hasOwnerMetadata, supportsProfiling }) => {
           if (hasOwnerMetadata) {
             this._hasOwnerMetadata = true;
           }
-          if (!this._supportsProfiling && supportsProfiling) {
+          if (supportsProfiling) {
             this._supportsProfiling = true;
-            this.emit('supportsProfiling');
           }
         }
       );
 
       this.emit('roots');
+
+      if (this._supportsProfiling !== prevSupportsProfiling) {
+        this.emit('supportsProfiling');
+      }
     }
 
     if (__DEBUG__) {

src/devtools/views/Profiler/ProfilerContext.js

@@ -21,16 +21,12 @@ import type { ProfilingDataFrontend } from './types';
 export type TabID = 'flame-chart' | 'ranked-chart' | 'interactions';
 
 export type Context = {|
-  // Does the Store support profiling?
-  supportsProfiling: boolean,
-
   // Which tab is selexted in the Profiler UI?
   selectedTabID: TabID,
   selectTab(id: TabID): void,
 
-  // Have we recorded any profiling data?
-  // Are we currently profiling?
-  // This value may be modified by the record button in the Profiler toolbar,
+  // Store subscription based values.
+  // The isProfiling value may be modified by the record button in the Profiler toolbar,
   // or from the backend itself (after a reload-and-profile action).
   // It is synced between the backend and frontend via a Store subscription.
   didRecordCommits: boolean,
@@ -39,6 +35,7 @@ export type Context = {|
   profilingData: ProfilingDataFrontend | null,
   startProfiling(value: boolean): void,
   stopProfiling(value: boolean): void,
+  supportsProfiling: boolean,
 
   // Which root should profiling data be shown for?
   // This value should be initialized to either: