1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
|
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
/**
* Tests if the waterfall is properly built after finishing a recording.
*/
const { SIMPLE_URL } = require("devtools/client/performance/test/helpers/urls");
const { initPerformanceInNewTab, teardownToolboxAndRemoveTab } = require("devtools/client/performance/test/helpers/panel-utils");
const { startRecording, stopRecording, waitForOverviewRenderedWithMarkers } = require("devtools/client/performance/test/helpers/actions");
const { once } = require("devtools/client/performance/test/helpers/event-utils");
add_task(function* () {
let { panel } = yield initPerformanceInNewTab({
url: SIMPLE_URL,
win: window
});
let { $, $$, EVENTS, WaterfallView } = panel.panelWin;
yield startRecording(panel);
ok(true, "Recording has started.");
// Ensure overview is rendering and some markers were received.
yield waitForOverviewRenderedWithMarkers(panel);
yield stopRecording(panel);
ok(true, "Recording has ended.");
// Test the header container.
ok($(".waterfall-header"),
"A header container should have been created.");
// Test the header sidebar (left).
ok($(".waterfall-header > .waterfall-sidebar"),
"A header sidebar node should have been created.");
// Test the header ticks (right).
ok($(".waterfall-header-ticks"),
"A header ticks node should have been created.");
ok($$(".waterfall-header-ticks > .waterfall-header-tick").length > 0,
"Some header tick labels should have been created inside the tick node.");
// Test the markers sidebar (left).
ok($$(".waterfall-tree-item > .waterfall-sidebar").length,
"Some marker sidebar nodes should have been created.");
ok($$(".waterfall-tree-item > .waterfall-sidebar > .waterfall-marker-bullet").length,
"Some marker color bullets should have been created inside the sidebar.");
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-tree-item > .waterfall-marker").length,
"Some marker waterfall nodes should have been created.");
ok($$(".waterfall-tree-item > .waterfall-marker .waterfall-marker-bar").length,
"Some marker color bars should have been created inside the waterfall.");
// Test the sidebar.
let detailsView = WaterfallView.details;
// Make sure the bounds are up to date.
WaterfallView._recalculateBounds();
let parentWidthBefore = $("#waterfall-view").getBoundingClientRect().width;
let sidebarWidthBefore = $(".waterfall-sidebar").getBoundingClientRect().width;
let detailsWidthBefore = $("#waterfall-details").getBoundingClientRect().width;
ok(detailsView.hidden,
"The details view in the waterfall view is hidden by default.");
is(detailsWidthBefore, 0,
"The details view width should be 0 when hidden.");
is(WaterfallView.waterfallWidth,
parentWidthBefore - sidebarWidthBefore
- WaterfallView.WATERFALL_MARKER_SIDEBAR_SAFE_BOUNDS,
"The waterfall width is correct (1).");
let waterfallRerendered = once(WaterfallView, EVENTS.UI_WATERFALL_RENDERED);
$$(".waterfall-tree-item")[0].click();
yield waterfallRerendered;
let parentWidthAfter = $("#waterfall-view").getBoundingClientRect().width;
let sidebarWidthAfter = $(".waterfall-sidebar").getBoundingClientRect().width;
let detailsWidthAfter = $("#waterfall-details").getBoundingClientRect().width;
ok(!detailsView.hidden,
"The details view in the waterfall view is now visible.");
is(parentWidthBefore, parentWidthAfter,
"The parent view's width should not have changed.");
is(sidebarWidthBefore, sidebarWidthAfter,
"The sidebar view's width should not have changed.");
isnot(detailsWidthAfter, 0,
"The details view width should not be 0 when visible.");
is(WaterfallView.waterfallWidth,
parentWidthAfter - sidebarWidthAfter - detailsWidthAfter
- WaterfallView.WATERFALL_MARKER_SIDEBAR_SAFE_BOUNDS,
"The waterfall width is correct (2).");
yield teardownToolboxAndRemoveTab(panel);
});
|