134 lines
3.6 KiB
HTML
134 lines
3.6 KiB
HTML
<!DOCTYPE HTML>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf8">
|
|
<title>Test for console.log styling with %c</title>
|
|
<script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
|
|
<script type="text/javascript" src="common.js"></script>
|
|
<!-- Any copyright is dedicated to the Public Domain.
|
|
- http://creativecommons.org/publicdomain/zero/1.0/ -->
|
|
</head>
|
|
<body>
|
|
<p>Test for console.log styling with %c</p>
|
|
|
|
<script class="testbody" type="text/javascript">
|
|
"use strict";
|
|
|
|
SimpleTest.waitForExplicitFinish();
|
|
|
|
let expectedConsoleCalls = [];
|
|
|
|
function doConsoleCalls()
|
|
{
|
|
top.console.log("%cOne formatter with no styles");
|
|
top.console.log("%cOne formatter", "color: red");
|
|
top.console.log("%cTwo formatters%cEach with an arg",
|
|
"color: red", "background: red");
|
|
top.console.log("%c%cTwo formatters next to each other",
|
|
"color: red", "background: red");
|
|
top.console.log("%c%c%cThree formatters next to each other",
|
|
"color: red", "background: red", "font-size: 150%");
|
|
top.console.log("%c%cTwo formatters%cWith a third separated",
|
|
"color: red", "background: red", "font-size: 150%");
|
|
top.console.log("%cOne formatter", "color: red",
|
|
"Second arg with no styles");
|
|
top.console.log("%cOne formatter", "color: red",
|
|
"%cSecond formatter is ignored", "background: blue")
|
|
|
|
expectedConsoleCalls = [
|
|
{
|
|
level: "log",
|
|
styles: undefined,
|
|
arguments: ["%cOne formatter with no styles"],
|
|
},
|
|
{
|
|
level: "log",
|
|
styles: /^color: red$/,
|
|
arguments: ["One formatter"],
|
|
},
|
|
{
|
|
level: "log",
|
|
styles: /^color: red,background: red$/,
|
|
arguments: ["Two formatters", "Each with an arg"],
|
|
},
|
|
{
|
|
level: "log",
|
|
styles: /^background: red$/,
|
|
arguments: ["Two formatters next to each other"],
|
|
},
|
|
{
|
|
level: "log",
|
|
styles: /^font-size: 150%$/,
|
|
arguments: ["Three formatters next to each other"],
|
|
},
|
|
{
|
|
level: "log",
|
|
styles: /^background: red,font-size: 150%$/,
|
|
arguments: ["Two formatters", "With a third separated"],
|
|
},
|
|
{
|
|
level: "log",
|
|
styles: /^color: red$/,
|
|
arguments: ["One formatter", "Second arg with no styles"],
|
|
},
|
|
{
|
|
level: "log",
|
|
styles: /^color: red$/,
|
|
arguments: ["One formatter",
|
|
"%cSecond formatter is ignored",
|
|
"background: blue"],
|
|
},
|
|
];
|
|
}
|
|
|
|
async function startTest()
|
|
{
|
|
removeEventListener("load", startTest);
|
|
|
|
const {state, response} = await attachConsoleToTab(["ConsoleAPI"]);
|
|
onAttach(state, response);
|
|
}
|
|
|
|
function onAttach(aState)
|
|
{
|
|
onConsoleAPICall = onConsoleAPICall.bind(null, aState);
|
|
aState.webConsoleFront.on("consoleAPICall", onConsoleAPICall);
|
|
doConsoleCalls(aState.actor);
|
|
}
|
|
|
|
let consoleCalls = [];
|
|
|
|
function onConsoleAPICall(aState, aPacket)
|
|
{
|
|
info("received message level: " + aPacket.message.level);
|
|
|
|
consoleCalls.push(aPacket.message);
|
|
if (consoleCalls.length != expectedConsoleCalls.length) {
|
|
return;
|
|
}
|
|
|
|
aState.webConsoleFront.off("consoleAPICall", onConsoleAPICall);
|
|
|
|
expectedConsoleCalls.forEach(function(aMessage, aIndex) {
|
|
info("checking received console call #" + aIndex);
|
|
const expected = expectedConsoleCalls[aIndex];
|
|
const consoleCall = consoleCalls[aIndex];
|
|
if (expected.styles == undefined) {
|
|
delete expected.styles;
|
|
is(consoleCall.styles, undefined, "No 'styles' property")
|
|
}
|
|
checkConsoleAPICall(consoleCall, expected);
|
|
});
|
|
|
|
|
|
consoleCalls = [];
|
|
|
|
closeDebugger(aState, function() {
|
|
SimpleTest.finish();
|
|
});
|
|
}
|
|
|
|
addEventListener("load", startTest);
|
|
</script>
|
|
</body>
|
|
</html>
|