// Copyright (c) Microsoft Corporation. All rights reserved. // Licensed under the MIT License. 'use strict'; const IMAGE_HEIGHT = 20 const IMAGE_WIDTH = 15 function getRndColor() { let r = 255*Math.random()|0, g = 255*Math.random()|0, b = 255*Math.random()|0, a = 255*Math.random()|0; return 'rgb(' + r + ',' + g + ',' + b + ',' + a +')'; } function compareTensors(tensorA, tensorB, msg){ for (let i = 0; i < IMAGE_HEIGHT*IMAGE_WIDTH*3; i++) { if(tensorA.data[i]!==tensorB.data[i]){ console.log("Element - " + i + " - " + tensorA.data[i] + " - " + tensorB.data[i]); throw new Error(msg); } } } it('Browser E2E testing - Tensor <--> Image E2E test', async function () { // Creating Image HTML Image Element let img = new Image(); img.crossOrigin = 'Anonymous'; // Creating canvas element const canvas = document.createElement('canvas'); canvas.height = IMAGE_HEIGHT; canvas.width = IMAGE_WIDTH; const context = canvas.getContext('2d'); let y, x; // Filling the canvas with random data for(y = 0; y < IMAGE_HEIGHT; y++) { for(x = 0; x < IMAGE_WIDTH; x++) { context.fillStyle = getRndColor(); context.fillRect(x, y, 1, 1); } } // Copying the canavas data to the image img.src = canvas.toDataURL(); // Testing HTML Image Element --> Tensor --> ImageData --> Tensor img.onload = async () =>{ // Image HTML element to tensor API - HTML const inputTensorHTML = await ort.Tensor.fromImage(img, {norm:{bias:[2,3,9,5],mean:[5,6,17,8]}}); // Tensor to ImageDAta API let newImage = inputTensorHTML.toImageData({norm:{bias:[2/5,3/6,9/17,5/8],mean:[5,6,17,8]}}); // ImageData to tensor API let inputTensorImageData = await ort.Tensor.fromImage(newImage, options={norm:{bias:[2,3,9,5],mean:[5,6,17,8]}}); compareTensors(inputTensorHTML,inputTensorImageData,'BUG in HTML image element & ImageData use case'); } // Copying the canavas data to the image as Data URL let image = canvas.toDataURL(); // Testing Data URL --> Tensor --> Data URL --> Tensor // Data URL to tensor API - const inputTensorDataURL = await ort.Tensor.fromImage(image,{format:'RBG', norm:{bias:[1,10,5,0],mean:[5,7,11,0]}}); // Tensor to ImageDAta API let newImage = inputTensorDataURL.toDataURL({norm:{bias:[1/5,10/7,5/11,0],mean:[5,7,11,0]}}); // ImageData to tensor API let inputTensorImageData = await ort.Tensor.fromImage(newImage,{format:'RGB', norm:{bias:[1,10,5,0],mean:[5,7,11,0]}}); compareTensors(inputTensorDataURL,inputTensorImageData,'BUG in ImageData & Data URL use case'); // Testing URL --> Tensor --> ImageData --> Tensor let online = navigator.onLine; if(online){ // URL element to tensor API const inputTensorURL = await ort.Tensor.fromImage('https://media.istockphoto.com/id/172859087/photo/square-eggs.jpg?s=2048x2048&w=is&k=20&c=KiBRyyYaoUUSjcJLBh1-qqVu7LW6UQZBopZdva0f5e4=',{norm:{bias:[2,3,9,0],mean:[5,6,17,0]}}); // Tensor to ImageDAta API let newImage = inputTensorURL.toImageData({format:'RGB',norm:{bias:[2/5,3/6,9/17,0],mean:[5,6,17,0]}}); // ImageData to tensor API let inputTensorImageData = await ort.Tensor.fromImage(newImage,{format:'RGB',norm:{bias:[2,3,9,0],mean:[5,6,17,0]}}); compareTensors(inputTensorURL,inputTensorImageData,'BUG in ImageData & URL'); }else{ console.log("No internet connection - didn't test Image URL to tensor API"); } });