Skip to content

Commit 840eb7f

Browse files
TheSpyderTheSpyder
committed
Improved canvas tests
1 parent ea9f3cd commit 840eb7f

File tree

2 files changed

+66
-77
lines changed

2 files changed

+66
-77
lines changed

‎lib/js/tests/Webapi/Canvas/Webapi__Canvas__Canvas2d__test.js‎

Lines changed: 29 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
'use strict';
22

3-
var List = require("rescript/lib/js/list.js");
43
var Webapi__Canvas__Canvas2d = require("../../../src/Webapi/Canvas/Webapi__Canvas__Canvas2d.js");
54

65
var canvasEl = document.createElement("canvas");
@@ -95,45 +94,23 @@ ctx.arc(1, 1, 4, 1, 3, true);
9594

9695
ctx.rect(0, 0, 10, 10);
9796

98-
ctx.isPointInPath(0, 0);
97+
var pointInPath = ctx.isPointInPath(0, 0);
9998

10099
var linearGradient = ctx.createLinearGradient(0.0, 0.0, 0.0, 0.0);
101100

102101
ctx.strokeStyle = linearGradient;
103102

104-
ctx.createRadialGradient(0.0, 0.0, 0.0, 0.0, 0.0, 0.0);
103+
var radialGradient = ctx.createRadialGradient(0.0, 0.0, 0.0, 0.0, 0.0, 0.0);
105104

106105
linearGradient.addColorStop(0.0, "red");
107106

108-
var partial_arg = document.createElement("img");
109-
110-
List.map((function (param) {
111-
return createPattern(ctx, partial_arg, (function () {
112-
switch (param) {
113-
case "repeat" :
114-
return "repeat";
115-
case "repeatX" :
116-
return "repeat-x";
117-
case "repeatY" :
118-
return "repeat-y";
119-
case "noRepeat" :
120-
return "no-repeat";
121-
122-
}
123-
})());
124-
}), {
125-
hd: "noRepeat",
126-
tl: {
127-
hd: "repeat",
128-
tl: {
129-
hd: "repeatX",
130-
tl: {
131-
hd: "repeatY",
132-
tl: /* [] */0
133-
}
134-
}
135-
}
136-
});
107+
var noRepeatPatern = createPattern(ctx, document.createElement("img"), "no-repeat");
108+
109+
var repeatPatern = createPattern(ctx, document.createElement("img"), "repeat");
110+
111+
var repeatXPatern = createPattern(ctx, document.createElement("img"), "repeat-x");
112+
113+
var repeatYPatern = createPattern(ctx, document.createElement("img"), "repeat-y");
137114

138115
var measureText = ctx.measureText("foo");
139116

@@ -151,15 +128,19 @@ ctx.drawImage(image, 0.0, 0.0, 16.0, 16.0);
151128

152129
ctx.drawImage(image, 0.0, 0.0, 16.0, 16.0, 0.0, 0.0, 16.0, 16.0);
153130

154-
var imageData = ctx.createImageData(0.0, 0.0);
131+
var imageFromCoords = ctx.createImageData(0.0, 0.0);
132+
133+
var imageFromData = ctx.createImageData(imageFromCoords);
134+
135+
var w = imageFromCoords.width;
155136

156-
ctx.createImageData(imageData);
137+
var h = imageFromCoords.height;
157138

158-
ctx.getImageData(0.0, 0.0, 0.0, 0.0);
139+
var frameFromImage = ctx.getImageData(0.0, 0.0, 0.0, 0.0);
159140

160-
ctx.putImageData(imageData, 0.0, 0.0);
141+
ctx.putImageData(imageFromCoords, 0.0, 0.0);
161142

162-
ctx.putImageData(imageData, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0);
143+
ctx.putImageData(imageFromCoords, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0);
163144

164145
ctx.font = "10px Courier";
165146

@@ -187,10 +168,20 @@ ctx.fill(path);
187168

