From 0d89d668e4dd4041edcf5616b367c840ec4a0046 Mon Sep 17 00:00:00 2001 From: janekptacijarabaci Date: Sun, 24 Jun 2018 20:33:07 +0200 Subject: DevTools - Eyedropper Tool - Used "createImageBitmap(canvas.toBlob())" instead of "createImageBitmap(ctx.getImageData())" Issue #544 --- devtools/server/actors/highlighters/eye-dropper.js | 30 ++++++++++++---------- 1 file changed, 16 insertions(+), 14 deletions(-) (limited to 'devtools') diff --git a/devtools/server/actors/highlighters/eye-dropper.js b/devtools/server/actors/highlighters/eye-dropper.js index a90ec22bd..bbfa2d78c 100644 --- a/devtools/server/actors/highlighters/eye-dropper.js +++ b/devtools/server/actors/highlighters/eye-dropper.js @@ -191,20 +191,22 @@ EyeDropper.prototype = { }, prepareImageCapture() { - // Get the image data from the content window. - let imageData = getWindowAsImageData(this.win); - - // We need to transform imageData to something drawWindow will consume. An ImageBitmap - // works well. We could have used an Image, but doing so results in errors if the page - // defines CSP headers. - this.win.createImageBitmap(imageData).then(image => { - this.pageImage = image; - // We likely haven't drawn anything yet (no mousemove events yet), so start now. - this.draw(); + // Get the canvas from the content window. + let canvas = getWindowAsImageData(this.win); + + canvas.toBlob(blob => { + // We need to transform imageData to something drawWindow will consume. An ImageBitmap + // works well. We could have used an Image, but doing so results in errors if the page + // defines CSP headers. + this.win.createImageBitmap(blob).then(image => { + this.pageImage = image; + // We likely haven't drawn anything yet (no mousemove events yet), so start now. + this.draw(); - // Set an attribute on the root element to be able to run tests after the first draw - // was done. - this.getElement("root").setAttribute("drawn", "true"); + // Set an attribute on the root element to be able to run tests after the first draw + // was done. + this.getElement("root").setAttribute("drawn", "true"); + }); }); }, @@ -486,7 +488,7 @@ function getWindowAsImageData(win) { ctx.scale(scale, scale); ctx.drawWindow(win, win.scrollX, win.scrollY, width, height, "#fff"); - return ctx.getImageData(0, 0, canvas.width, canvas.height); + return canvas; } /** -- cgit v1.2.3