134 lines
4.4 KiB
JavaScript
134 lines
4.4 KiB
JavaScript
/** @odoo-module **/
|
|
/* global ZXing */
|
|
|
|
import { browser } from "@web/core/browser/browser";
|
|
import {
|
|
makeDeferred,
|
|
nextTick,
|
|
patchWithCleanup,
|
|
triggerEvent,
|
|
} from "@web/../tests/helpers/utils";
|
|
|
|
import { scanBarcode, BarcodeDialog } from "@web/webclient/barcode/barcode_scanner";
|
|
|
|
QUnit.module("Barcode scanner", {});
|
|
|
|
QUnit.test("Barcode scanner crop overlay", async (assert) => {
|
|
const firstBarcodeValue = "Odoo";
|
|
const secondBarcodeValue = "O-CMD-TEST";
|
|
|
|
let barcodeToGenerate = firstBarcodeValue;
|
|
let videoReady = makeDeferred();
|
|
|
|
function mockUserMedia() {
|
|
const canvas = document.createElement("canvas");
|
|
const ctx = canvas.getContext("2d");
|
|
const stream = canvas.captureStream();
|
|
|
|
const multiFormatWriter = new ZXing.MultiFormatWriter();
|
|
const bitMatrix = multiFormatWriter.encode(
|
|
barcodeToGenerate,
|
|
ZXing.BarcodeFormat.QR_CODE,
|
|
250,
|
|
250,
|
|
null
|
|
);
|
|
canvas.width = bitMatrix.width;
|
|
canvas.height = bitMatrix.height;
|
|
for (let x = 0; x < bitMatrix.width; x++) {
|
|
for (let y = 0; y < bitMatrix.height; y++) {
|
|
if (bitMatrix.get(x, y)) {
|
|
ctx.beginPath();
|
|
ctx.rect(x, y, 1, 1);
|
|
ctx.stroke();
|
|
}
|
|
}
|
|
}
|
|
return stream;
|
|
}
|
|
// simulate an environment with a camera/webcam
|
|
patchWithCleanup(
|
|
browser,
|
|
Object.assign({}, browser, {
|
|
navigator: {
|
|
mediaDevices: {
|
|
getUserMedia: mockUserMedia,
|
|
},
|
|
},
|
|
})
|
|
);
|
|
|
|
patchWithCleanup(BarcodeDialog.prototype, {
|
|
async isVideoReady() {
|
|
return this._super(...arguments).then(() => {
|
|
videoReady.resolve();
|
|
});
|
|
},
|
|
onResize(overlayInfo) {
|
|
assert.step(JSON.stringify(overlayInfo));
|
|
return this._super(...arguments);
|
|
},
|
|
});
|
|
|
|
const firstBarcodeFound = scanBarcode();
|
|
await videoReady;
|
|
// Needed due to the change on the props in the Crop component
|
|
await nextTick();
|
|
const cropIconSelector = ".o_crop_icon";
|
|
const cropIcon = document.querySelector(cropIconSelector);
|
|
const cropOverlay = document.querySelector(".o_crop_overlay");
|
|
const cropContainer = document.querySelector(".o_crop_container");
|
|
const cropIconPosition = cropIcon.getBoundingClientRect();
|
|
const cropOverlayPosition = cropOverlay.getBoundingClientRect();
|
|
await triggerEvent(cropContainer, cropIconSelector, "touchstart", {
|
|
touches: [
|
|
{
|
|
identifier: 0,
|
|
clientX: cropIconPosition.x + cropIconPosition.width / 2,
|
|
clientY: cropIconPosition.y + cropIconPosition.height / 2,
|
|
target: cropIcon,
|
|
},
|
|
],
|
|
});
|
|
await triggerEvent(cropContainer, cropIconSelector, "touchmove", {
|
|
touches: [
|
|
{
|
|
identifier: 0,
|
|
clientX: cropOverlayPosition.right,
|
|
clientY: cropOverlayPosition.bottom,
|
|
target: cropIcon,
|
|
},
|
|
],
|
|
});
|
|
await triggerEvent(cropContainer, cropIconSelector, "touchend", {});
|
|
const firstValueScanned = await firstBarcodeFound;
|
|
assert.strictEqual(
|
|
firstValueScanned,
|
|
firstBarcodeValue,
|
|
`The detected barcode should be the same as generated (${firstBarcodeValue})`
|
|
);
|
|
|
|
// Do another scan barcode to the test position of the overlay saved in the locale storage
|
|
// Reset all values for the second test
|
|
barcodeToGenerate = secondBarcodeValue;
|
|
videoReady = makeDeferred();
|
|
|
|
const secondBarcodeFound = scanBarcode();
|
|
await videoReady;
|
|
const secondValueScanned = await secondBarcodeFound;
|
|
assert.strictEqual(
|
|
secondValueScanned,
|
|
secondBarcodeValue,
|
|
`The detected barcode should be the same as generated (${secondBarcodeValue})`
|
|
);
|
|
|
|
assert.verifySteps(
|
|
[
|
|
JSON.stringify({ x: 25, y: 100, width: 200, height: 50 }),
|
|
JSON.stringify({ x: 0, y: 0, width: 250, height: 250 }),
|
|
JSON.stringify({ x: 0, y: 0, width: 250, height: 250 }),
|
|
],
|
|
"We should haves three resize event; one for the default position, another one for the all frame and the last one must be the same as the saved second position"
|
|
);
|
|
});
|