зеркало из https://github.com/mozilla/gecko-dev.git
91 строка
2.7 KiB
JavaScript
91 строка
2.7 KiB
JavaScript
/* Any copyright is dedicated to the Public Domain.
|
|
http://creativecommons.org/publicdomain/zero/1.0/ */
|
|
|
|
"use strict";
|
|
|
|
// Tests that text metrics in the flame graph widget work properly.
|
|
|
|
const HTML_NS = "http://www.w3.org/1999/xhtml";
|
|
const {ELLIPSIS} = require("devtools/shared/l10n");
|
|
const {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
|
|
const {FLAME_GRAPH_BLOCK_TEXT_FONT_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
|
|
const {FLAME_GRAPH_BLOCK_TEXT_FONT_FAMILY} = require("devtools/client/shared/widgets/FlameGraph");
|
|
|
|
add_task(function* () {
|
|
yield addTab("about:blank");
|
|
yield performTest();
|
|
gBrowser.removeCurrentTab();
|
|
});
|
|
|
|
function* performTest() {
|
|
let [host,, doc] = yield createHost();
|
|
let graph = new FlameGraph(doc.body, 1);
|
|
yield graph.ready();
|
|
|
|
testGraph(graph);
|
|
|
|
yield graph.destroy();
|
|
host.destroy();
|
|
}
|
|
|
|
function testGraph(graph) {
|
|
is(graph._averageCharWidth, getAverageCharWidth(),
|
|
"The average char width was calculated correctly.");
|
|
is(graph._overflowCharWidth, getCharWidth(ELLIPSIS),
|
|
"The ellipsis char width was calculated correctly.");
|
|
|
|
let text = "This text is maybe overflowing";
|
|
let text1000px = graph._getFittedText(text, 1000);
|
|
let text50px = graph._getFittedText(text, 50);
|
|
let text10px = graph._getFittedText(text, 10);
|
|
let text1px = graph._getFittedText(text, 1);
|
|
|
|
is(graph._getTextWidthApprox(text), getAverageCharWidth() * text.length,
|
|
"The approximate width was calculated correctly.");
|
|
|
|
info("Text at 1000px width: " + text1000px);
|
|
info("Text at 50px width : " + text50px);
|
|
info("Text at 10px width : " + text10px);
|
|
info("Text at 1px width : " + text1px);
|
|
|
|
is(text1000px, text,
|
|
"The fitted text for 1000px width is correct.");
|
|
|
|
isnot(text50px, text,
|
|
"The fitted text for 50px width is correct (1).");
|
|
|
|
ok(text50px.includes(ELLIPSIS),
|
|
"The fitted text for 50px width is correct (2).");
|
|
|
|
is(graph._getFittedText(text, FLAME_GRAPH_BLOCK_TEXT_FONT_SIZE + 1), ELLIPSIS,
|
|
"The fitted text for text font size width is correct.");
|
|
|
|
is(graph._getFittedText(text, 1), "",
|
|
"The fitted text for 1px width is correct.");
|
|
}
|
|
|
|
function getAverageCharWidth() {
|
|
let letterWidthsSum = 0;
|
|
|
|
let start = " ".charCodeAt(0);
|
|
let end = "z".charCodeAt(0) + 1;
|
|
|
|
for (let i = start; i < end; i++) {
|
|
let char = String.fromCharCode(i);
|
|
letterWidthsSum += getCharWidth(char);
|
|
}
|
|
|
|
return letterWidthsSum / (end - start);
|
|
}
|
|
|
|
function getCharWidth(char) {
|
|
let canvas = document.createElementNS(HTML_NS, "canvas");
|
|
let ctx = canvas.getContext("2d");
|
|
|
|
let fontSize = FLAME_GRAPH_BLOCK_TEXT_FONT_SIZE;
|
|
let fontFamily = FLAME_GRAPH_BLOCK_TEXT_FONT_FAMILY;
|
|
ctx.font = fontSize + "px " + fontFamily;
|
|
|
|
return ctx.measureText(char).width;
|
|
}
|