Bug 1168125 - Fix existing tests, r=jsantell

browser/devtools/performance/test/browser_perf-front-basic-timeline-01.js

@@ -68,8 +68,11 @@ function* spawnTest() {
       counters.ticks.push({ delta, timestamps });
       lastTickDelta = delta;
     }
+    else if (name === "frames") {
+      // Nothing to do here.
+    }
     else {
-      throw new Error("unknown event " + name);
+      ok(false, `Received unknown event: ${name}`);
     }
 
     if (name === "markers" && counters[name].length === 1 ||

browser/devtools/performance/test/browser_profiler_tree-abstract-01.js

@@ -18,6 +18,11 @@ function* spawnTest() {
   let treeRoot = new MyCustomTreeItem(gDataSrc, { parent: null });
   treeRoot.attachTo(container);
 
+  ok(!treeRoot.expanded,
+    "The root node should not be expanded yet.");
+  ok(!treeRoot.populated,
+    "The root node should not be populated yet.");
+
   is(container.childNodes.length, 1,
     "The container node should have one child available.");
   is(container.childNodes[0], treeRoot.target,

browser/devtools/performance/test/browser_profiler_tree-abstract-02.js

@@ -16,14 +16,9 @@ function* spawnTest() {
   // Populate the tree and test `expand`, `collapse` and `getChild`...
 
   let treeRoot = new MyCustomTreeItem(gDataSrc, { parent: null });
+  treeRoot.autoExpandDepth = 1;
   treeRoot.attachTo(container);
 
-  ok(!treeRoot.expanded,
-    "The root node should not be expanded yet.");
-  ok(!treeRoot.populated,
-    "The root node should not be populated yet.");
-
-  treeRoot.expand();
   ok(treeRoot.expanded,
     "The root node should now be expanded.");
   ok(treeRoot.populated,

browser/devtools/performance/test/browser_timeline-blueprint.js

@@ -15,11 +15,20 @@ function* spawnTest() {
     "The timeline blueprint has at least one entry.");
 
   for (let [key, value] of Iterator(TIMELINE_BLUEPRINT)) {
-    ok("group" in value,
-      "Each entry in the timeline blueprint contains a `group` key.");
-    ok("colorName" in value,
-      "Each entry in the timeline blueprint contains a `colorName` key.");
-    ok("label" in value,
-      "Each entry in the timeline blueprint contains a `label` key.");
+    if (key.startsWith("meta::")) {
+      ok(!("group" in value),
+        "No meta entry in the timeline blueprint can contain a `group` key.");
+      ok("colorName" in value,
+        "Each meta entry in the timeline blueprint contains a `colorName` key.");
+      ok("label" in value,
+        "Each meta entry in the timeline blueprint contains a `label` key.");
+    } else {
+      ok("group" in value,
+        "Each entry in the timeline blueprint contains a `group` key.");
+      ok("colorName" in value,
+        "Each entry in the timeline blueprint contains a `colorName` key.");
+      ok("label" in value,
+        "Each entry in the timeline blueprint contains a `label` key.");
+    }
   }
 }

browser/devtools/performance/test/browser_timeline-filters.js

@@ -7,7 +7,7 @@
 
 function* spawnTest() {
   let { panel } = yield initPerformance(SIMPLE_URL);
-  let { $, $$, PerformanceController, OverviewView, WaterfallView } = panel.panelWin;
+  let { $, $$, EVENTS, PerformanceController, OverviewView, WaterfallView } = panel.panelWin;
   let { TimelineGraph } = devtools.require("devtools/performance/graphs");
   let { rowHeight: MARKERS_GRAPH_ROW_HEIGHT } = TimelineGraph.prototype;
 
@@ -24,20 +24,15 @@ function* spawnTest() {
 
   yield stopRecording(panel);
 
-  let overview = OverviewView.graphs.get("timeline");
-  let waterfall = WaterfallView.waterfall;
-
   // Select everything
   OverviewView.setTimeInterval({ startTime: 0, endTime: Number.MAX_VALUE })
 
   $("#filter-button").click();
-
-  yield waitUntil(() => !waterfall._outstandingMarkers.length);
-
   let menuItem1 = $("menuitem[marker-type=Styles]");
   let menuItem2 = $("menuitem[marker-type=Reflow]");
   let menuItem3 = $("menuitem[marker-type=Paint]");
 
+  let overview = OverviewView.graphs.get("timeline");
   let originalHeight = overview.fixedHeight;
 
   ok($(".waterfall-marker-bar[type=Styles]"), "Found at least one 'Styles' marker (1)");
@@ -46,9 +41,7 @@ function* spawnTest() {
 
   let heightBefore = overview.fixedHeight;
   EventUtils.synthesizeMouseAtCenter(menuItem1, {type: "mouseup"}, panel.panelWin);
-  yield once(menuItem1, "command");
-
-  yield waitUntil(() => !waterfall._outstandingMarkers.length);
+  yield waitForOverviewAndCommand(overview, menuItem1);
 
   is(overview.fixedHeight, heightBefore, "Overview height hasn't changed");
   ok(!$(".waterfall-marker-bar[type=Styles]"), "No 'Styles' marker (2)");
@@ -57,9 +50,7 @@ function* spawnTest() {
 
   heightBefore = overview.fixedHeight;
   EventUtils.synthesizeMouseAtCenter(menuItem2, {type: "mouseup"}, panel.panelWin);
-  yield once(menuItem2, "command");
-
-  yield waitUntil(() => !waterfall._outstandingMarkers.length);
+  yield waitForOverviewAndCommand(overview, menuItem2);
 
   is(overview.fixedHeight, heightBefore, "Overview height hasn't changed");
   ok(!$(".waterfall-marker-bar[type=Styles]"), "No 'Styles' marker (3)");
@@ -68,9 +59,7 @@ function* spawnTest() {
 
   heightBefore = overview.fixedHeight;
   EventUtils.synthesizeMouseAtCenter(menuItem3, {type: "mouseup"}, panel.panelWin);
-  yield once(menuItem3, "command");
-
-  yield waitUntil(() => !waterfall._outstandingMarkers.length);
+  yield waitForOverviewAndCommand(overview, menuItem3);
 
   is(overview.fixedHeight, heightBefore - MARKERS_GRAPH_ROW_HEIGHT, "Overview is smaller");
   ok(!$(".waterfall-marker-bar[type=Styles]"), "No 'Styles' marker (4)");
@@ -79,11 +68,9 @@ function* spawnTest() {
 
   for (let item of [menuItem1, menuItem2, menuItem3]) {
     EventUtils.synthesizeMouseAtCenter(item, {type: "mouseup"}, panel.panelWin);
-    yield once(item, "command");
+    yield waitForOverviewAndCommand(overview, item);
   }
 
-  yield waitUntil(() => !waterfall._outstandingMarkers.length);
-
   ok($(".waterfall-marker-bar[type=Styles]"), "Found at least one 'Styles' marker (5)");
   ok($(".waterfall-marker-bar[type=Reflow]"), "Found at least one 'Reflow' marker (5)");
   ok($(".waterfall-marker-bar[type=Paint]"), "Found at least one 'Paint' marker (5)");
@@ -93,3 +80,9 @@ function* spawnTest() {
   yield teardown(panel);
   finish();
 }
+
+function waitForOverviewAndCommand(overview, item) {
+  let overviewRendered = overview.once("refresh");
+  let menuitemCommandDispatched = once(item, "command");
+  return Promise.all([overviewRendered, menuitemCommandDispatched]);
+}

browser/devtools/performance/test/browser_timeline-waterfall-background.js

@@ -25,27 +25,30 @@ function* spawnTest() {
     DetailsView.selectView("waterfall"),
     once(WaterfallView, EVENTS.WATERFALL_RENDERED)
   ]);
+
   yield stopRecording(panel);
   ok(true, "Recording has ended.");
+
   yield rendered;
+  ok(true, "Recording has rendered.");
 
   // Test the waterfall background.
 
   let parentWidth = $("#waterfall-view").getBoundingClientRect().width;
   let sidebarWidth = $(".waterfall-sidebar").getBoundingClientRect().width;
   let detailsWidth = $("#waterfall-details").getBoundingClientRect().width;
-  let waterfallWidth = WaterfallView.waterfall._waterfallWidth;
+  let waterfallWidth = WaterfallView._markersRoot._waterfallWidth;
   is(waterfallWidth, parentWidth - sidebarWidth - detailsWidth,
     "The waterfall width is correct.")
 
-  ok(WaterfallView.waterfall._canvas,
+  ok(WaterfallView._waterfallHeader._canvas,
     "A canvas should be created after the recording ended.");
-  ok(WaterfallView.waterfall._ctx,
+  ok(WaterfallView._waterfallHeader._ctx,
     "A 2d context should be created after the recording ended.");
 
-  is(WaterfallView.waterfall._canvas.width, waterfallWidth,
+  is(WaterfallView._waterfallHeader._canvas.width, waterfallWidth,
     "The canvas width is correct.");
-  is(WaterfallView.waterfall._canvas.height, 1,
+  is(WaterfallView._waterfallHeader._canvas.height, 1,
     "The canvas height is correct.");
 
   yield teardown(panel);

browser/devtools/performance/test/browser_timeline-waterfall-generic.js

@@ -42,26 +42,22 @@ function* spawnTest() {
   ok($$(".waterfall-header-ticks > .waterfall-header-tick").length > 0,
     "Some header tick labels should have been created inside the tick node.");
 
-  // Test the markers container.
-
-  ok($(".waterfall-marker-container"),
-    "A marker container should have been created.");
-
   // Test the markers sidebar (left).
 
-  ok($$(".waterfall-marker-container > .waterfall-sidebar").length,
+  ok($$(".waterfall-tree-item > .waterfall-sidebar").length,
     "Some marker sidebar nodes should have been created.");
-  ok($$(".waterfall-marker-container > .waterfall-sidebar:not(spacer) > .waterfall-marker-bullet").length,
+  ok($$(".waterfall-tree-item > .waterfall-sidebar > .waterfall-marker-bullet").length,
     "Some marker color bullets should have been created inside the sidebar.");
-  ok($$(".waterfall-marker-container > .waterfall-sidebar:not(spacer) > .waterfall-marker-name").length,
+  ok($$(".waterfall-tree-item > .waterfall-sidebar > .waterfall-marker-name").length,
     "Some marker name labels should have been created inside the sidebar.");
 
   // Test the markers waterfall (right).
 
-  ok($$(".waterfall-marker-item").length,
+  ok($$(".waterfall-tree-item > .waterfall-marker").length,
     "Some marker waterfall nodes should have been created.");
-  ok($$(".waterfall-marker-item:not(spacer) > .waterfall-marker-bar").length,
+  ok($$(".waterfall-tree-item > .waterfall-marker > .waterfall-marker-bar").length,
     "Some marker color bars should have been created inside the waterfall.");
+
   yield teardown(panel);
   finish();
 }

browser/devtools/performance/test/browser_timeline-waterfall-sidebar.js

@@ -7,10 +7,18 @@
 
 function* spawnTest() {
   let { target, panel } = yield initPerformance(SIMPLE_URL);
-  let { $, $$, EVENTS, PerformanceController, OverviewView } = panel.panelWin;
+  let { $, $$, EVENTS, PerformanceController, OverviewView, WaterfallView } = panel.panelWin;
   let { L10N, TIMELINE_BLUEPRINT } = devtools.require("devtools/performance/global");
   let { getMarkerLabel } = devtools.require("devtools/performance/marker-utils");
 
+  // Hijack the markers massaging part of creating the waterfall view,
+  // to prevent collapsing markers and allowing this test to verify
+  // everything individually. A better solution would be to just expand
+  // all markers first and then skip the meta nodes, but I'm lazy.
+  WaterfallView._prepareWaterfallTree = markers => {
+    return { submarkers: markers };
+  };
+
   yield startRecording(panel);
   ok(true, "Recording has started.");
 
@@ -28,32 +36,34 @@ function* spawnTest() {
   // Select everything
   OverviewView.graphs.get("timeline").setSelection({ start: 0, end: OverviewView.graphs.get("timeline").width })
 
-  let bars = $$(".waterfall-marker-item:not(spacer) > .waterfall-marker-bar");
+  let bars = $$(".waterfall-marker-bar");
   let markers = PerformanceController.getCurrentRecording().getMarkers();
 
-  ok(bars.length > 2, "got at least 3 markers");
+  ok(bars.length > 2, "Got at least 3 markers (1)");
+  ok(markers.length > 2, "Got at least 3 markers (2)");
 
-  let sidebar = $("#waterfall-details");
   for (let i = 0; i < bars.length; i++) {
     let bar = bars[i];
-    bar.click();
     let m = markers[i];
+    EventUtils.sendMouseEvent({ type: "mousedown" }, bar);
 
     is($("#waterfall-details .marker-details-type").getAttribute("value"), getMarkerLabel(m),
-      "sidebar title matches markers name");
+      "Sidebar title matches markers name.");
 
     let tooltip = $(".marker-details-duration").getAttribute("tooltiptext");
-    let printedDuration = $(".marker-details-duration .marker-details-labelvalue").getAttribute("value");
+    let duration = $(".marker-details-duration .marker-details-labelvalue").getAttribute("value");
 
     let toMs = ms => L10N.getFormatStrWithNumbers("timeline.tick", ms);
 
     // Values are rounded. We don't use a strict equality.
-    is(toMs(m.end - m.start), printedDuration, "sidebar duration is valid");
+    is(toMs(m.end - m.start), duration, "Sidebar duration is valid.");
+
     // For some reason, anything that creates "→" here turns it into a "â" for some reason.
     // So just check that start and end time are in there somewhere.
-    ok(tooltip.indexOf(toMs(m.start)) !== -1, "tooltip has start time");
-    ok(tooltip.indexOf(toMs(m.end)) !== -1, "tooltip has end time");
+    ok(tooltip.indexOf(toMs(m.start)) !== -1, "Tooltip has start time.");
+    ok(tooltip.indexOf(toMs(m.end)) !== -1, "Tooltip has end time.");
   }
+
   yield teardown(panel);
   finish();
 }