188169
exports.canvasEl = canvasEl;
189170
exports.ctx = ctx;
171+
exports.pointInPath = pointInPath;
190172
exports.linearGradient = linearGradient;
173+
exports.radialGradient = radialGradient;
174+
exports.noRepeatPatern = noRepeatPatern;
175+
exports.repeatPatern = repeatPatern;
176+
exports.repeatXPatern = repeatXPatern;
177+
exports.repeatYPatern = repeatYPatern;
191178
exports.measureText = measureText;
192179
exports.width = width;
193180
exports.image = image;
194-
exports.imageData = imageData;
181+
exports.imageFromCoords = imageFromCoords;
182+
exports.imageFromData = imageFromData;
183+
exports.w = w;
184+
exports.h = h;
185+
exports.frameFromImage = frameFromImage;
195186
exports.path = path;
196187
/* canvasEl Not a pure module */

‎tests/Webapi/Canvas/Webapi__Canvas__Canvas2d__test.res‎

Lines changed: 37 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ open Webapi.Canvas
22
open Webapi.Canvas.Canvas2d
33
open Webapi.Dom
44

5-
let canvasEl = document->Document.createElement("canvas")
6-
let ctx = canvasEl->CanvasElement.getContext2d
5+
let canvasEl: Dom.element = document->Document.createElement("canvas")
6+
let ctx: t = canvasEl->CanvasElement.getContext2d
77

88
ctx->save
99
ctx->restore
@@ -25,7 +25,7 @@ setStrokeStyle(ctx, String, "red")
2525
setFillStyle(ctx, String, "red")
2626

2727
switch fillStyle(ctx) {
28-
| (Gradient, g) => g->addColorStop(0.0, "red")
28+
| (Gradient, g: gradient) => g->addColorStop(0.0, "red")
2929
| (String, s) => Js.log(s)
3030
| (Pattern, _) => ()
3131
}
@@ -53,49 +53,47 @@ ctx->bezierCurveTo(~cp1x=1., ~cp1y=1., ~cp2x=2., ~cp2y=2., ~x=4., ~y=4.)
5353
ctx->arcTo(~x1=1., ~y1=1., ~x2=2., ~y2=2., ~r=4.)
5454
ctx->arc(~x=1., ~y=1., ~r=4., ~startAngle=1., ~endAngle=3., ~anticw=true)
5555
ctx->rect(~x=0., ~y=0., ~w=10., ~h=10.)
56-
let _ = ctx->isPointInPath(~x=0., ~y=0.)
56+
let pointInPath: bool = ctx->isPointInPath(~x=0., ~y=0.)
5757

