From 5f8de423f190bbb79a62f804151bc24824fa32d8 Mon Sep 17 00:00:00 2001 From: "Matt A. Tobin" Date: Fri, 2 Feb 2018 04:16:08 -0500 Subject: Add m-esr52 at 52.6.0 --- .../client/shared/test/browser_flame-graph-04.js | 90 ++++++++++++++++++++++ 1 file changed, 90 insertions(+) create mode 100644 devtools/client/shared/test/browser_flame-graph-04.js (limited to 'devtools/client/shared/test/browser_flame-graph-04.js') diff --git a/devtools/client/shared/test/browser_flame-graph-04.js b/devtools/client/shared/test/browser_flame-graph-04.js new file mode 100644 index 000000000..5bcc112ec --- /dev/null +++ b/devtools/client/shared/test/browser_flame-graph-04.js @@ -0,0 +1,90 @@ +/* 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; +} -- cgit v1.2.3