test(zoom): Add test codes for zoom callbacks

Test codes for onzoomstart, onzoom and onzoomend
after firing 'mousedown', it should fire 'mouseup' to not affect other test cases

Ref #617
Close #636

spec/interactions/zoom-spec.js

@@ -70,6 +70,10 @@ describe("ZOOM", function() {
 	});
 
 	describe("zoom event", () => {
+		const spyOnZoomStart = sinon.spy();
+		const spyOnZoom = sinon.spy();
+		const spyOnZoomEnd = sinon.spy();
+
 		before(() => {
 			args = {
 				size: {
@@ -85,7 +89,10 @@ describe("ZOOM", function() {
 				zoom: {
 					enabled: {
                         type: "wheel"
-                    }
+                    },
+					onzoomstart: spyOnZoomStart,
+					onzoom: spyOnZoom,
+					onzoomend: spyOnZoomEnd
 				}
 			};
 		});
@@ -100,6 +107,75 @@ describe("ZOOM", function() {
 			expect(+main.select(`.${CLASS.eventRect}-2`).attr("x")).to.be.above(xValue);
 		});
 
+		it("check for zoom event callbacks", done => {
+			const main = chart.internal.main;
+			const eventRect = main.select(`.${CLASS.eventRect}-2`).node();
+
+			util.fireEvent(eventRect, "mousedown", {
+				clientX: 100,
+				clientY: 150
+			}, chart);
+
+			new Promise((resolve, reject) => {
+				util.fireEvent(eventRect, "mousedown", {
+					clientX: 100,
+					clientY: 150
+				}, chart);
+
+				resolve();
+			}).then(() => {
+				return new Promise((resolve, reject) => {
+					setTimeout(() => {
+						if (spyOnZoomStart.called) {
+							util.fireEvent(eventRect, "mousemove", {
+								clientX: 100,
+								clientY: 150
+							}, chart);
+
+							resolve("--> onzoomstart callback called!");
+						}
+					}, 500);
+				});
+			}).then((msg) => {
+				console.log(msg);
+
+				return new Promise((resolve, reject) => {
+					setTimeout(() => {
+						if (spyOnZoom.called) {
+							if (spyOnZoom.called) {
+								util.fireEvent(eventRect, "mouseup", {
+									clientX: 100,
+									clientY: 150
+								}, chart);
+
+								// call explicitly, due to mouseup isn't firing well programmatically.
+								chart.internal.onZoomEnd();
+
+								resolve("--> onzoom callback called!");
+							}
+						};
+					}, 500);
+				})
+			}).then((msg) => {
+				console.log(msg);
+				console.log("--> onzoomend callback called!");
+
+				expect(spyOnZoomEnd.called).to.be.true;
+
+				done();
+			});
+		});
+
+		it("check for data zoom", () => {
+			const main = chart.internal.main;
+			const xValue = +main.select(`.${CLASS.eventRect}-2`).attr("x");
+
+			// when
+			chart.zoom([0,3]);  // zoom in
+
+			expect(+main.select(`.${CLASS.eventRect}-2`).attr("x")).to.be.above(xValue);
+		});
+
 		it("check for x axis resize after zoom", () => {
 			const main = chart.internal.main;
 			const rx = /H(\d+)/;