X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;ds=sidebyside;f=auto_tests%2Ftests%2Fgrid_per_axis.js;h=6ca239c254266a9a5461190d8311e165a10fa519;hb=refs%2Fheads%2F558-fill-artifacts;hp=1e71aad03a6b1817c9c65b9452d3e2d87b181201;hpb=4a0567daedb72437ba4b780f3f13670a1467d38c;p=dygraphs.git diff --git a/auto_tests/tests/grid_per_axis.js b/auto_tests/tests/grid_per_axis.js index 1e71aad..6ca239c 100644 --- a/auto_tests/tests/grid_per_axis.js +++ b/auto_tests/tests/grid_per_axis.js @@ -1,30 +1,29 @@ /** - * @fileoverview Test cases for the option "stepPlot" especially for the - * scenario where the option is not set for the whole graph but - * for single series. + * @fileoverview Test cases for the per-axis grid options, including the new + * option "gridLinePattern". * * @author david.eberlein@ch.sauter-bc.com (Fr. Sauter AG) */ -var StepTestCase = TestCase("grid_per_axis"); +describe("grid-per-axis", function() { -StepTestCase.prototype.setUp = function() { +beforeEach(function() { document.body.innerHTML = "
"; -}; +}); -StepTestCase.origFunc = Dygraph.getContext; +var origFunc = Dygraph.getContext; -StepTestCase.prototype.setUp = function() { +beforeEach(function() { document.body.innerHTML = ""; Dygraph.getContext = function(canvas) { - return new Proxy(StepTestCase.origFunc(canvas)); + return new Proxy(origFunc(canvas)); }; -}; +}); -StepTestCase.prototype.tearDown = function() { - Dygraph.getContext = StepTestCase.origFunc; -}; +afterEach(function() { + Dygraph.getContext = origFunc; +}); -StepTestCase.prototype.testIndependantGrids = function() { +it('testIndependentGrids', function() { var opts = { width : 480, height : 320, @@ -51,7 +50,7 @@ StepTestCase.prototype.testIndependantGrids = function() { var graph = document.getElementById("graph"); var g = new Dygraph(graph, data, opts); - htx = g.hidden_ctx_; + var htx = g.hidden_ctx_; // The expected gridlines var yGridlines = [ 0, 20, 40, 60, 80, 100, 120 ]; @@ -73,7 +72,7 @@ StepTestCase.prototype.testIndependantGrids = function() { for ( var i = 0; i < gridlines[axis].length; i++) { // Check the labels: var labels = Util.getYLabels(axis + 1); - assertEquals("Expected label not found.", gridlines[axis][i], labels[i]); + assert.equal(gridlines[axis][i], labels[i], "Expected label not found."); // Check that the grid was drawn. y = halfDown(g.toDomYCoord(gridlines[axis][i], axis)); @@ -82,9 +81,9 @@ StepTestCase.prototype.testIndependantGrids = function() { CanvasAssertions.assertLineDrawn(htx, p1, p2, attrs); } } -}; +}); -StepTestCase.prototype.testPerAxisGridColors = function() { +it('testPerAxisGridColors', function() { var opts = { width : 480, height : 320, @@ -115,7 +114,7 @@ StepTestCase.prototype.testPerAxisGridColors = function() { [ 5, 110, 333 ] ]; var graph = document.getElementById("graph"); var g = new Dygraph(graph, data, opts); - htx = g.hidden_ctx_; + var htx = g.hidden_ctx_; // The expected gridlines var yGridlines = [ 20, 40, 60, 80, 100, 120 ]; @@ -137,12 +136,12 @@ StepTestCase.prototype.testPerAxisGridColors = function() { for ( var i = 0; i < gridlines[axis].length; i++) { y = halfDown(g.toDomYCoord(gridlines[axis][i], axis)); // Check the grid colors. - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " + y, - gridColors[axis], Util.samplePixel(g.hidden_, x, y)); + assert.deepEqual(gridColors[axis], Util.samplePixel(g.hidden_, x, y), + "Unexpected grid color found at pixel: x: " + x + "y: " + y); } } -}; -StepTestCase.prototype.testPerAxisGridWidth = function() { +}); +it('testPerAxisGridWidth', function() { var opts = { width : 480, height : 320, @@ -175,13 +174,15 @@ StepTestCase.prototype.testPerAxisGridWidth = function() { [ 5, 110, 333 ] ]; var graph = document.getElementById("graph"); var g = new Dygraph(graph, data, opts); - htx = g.hidden_ctx_; + var htx = g.hidden_ctx_; // The expected gridlines var yGridlines = [ 20, 40, 60, 80 ]; var y2Gridlines = [ 50, 100, 150, 200, 250, 350 ]; var gridlines = [ yGridlines, y2Gridlines ]; var xGridlines = [ 2, 3, 4 ]; + var gridColor = [ 255, 0, 0 ]; + var emptyColor = [ 0, 0, 0 ]; function halfUp(x) { return Math.round(x) + 1; @@ -196,32 +197,27 @@ StepTestCase.prototype.testPerAxisGridWidth = function() { // Step through all gridlines of the axis for ( var i = 0; i < gridlines[axis].length; i++) { y = halfDown(g.toDomYCoord(gridlines[axis][i], axis)); - var drawnPixeldown2 = Util.samplePixel(g.hidden_, x, y - 2); - var drawnPixeldown1 = Util.samplePixel(g.hidden_, x, y - 1); - var drawnPixel = Util.samplePixel(g.hidden_, x, y); - var drawnPixelup1 = Util.samplePixel(g.hidden_, x, y + 1); - var drawnPixelup2 = Util.samplePixel(g.hidden_, x, y + 2); + // Ignore the alpha value + + // FIXME(pholden): this test fails with a context pixel ratio of 2. + var drawnPixeldown2 = Util.samplePixel(g.hidden_, x, y - 2).slice(0, 3); + var drawnPixeldown1 = Util.samplePixel(g.hidden_, x, y - 1).slice(0, 3); + var drawnPixel = Util.samplePixel(g.hidden_, x, y).slice(0, 3); + var drawnPixelup1 = Util.samplePixel(g.hidden_, x, y + 1).slice(0, 3); + var drawnPixelup2 = Util.samplePixel(g.hidden_, x, y + 2).slice(0, 3); // Check the grid width. switch (axis) { case 0: // y with 2 pixels width - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " - + y, [ 0, 0, 0, 0 ], drawnPixeldown2); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " - + y, [ 255, 0, 0, 127 ], drawnPixeldown1); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " - + y, [ 255, 0, 0, 255 ], drawnPixel); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " - + y, [ 255, 0, 0, 128 ], drawnPixelup1); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " - + y, [ 0, 0, 0, 0 ], drawnPixelup2); + assert.deepEqual(emptyColor, drawnPixeldown2, "Unexpected y-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(gridColor, drawnPixeldown1, "Unexpected y-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(gridColor, drawnPixel, "Unexpected y-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(gridColor, drawnPixelup1, "Unexpected y-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(emptyColor, drawnPixelup2, "Unexpected y-grid color found at pixel: x: " + x + "y: " + y); break; case 1: // y2 with 1 pixel width - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " - + y, [ 0, 0, 0, 0 ], drawnPixeldown1); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " - + y, [ 255, 0, 0, 255 ], drawnPixel); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " - + y, [ 0, 0, 0, 0 ], drawnPixelup1); + assert.deepEqual(emptyColor, drawnPixeldown1, "Unexpected y2-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(gridColor, drawnPixel, "Unexpected y2-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(emptyColor, drawnPixelup1, "Unexpected y2-grid color found at pixel: x: " + x + "y: " + y); break; } } @@ -231,30 +227,28 @@ StepTestCase.prototype.testPerAxisGridWidth = function() { y = halfDown(g.plotter_.area.y) + 10; for ( var i = 0; i < xGridlines.length; i++) { x = halfUp(g.toDomXCoord(xGridlines[i])); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " + y, [ - 0, 0, 0, 0 ], Util.samplePixel(g.hidden_, x - 4, y)); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " + y, [ - 255, 0, 0, 128 ], Util.samplePixel(g.hidden_, x - 3, y)); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " + y, [ - 255, 0, 0, 255 ], Util.samplePixel(g.hidden_, x - 2, y)); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " + y, [ - 255, 0, 0, 255 ], Util.samplePixel(g.hidden_, x - 1, y)); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " + y, [ - 255, 0, 0, 255 ], Util.samplePixel(g.hidden_, x, y)); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " + y, [ - 255, 0, 0, 128 ], Util.samplePixel(g.hidden_, x + 1, y)); - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " + y, [ - 0, 0, 0, 0 ], Util.samplePixel(g.hidden_, x + 2, y)); + assert.deepEqual(emptyColor, Util.samplePixel(g.hidden_, x - 4, y).slice(0, 3), + "Unexpected x-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(gridColor, Util.samplePixel(g.hidden_, x - 3, y).slice(0, 3), + "Unexpected x-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(gridColor, Util.samplePixel(g.hidden_, x - 2, y).slice(0, 3), + "Unexpected x-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(gridColor, Util.samplePixel(g.hidden_, x - 1, y).slice(0, 3), + "Unexpected x-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(gridColor, Util.samplePixel(g.hidden_, x, y).slice(0, 3), + "Unexpected x-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(gridColor, Util.samplePixel(g.hidden_, x + 1, y).slice(0, 3), + "Unexpected x-grid color found at pixel: x: " + x + "y: " + y); + assert.deepEqual(emptyColor, Util.samplePixel(g.hidden_, x + 2, y).slice(0, 3), + "Unexpected x-grid color found at pixel: x: " + x + "y: " + y); } -}; -StepTestCase.prototype.testGridLinePattern = function() { +}); + +it('testGridLinePattern', function() { var opts = { - width : 480, + width : 120, height : 320, errorBars : false, - drawXGrid : false, - drawXAxis : false, - drawYAxis : false, labels : [ "X", "Left", "Right" ], colors : [ "rgba(0,0,0,0)", "rgba(0,0,0,0)" ], series : { @@ -266,9 +260,14 @@ StepTestCase.prototype.testGridLinePattern = function() { } }, axes : { + x : { + drawGrid: false, + drawAxis: false, + }, y : { + drawAxis : false, gridLineColor : "#0000ff", - gridLinePattern : [ 4, 4 ] + gridLinePattern : [ 10, 10 ] } } }; @@ -276,7 +275,7 @@ StepTestCase.prototype.testGridLinePattern = function() { [ 5, 110, 333 ] ]; var graph = document.getElementById("graph"); var g = new Dygraph(graph, data, opts); - htx = g.hidden_ctx_; + var htx = g.hidden_ctx_; // The expected gridlines var yGridlines = [ 0, 20, 40, 60, 80, 100, 120 ]; @@ -288,24 +287,30 @@ StepTestCase.prototype.testGridLinePattern = function() { return Math.round(y) - 1; } var x, y; - x = halfUp(g.plotter_.area.x); // Step through all gridlines of the axis - for ( var i = 0; i < yGridlines.length; i++) { + for (var i = 0; i < yGridlines.length; i++) { y = halfDown(g.toDomYCoord(yGridlines[i], 0)); // Step through the pixels of the line and test the pattern. - for (x; x < g.plotter_.area.w; x++) { - var drawnPixel = Util.samplePixel(g.hidden_, x, y); - var pattern = (Math.floor((x) / 4)) % 2; + for (x = halfUp(g.plotter_.area.x); x < g.plotter_.area.w; x++) { + // avoid checking the edge pixels since they differ depending on the OS. + var pixelpos = x % 10; + if(pixelpos < 1 || pixelpos > 8) continue; + + // Ignore alpha + var drawnPixel = Util.samplePixel(g.hidden_, x, y).slice(0,3); + var pattern = (Math.floor((x) / 10)) % 2; switch (pattern) { case 0: // fill - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " - + y, [ 0, 0, 255, 77 ], drawnPixel); + assert.deepEqual([ 0, 0, 255 ], drawnPixel, + "Unexpected filled grid-pattern color found at pixel: x: " + x + " y: " + y); break; case 1: // no fill - assertEquals("Unexpected grid color found at pixel: x: " + x + "y: " - + y, [ 0, 0, 0, 0 ], drawnPixel); + assert.deepEqual([ 0, 0, 0 ], drawnPixel, + "Unexpected empty grid-pattern color found at pixel: x: " + x + " y: " + y); break; } } } -}; +}); + +});