229 lines
7.4 KiB
HTML
229 lines
7.4 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<script src="../../http/tests/inspector/resources/inspector-test.js"></script>
|
|
<script>
|
|
|
|
function createDetachedTest()
|
|
{
|
|
let div = document.createElement("div");
|
|
div.id = "detached";
|
|
return div;
|
|
}
|
|
|
|
function testHTMLImageElement() {
|
|
// 2x2 red square
|
|
let image = document.createElement("img");
|
|
image.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAAXNSR0IArs4c6QAAABNJREFUCB1j/M/AAEQMDEwgAgQAHxcCAmtAm/sAAAAASUVORK5CYII=";
|
|
image.addEventListener("load", async (event) => {
|
|
console.screenshot(image);
|
|
});
|
|
}
|
|
|
|
function testHTMLPictureElement() {
|
|
let picture = document.createElement("picture");
|
|
|
|
// 2x2 red square
|
|
let image = picture.appendChild(document.createElement("img"));
|
|
image.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAAXNSR0IArs4c6QAAABNJREFUCB1j/M/AAEQMDEwgAgQAHxcCAmtAm/sAAAAASUVORK5CYII=";
|
|
image.addEventListener("load", async (event) => {
|
|
console.screenshot(picture);
|
|
});
|
|
}
|
|
|
|
function testHTMLCanvasElement() {
|
|
let canvas = document.createElement("canvas");
|
|
canvas.width = 2;
|
|
canvas.height = 2;
|
|
|
|
let context = canvas.getContext("2d");
|
|
context.fillStyle = "red";
|
|
context.fillRect(0, 0, 2, 2);
|
|
|
|
console.screenshot(canvas);
|
|
}
|
|
|
|
function testImageBitmap() {
|
|
// 2x2 red square
|
|
let image = document.createElement("img");
|
|
image.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAAXNSR0IArs4c6QAAABNJREFUCB1j/M/AAEQMDEwgAgQAHxcCAmtAm/sAAAAASUVORK5CYII=";
|
|
image.addEventListener("load", async (event) => {
|
|
let imageBitmap = await createImageBitmap(image);
|
|
console.screenshot(imageBitmap);
|
|
});
|
|
}
|
|
|
|
function createCanvas2DTest() {
|
|
let canvas = document.createElement("canvas");
|
|
canvas.width = 2;
|
|
canvas.height = 2;
|
|
return canvas.getContext("2d");
|
|
}
|
|
|
|
function test()
|
|
{
|
|
let suite = InspectorTest.createAsyncSuite("console.screenshot");
|
|
|
|
function addTest({name, expression, imageMessageAddedCallback, shouldCaptureViewport, shouldError}) {
|
|
suite.addTestCase({
|
|
name,
|
|
async test() {
|
|
let [event] = await Promise.all([
|
|
WI.consoleManager.awaitEvent(WI.ConsoleManager.Event.MessageAdded),
|
|
InspectorTest.evaluateInPage(expression),
|
|
]);
|
|
|
|
let {message} = event.data;
|
|
|
|
if (message.level === WI.ConsoleMessage.MessageLevel.Error) {
|
|
InspectorTest.expectThat(shouldError, "Error: " + message.messageText);
|
|
return;
|
|
}
|
|
|
|
InspectorTest.expectEqual(message.type, WI.ConsoleMessage.MessageType.Image, "The added message should be an image.");
|
|
InspectorTest.expectNotEqual(message.messageText, "data:", "The image should not be empty.");
|
|
|
|
try {
|
|
let image = new Image;
|
|
await new Promise((resolve, reject) => {
|
|
image.addEventListener("load", resolve);
|
|
image.addEventListener("error", reject);
|
|
image.src = message.messageText;
|
|
});
|
|
|
|
if (shouldCaptureViewport) {
|
|
InspectorTest.expectGreaterThan(image.width, 2, "The image width should be greater than 2px.");
|
|
InspectorTest.expectGreaterThan(image.height, 2, "The image height should be greater than 2px.");
|
|
} else {
|
|
InspectorTest.expectEqual(image.width, 2, "The image width should be 2px.");
|
|
InspectorTest.expectEqual(image.height, 2, "The image height should be 2px.");
|
|
}
|
|
} catch {
|
|
InspectorTest.expectThat(shouldError, "The image should not load.");
|
|
}
|
|
},
|
|
});
|
|
}
|
|
|
|
addTest({
|
|
name: "console.screenshot.Node.SingleArgument",
|
|
expression: `console.screenshot(document.querySelector("#testNode"))`,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.Node.MultipleArguments",
|
|
expression: `console.screenshot(document.querySelector("#testNode"), "test")`,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.Node.DetachedScreenshotable.Image",
|
|
expression: `testHTMLImageElement()`,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.Node.DetachedScreenshotable.Picture",
|
|
expression: `testHTMLPictureElement()`,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.Node.DetachedScreenshotable.Canvas",
|
|
expression: `testHTMLCanvasElement()`,
|
|
async imageMessageAddedCallback(message) {
|
|
InspectorTest.expectNotEqual(message.messageText, "data:", "The image should not be empty.");
|
|
|
|
let img = await WI.ImageUtilities.promisifyLoad(message.messageText);
|
|
InspectorTest.expectEqual(img.width, 2, "The image width should be 2px.");
|
|
InspectorTest.expectEqual(img.height, 2, "The image height should be 2px.");
|
|
},
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.Node.DetachedNonScreenshotable",
|
|
expression: `console.screenshot(createDetachedTest())`,
|
|
shouldError: true,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.ImageData",
|
|
expression: `console.screenshot(new ImageData(2, 2))`,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.ImageBitmap",
|
|
expression: `testImageBitmap()`,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.CanvasRenderingContext2D",
|
|
expression: `console.screenshot(createCanvas2DTest())`,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.String.Valid",
|
|
expression: `console.screenshot("test")`,
|
|
shouldCaptureViewport: true,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.String.dataURL.Valid",
|
|
expression: `console.screenshot("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAAXNSR0IArs4c6QAAABNJREFUCB1j/M/AAEQMDEwgAgQAHxcCAmtAm/sAAAAASUVORK5CYII=")`, // 2x2 red square
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.String.dataURL.InvalidMIME",
|
|
expression: `console.screenshot("data:fake/mime")`,
|
|
shouldError: true,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.String.dataURL.InvalidContent",
|
|
expression: `console.screenshot("data:image/png;base64,<INVALID>")`,
|
|
shouldError: true,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.String.dataURL.InvalidNoContent",
|
|
expression: `console.screenshot("data:image/png;a1=b2;base64,")`,
|
|
shouldError: true,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.String.dataURL.ValidNoContent",
|
|
expression: `console.screenshot("data:")`,
|
|
shouldCaptureViewport: true,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.NonScreenshotableTarget",
|
|
expression: `console.screenshot(42)`,
|
|
shouldCaptureViewport: true,
|
|
});
|
|
|
|
addTest({
|
|
name: "console.screenshot.NoArguments",
|
|
expression: `console.screenshot()`,
|
|
shouldCaptureViewport: true,
|
|
});
|
|
|
|
suite.runTestCasesAndFinish();
|
|
}
|
|
</script>
|
|
</head>
|
|
<body onload="runTest()">
|
|
<p>Tests for the console.screenshot API.</p>
|
|
<div id="testNode"></div>
|
|
<style>
|
|
#testNode {
|
|
width: 2px;
|
|
height: 2px;
|
|
background-color: red;
|
|
}
|
|
#detached {
|
|
width: 2px;
|
|
height: 2px;
|
|
background-color: blue;
|
|
}
|
|
</style>
|
|
</body>
|
|
</html>
|