Bug 1130274 - JS and Memory flame graphs get rerendered but don't actually change when prefs are modified, r=jsantell

browser/devtools/performance/test/browser_perf-options-flatten-tree-recursion-01.js

@@ -6,7 +6,7 @@
  */
 function spawnTest () {
   let { panel } = yield initPerformance(SIMPLE_URL);
-  let { EVENTS, DetailsView, JsFlameGraphView } = panel.panelWin;
+  let { EVENTS, PerformanceController, DetailsView, JsFlameGraphView } = panel.panelWin;
 
   Services.prefs.setBoolPref(FLATTEN_PREF, true);
 
@@ -19,18 +19,42 @@ function spawnTest () {
   yield stopRecording(panel);
   yield rendered;
 
+  let samples1 = PerformanceController.getCurrentRecording().getProfile().threads[0].samples;
+  let rendering1 = FlameGraphUtils._cache.get(samples1);
+
+  ok(samples1,
+    "The samples were retrieved from the controller.");
+  ok(rendering1,
+    "The rendering data was cached.");
+
   rendered = once(JsFlameGraphView, EVENTS.JS_FLAMEGRAPH_RENDERED);
   Services.prefs.setBoolPref(FLATTEN_PREF, false);
   yield rendered;
 
   ok(true, "JsFlameGraphView rerendered when toggling flatten-tree-recursion.");
 
+  let samples2 = PerformanceController.getCurrentRecording().getProfile().threads[0].samples;
+  let rendering2 = FlameGraphUtils._cache.get(samples2);
+
+  is(samples1, samples2,
+    "The same samples data should be retrieved from the controller (1).");
+  isnot(rendering1, rendering2,
+    "The rendering data should be different because other options were used (1).");
+
   rendered = once(JsFlameGraphView, EVENTS.JS_FLAMEGRAPH_RENDERED);
   Services.prefs.setBoolPref(FLATTEN_PREF, true);
   yield rendered;
 
   ok(true, "JsFlameGraphView rerendered when toggling back flatten-tree-recursion.");
 
+  let samples3 = PerformanceController.getCurrentRecording().getProfile().threads[0].samples;
+  let rendering3 = FlameGraphUtils._cache.get(samples3);
+
+  is(samples2, samples3,
+    "The same samples data should be retrieved from the controller (2).");
+  isnot(rendering2, rendering3,
+    "The rendering data should be different because other options were used (2).");
+
   yield teardown(panel);
   finish();
 }

browser/devtools/performance/test/browser_perf-options-flatten-tree-recursion-02.js

@@ -6,7 +6,7 @@
  */
 function spawnTest () {
   let { panel } = yield initPerformance(SIMPLE_URL);
-  let { EVENTS, DetailsView, MemoryFlameGraphView } = panel.panelWin;
+  let { EVENTS, PerformanceController, DetailsView, MemoryFlameGraphView } = panel.panelWin;
 
   // Enable memory to test
   Services.prefs.setBoolPref(MEMORY_PREF, true);
@@ -21,18 +21,51 @@ function spawnTest () {
   yield stopRecording(panel);
   yield rendered;
 
+  let allocations1 = PerformanceController.getCurrentRecording().getAllocations();
+  let samples1 = RecordingUtils.getSamplesFromAllocations(allocations1);
+  let rendering1 = FlameGraphUtils._cache.get(samples1);
+
+  ok(allocations1,
+    "The allocations were retrieved from the controller.");
+  ok(samples1,
+    "The samples were retrieved from the utility funcs.");
+  ok(rendering1,
+    "The rendering data was cached.");
+
   rendered = once(MemoryFlameGraphView, EVENTS.MEMORY_FLAMEGRAPH_RENDERED);
   Services.prefs.setBoolPref(FLATTEN_PREF, false);
   yield rendered;
 
   ok(true, "MemoryFlameGraphView rerendered when toggling flatten-tree-recursion.");
 
+  let allocations2 = PerformanceController.getCurrentRecording().getAllocations();
+  let samples2 = RecordingUtils.getSamplesFromAllocations(allocations2);
+  let rendering2 = FlameGraphUtils._cache.get(samples2);
+
+  is(allocations1, allocations2,
+    "The same allocations data should be retrieved from the controller (1).");
+  is(samples1, samples2,
+    "The same samples data should be retrieved from the utility funcs. (1).");
+  isnot(rendering1, rendering2,
+    "The rendering data should be different because other options were used (1).");
+
   rendered = once(MemoryFlameGraphView, EVENTS.MEMORY_FLAMEGRAPH_RENDERED);
   Services.prefs.setBoolPref(FLATTEN_PREF, true);
   yield rendered;
 
   ok(true, "MemoryFlameGraphView rerendered when toggling back flatten-tree-recursion.");
 
+  let allocations3 = PerformanceController.getCurrentRecording().getAllocations();
+  let samples3 = RecordingUtils.getSamplesFromAllocations(allocations3);
+  let rendering3 = FlameGraphUtils._cache.get(samples3);
+
+  is(allocations2, allocations3,
+    "The same allocations data should be retrieved from the controller (2).");
+  is(samples2, samples3,
+    "The same samples data should be retrieved from the utility funcs. (2).");
+  isnot(rendering2, rendering3,
+    "The rendering data should be different because other options were used (2).");
+
   yield teardown(panel);
   finish();
 }

browser/devtools/performance/views/details-abstract-subview.js

@@ -114,6 +114,10 @@ let DetailsSubview = {
       return;
     }
 
+    if (this._onRerenderPrefChanged) {
+      this._onRerenderPrefChanged();
+    }
+
     if (DetailsView.isViewSelected(this) || this.canUpdateWhileHidden) {
       this.render(OverviewView.getTimeInterval());
     } else {

browser/devtools/performance/views/details-js-flamegraph.js

@@ -73,5 +73,15 @@ let JsFlameGraphView = Heritage.extend(DetailsSubview, {
   _onRangeChangeInGraph: function () {
     let interval = this.graph.getViewRange();
     OverviewView.setTimeInterval(interval, { stopPropagation: true });
+  },
+
+  /**
+   * Called whenever a pref is changed and this view needs to be rerendered.
+   */
+  _onRerenderPrefChanged: function() {
+    let recording = PerformanceController.getCurrentRecording();
+    let profile = recording.getProfile();
+    let samples = profile.threads[0].samples;
+    FlameGraphUtils.removeFromCache(samples);
   }
 });

browser/devtools/performance/views/details-memory-call-tree.js

@@ -101,5 +101,4 @@ let MemoryCallTreeView = Heritage.extend(DetailsSubview, {
     // Memory allocation samples don't contain cateogry labels.
     root.toggleCategories(false);
   }
-
 });

browser/devtools/performance/views/details-memory-flamegraph.js

@@ -72,5 +72,15 @@ let MemoryFlameGraphView = Heritage.extend(DetailsSubview, {
   _onRangeChangeInGraph: function () {
     let interval = this.graph.getViewRange();
     OverviewView.setTimeInterval(interval, { stopPropagation: true });
+  },
+
+  /**
+   * Called whenever a pref is changed and this view needs to be rerendered.
+   */
+  _onRerenderPrefChanged: function() {
+    let recording = PerformanceController.getCurrentRecording();
+    let allocations = recording.getAllocations();
+    let samples = RecordingUtils.getSamplesFromAllocations(allocations);
+    FlameGraphUtils.removeFromCache(samples);
   }
 });