58-
let linearGradient = ctx->createLinearGradient(~x0=0.0, ~y0=0.0, ~x1=0.0, ~y1=0.0)
58+
let linearGradient: gradient = ctx->createLinearGradient(~x0=0.0, ~y0=0.0, ~x1=0.0, ~y1=0.0)
5959
setStrokeStyle(ctx, Gradient, linearGradient)
60-
let _ = ctx->createRadialGradient(~x0=0.0, ~y0=0.0, ~x1=0.0, ~y1=0.0, ~r0=0.0, ~r1=0.0)
60+
let radialGradient: gradient = ctx->createRadialGradient(~x0=0.0, ~y0=0.0, ~x1=0.0, ~y1=0.0, ~r0=0.0, ~r1=0.0)
6161
linearGradient->addColorStop(0.0, "red")
62-
let _ = List.map(
63-
ctx->createPattern(document->Document.createElement("img")),
64-
list{#noRepeat, #repeat, #repeatX, #repeatY},
65-
)
62+
let noRepeatPatern: pattern = ctx->createPattern(document->Document.createElement("img"), #noRepeat)
63+
let repeatPatern: pattern = ctx->createPattern(document->Document.createElement("img"), #repeat)
64+
let repeatXPatern: pattern = ctx->createPattern(document->Document.createElement("img"), #repeatX)
65+
let repeatYPatern: pattern = ctx->createPattern(document->Document.createElement("img"), #repeatY)
6666

67-
let measureText = ctx->measureText("foo")
68-
let width = width(measureText)
67+
let measureText: measureText = ctx->measureText("foo")
68+
let width: float = width(measureText)
6969
ctx->fillText("foo!", ~x=0.0, ~y=0.0, ~maxWidth=width, ())
7070
ctx->strokeText("foo!", ~x=0.0, ~y=0.0, ~maxWidth=width, ())
7171

72-
let image = HtmlImageElement.makeWithSize(16, 16)
73-
let _: unit = ctx->drawImage(#HtmlImageElement(image), ~dx=0.0, ~dy=0.0)
74-
let _: unit =
75-
ctx->drawImageScale(#HtmlImageElement(image), ~dx=0.0, ~dy=0.0, ~dWidth=16.0, ~dHeight=16.0)
76-
let _: unit =
77-
ctx->drawImageFull(
78-
#HtmlImageElement(image),
79-
~sx=0.0,
80-
~sy=0.0,
81-
~sWidth=16.0,
82-
~sHeight=16.0,
83-
~dx=0.0,
84-
~dy=0.0,
85-
~dHeight=16.0,
86-
~dWidth=16.0,
87-
)
88-
89-
let imageData = createImageDataCoords(ctx, ~width=0.0, ~height=0.0)
90-
let _ = createImageDataFromImage(ctx, imageData)
91-
let _ = Image.width(imageData)
92-
let _ = Image.height(imageData)
93-
94-
let _ = getImageData(ctx, ~sx=0.0, ~sy=0.0, ~sw=0.0, ~sh=0.0)
95-
let _: unit = putImageData(ctx, ~imageData, ~dx=0.0, ~dy=0.0)
96-
let _: unit = putImageDataWithDirtyRect(
72+
let image: HtmlImageElement.t = HtmlImageElement.makeWithSize(16, 16)
73+
ctx->drawImage(#HtmlImageElement(image), ~dx=0.0, ~dy=0.0)
74+
ctx->drawImageScale(#HtmlImageElement(image), ~dx=0.0, ~dy=0.0, ~dWidth=16.0, ~dHeight=16.0)
75+
ctx->drawImageFull(
76+
#HtmlImageElement(image),
77+
~sx=0.0,
78+
~sy=0.0,
79+
~sWidth=16.0,
80+
~sHeight=16.0,
81+
~dx=0.0,
82+
~dy=0.0,
83+
~dHeight=16.0,
84+
~dWidth=16.0,
85+
)
86+
87+
let imageFromCoords: Image.t = createImageDataCoords(ctx, ~width=0.0, ~height=0.0)
88+
let imageFromData: Image.t = createImageDataFromImage(ctx, imageFromCoords)
89+
let w: float = Image.width(imageFromCoords)
90+
let h: float = Image.height(imageFromCoords)
91+
92+
let frameFromImage = getImageData(ctx, ~sx=0.0, ~sy=0.0, ~sw=0.0, ~sh=0.0)
93+
putImageData(ctx, ~imageData=imageFromCoords, ~dx=0.0, ~dy=0.0)
94+
putImageDataWithDirtyRect(
9795
ctx,
98-
~imageData,
96+
~imageData=imageFromCoords,
9997
~dx=0.0,
10098
~dy=0.0,
10199
~dirtyX=0.0,
@@ -114,7 +112,7 @@ ctx->fillRect(~x=1., ~y=0., ~w=10., ~h=10.)
114112
ctx->strokeRect(~x=1., ~y=0., ~w=10., ~h=10.)
115113
ctx->clearRect(~x=1., ~y=0., ~w=10., ~h=10.)
116114

117-
let path = newPath2D("M24.85,10.126c2.018-4.783,6.628-8.125,11.99-8.125c7.223"
115+
let path: path2d = newPath2D("M24.85,10.126c2.018-4.783,6.628-8.125,11.99-8.125c7.223"
118116
++ ",0,12.425,6.179,13.079,13.543 c0,0,0.353,1.828-0.424,5.119c-1.058,4.482"
119117
++ "-3.545,8.464-6.898,11.503L24.85,48L7.402,32.165c-3.353-3.038-5.84-7.021"
120118
++ "-6.898-11.503 c-0.777-3.291-0.424-5.119-0.424-5.119C0.734,8.179,5.936,2"

0 commit comments

Comments
 (0)