#110: parameter support for getImageData (#111)

* fix: support parameters for CanvasRenderingContext2D#getImageData

* #110: throw on zero size, allow negative size

README.md

@@ -195,6 +195,7 @@ canvas.toDataURL.mockReturnValueOnce(
 - [@lekha](https://github.com/lekha)
 - [@yonatankra](https://github.com/yonatankra)
 - [@LitoMore](https://github.com/LitoMore)
+- [@danielrentz](https://github.com/danielrentz)
 
 ## License
 

__tests__/classes/CanvasRenderingContext2D.getImageData.js

@@ -14,18 +14,39 @@ describe('getImageData', () => {
   });
 
   it('should be callable', () => {
-    ctx.getImageData();
+    ctx.getImageData(0, 0, 10, 20);
     expect(ctx.getImageData).toBeCalled();
   });
 
+  it('should throw if less than 4 parameters are given', () => {
+    expect(() => ctx.getImageData()).toThrow(TypeError);
+    expect(() => ctx.getImageData(0)).toThrow(TypeError);
+    expect(() => ctx.getImageData(0, 0)).toThrow(TypeError);
+    expect(() => ctx.getImageData(0, 0, 0)).toThrow(TypeError);
+  });
+
   it('should return a image data from getImageData', () => {
-    expect(ctx.getImageData()).toBeInstanceOf(ImageData);
+    expect(ctx.getImageData(0, 0, 10, 20)).toBeInstanceOf(ImageData);
   });
 
   it('should return a image data from getImageData of proper size', () => {
-    const data = ctx.getImageData();
-    expect(data.width).toBe(400);
-    expect(data.height).toBe(300);
-    expect(data.data.length).toBe(400 * 300 * 4);
+    const data = ctx.getImageData(0, 0, 10, 20);
+    expect(data.width).toBe(10);
+    expect(data.height).toBe(20);
+    expect(data.data.length).toBe(10 * 20 * 4);
+  });
+
+  it('should return image data from getImageData if size is negative', () => {
+    const data = ctx.getImageData(0, 0, -10, -20);
+    expect(data.width).toBe(10);
+    expect(data.height).toBe(20);
+    expect(data.data.length).toBe(10 * 20 * 4);
+  });
+
+  it('should throw if width or height are zero', () => {
+    expect(() => ctx.getImageData(0, 0, 0, 1)).toThrow(DOMException);
+    expect(() => ctx.getImageData(0, 0, 0, 1)).toThrow('source width is 0');
+    expect(() => ctx.getImageData(0, 0, 1, 0)).toThrow('source height is 0');
+    expect(() => ctx.getImageData(0, 0, 0, 0)).toThrow('source width is 0');
   });
 });

__tests__/vis.js

@@ -7,7 +7,6 @@
 describe('vis', () => {
   it('vis can pass', () => {
     // const div = document.createElement('canvas');
-
     // const line = new Line(div, {
     //   data: [
     //     { x: 'A', y: 10 },
@@ -17,13 +16,9 @@ describe('vis', () => {
     //   xField: 'x',
     //   yField: 'y',
     // });
-
     // line.render();
-
     // expect(line.container.querySelector('canvas')).not.toBe(null);
-
     // line.destroy();
-
     // expect(line.container.querySelector('canvas')).toBe(null);
   });
 });

src/classes/CanvasRenderingContext2D.js

@@ -1053,8 +1053,25 @@ export default class CanvasRenderingContext2D {
     return this._fontStack[this._stackIndex];
   }
 
-  getImageData() {
-    return new ImageData(this._canvas.width, this._canvas.height);
+  getImageData(x, y, w, h) {
+    if (arguments.length < 4)
+      throw new TypeError(
+        "Failed to execute 'getImageData' on '" +
+          this.constructor.name +
+          "': 4 arguments required, but only " +
+          arguments.length +
+          ' present.'
+      );
+    if (w == 0 || h == 0)
+      throw new DOMException(
+        "Failed to execute 'getImageData' on '" +
+          this.constructor.name +
+          "': The source " +
+          (w == 0 ? 'width' : 'height') +
+          ' is 0.',
+        'IndexSizeError'
+      );
+    return new ImageData(Math.abs(w), Math.abs(h));
   }
 
   getLineDash() {