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
106
107
108
109
110
111
112
113
|
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Tests that flame graph widget has proper keyboard support.
const TEST_DATA = [
{
color: "#f00",
blocks: [
{ x: 0, y: 0, width: 50, height: 20, text: "FOO" },
{ x: 50, y: 0, width: 100, height: 20, text: "BAR" }
]
},
{
color: "#00f",
blocks: [
{ x: 0, y: 30, width: 30, height: 20, text: "BAZ" }
]
}
];
const TEST_BOUNDS = { startTime: 0, endTime: 150 };
const TEST_DPI_DENSITIY = 2;
const KEY_CODE_UP = 38;
const KEY_CODE_LEFT = 37;
const KEY_CODE_RIGHT = 39;
var {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
add_task(function* () {
yield addTab("about:blank");
yield performTest();
gBrowser.removeCurrentTab();
});
function* performTest() {
let [host,, doc] = yield createHost();
doc.body.setAttribute("style",
"position: fixed; width: 100%; height: 100%; margin: 0;");
let graph = new FlameGraph(doc.body, TEST_DPI_DENSITIY);
yield graph.ready();
yield testGraph(host, graph);
yield graph.destroy();
host.destroy();
}
function* testGraph(host, graph) {
graph.setData({ data: TEST_DATA, bounds: TEST_BOUNDS });
is(graph._selection.start, 0,
"The graph's selection start value is initially correct.");
is(graph._selection.end, TEST_BOUNDS.endTime * TEST_DPI_DENSITIY,
"The graph's selection end value is initially correct.");
yield pressKeyForTime(graph, KEY_CODE_LEFT, 1000);
is(graph._selection.start, 0,
"The graph's selection start value is correct after pressing LEFT.");
ok(graph._selection.end < TEST_BOUNDS.endTime * TEST_DPI_DENSITIY,
"The graph's selection end value is correct after pressing LEFT.");
graph._selection.start = 0;
graph._selection.end = TEST_BOUNDS.endTime * TEST_DPI_DENSITIY;
info("Graph selection was reset (1).");
yield pressKeyForTime(graph, KEY_CODE_RIGHT, 1000);
ok(graph._selection.start > 0,
"The graph's selection start value is correct after pressing RIGHT.");
is(graph._selection.end, TEST_BOUNDS.endTime * TEST_DPI_DENSITIY,
"The graph's selection end value is correct after pressing RIGHT.");
graph._selection.start = 0;
graph._selection.end = TEST_BOUNDS.endTime * TEST_DPI_DENSITIY;
info("Graph selection was reset (2).");
yield pressKeyForTime(graph, KEY_CODE_UP, 1000);
ok(graph._selection.start > 0,
"The graph's selection start value is correct after pressing UP.");
ok(graph._selection.end < TEST_BOUNDS.endTime * TEST_DPI_DENSITIY,
"The graph's selection end value is correct after pressing UP.");
let distanceLeft = graph._selection.start;
let distanceRight = TEST_BOUNDS.endTime * TEST_DPI_DENSITIY - graph._selection.end;
ok(Math.abs(distanceRight - distanceLeft) < 0.1,
"The graph zoomed correctly towards the center point.");
}
function pressKeyForTime(graph, keyCode, ms) {
graph._onKeyDown({
keyCode,
preventDefault: () => {},
stopPropagation: () => {},
});
return new Promise(resolve => {
setTimeout(() => {
graph._onKeyUp({
keyCode,
preventDefault: () => {},
stopPropagation: () => {},
});
resolve();
}, ms);
});
}
|
