[canvaskit] Add test for skottie to catch framebuffer issues
Would have helped notice
https://skia-review.googlesource.com/c/skia/+/241757
when Gold results changed.
Change-Id: I0c7b75a7c6cd5d9952eb98056c98b1118471c330
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/241763
Reviewed-by: Nathaniel Nifong <nifong@google.com>
diff --git a/modules/canvaskit/tests/assets/animated_gif.json b/modules/canvaskit/tests/assets/animated_gif.json
new file mode 100644
index 0000000..1f049f6
--- /dev/null
+++ b/modules/canvaskit/tests/assets/animated_gif.json
@@ -0,0 +1,52 @@
+{
+ "v":"4.6.9",
+ "fr":60,
+ "ip":0,
+ "op":200,
+ "w":800,
+ "h":600,
+ "ddd":0,
+
+ "assets": [
+ {
+ "id": "image_0",
+ "p": "flightAnim.gif",
+ "u": "images/",
+ "w": 600,
+ "h": 400
+ }
+ ],
+
+ "layers":[
+ {
+ "ddd":0,
+ "ind":1,
+ "ty":2,
+ "refId": "image_0",
+ "nm":"Custom Path 1",
+ "ao": 0,
+ "ip": 0,
+ "op": 200,
+ "st": 0,
+ "sr": 1,
+ "bm": 0,
+ "ks": {
+ "o": { "a":0, "k":100 },
+ "r": { "a":1, "k": [
+ { "t": 0, "s": 0, "e": 5 },
+ { "t": 50, "s": 5, "e": -5 },
+ { "t": 150, "s": -5, "e": 0 },
+ { "t": 200 }
+ ]},
+ "p": { "a":0, "k":[ 400, 300, 0 ] },
+ "a": { "a":0, "k":[ 300, 200, 0 ] },
+ "s": { "a":1, "k":[
+ { "t": 0, "s": [ 100, 100, 100 ], "e": [ 150, 150, 100 ] },
+ { "t": 100, "s": [ 150, 150, 100 ], "e": [ 100, 100, 100 ] },
+ { "t": 200 }
+ ]}
+ }
+
+ }
+ ]
+}
diff --git a/modules/canvaskit/tests/assets/flightAnim.gif b/modules/canvaskit/tests/assets/flightAnim.gif
new file mode 100644
index 0000000..7aaa327
--- /dev/null
+++ b/modules/canvaskit/tests/assets/flightAnim.gif
Binary files differ
diff --git a/modules/canvaskit/tests/core.spec.js b/modules/canvaskit/tests/core.spec.js
index 9a6591d..6091398 100644
--- a/modules/canvaskit/tests/core.spec.js
+++ b/modules/canvaskit/tests/core.spec.js
@@ -18,7 +18,7 @@
LoadCanvasKit.then(catchException(done, () => {
// This is taken from example.html
const surface = CanvasKit.MakeCanvasSurface('test');
- expect(surface).toBeTruthy('Could not make surface')
+ expect(surface).toBeTruthy('Could not make surface');
if (!surface) {
done();
return;
diff --git a/modules/canvaskit/tests/skottie.spec.js b/modules/canvaskit/tests/skottie.spec.js
new file mode 100644
index 0000000..91cbd0a
--- /dev/null
+++ b/modules/canvaskit/tests/skottie.spec.js
@@ -0,0 +1,67 @@
+describe('Skottie behavior', function() {
+ let container = document.createElement('div');
+ document.body.appendChild(container);
+ const CANVAS_WIDTH = 600;
+ const CANVAS_HEIGHT = 600;
+
+ beforeEach(function() {
+ container.innerHTML = `
+ <canvas width=600 height=600 id=test></canvas>
+ <canvas width=600 height=600 id=report></canvas>`;
+ });
+
+ afterEach(function() {
+ container.innerHTML = '';
+ });
+
+ it('can draw one with an animated gif', function(done) {
+ const imgPromise = fetch('/assets/flightAnim.gif')
+ .then((response) => response.arrayBuffer());
+ const jsonPromise = fetch('/assets/animated_gif.json')
+ .then((response) => response.text());
+
+ Promise.all([imgPromise, jsonPromise, LoadCanvasKit]).then((values) => {
+ if (!CanvasKit.managed_skottie) {
+ console.warn('Skipping test because not compiled with skottie')
+ done();
+ return;
+ }
+ catchException(done, () => {
+ const imgBuffer = values[0];
+ expect(imgBuffer).toBeTruthy();
+ expect(imgBuffer.byteLength).toBeTruthy();
+ const jsonStr = values[1];
+ expect(jsonStr).toBeTruthy();
+
+ const c = document.getElementById('test');
+ expect(c).toBeTruthy();
+ let surface = CanvasKit.MakeCanvasSurface(c);
+ expect(surface).toBeTruthy('Could not make surface');
+ if (CanvasKit.gpu) {
+ // If we are on GPU, make sure we didn't fallback
+ expect(c).not.toHaveClass('ck-replaced');
+ }
+ const animation = CanvasKit.MakeManagedAnimation(jsonStr, {
+ 'flightAnim.gif': imgBuffer,
+ });
+ expect(animation).toBeTruthy();
+ const bounds = {fLeft: 0, fTop: 0, fRight: 500, fBottom: 500};
+
+ const canvas = surface.getCanvas();
+ canvas.clear(CanvasKit.WHITE);
+ animation.render(canvas, bounds);
+ surface.flush();
+
+ // There was a bug, fixed in https://skia-review.googlesource.com/c/skia/+/241757
+ // that seeking again and drawing again revealed.
+ animation.seek(0.5);
+ canvas.clear(CanvasKit.WHITE);
+ animation.render(canvas, bounds);
+ surface.flush();
+
+ reportSurface(surface, 'skottie_animgif', done);
+ })();
+ });
+ });
+
+});
