detected-postMessage.https.html (3934B)
1 <!DOCTYPE html> 2 <script src="/resources/testharness.js"></script> 3 <script src="/resources/testharnessreport.js"></script> 4 <script src="resources/shapedetection-helpers.js"></script> 5 <script> 6 7 // These tests verify that Detected{Face, Barcode, Text} can be passed to 8 // postMessage(). 9 const postMessageTests = 10 [ 11 { 12 createDetector: () => { return new FaceDetector(); }, 13 mockTestName: "FaceDetectionTest", 14 detectionResultTest: FaceDetectorDetectionResultTest, 15 name: "Face - DetectedFace can be passed to postMessage()" 16 }, 17 { 18 createDetector: () => { return new BarcodeDetector(); }, 19 mockTestName: "BarcodeDetectionTest", 20 detectionResultTest: BarcodeDetectorDetectionResultTest, 21 name: "Barcode - DetectedBarcode can be passed to postMessage()" 22 }, 23 { 24 createDetector: () => { return new TextDetector(); }, 25 mockTestName: "TextDetectionTest", 26 detectionResultTest: TextDetectorDetectionResultTest, 27 name: "Text - DetectedText can be passed to postMessage()", 28 }, 29 ]; 30 31 for (let postMessageTest of postMessageTests) { 32 detection_test(postMessageTest.mockTestName, async t => { 33 const img = new Image(); 34 const imgWatcher = new EventWatcher(t, img, ["load", "error"]); 35 img.src = "/images/green-16x16.png"; 36 await imgWatcher.wait_for("load"); 37 38 const canvas = document.createElement("canvas"); 39 canvas.getContext("2d").drawImage(img, 0, 0); 40 41 const detector = postMessageTest.createDetector(); 42 const detectionResult = await detector.detect(canvas.getContext("2d") 43 .getImageData(0, 0, canvas.width, canvas.height)); 44 45 const msgWatcher = new EventWatcher(t, window, ['message']); 46 window.postMessage(detectionResult); 47 const evt = await msgWatcher.wait_for('message'); 48 postMessageTest.detectionResultTest(evt.data) 49 }, postMessageTest.name); 50 } 51 52 function FaceDetectorDetectionResultTest(detectionResult) { 53 assert_equals(detectionResult.length, 3, "Number of faces"); 54 assert_equals(detectionResult[0].landmarks.length, 2, "Number of landmarks"); 55 assert_object_equals(detectionResult[0].landmarks[0], 56 {type : 'eye', locations : [{x : 4.0, y : 5.0}]}, 57 "landmark #1"); 58 assert_equals(detectionResult[0].landmarks[1].locations.length, 8, 59 "Number of locations along eye"); 60 assert_object_equals(detectionResult[1].landmarks[0], 61 {type : 'nose', locations : [{x : 100.0, y : 50.0}]}, 62 "landmark #2"); 63 assert_equals(detectionResult[1].landmarks[1].locations.length, 9, 64 "Number of locations along nose"); 65 } 66 67 function BarcodeDetectorDetectionResultTest(detectionResult) { 68 assert_equals(detectionResult.length, 2, "Number of barcodes"); 69 assert_equals(detectionResult[0].rawValue, "cats", "barcode 1"); 70 assert_equals(detectionResult[0].format, "qr_code", "barcode 1 format"); 71 assert_equals(detectionResult[1].rawValue, "dogs", "barcode 2"); 72 assert_equals(detectionResult[1].format, "code_128", "barcode 2 format"); 73 } 74 75 function TextDetectorDetectionResultTest(detectionResult) { 76 assert_equals(detectionResult.length, 2, "Number of textBlocks"); 77 assert_equals(detectionResult[0].rawValue, "cats", "textBlock 1"); 78 assert_equals(detectionResult[1].rawValue, "dogs", "textBlock 2"); 79 for (let i = 0; i < detectionResult.length; i++) { 80 assert_equals(detectionResult[i].boundingBox.x, detectionResult[i].cornerPoints[0].x); 81 assert_equals(detectionResult[i].boundingBox.y, detectionResult[i].cornerPoints[0].y); 82 assert_equals(detectionResult[i].boundingBox.width, 83 detectionResult[i].cornerPoints[2].x - detectionResult[i].cornerPoints[3].x); 84 assert_equals(detectionResult[i].boundingBox.height, 85 detectionResult[i].cornerPoints[2].y - detectionResult[i].cornerPoints[1].y); 86 } 87 88 } 89 90 </script>