summaryrefslogtreecommitdiffstats
path: root/dom/file/tests/test_fileapi_slice_image.html
blob: c873afa438ec1a06b378635263e1d7b2099e9f94 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
<!DOCTYPE HTML>
<html>
<head>
  <title>Test for File API + Slice</title>
  <script src="/tests/SimpleTest/SimpleTest.js"></script>
  <script type="text/javascript" src="common_blob.js"></script>
  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
</head>

<body>

<p id="display">
  <canvas id=canvas width=1100 height=1100 hidden moz-opaque></canvas>
  <canvas id=testcanvas hidden moz-opaque></canvas>
</p>

<script type="text/javascript">

SimpleTest.waitForExplicitFinish();
SimpleTest.requestLongerTimeout(4);

// Create files containing data we'll test with. We'll want long
// strings to ensure they span multiple buffers while loading

let canvasData;
let testBinaryData;

function imageLoadHandler(event, resolve) {
  let origcanvas = $("canvas");
  let testcanvas = $("testcanvas");
  let image = event.target;
  is(image.naturalWidth, origcanvas.width, "width correct");
  is(image.naturalHeight, origcanvas.height, "height correct");

  testcanvas.width = origcanvas.width;
  testcanvas.height = origcanvas.height;
  testcanvas.getContext("2d").drawImage(image, 0, 0);
  // Do not use |is(testcanvas.toDataURL("image/png"), origcanvas.toDataURL("image/png"), "...");| that results in a _very_ long line.
  let origDataURL = origcanvas.toDataURL("image/png");
  let testDataURL = testcanvas.toDataURL("image/png");
  is(testDataURL.length, origDataURL.length,
     "Length of correct image data");
  ok(testDataURL == origDataURL,
     "Content of correct image data");
  resolve();
}

createCanvasURL()
.then(data => {
  for (var i = 0; i < 256; i++) {
    testBinaryData += String.fromCharCode(i);
  }
  while (testBinaryData.length < 20000) {
    testBinaryData += testBinaryData;
  }

  canvasData = data;
})

// image in the middle
.then(() => {
  return createFile(testBinaryData + canvasData + testBinaryData, "middleTestFile");
})

// image in the middle - loader
.then(file => {
  return new Promise(resolve => {
    is(file.size, canvasData.length + testBinaryData.length * 2, "correct file size (middle)");

    var img = new Image();
    img.src = URL.createObjectURL(file.slice(testBinaryData.length,
                                             testBinaryData.length + canvasData.length));
    img.onload = event => {
      imageLoadHandler(event, resolve);
    }
  });
})

// image at start
.then(() => {
  return createFile(canvasData + testBinaryData, "startTestFile");
})

// image at start - loader
.then(file => {
  return new Promise(resolve => {
    is(file.size, canvasData.length + testBinaryData.length, "correct file size (start)");

    var img = new Image();
    img.src = URL.createObjectURL(file.slice(0, canvasData.length));
    img.onload = event => {
      imageLoadHandler(event, resolve);
    }
  });
})

// image at end
.then(() => {
  return createFile(testBinaryData + canvasData, "endTestFile");
})

// image at end - loader
.then(file => {
  return new Promise(resolve => {
    is(file.size, canvasData.length + testBinaryData.length, "correct file size (end)");

    var img = new Image();
    img.src = URL.createObjectURL(file.slice(testBinaryData.length,
                                             testBinaryData.length + canvasData.length));
    img.onload = event => {
      imageLoadHandler(event, resolve);
    }
  });
})

// image past end
.then(() => {
  return createFile(testBinaryData + canvasData, "pastEndTestFile");
})

// image past end - loader
.then(file => {
  return new Promise(resolve => {
    is(file.size, canvasData.length + testBinaryData.length, "correct file size (end)");

    var img = new Image();
    img.src = URL.createObjectURL(file.slice(testBinaryData.length,
                                             testBinaryData.length + canvasData.length + 1000));
    img.onload = event => {
      imageLoadHandler(event, resolve);
    }
  });
})

.then(SimpleTest.finish);

</script>
</body>
</html>