in
+ // a 0-second transition, so push the resolve call at the back
+ // of the rendering queue to make sure the edit
is properly
+ // cleared after each mocked text edits.
+ function delayedResolve(resolve) {
+ setTimeout(
+ function() {
+ return resolve(gd);
+ },
+ 0
+ );
+ }
+ Plotly.plot(
+ gd,
+ [
+ Lib.extendDeep({}, mock0, { type: "ohlc" }),
+ Lib.extendDeep({}, mock0, { type: "candlestick" })
+ ],
+ {},
+ { editable: true }
+ )
+ .then(function(gd) {
+ return new Promise(function(resolve) {
+ gd.once("plotly_restyle", function(eventData) {
+ expect(eventData[0]["increasing.name"]).toEqual("0");
+ expect(eventData[1]).toEqual([0]);
+ delayedResolve(resolve);
+ });
+
+ editText(0, "0");
+ });
+ })
+ .then(function(gd) {
+ return new Promise(function(resolve) {
+ gd.once("plotly_restyle", function(eventData) {
+ expect(eventData[0]["decreasing.name"]).toEqual("1");
+ expect(eventData[1]).toEqual([0]);
+ delayedResolve(resolve);
+ });
+
+ editText(1, "1");
+ });
+ })
+ .then(function(gd) {
+ return new Promise(function(resolve) {
+ gd.once("plotly_restyle", function(eventData) {
+ expect(eventData[0]["decreasing.name"]).toEqual("2");
+ expect(eventData[1]).toEqual([1]);
+ delayedResolve(resolve);
+ });
+
+ editText(3, "2");
+ });
+ })
+ .then(function(gd) {
+ return new Promise(function(resolve) {
+ gd.once("plotly_restyle", function(eventData) {
+ expect(eventData[0]["increasing.name"]).toEqual("3");
+ expect(eventData[1]).toEqual([1]);
+ delayedResolve(resolve);
+ });
+
+ editText(2, "3");
+ });
+ })
+ .then(done);
+ });
});
diff --git a/test/jasmine/tests/frame_api_test.js b/test/jasmine/tests/frame_api_test.js
index 16c253e06e8..10f3708357a 100644
--- a/test/jasmine/tests/frame_api_test.js
+++ b/test/jasmine/tests/frame_api_test.js
@@ -1,267 +1,403 @@
-var Plotly = require('@lib/index');
-var Lib = require('@src/lib');
-
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var fail = require('../assets/fail_test');
-
-describe('Test frame api', function() {
- 'use strict';
-
- var gd, mock, f, h;
-
- beforeEach(function(done) {
- mock = [{x: [1, 2, 3], y: [2, 1, 3]}, {x: [1, 2, 3], y: [6, 4, 5]}];
- gd = createGraphDiv();
- Plotly.plot(gd, mock).then(function() {
- f = gd._transitionData._frames;
- h = gd._transitionData._frameHash;
- }).then(function() {
- Plotly.setPlotConfig({ queueLength: 10 });
- }).then(done);
+var Plotly = require("@lib/index");
+var Lib = require("@src/lib");
+
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var fail = require("../assets/fail_test");
+
+describe("Test frame api", function() {
+ "use strict";
+ var gd, mock, f, h;
+
+ beforeEach(function(done) {
+ mock = [{ x: [1, 2, 3], y: [2, 1, 3] }, { x: [1, 2, 3], y: [6, 4, 5] }];
+ gd = createGraphDiv();
+ Plotly.plot(gd, mock)
+ .then(function() {
+ f = gd._transitionData._frames;
+ h = gd._transitionData._frameHash;
+ })
+ .then(function() {
+ Plotly.setPlotConfig({ queueLength: 10 });
+ })
+ .then(done);
+ });
+
+ afterEach(function() {
+ destroyGraphDiv();
+ Plotly.setPlotConfig({ queueLength: 0 });
+ });
+
+ describe("gd initialization", function() {
+ it("creates an empty list for frames", function() {
+ expect(gd._transitionData._frames).toEqual([]);
});
- afterEach(function() {
- destroyGraphDiv();
- Plotly.setPlotConfig({queueLength: 0});
+ it("creates an empty lookup table for frames", function() {
+ expect(gd._transitionData._counter).toEqual(0);
});
-
- describe('gd initialization', function() {
- it('creates an empty list for frames', function() {
- expect(gd._transitionData._frames).toEqual([]);
- });
-
- it('creates an empty lookup table for frames', function() {
- expect(gd._transitionData._counter).toEqual(0);
- });
+ });
+
+ describe("#addFrames", function() {
+ it("treats an undefined list as a noop", function(done) {
+ Plotly.addFrames(gd, undefined)
+ .then(function() {
+ expect(Object.keys(h)).toEqual([]);
+ })
+ .catch(fail)
+ .then(done);
});
- describe('#addFrames', function() {
- it('treats an undefined list as a noop', function(done) {
- Plotly.addFrames(gd, undefined).then(function() {
- expect(Object.keys(h)).toEqual([]);
- }).catch(fail).then(done);
- });
-
- it('compresses garbage when adding frames', function(done) {
- Plotly.addFrames(gd, [null, 'garbage', 14, true, false, {name: 'test'}, null]).then(function() {
- expect(Object.keys(h)).toEqual(['test']);
- expect(f).toEqual([{name: 'test'}]);
- }).catch(fail).then(done);
- });
-
- it('treats a null list as a noop', function(done) {
- Plotly.addFrames(gd, null).then(function() {
- expect(Object.keys(h)).toEqual([]);
- }).catch(fail).then(done);
- });
-
- it('treats an empty list as a noop', function(done) {
- Plotly.addFrames(gd, []).then(function() {
- expect(Object.keys(h)).toEqual([]);
- }).catch(fail).then(done);
- });
-
- it('names an unnamed frame', function(done) {
- Plotly.addFrames(gd, [{}]).then(function() {
- expect(Object.keys(h)).toEqual(['frame 0']);
- }).catch(fail).then(done);
- });
-
- it('casts names to strings', function(done) {
- Plotly.addFrames(gd, [{name: 5}]).then(function() {
- expect(Object.keys(h)).toEqual(['5']);
- }).catch(fail).then(done);
- });
+ it("compresses garbage when adding frames", function(done) {
+ Plotly.addFrames(gd, [
+ null,
+ "garbage",
+ 14,
+ true,
+ false,
+ { name: "test" },
+ null
+ ])
+ .then(function() {
+ expect(Object.keys(h)).toEqual(["test"]);
+ expect(f).toEqual([{ name: "test" }]);
+ })
+ .catch(fail)
+ .then(done);
+ });
- it('creates multiple unnamed frames at the same time', function(done) {
- Plotly.addFrames(gd, [{}, {}]).then(function() {
- expect(f).toEqual([{name: 'frame 0'}, {name: 'frame 1'}]);
- }).catch(fail).then(done);
- });
+ it("treats a null list as a noop", function(done) {
+ Plotly.addFrames(gd, null)
+ .then(function() {
+ expect(Object.keys(h)).toEqual([]);
+ })
+ .catch(fail)
+ .then(done);
+ });
- it('creates multiple unnamed frames in series', function(done) {
- Plotly.addFrames(gd, [{}]).then(function() {
- return Plotly.addFrames(gd, [{}]);
- }).then(function() {
- expect(f).toEqual([{name: 'frame 0'}, {name: 'frame 1'}]);
- }).catch(fail).then(done);
- });
+ it("treats an empty list as a noop", function(done) {
+ Plotly.addFrames(gd, [])
+ .then(function() {
+ expect(Object.keys(h)).toEqual([]);
+ })
+ .catch(fail)
+ .then(done);
+ });
- it('casts number names to strings on insertion', function(done) {
- Plotly.addFrames(gd, [{name: 2}]).then(function() {
- expect(f).toEqual([{name: '2'}]);
- }).catch(fail).then(done);
- });
+ it("names an unnamed frame", function(done) {
+ Plotly.addFrames(gd, [{}])
+ .then(function() {
+ expect(Object.keys(h)).toEqual(["frame 0"]);
+ })
+ .catch(fail)
+ .then(done);
+ });
- it('updates frames referenced by number', function(done) {
- Plotly.addFrames(gd, [{name: 2}]).then(function() {
- return Plotly.addFrames(gd, [{name: 2, layout: {foo: 'bar'}}]);
- }).then(function() {
- expect(f).toEqual([{name: '2', layout: {foo: 'bar'}}]);
- }).catch(fail).then(done);
- });
+ it("casts names to strings", function(done) {
+ Plotly.addFrames(gd, [{ name: 5 }])
+ .then(function() {
+ expect(Object.keys(h)).toEqual(["5"]);
+ })
+ .catch(fail)
+ .then(done);
+ });
- it('issues a warning if a number-named frame would overwrite a frame', function(done) {
- var warnings = [];
- spyOn(Lib, 'warn').and.callFake(function(msg) {
- warnings.push(msg);
- });
-
- Plotly.addFrames(gd, [{name: 2}]).then(function() {
- return Plotly.addFrames(gd, [{name: 2, layout: {foo: 'bar'}}]);
- }).then(function() {
- expect(warnings.length).toEqual(1);
- expect(warnings[0]).toMatch(/overwriting/);
- }).catch(fail).then(done);
- });
+ it("creates multiple unnamed frames at the same time", function(done) {
+ Plotly.addFrames(gd, [{}, {}])
+ .then(function() {
+ expect(f).toEqual([{ name: "frame 0" }, { name: "frame 1" }]);
+ })
+ .catch(fail)
+ .then(done);
+ });
- it('avoids name collisions', function(done) {
- Plotly.addFrames(gd, [{name: 'frame 0'}, {name: 'frame 2'}]).then(function() {
- expect(f).toEqual([{name: 'frame 0'}, {name: 'frame 2'}]);
+ it("creates multiple unnamed frames in series", function(done) {
+ Plotly.addFrames(gd, [{}])
+ .then(function() {
+ return Plotly.addFrames(gd, [{}]);
+ })
+ .then(function() {
+ expect(f).toEqual([{ name: "frame 0" }, { name: "frame 1" }]);
+ })
+ .catch(fail)
+ .then(done);
+ });
- return Plotly.addFrames(gd, [{}, {name: 'foobar'}, {}]);
- }).then(function() {
- expect(f).toEqual([{name: 'frame 0'}, {name: 'frame 2'}, {name: 'frame 1'}, {name: 'foobar'}, {name: 'frame 3'}]);
- }).catch(fail).then(done);
- });
+ it("casts number names to strings on insertion", function(done) {
+ Plotly.addFrames(gd, [{ name: 2 }])
+ .then(function() {
+ expect(f).toEqual([{ name: "2" }]);
+ })
+ .catch(fail)
+ .then(done);
+ });
- it('inserts frames at specific indices', function(done) {
- var i;
- var frames = [];
- for(i = 0; i < 10; i++) {
- frames.push({name: 'frame' + i});
- }
-
- function validate() {
- for(i = 0; i < f.length; i++) {
- expect(f[i].name).toEqual('frame' + i);
- }
- }
-
- Plotly.addFrames(gd, frames).then(validate).then(function() {
- return Plotly.addFrames(gd, [{name: 'frame5', data: [1]}, {name: 'frame7', data: [2]}, {name: 'frame10', data: [3]}], [5, 7, undefined]);
- }).then(function() {
- expect(f[5]).toEqual({name: 'frame5', data: [1]});
- expect(f[7]).toEqual({name: 'frame7', data: [2]});
- expect(f[10]).toEqual({name: 'frame10', data: [3]});
-
- return Plotly.Queue.undo(gd);
- }).then(validate).catch(fail).then(done);
- });
+ it("updates frames referenced by number", function(done) {
+ Plotly.addFrames(gd, [{ name: 2 }])
+ .then(function() {
+ return Plotly.addFrames(gd, [{ name: 2, layout: { foo: "bar" } }]);
+ })
+ .then(function() {
+ expect(f).toEqual([{ name: "2", layout: { foo: "bar" } }]);
+ })
+ .catch(fail)
+ .then(done);
+ });
- it('inserts frames at specific indices (reversed)', function(done) {
- var i;
- var frames = [];
- for(i = 0; i < 10; i++) {
- frames.push({name: 'frame' + i});
- }
-
- function validate() {
- for(i = 0; i < f.length; i++) {
- expect(f[i].name).toEqual('frame' + i);
- }
- }
-
- Plotly.addFrames(gd, frames).then(validate).then(function() {
- return Plotly.addFrames(gd, [{name: 'frame10', data: [3]}, {name: 'frame7', data: [2]}, {name: 'frame5', data: [1]}], [undefined, 7, 5]);
- }).then(function() {
- expect(f[5]).toEqual({name: 'frame5', data: [1]});
- expect(f[7]).toEqual({name: 'frame7', data: [2]});
- expect(f[10]).toEqual({name: 'frame10', data: [3]});
-
- return Plotly.Queue.undo(gd);
- }).then(validate).catch(fail).then(done);
+ it(
+ "issues a warning if a number-named frame would overwrite a frame",
+ function(done) {
+ var warnings = [];
+ spyOn(Lib, "warn").and.callFake(function(msg) {
+ warnings.push(msg);
});
- it('implements undo/redo', function(done) {
- function validate() {
- expect(f).toEqual([{name: 'frame 0'}, {name: 'frame 1'}]);
- expect(h).toEqual({'frame 0': {name: 'frame 0'}, 'frame 1': {name: 'frame 1'}});
- }
+ Plotly.addFrames(gd, [{ name: 2 }])
+ .then(function() {
+ return Plotly.addFrames(gd, [{ name: 2, layout: { foo: "bar" } }]);
+ })
+ .then(function() {
+ expect(warnings.length).toEqual(1);
+ expect(warnings[0]).toMatch(/overwriting/);
+ })
+ .catch(fail)
+ .then(done);
+ }
+ );
+
+ it("avoids name collisions", function(done) {
+ Plotly.addFrames(gd, [{ name: "frame 0" }, { name: "frame 2" }])
+ .then(function() {
+ expect(f).toEqual([{ name: "frame 0" }, { name: "frame 2" }]);
+
+ return Plotly.addFrames(gd, [{}, { name: "foobar" }, {}]);
+ })
+ .then(function() {
+ expect(f).toEqual([
+ { name: "frame 0" },
+ { name: "frame 2" },
+ { name: "frame 1" },
+ { name: "foobar" },
+ { name: "frame 3" }
+ ]);
+ })
+ .catch(fail)
+ .then(done);
+ });
- Plotly.addFrames(gd, [{name: 'frame 0'}, {name: 'frame 1'}]).then(validate).then(function() {
- return Plotly.Queue.undo(gd);
- }).then(function() {
- expect(f).toEqual([]);
- expect(h).toEqual({});
+ it("inserts frames at specific indices", function(done) {
+ var i;
+ var frames = [];
+ for (i = 0; i < 10; i++) {
+ frames.push({ name: "frame" + i });
+ }
+
+ function validate() {
+ for (i = 0; i < f.length; i++) {
+ expect(f[i].name).toEqual("frame" + i);
+ }
+ }
+
+ Plotly.addFrames(gd, frames)
+ .then(validate)
+ .then(function() {
+ return Plotly.addFrames(
+ gd,
+ [
+ { name: "frame5", data: [1] },
+ { name: "frame7", data: [2] },
+ { name: "frame10", data: [3] }
+ ],
+ [5, 7, undefined]
+ );
+ })
+ .then(function() {
+ expect(f[5]).toEqual({ name: "frame5", data: [1] });
+ expect(f[7]).toEqual({ name: "frame7", data: [2] });
+ expect(f[10]).toEqual({ name: "frame10", data: [3] });
+
+ return Plotly.Queue.undo(gd);
+ })
+ .then(validate)
+ .catch(fail)
+ .then(done);
+ });
- return Plotly.Queue.redo(gd);
- }).then(validate).catch(fail).then(done);
- });
+ it("inserts frames at specific indices (reversed)", function(done) {
+ var i;
+ var frames = [];
+ for (i = 0; i < 10; i++) {
+ frames.push({ name: "frame" + i });
+ }
+
+ function validate() {
+ for (i = 0; i < f.length; i++) {
+ expect(f[i].name).toEqual("frame" + i);
+ }
+ }
+
+ Plotly.addFrames(gd, frames)
+ .then(validate)
+ .then(function() {
+ return Plotly.addFrames(
+ gd,
+ [
+ { name: "frame10", data: [3] },
+ { name: "frame7", data: [2] },
+ { name: "frame5", data: [1] }
+ ],
+ [undefined, 7, 5]
+ );
+ })
+ .then(function() {
+ expect(f[5]).toEqual({ name: "frame5", data: [1] });
+ expect(f[7]).toEqual({ name: "frame7", data: [2] });
+ expect(f[10]).toEqual({ name: "frame10", data: [3] });
+
+ return Plotly.Queue.undo(gd);
+ })
+ .then(validate)
+ .catch(fail)
+ .then(done);
+ });
- it('overwrites frames', function(done) {
- // The whole shebang. This hits insertion + replacements + deletion + undo + redo:
- Plotly.addFrames(gd, [{name: 'test1', data: ['y']}, {name: 'test2'}]).then(function() {
- expect(f).toEqual([{name: 'test1', data: ['y']}, {name: 'test2'}]);
- expect(Object.keys(h)).toEqual(['test1', 'test2']);
-
- return Plotly.addFrames(gd, [{name: 'test1'}, {name: 'test3'}]);
- }).then(function() {
- expect(f).toEqual([{name: 'test1'}, {name: 'test2'}, {name: 'test3'}]);
- expect(Object.keys(h)).toEqual(['test1', 'test2', 'test3']);
-
- return Plotly.Queue.undo(gd);
- }).then(function() {
- expect(f).toEqual([{name: 'test1', data: ['y']}, {name: 'test2'}]);
- expect(Object.keys(h)).toEqual(['test1', 'test2']);
-
- return Plotly.Queue.redo(gd);
- }).then(function() {
- expect(f).toEqual([{name: 'test1'}, {name: 'test2'}, {name: 'test3'}]);
- expect(Object.keys(h)).toEqual(['test1', 'test2', 'test3']);
- }).catch(fail).then(done);
+ it("implements undo/redo", function(done) {
+ function validate() {
+ expect(f).toEqual([{ name: "frame 0" }, { name: "frame 1" }]);
+ expect(h).toEqual({
+ "frame 0": { name: "frame 0" },
+ "frame 1": { name: "frame 1" }
});
+ }
+
+ Plotly.addFrames(gd, [{ name: "frame 0" }, { name: "frame 1" }])
+ .then(validate)
+ .then(function() {
+ return Plotly.Queue.undo(gd);
+ })
+ .then(function() {
+ expect(f).toEqual([]);
+ expect(h).toEqual({});
+
+ return Plotly.Queue.redo(gd);
+ })
+ .then(validate)
+ .catch(fail)
+ .then(done);
});
- describe('#deleteFrames', function() {
- it('deletes a frame', function(done) {
- Plotly.addFrames(gd, [{name: 'frame1'}]).then(function() {
- expect(f).toEqual([{name: 'frame1'}]);
- expect(Object.keys(h)).toEqual(['frame1']);
-
- return Plotly.deleteFrames(gd, [0]);
- }).then(function() {
- expect(f).toEqual([]);
- expect(Object.keys(h)).toEqual([]);
-
- return Plotly.Queue.undo(gd);
- }).then(function() {
- expect(f).toEqual([{name: 'frame1'}]);
-
- return Plotly.Queue.redo(gd);
- }).then(function() {
- expect(f).toEqual([]);
- expect(Object.keys(h)).toEqual([]);
- }).catch(fail).then(done);
- });
+ it("overwrites frames", function(done) {
+ // The whole shebang. This hits insertion + replacements + deletion + undo + redo:
+ Plotly.addFrames(gd, [{ name: "test1", data: ["y"] }, { name: "test2" }])
+ .then(function() {
+ expect(f).toEqual([
+ { name: "test1", data: ["y"] },
+ { name: "test2" }
+ ]);
+ expect(Object.keys(h)).toEqual(["test1", "test2"]);
+
+ return Plotly.addFrames(gd, [{ name: "test1" }, { name: "test3" }]);
+ })
+ .then(function() {
+ expect(f).toEqual([
+ { name: "test1" },
+ { name: "test2" },
+ { name: "test3" }
+ ]);
+ expect(Object.keys(h)).toEqual(["test1", "test2", "test3"]);
+
+ return Plotly.Queue.undo(gd);
+ })
+ .then(function() {
+ expect(f).toEqual([
+ { name: "test1", data: ["y"] },
+ { name: "test2" }
+ ]);
+ expect(Object.keys(h)).toEqual(["test1", "test2"]);
+
+ return Plotly.Queue.redo(gd);
+ })
+ .then(function() {
+ expect(f).toEqual([
+ { name: "test1" },
+ { name: "test2" },
+ { name: "test3" }
+ ]);
+ expect(Object.keys(h)).toEqual(["test1", "test2", "test3"]);
+ })
+ .catch(fail)
+ .then(done);
+ });
+ });
+
+ describe("#deleteFrames", function() {
+ it("deletes a frame", function(done) {
+ Plotly.addFrames(gd, [{ name: "frame1" }])
+ .then(function() {
+ expect(f).toEqual([{ name: "frame1" }]);
+ expect(Object.keys(h)).toEqual(["frame1"]);
+
+ return Plotly.deleteFrames(gd, [0]);
+ })
+ .then(function() {
+ expect(f).toEqual([]);
+ expect(Object.keys(h)).toEqual([]);
+
+ return Plotly.Queue.undo(gd);
+ })
+ .then(function() {
+ expect(f).toEqual([{ name: "frame1" }]);
+
+ return Plotly.Queue.redo(gd);
+ })
+ .then(function() {
+ expect(f).toEqual([]);
+ expect(Object.keys(h)).toEqual([]);
+ })
+ .catch(fail)
+ .then(done);
+ });
- it('deletes multiple frames', function(done) {
- var i;
- var frames = [];
- for(i = 0; i < 10; i++) {
- frames.push({name: 'frame' + i});
- }
-
- function validate() {
- var expected = ['frame0', 'frame1', 'frame3', 'frame5', 'frame7', 'frame9'];
- expect(f.length).toEqual(expected.length);
- for(i = 0; i < expected.length; i++) {
- expect(f[i].name).toEqual(expected[i]);
- }
- }
-
- Plotly.addFrames(gd, frames).then(function() {
- return Plotly.deleteFrames(gd, [2, 8, 4, 6]);
- }).then(validate).then(function() {
- return Plotly.Queue.undo(gd);
- }).then(function() {
- for(i = 0; i < 10; i++) {
- expect(f[i]).toEqual({name: 'frame' + i});
- }
-
- return Plotly.Queue.redo(gd);
- }).then(validate).catch(fail).then(done);
- });
+ it("deletes multiple frames", function(done) {
+ var i;
+ var frames = [];
+ for (i = 0; i < 10; i++) {
+ frames.push({ name: "frame" + i });
+ }
+
+ function validate() {
+ var expected = [
+ "frame0",
+ "frame1",
+ "frame3",
+ "frame5",
+ "frame7",
+ "frame9"
+ ];
+ expect(f.length).toEqual(expected.length);
+ for (i = 0; i < expected.length; i++) {
+ expect(f[i].name).toEqual(expected[i]);
+ }
+ }
+
+ Plotly.addFrames(gd, frames)
+ .then(function() {
+ return Plotly.deleteFrames(gd, [2, 8, 4, 6]);
+ })
+ .then(validate)
+ .then(function() {
+ return Plotly.Queue.undo(gd);
+ })
+ .then(function() {
+ for (i = 0; i < 10; i++) {
+ expect(f[i]).toEqual({ name: "frame" + i });
+ }
+
+ return Plotly.Queue.redo(gd);
+ })
+ .then(validate)
+ .catch(fail)
+ .then(done);
});
+ });
});
diff --git a/test/jasmine/tests/fx_test.js b/test/jasmine/tests/fx_test.js
index 4a89b547472..2a8011abb17 100644
--- a/test/jasmine/tests/fx_test.js
+++ b/test/jasmine/tests/fx_test.js
@@ -1,135 +1,142 @@
-var Plotly = require('@lib/index');
-var Plots = require('@src/plots/plots');
-
-var Fx = require('@src/plots/cartesian/graph_interact');
-
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-
-
-describe('Fx defaults', function() {
- 'use strict';
-
- var layoutIn, layoutOut, fullData;
-
- beforeEach(function() {
- layoutIn = {};
- layoutOut = {
- _has: Plots._hasPlotType
- };
- fullData = [{}];
- });
-
- it('should default (blank version)', function() {
- Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.hovermode).toBe('closest', 'hovermode to closest');
- expect(layoutOut.dragmode).toBe('zoom', 'dragmode to zoom');
- });
-
- it('should default (cartesian version)', function() {
- layoutOut._basePlotModules = [{ name: 'cartesian' }];
-
- Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.hovermode).toBe('x', 'hovermode to x');
- expect(layoutOut.dragmode).toBe('zoom', 'dragmode to zoom');
- expect(layoutOut._isHoriz).toBe(false, 'isHoriz to false');
- });
-
- it('should default (cartesian horizontal version)', function() {
- layoutOut._basePlotModules = [{ name: 'cartesian' }];
- fullData[0] = { orientation: 'h' };
-
- Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.hovermode).toBe('y', 'hovermode to y');
- expect(layoutOut.dragmode).toBe('zoom', 'dragmode to zoom');
- expect(layoutOut._isHoriz).toBe(true, 'isHoriz to true');
- });
-
- it('should default (gl3d version)', function() {
- layoutOut._basePlotModules = [{ name: 'gl3d' }];
-
- Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.hovermode).toBe('closest', 'hovermode to closest');
- expect(layoutOut.dragmode).toBe('zoom', 'dragmode to zoom');
- });
-
- it('should default (geo version)', function() {
- layoutOut._basePlotModules = [{ name: 'geo' }];
-
- Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.hovermode).toBe('closest', 'hovermode to closest');
- expect(layoutOut.dragmode).toBe('zoom', 'dragmode to zoom');
- });
-
- it('should default (multi plot type version)', function() {
- layoutOut._basePlotModules = [{ name: 'cartesian' }, { name: 'gl3d' }];
-
- Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.hovermode).toBe('x', 'hovermode to x');
- expect(layoutOut.dragmode).toBe('zoom', 'dragmode to zoom');
- });
+var Plotly = require("@lib/index");
+var Plots = require("@src/plots/plots");
+
+var Fx = require("@src/plots/cartesian/graph_interact");
+
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+
+describe("Fx defaults", function() {
+ "use strict";
+ var layoutIn, layoutOut, fullData;
+
+ beforeEach(function() {
+ layoutIn = {};
+ layoutOut = { _has: Plots._hasPlotType };
+ fullData = [{}];
+ });
+
+ it("should default (blank version)", function() {
+ Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.hovermode).toBe("closest", "hovermode to closest");
+ expect(layoutOut.dragmode).toBe("zoom", "dragmode to zoom");
+ });
+
+ it("should default (cartesian version)", function() {
+ layoutOut._basePlotModules = [{ name: "cartesian" }];
+
+ Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.hovermode).toBe("x", "hovermode to x");
+ expect(layoutOut.dragmode).toBe("zoom", "dragmode to zoom");
+ expect(layoutOut._isHoriz).toBe(false, "isHoriz to false");
+ });
+
+ it("should default (cartesian horizontal version)", function() {
+ layoutOut._basePlotModules = [{ name: "cartesian" }];
+ fullData[0] = { orientation: "h" };
+
+ Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.hovermode).toBe("y", "hovermode to y");
+ expect(layoutOut.dragmode).toBe("zoom", "dragmode to zoom");
+ expect(layoutOut._isHoriz).toBe(true, "isHoriz to true");
+ });
+
+ it("should default (gl3d version)", function() {
+ layoutOut._basePlotModules = [{ name: "gl3d" }];
+
+ Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.hovermode).toBe("closest", "hovermode to closest");
+ expect(layoutOut.dragmode).toBe("zoom", "dragmode to zoom");
+ });
+
+ it("should default (geo version)", function() {
+ layoutOut._basePlotModules = [{ name: "geo" }];
+
+ Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.hovermode).toBe("closest", "hovermode to closest");
+ expect(layoutOut.dragmode).toBe("zoom", "dragmode to zoom");
+ });
+
+ it("should default (multi plot type version)", function() {
+ layoutOut._basePlotModules = [{ name: "cartesian" }, { name: "gl3d" }];
+
+ Fx.supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.hovermode).toBe("x", "hovermode to x");
+ expect(layoutOut.dragmode).toBe("zoom", "dragmode to zoom");
+ });
});
-describe('relayout', function() {
- 'use strict';
-
- var gd;
-
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(destroyGraphDiv);
-
- it('should update main drag with correct', function(done) {
-
- function assertMainDrag(cursor, isActive) {
- expect(d3.selectAll('rect.nsewdrag').size()).toEqual(1, 'number of nodes');
- var mainDrag = d3.select('rect.nsewdrag'),
- node = mainDrag.node();
-
- expect(mainDrag.classed('cursor-' + cursor)).toBe(true, 'cursor ' + cursor);
- expect(mainDrag.style('pointer-events')).toEqual('all', 'pointer event');
- expect(!!node.onmousedown).toBe(isActive, 'mousedown handler');
- }
-
- Plotly.plot(gd, [{
- y: [2, 1, 2]
- }]).then(function() {
- assertMainDrag('crosshair', true);
-
- return Plotly.relayout(gd, 'dragmode', 'pan');
- }).then(function() {
- assertMainDrag('move', true);
-
- return Plotly.relayout(gd, 'dragmode', 'drag');
- }).then(function() {
- assertMainDrag('crosshair', true);
-
- return Plotly.relayout(gd, 'xaxis.fixedrange', true);
- }).then(function() {
- assertMainDrag('ns-resize', true);
-
- return Plotly.relayout(gd, 'yaxis.fixedrange', true);
- }).then(function() {
- assertMainDrag('pointer', false);
-
- return Plotly.relayout(gd, 'dragmode', 'drag');
- }).then(function() {
- assertMainDrag('pointer', false);
-
- return Plotly.relayout(gd, 'dragmode', 'lasso');
- }).then(function() {
- assertMainDrag('pointer', true);
-
- return Plotly.relayout(gd, 'dragmode', 'select');
- }).then(function() {
- assertMainDrag('pointer', true);
-
- return Plotly.relayout(gd, 'xaxis.fixedrange', false);
- }).then(function() {
- assertMainDrag('ew-resize', true);
- }).then(done);
- });
+describe("relayout", function() {
+ "use strict";
+ var gd;
+
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
+
+ afterEach(destroyGraphDiv);
+
+ it("should update main drag with correct", function(done) {
+ function assertMainDrag(cursor, isActive) {
+ expect(d3.selectAll("rect.nsewdrag").size()).toEqual(
+ 1,
+ "number of nodes"
+ );
+ var mainDrag = d3.select("rect.nsewdrag"), node = mainDrag.node();
+
+ expect(mainDrag.classed("cursor-" + cursor)).toBe(
+ true,
+ "cursor " + cursor
+ );
+ expect(mainDrag.style("pointer-events")).toEqual("all", "pointer event");
+ expect(!!node.onmousedown).toBe(isActive, "mousedown handler");
+ }
+
+ Plotly.plot(gd, [{ y: [2, 1, 2] }])
+ .then(function() {
+ assertMainDrag("crosshair", true);
+
+ return Plotly.relayout(gd, "dragmode", "pan");
+ })
+ .then(function() {
+ assertMainDrag("move", true);
+
+ return Plotly.relayout(gd, "dragmode", "drag");
+ })
+ .then(function() {
+ assertMainDrag("crosshair", true);
+
+ return Plotly.relayout(gd, "xaxis.fixedrange", true);
+ })
+ .then(function() {
+ assertMainDrag("ns-resize", true);
+
+ return Plotly.relayout(gd, "yaxis.fixedrange", true);
+ })
+ .then(function() {
+ assertMainDrag("pointer", false);
+
+ return Plotly.relayout(gd, "dragmode", "drag");
+ })
+ .then(function() {
+ assertMainDrag("pointer", false);
+
+ return Plotly.relayout(gd, "dragmode", "lasso");
+ })
+ .then(function() {
+ assertMainDrag("pointer", true);
+
+ return Plotly.relayout(gd, "dragmode", "select");
+ })
+ .then(function() {
+ assertMainDrag("pointer", true);
+
+ return Plotly.relayout(gd, "xaxis.fixedrange", false);
+ })
+ .then(function() {
+ assertMainDrag("ew-resize", true);
+ })
+ .then(done);
+ });
});
diff --git a/test/jasmine/tests/geo_test.js b/test/jasmine/tests/geo_test.js
index 244db755d2c..33ddc7cdb04 100644
--- a/test/jasmine/tests/geo_test.js
+++ b/test/jasmine/tests/geo_test.js
@@ -1,989 +1,1035 @@
-var Plotly = require('@lib/index');
-var Lib = require('@src/lib');
-
-var Geo = require('@src/plots/geo');
-var GeoAssets = require('@src/assets/geo_assets');
-var params = require('@src/plots/geo/constants');
-var supplyLayoutDefaults = require('@src/plots/geo/layout/axis_defaults');
-var geoLocationUtils = require('@src/lib/geo_location_utils');
-var topojsonUtils = require('@src/lib/topojson_utils');
-
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var mouseEvent = require('../assets/mouse_event');
-
-var HOVERMINTIME = require('@src/plots/cartesian/constants').HOVERMINTIME;
-
-
-describe('Test geoaxes', function() {
- 'use strict';
-
- describe('supplyLayoutDefaults', function() {
- var geoLayoutIn,
- geoLayoutOut;
-
- beforeEach(function() {
- geoLayoutOut = {};
- });
+var Plotly = require("@lib/index");
+var Lib = require("@src/lib");
+
+var Geo = require("@src/plots/geo");
+var GeoAssets = require("@src/assets/geo_assets");
+var params = require("@src/plots/geo/constants");
+var supplyLayoutDefaults = require("@src/plots/geo/layout/axis_defaults");
+var geoLocationUtils = require("@src/lib/geo_location_utils");
+var topojsonUtils = require("@src/lib/topojson_utils");
+
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var mouseEvent = require("../assets/mouse_event");
+
+var HOVERMINTIME = require("@src/plots/cartesian/constants").HOVERMINTIME;
+
+describe("Test geoaxes", function() {
+ "use strict";
+ describe("supplyLayoutDefaults", function() {
+ var geoLayoutIn, geoLayoutOut;
+
+ beforeEach(function() {
+ geoLayoutOut = {};
+ });
- it('should default to lon(lat)range to params non-world scopes', function() {
- var scopeDefaults = params.scopeDefaults,
- scopes = Object.keys(scopeDefaults),
- customLonaxisRange = [-42.21313312, 40.321321],
- customLataxisRange = [-42.21313312, 40.321321];
-
- var dfltLonaxisRange, dfltLataxisRange;
-
- scopes.forEach(function(scope) {
- if(scope === 'world') return;
-
- dfltLonaxisRange = scopeDefaults[scope].lonaxisRange;
- dfltLataxisRange = scopeDefaults[scope].lataxisRange;
-
- geoLayoutIn = {};
- geoLayoutOut = {scope: scope};
-
- supplyLayoutDefaults(geoLayoutIn, geoLayoutOut);
- expect(geoLayoutOut.lonaxis.range).toEqual(dfltLonaxisRange);
- expect(geoLayoutOut.lataxis.range).toEqual(dfltLataxisRange);
- expect(geoLayoutOut.lonaxis.tick0).toEqual(dfltLonaxisRange[0]);
- expect(geoLayoutOut.lataxis.tick0).toEqual(dfltLataxisRange[0]);
-
- geoLayoutIn = {
- lonaxis: {range: customLonaxisRange},
- lataxis: {range: customLataxisRange}
- };
- geoLayoutOut = {scope: scope};
-
- supplyLayoutDefaults(geoLayoutIn, geoLayoutOut);
- expect(geoLayoutOut.lonaxis.range).toEqual(customLonaxisRange);
- expect(geoLayoutOut.lataxis.range).toEqual(customLataxisRange);
- expect(geoLayoutOut.lonaxis.tick0).toEqual(customLonaxisRange[0]);
- expect(geoLayoutOut.lataxis.tick0).toEqual(customLataxisRange[0]);
- });
+ it(
+ "should default to lon(lat)range to params non-world scopes",
+ function() {
+ var scopeDefaults = params.scopeDefaults,
+ scopes = Object.keys(scopeDefaults),
+ customLonaxisRange = [-42.21313312, 40.321321],
+ customLataxisRange = [-42.21313312, 40.321321];
+
+ var dfltLonaxisRange, dfltLataxisRange;
+
+ scopes.forEach(function(scope) {
+ if (scope === "world") return;
+
+ dfltLonaxisRange = scopeDefaults[scope].lonaxisRange;
+ dfltLataxisRange = scopeDefaults[scope].lataxisRange;
+
+ geoLayoutIn = {};
+ geoLayoutOut = { scope: scope };
+
+ supplyLayoutDefaults(geoLayoutIn, geoLayoutOut);
+ expect(geoLayoutOut.lonaxis.range).toEqual(dfltLonaxisRange);
+ expect(geoLayoutOut.lataxis.range).toEqual(dfltLataxisRange);
+ expect(geoLayoutOut.lonaxis.tick0).toEqual(dfltLonaxisRange[0]);
+ expect(geoLayoutOut.lataxis.tick0).toEqual(dfltLataxisRange[0]);
+
+ geoLayoutIn = {
+ lonaxis: { range: customLonaxisRange },
+ lataxis: { range: customLataxisRange }
+ };
+ geoLayoutOut = { scope: scope };
+
+ supplyLayoutDefaults(geoLayoutIn, geoLayoutOut);
+ expect(geoLayoutOut.lonaxis.range).toEqual(customLonaxisRange);
+ expect(geoLayoutOut.lataxis.range).toEqual(customLataxisRange);
+ expect(geoLayoutOut.lonaxis.tick0).toEqual(customLonaxisRange[0]);
+ expect(geoLayoutOut.lataxis.tick0).toEqual(customLataxisRange[0]);
});
+ }
+ );
+
+ it(
+ "should adjust default lon(lat)range to projection.rotation in world scopes",
+ function() {
+ var expectedLonaxisRange, expectedLataxisRange;
+
+ function testOne() {
+ supplyLayoutDefaults(geoLayoutIn, geoLayoutOut);
+ expect(geoLayoutOut.lonaxis.range).toEqual(expectedLonaxisRange);
+ expect(geoLayoutOut.lataxis.range).toEqual(expectedLataxisRange);
+ }
- it('should adjust default lon(lat)range to projection.rotation in world scopes', function() {
- var expectedLonaxisRange, expectedLataxisRange;
-
- function testOne() {
- supplyLayoutDefaults(geoLayoutIn, geoLayoutOut);
- expect(geoLayoutOut.lonaxis.range).toEqual(expectedLonaxisRange);
- expect(geoLayoutOut.lataxis.range).toEqual(expectedLataxisRange);
- }
-
- geoLayoutIn = {};
- geoLayoutOut = {
- scope: 'world',
- projection: {
- type: 'equirectangular',
- rotation: {
- lon: -75,
- lat: 45
- }
- }
- };
- expectedLonaxisRange = [-255, 105]; // => -75 +/- 180
- expectedLataxisRange = [-45, 135]; // => 45 +/- 90
- testOne();
-
- geoLayoutIn = {};
- geoLayoutOut = {
- scope: 'world',
- projection: {
- type: 'orthographic',
- rotation: {
- lon: -75,
- lat: 45
- }
- }
- };
- expectedLonaxisRange = [-165, 15]; // => -75 +/- 90
- expectedLataxisRange = [-45, 135]; // => 45 +/- 90
- testOne();
-
- geoLayoutIn = {
- lonaxis: {range: [-42.21313312, 40.321321]},
- lataxis: {range: [-42.21313312, 40.321321]}
- };
- expectedLonaxisRange = [-42.21313312, 40.321321];
- expectedLataxisRange = [-42.21313312, 40.321321];
- testOne();
- });
- });
+ geoLayoutIn = {};
+ geoLayoutOut = {
+ scope: "world",
+ projection: {
+ type: "equirectangular",
+ rotation: { lon: -75, lat: 45 }
+ }
+ };
+ expectedLonaxisRange = [-255, 105];
+ // => -75 +/- 180
+ expectedLataxisRange = [-45, 135];
+ // => 45 +/- 90
+ testOne();
+
+ geoLayoutIn = {};
+ geoLayoutOut = {
+ scope: "world",
+ projection: { type: "orthographic", rotation: { lon: -75, lat: 45 } }
+ };
+ expectedLonaxisRange = [-165, 15];
+ // => -75 +/- 90
+ expectedLataxisRange = [-45, 135];
+ // => 45 +/- 90
+ testOne();
+
+ geoLayoutIn = {
+ lonaxis: { range: [-42.21313312, 40.321321] },
+ lataxis: { range: [-42.21313312, 40.321321] }
+ };
+ expectedLonaxisRange = [-42.21313312, 40.321321];
+ expectedLataxisRange = [-42.21313312, 40.321321];
+ testOne();
+ }
+ );
+ });
});
-describe('Test Geo layout defaults', function() {
- 'use strict';
-
- var layoutAttributes = Geo.layoutAttributes;
- var supplyLayoutDefaults = Geo.supplyLayoutDefaults;
+describe("Test Geo layout defaults", function() {
+ "use strict";
+ var layoutAttributes = Geo.layoutAttributes;
+ var supplyLayoutDefaults = Geo.supplyLayoutDefaults;
- describe('supplyLayoutDefaults', function() {
- var layoutIn, layoutOut, fullData;
+ describe("supplyLayoutDefaults", function() {
+ var layoutIn, layoutOut, fullData;
- beforeEach(function() {
- layoutOut = {};
+ beforeEach(function() {
+ layoutOut = {};
- // needs a geo-ref in a trace in order to be detected
- fullData = [{ type: 'scattergeo', geo: 'geo' }];
- });
-
- var seaFields = [
- 'showcoastlines', 'coastlinecolor', 'coastlinewidth',
- 'showocean', 'oceancolor'
- ];
-
- var subunitFields = [
- 'showsubunits', 'subunitcolor', 'subunitwidth'
- ];
-
- var frameFields = [
- 'showframe', 'framecolor', 'framewidth'
- ];
-
- it('should not coerce projection.rotation if type is albers usa', function() {
- layoutIn = {
- geo: {
- projection: {
- type: 'albers usa',
- rotation: {
- lon: 10,
- lat: 10
- }
- }
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.geo.projection.rotation).toBeUndefined();
- });
+ // needs a geo-ref in a trace in order to be detected
+ fullData = [{ type: "scattergeo", geo: "geo" }];
+ });
- it('should not coerce projection.rotation if type is albers usa (converse)', function() {
- layoutIn = {
- geo: {
- projection: {
- rotation: {
- lon: 10,
- lat: 10
- }
- }
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.geo.projection.rotation).toBeDefined();
+ var seaFields = [
+ "showcoastlines",
+ "coastlinecolor",
+ "coastlinewidth",
+ "showocean",
+ "oceancolor"
+ ];
+
+ var subunitFields = ["showsubunits", "subunitcolor", "subunitwidth"];
+
+ var frameFields = ["showframe", "framecolor", "framewidth"];
+
+ it(
+ "should not coerce projection.rotation if type is albers usa",
+ function() {
+ layoutIn = {
+ geo: {
+ projection: { type: "albers usa", rotation: { lon: 10, lat: 10 } }
+ }
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.geo.projection.rotation).toBeUndefined();
+ }
+ );
+
+ it(
+ "should not coerce projection.rotation if type is albers usa (converse)",
+ function() {
+ layoutIn = { geo: { projection: { rotation: { lon: 10, lat: 10 } } } };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.geo.projection.rotation).toBeDefined();
+ }
+ );
+
+ it(
+ "should not coerce coastlines and ocean if type is albers usa",
+ function() {
+ layoutIn = {
+ geo: {
+ projection: { type: "albers usa" },
+ showcoastlines: true,
+ showocean: true
+ }
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ seaFields.forEach(function(field) {
+ expect(layoutOut.geo[field]).toBeUndefined();
});
+ }
+ );
- it('should not coerce coastlines and ocean if type is albers usa', function() {
- layoutIn = {
- geo: {
- projection: {
- type: 'albers usa'
- },
- showcoastlines: true,
- showocean: true
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- seaFields.forEach(function(field) {
- expect(layoutOut.geo[field]).toBeUndefined();
- });
- });
+ it(
+ "should not coerce coastlines and ocean if type is albers usa (converse)",
+ function() {
+ layoutIn = { geo: { showcoastlines: true, showocean: true } };
- it('should not coerce coastlines and ocean if type is albers usa (converse)', function() {
- layoutIn = {
- geo: {
- showcoastlines: true,
- showocean: true
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- seaFields.forEach(function(field) {
- expect(layoutOut.geo[field]).toBeDefined();
- });
- });
-
- it('should not coerce projection.parallels if type is conic', function() {
- var projTypes = layoutAttributes.projection.type.values;
-
- function testOne(projType) {
- layoutIn = {
- geo: {
- projection: {
- type: projType,
- parallels: [10, 10]
- }
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- }
-
- projTypes.forEach(function(projType) {
- testOne(projType);
- if(projType.indexOf('conic') !== -1) {
- expect(layoutOut.geo.projection.parallels).toBeDefined();
- }
- else {
- expect(layoutOut.geo.projection.parallels).toBeUndefined();
- }
- });
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ seaFields.forEach(function(field) {
+ expect(layoutOut.geo[field]).toBeDefined();
});
+ }
+ );
+
+ it("should not coerce projection.parallels if type is conic", function() {
+ var projTypes = layoutAttributes.projection.type.values;
+
+ function testOne(projType) {
+ layoutIn = {
+ geo: { projection: { type: projType, parallels: [10, 10] } }
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ }
+
+ projTypes.forEach(function(projType) {
+ testOne(projType);
+ if (projType.indexOf("conic") !== -1) {
+ expect(layoutOut.geo.projection.parallels).toBeDefined();
+ } else {
+ expect(layoutOut.geo.projection.parallels).toBeUndefined();
+ }
+ });
+ });
- it('should coerce subunits only when available (usa case)', function() {
- layoutIn = {
- geo: { scope: 'usa' }
- };
+ it("should coerce subunits only when available (usa case)", function() {
+ layoutIn = { geo: { scope: "usa" } };
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- subunitFields.forEach(function(field) {
- expect(layoutOut.geo[field]).toBeDefined();
- });
- });
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ subunitFields.forEach(function(field) {
+ expect(layoutOut.geo[field]).toBeDefined();
+ });
+ });
- it('should coerce subunits only when available (default case)', function() {
- layoutIn = { geo: {} };
+ it("should coerce subunits only when available (default case)", function() {
+ layoutIn = { geo: {} };
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- subunitFields.forEach(function(field) {
- expect(layoutOut.geo[field]).toBeUndefined();
- });
- });
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ subunitFields.forEach(function(field) {
+ expect(layoutOut.geo[field]).toBeUndefined();
+ });
+ });
- it('should coerce subunits only when available (NA case)', function() {
- layoutIn = {
- geo: {
- scope: 'north america',
- resolution: 50
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- subunitFields.forEach(function(field) {
- expect(layoutOut.geo[field]).toBeDefined();
- });
- });
+ it("should coerce subunits only when available (NA case)", function() {
+ layoutIn = { geo: { scope: "north america", resolution: 50 } };
- it('should coerce subunits only when available (NA case 2)', function() {
- layoutIn = {
- geo: {
- scope: 'north america',
- resolution: '50'
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- subunitFields.forEach(function(field) {
- expect(layoutOut.geo[field]).toBeDefined();
- });
- });
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ subunitFields.forEach(function(field) {
+ expect(layoutOut.geo[field]).toBeDefined();
+ });
+ });
- it('should coerce subunits only when available (NA case 2)', function() {
- layoutIn = {
- geo: {
- scope: 'north america'
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- subunitFields.forEach(function(field) {
- expect(layoutOut.geo[field]).toBeUndefined();
- });
- });
+ it("should coerce subunits only when available (NA case 2)", function() {
+ layoutIn = { geo: { scope: "north america", resolution: "50" } };
- it('should not coerce frame unless for world scope', function() {
- var scopes = layoutAttributes.scope.values;
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ subunitFields.forEach(function(field) {
+ expect(layoutOut.geo[field]).toBeDefined();
+ });
+ });
- function testOne(scope) {
- layoutIn = {
- geo: { scope: scope }
- };
+ it("should coerce subunits only when available (NA case 2)", function() {
+ layoutIn = { geo: { scope: "north america" } };
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- }
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ subunitFields.forEach(function(field) {
+ expect(layoutOut.geo[field]).toBeUndefined();
+ });
+ });
- scopes.forEach(function(scope) {
- testOne(scope);
- if(scope === 'world') {
- frameFields.forEach(function(field) {
- expect(layoutOut.geo[field]).toBeDefined();
- });
- }
- else {
- frameFields.forEach(function(field) {
- expect(layoutOut.geo[field]).toBeUndefined();
- });
- }
- });
- });
+ it("should not coerce frame unless for world scope", function() {
+ var scopes = layoutAttributes.scope.values;
+
+ function testOne(scope) {
+ layoutIn = { geo: { scope: scope } };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ }
+
+ scopes.forEach(function(scope) {
+ testOne(scope);
+ if (scope === "world") {
+ frameFields.forEach(function(field) {
+ expect(layoutOut.geo[field]).toBeDefined();
+ });
+ } else {
+ frameFields.forEach(function(field) {
+ expect(layoutOut.geo[field]).toBeUndefined();
+ });
+ }
+ });
+ });
- it('should add geo data-only geos into layoutIn', function() {
- layoutIn = {};
- fullData = [{ type: 'scattergeo', geo: 'geo' }];
+ it("should add geo data-only geos into layoutIn", function() {
+ layoutIn = {};
+ fullData = [{ type: "scattergeo", geo: "geo" }];
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutIn.geo).toEqual({});
- });
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutIn.geo).toEqual({});
+ });
- it('should add geo data-only geos into layoutIn (converse)', function() {
- layoutIn = {};
- fullData = [{ type: 'scatter' }];
+ it("should add geo data-only geos into layoutIn (converse)", function() {
+ layoutIn = {};
+ fullData = [{ type: "scatter" }];
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutIn.geo).toBe(undefined);
- });
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutIn.geo).toBe(undefined);
});
+ });
});
-describe('geojson / topojson utils', function() {
- 'use strict';
+describe("geojson / topojson utils", function() {
+ "use strict";
+ function _locationToFeature(topojson, loc, locationmode) {
+ var trace = { locationmode: locationmode };
+ var features = topojsonUtils.getTopojsonFeatures(trace, topojson);
+
+ var feature = geoLocationUtils.locationToFeature(
+ locationmode,
+ loc,
+ features
+ );
+ return feature;
+ }
+
+ describe(
+ "should be able to extract topojson feature from *locations* items",
+ function() {
+ var topojsonName = "world_110m";
+ var topojson = GeoAssets.topojson[topojsonName];
+
+ it("with *ISO-3* locationmode", function() {
+ var out = _locationToFeature(topojson, "CAN", "ISO-3");
+
+ expect(Object.keys(out)).toEqual([
+ "type",
+ "id",
+ "properties",
+ "geometry"
+ ]);
+ expect(out.id).toEqual("CAN");
+ });
+
+ it("with *ISO-3* locationmode (not-found case)", function() {
+ var out = _locationToFeature(topojson, "XXX", "ISO-3");
+
+ expect(out).toEqual(false);
+ });
+
+ it("with *country names* locationmode", function() {
+ var out = _locationToFeature(
+ topojson,
+ "United States",
+ "country names"
+ );
+
+ expect(Object.keys(out)).toEqual([
+ "type",
+ "id",
+ "properties",
+ "geometry"
+ ]);
+ expect(out.id).toEqual("USA");
+ });
+
+ it("with *country names* locationmode (not-found case)", function() {
+ var out = _locationToFeature(topojson, "XXX", "country names");
+
+ expect(out).toEqual(false);
+ });
+ }
+ );
+});
- function _locationToFeature(topojson, loc, locationmode) {
- var trace = { locationmode: locationmode };
- var features = topojsonUtils.getTopojsonFeatures(trace, topojson);
+describe("Test geo interactions", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
- var feature = geoLocationUtils.locationToFeature(locationmode, loc, features);
- return feature;
- }
+ describe("mock geo_first.json", function() {
+ var mock = require("@mocks/geo_first.json");
+ var gd;
- describe('should be able to extract topojson feature from *locations* items', function() {
- var topojsonName = 'world_110m';
- var topojson = GeoAssets.topojson[topojsonName];
+ function mouseEventScatterGeo(type) {
+ mouseEvent(type, 300, 235);
+ }
- it('with *ISO-3* locationmode', function() {
- var out = _locationToFeature(topojson, 'CAN', 'ISO-3');
+ function mouseEventChoropleth(type) {
+ mouseEvent(type, 400, 160);
+ }
- expect(Object.keys(out)).toEqual(['type', 'id', 'properties', 'geometry']);
- expect(out.id).toEqual('CAN');
- });
+ function countTraces(type) {
+ return d3.selectAll("g.trace." + type).size();
+ }
- it('with *ISO-3* locationmode (not-found case)', function() {
- var out = _locationToFeature(topojson, 'XXX', 'ISO-3');
+ function countGeos() {
+ return d3.select("div.geo-container").selectAll("div").size();
+ }
- expect(out).toEqual(false);
- });
+ function countColorBars() {
+ return d3.select("g.infolayer").selectAll(".cbbg").size();
+ }
- it('with *country names* locationmode', function() {
- var out = _locationToFeature(topojson, 'United States', 'country names');
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- expect(Object.keys(out)).toEqual(['type', 'id', 'properties', 'geometry']);
- expect(out.id).toEqual('USA');
- });
+ var mockCopy = Lib.extendDeep({}, mock);
- it('with *country names* locationmode (not-found case)', function() {
- var out = _locationToFeature(topojson, 'XXX', 'country names');
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- expect(out).toEqual(false);
- });
+ describe("scattergeo hover labels", function() {
+ it("should show one hover text group", function() {
+ mouseEventScatterGeo("mousemove");
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
+ });
+
+ it("should show longitude and latitude values", function() {
+ mouseEventScatterGeo("mousemove");
+
+ var node = d3.selectAll("g.hovertext").selectAll("tspan")[0][0];
+ expect(node.innerHTML).toEqual("(0\xB0, 0\xB0)");
+ });
+
+ it("should show the trace name", function() {
+ mouseEventScatterGeo("mousemove");
+
+ var node = d3.selectAll("g.hovertext").selectAll("text")[0][0];
+ expect(node.innerHTML).toEqual("trace 0");
+ });
+
+ it("should show *text* (case 1)", function(done) {
+ Plotly.restyle(gd, "text", [["A", "B"]])
+ .then(function() {
+ mouseEventScatterGeo("mousemove");
+
+ var node = d3.selectAll("g.hovertext").selectAll("tspan")[0][1];
+ expect(node.innerHTML).toEqual("A");
+ })
+ .then(done);
+ });
+
+ it("should show *text* (case 2)", function(done) {
+ Plotly.restyle(gd, "text", [[null, "B"]])
+ .then(function() {
+ mouseEventScatterGeo("mousemove");
+
+ var node = d3.selectAll("g.hovertext").selectAll("tspan")[0][1];
+ expect(node).toBeUndefined();
+ })
+ .then(done);
+ });
+
+ it("should show *text* (case 3)", function(done) {
+ Plotly.restyle(gd, "text", [["", "B"]])
+ .then(function() {
+ mouseEventScatterGeo("mousemove");
+
+ var node = d3.selectAll("g.hovertext").selectAll("tspan")[0][1];
+ expect(node).toBeUndefined();
+ })
+ .then(done);
+ });
});
-});
-describe('Test geo interactions', function() {
- 'use strict';
+ describe("scattergeo hover events", function() {
+ var ptData, cnt;
- afterEach(destroyGraphDiv);
+ beforeEach(function() {
+ cnt = 0;
- describe('mock geo_first.json', function() {
- var mock = require('@mocks/geo_first.json');
- var gd;
+ gd.on("plotly_hover", function(eventData) {
+ ptData = eventData.points[0];
+ cnt++;
+ });
- function mouseEventScatterGeo(type) {
- mouseEvent(type, 300, 235);
- }
+ mouseEventScatterGeo("mousemove");
+ });
+
+ it("should contain the correct fields", function() {
+ expect(Object.keys(ptData)).toEqual([
+ "data",
+ "fullData",
+ "curveNumber",
+ "pointNumber",
+ "lon",
+ "lat",
+ "location"
+ ]);
+ expect(cnt).toEqual(1);
+ });
+
+ it("should show the correct point data", function() {
+ expect(ptData.lon).toEqual(0);
+ expect(ptData.lat).toEqual(0);
+ expect(ptData.location).toBe(null);
+ expect(ptData.curveNumber).toEqual(0);
+ expect(ptData.pointNumber).toEqual(0);
+ expect(cnt).toEqual(1);
+ });
+
+ it(
+ "should not be triggered when pt over on the other side of the globe",
+ function(done) {
+ var update = {
+ "geo.projection.type": "orthographic",
+ "geo.projection.rotation": { lon: 82, lat: -19 }
+ };
+
+ Plotly.relayout(gd, update).then(function() {
+ setTimeout(
+ function() {
+ mouseEvent("mousemove", 288, 170);
- function mouseEventChoropleth(type) {
- mouseEvent(type, 400, 160);
- }
+ expect(cnt).toEqual(1);
- function countTraces(type) {
- return d3.selectAll('g.trace.' + type).size();
+ done();
+ },
+ HOVERMINTIME + 10
+ );
+ });
}
+ );
- function countGeos() {
- return d3.select('div.geo-container').selectAll('div').size();
- }
+ it(
+ "should not be triggered when pt *location* does not have matching feature",
+ function(done) {
+ var update = { locations: [["CAN", "AAA", "USA"]] };
- function countColorBars() {
- return d3.select('g.infolayer').selectAll('.cbbg').size();
- }
+ Plotly.restyle(gd, update).then(function() {
+ setTimeout(
+ function() {
+ mouseEvent("mousemove", 300, 230);
- beforeEach(function(done) {
- gd = createGraphDiv();
+ expect(cnt).toEqual(1);
- var mockCopy = Lib.extendDeep({}, mock);
+ done();
+ },
+ HOVERMINTIME + 10
+ );
+ });
+ }
+ );
+ });
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
- });
+ describe("scattergeo click events", function() {
+ var ptData;
- describe('scattergeo hover labels', function() {
- it('should show one hover text group', function() {
- mouseEventScatterGeo('mousemove');
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
- });
-
- it('should show longitude and latitude values', function() {
- mouseEventScatterGeo('mousemove');
-
- var node = d3.selectAll('g.hovertext').selectAll('tspan')[0][0];
- expect(node.innerHTML).toEqual('(0°, 0°)');
- });
-
- it('should show the trace name', function() {
- mouseEventScatterGeo('mousemove');
-
- var node = d3.selectAll('g.hovertext').selectAll('text')[0][0];
- expect(node.innerHTML).toEqual('trace 0');
- });
-
- it('should show *text* (case 1)', function(done) {
- Plotly.restyle(gd, 'text', [['A', 'B']]).then(function() {
- mouseEventScatterGeo('mousemove');
-
- var node = d3.selectAll('g.hovertext').selectAll('tspan')[0][1];
- expect(node.innerHTML).toEqual('A');
- })
- .then(done);
- });
-
- it('should show *text* (case 2)', function(done) {
- Plotly.restyle(gd, 'text', [[null, 'B']]).then(function() {
- mouseEventScatterGeo('mousemove');
-
- var node = d3.selectAll('g.hovertext').selectAll('tspan')[0][1];
- expect(node).toBeUndefined();
- })
- .then(done);
- });
-
- it('should show *text* (case 3)', function(done) {
- Plotly.restyle(gd, 'text', [['', 'B']]).then(function() {
- mouseEventScatterGeo('mousemove');
-
- var node = d3.selectAll('g.hovertext').selectAll('tspan')[0][1];
- expect(node).toBeUndefined();
- })
- .then(done);
- });
+ beforeEach(function() {
+ gd.on("plotly_click", function(eventData) {
+ ptData = eventData.points[0];
});
- describe('scattergeo hover events', function() {
- var ptData, cnt;
-
- beforeEach(function() {
- cnt = 0;
-
- gd.on('plotly_hover', function(eventData) {
- ptData = eventData.points[0];
- cnt++;
- });
+ mouseEventScatterGeo("mousemove");
+ mouseEventScatterGeo("click");
+ });
+
+ it("should contain the correct fields", function() {
+ expect(Object.keys(ptData)).toEqual([
+ "data",
+ "fullData",
+ "curveNumber",
+ "pointNumber",
+ "lon",
+ "lat",
+ "location"
+ ]);
+ });
+
+ it("should show the correct point data", function() {
+ expect(ptData.lon).toEqual(0);
+ expect(ptData.lat).toEqual(0);
+ expect(ptData.location).toBe(null);
+ expect(ptData.curveNumber).toEqual(0);
+ expect(ptData.pointNumber).toEqual(0);
+ });
+ });
- mouseEventScatterGeo('mousemove');
- });
+ describe("scattergeo unhover events", function() {
+ var ptData;
- it('should contain the correct fields', function() {
- expect(Object.keys(ptData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber',
- 'lon', 'lat', 'location'
- ]);
- expect(cnt).toEqual(1);
- });
-
- it('should show the correct point data', function() {
- expect(ptData.lon).toEqual(0);
- expect(ptData.lat).toEqual(0);
- expect(ptData.location).toBe(null);
- expect(ptData.curveNumber).toEqual(0);
- expect(ptData.pointNumber).toEqual(0);
- expect(cnt).toEqual(1);
- });
-
- it('should not be triggered when pt over on the other side of the globe', function(done) {
- var update = {
- 'geo.projection.type': 'orthographic',
- 'geo.projection.rotation': { lon: 82, lat: -19 }
- };
+ beforeEach(function(done) {
+ gd.on("plotly_unhover", function(eventData) {
+ ptData = eventData.points[0];
+ });
- Plotly.relayout(gd, update).then(function() {
- setTimeout(function() {
- mouseEvent('mousemove', 288, 170);
+ mouseEventScatterGeo("mousemove");
+ setTimeout(
+ function() {
+ mouseEvent("mousemove", 400, 200);
+ done();
+ },
+ HOVERMINTIME + 10
+ );
+ });
+
+ it("should contain the correct fields", function() {
+ expect(Object.keys(ptData)).toEqual([
+ "data",
+ "fullData",
+ "curveNumber",
+ "pointNumber",
+ "lon",
+ "lat",
+ "location"
+ ]);
+ });
+
+ it("should show the correct point data", function() {
+ expect(ptData.lon).toEqual(0);
+ expect(ptData.lat).toEqual(0);
+ expect(ptData.location).toBe(null);
+ expect(ptData.curveNumber).toEqual(0);
+ expect(ptData.pointNumber).toEqual(0);
+ });
+ });
- expect(cnt).toEqual(1);
+ describe("choropleth hover labels", function() {
+ beforeEach(function() {
+ mouseEventChoropleth("mouseover");
+ });
- done();
- }, HOVERMINTIME + 10);
- });
- });
+ it("should show one hover text group", function() {
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
+ });
- it('should not be triggered when pt *location* does not have matching feature', function(done) {
- var update = {
- 'locations': [['CAN', 'AAA', 'USA']]
- };
+ it("should show location and z values", function() {
+ var node = d3.selectAll("g.hovertext").selectAll("tspan")[0];
- Plotly.restyle(gd, update).then(function() {
- setTimeout(function() { mouseEvent('mousemove', 300, 230);
+ expect(node[0].innerHTML).toEqual("RUS");
+ expect(node[1].innerHTML).toEqual("10");
+ });
- expect(cnt).toEqual(1);
+ it("should show the trace name", function() {
+ var node = d3.selectAll("g.hovertext").selectAll("text")[0][0];
- done();
- }, HOVERMINTIME + 10);
- });
- });
- });
+ expect(node.innerHTML).toEqual("trace 1");
+ });
+ });
- describe('scattergeo click events', function() {
- var ptData;
-
- beforeEach(function() {
- gd.on('plotly_click', function(eventData) {
- ptData = eventData.points[0];
- });
-
- mouseEventScatterGeo('mousemove');
- mouseEventScatterGeo('click');
- });
-
- it('should contain the correct fields', function() {
- expect(Object.keys(ptData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber',
- 'lon', 'lat', 'location'
- ]);
- });
-
- it('should show the correct point data', function() {
- expect(ptData.lon).toEqual(0);
- expect(ptData.lat).toEqual(0);
- expect(ptData.location).toBe(null);
- expect(ptData.curveNumber).toEqual(0);
- expect(ptData.pointNumber).toEqual(0);
- });
- });
+ describe("choropleth hover events", function() {
+ var ptData;
- describe('scattergeo unhover events', function() {
- var ptData;
-
- beforeEach(function(done) {
- gd.on('plotly_unhover', function(eventData) {
- ptData = eventData.points[0];
- });
-
- mouseEventScatterGeo('mousemove');
- setTimeout(function() {
- mouseEvent('mousemove', 400, 200);
- done();
- }, HOVERMINTIME + 10);
- });
-
- it('should contain the correct fields', function() {
- expect(Object.keys(ptData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber',
- 'lon', 'lat', 'location'
- ]);
- });
-
- it('should show the correct point data', function() {
- expect(ptData.lon).toEqual(0);
- expect(ptData.lat).toEqual(0);
- expect(ptData.location).toBe(null);
- expect(ptData.curveNumber).toEqual(0);
- expect(ptData.pointNumber).toEqual(0);
- });
+ beforeEach(function() {
+ gd.on("plotly_hover", function(eventData) {
+ ptData = eventData.points[0];
});
- describe('choropleth hover labels', function() {
- beforeEach(function() {
- mouseEventChoropleth('mouseover');
- });
-
- it('should show one hover text group', function() {
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
- });
-
- it('should show location and z values', function() {
- var node = d3.selectAll('g.hovertext').selectAll('tspan')[0];
-
- expect(node[0].innerHTML).toEqual('RUS');
- expect(node[1].innerHTML).toEqual('10');
- });
+ mouseEventChoropleth("mouseover");
+ });
+
+ it("should contain the correct fields", function() {
+ expect(Object.keys(ptData)).toEqual([
+ "data",
+ "fullData",
+ "curveNumber",
+ "pointNumber",
+ "location",
+ "z"
+ ]);
+ });
+
+ it("should show the correct point data", function() {
+ expect(ptData.location).toBe("RUS");
+ expect(ptData.z).toEqual(10);
+ expect(ptData.curveNumber).toEqual(1);
+ expect(ptData.pointNumber).toEqual(2);
+ });
+ });
- it('should show the trace name', function() {
- var node = d3.selectAll('g.hovertext').selectAll('text')[0][0];
+ describe("choropleth click events", function() {
+ var ptData;
- expect(node.innerHTML).toEqual('trace 1');
- });
+ beforeEach(function() {
+ gd.on("plotly_click", function(eventData) {
+ ptData = eventData.points[0];
});
- describe('choropleth hover events', function() {
- var ptData;
-
- beforeEach(function() {
- gd.on('plotly_hover', function(eventData) {
- ptData = eventData.points[0];
- });
-
- mouseEventChoropleth('mouseover');
- });
-
- it('should contain the correct fields', function() {
- expect(Object.keys(ptData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber',
- 'location', 'z'
- ]);
- });
-
- it('should show the correct point data', function() {
- expect(ptData.location).toBe('RUS');
- expect(ptData.z).toEqual(10);
- expect(ptData.curveNumber).toEqual(1);
- expect(ptData.pointNumber).toEqual(2);
- });
- });
+ mouseEventChoropleth("click");
+ });
+
+ it("should contain the correct fields", function() {
+ expect(Object.keys(ptData)).toEqual([
+ "data",
+ "fullData",
+ "curveNumber",
+ "pointNumber",
+ "location",
+ "z"
+ ]);
+ });
+
+ it("should show the correct point data", function() {
+ expect(ptData.location).toBe("RUS");
+ expect(ptData.z).toEqual(10);
+ expect(ptData.curveNumber).toEqual(1);
+ expect(ptData.pointNumber).toEqual(2);
+ });
+ });
- describe('choropleth click events', function() {
- var ptData;
-
- beforeEach(function() {
- gd.on('plotly_click', function(eventData) {
- ptData = eventData.points[0];
- });
-
- mouseEventChoropleth('click');
- });
-
- it('should contain the correct fields', function() {
- expect(Object.keys(ptData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber',
- 'location', 'z'
- ]);
- });
-
- it('should show the correct point data', function() {
- expect(ptData.location).toBe('RUS');
- expect(ptData.z).toEqual(10);
- expect(ptData.curveNumber).toEqual(1);
- expect(ptData.pointNumber).toEqual(2);
- });
- });
+ describe("choropleth unhover events", function() {
+ var ptData;
- describe('choropleth unhover events', function() {
- var ptData;
-
- beforeEach(function() {
- gd.on('plotly_unhover', function(eventData) {
- ptData = eventData.points[0];
- });
-
- mouseEventChoropleth('mouseover');
- mouseEventChoropleth('mouseout');
- });
-
- it('should contain the correct fields', function() {
- expect(Object.keys(ptData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber',
- 'location', 'z'
- ]);
- });
-
- it('should show the correct point data', function() {
- expect(ptData.location).toBe('RUS');
- expect(ptData.z).toEqual(10);
- expect(ptData.curveNumber).toEqual(1);
- expect(ptData.pointNumber).toEqual(2);
- });
+ beforeEach(function() {
+ gd.on("plotly_unhover", function(eventData) {
+ ptData = eventData.points[0];
});
- describe('trace visibility toggle', function() {
- it('should toggle scattergeo elements', function(done) {
- expect(countTraces('scattergeo')).toBe(1);
- expect(countTraces('choropleth')).toBe(1);
-
- Plotly.restyle(gd, 'visible', false, [0]).then(function() {
- expect(countTraces('scattergeo')).toBe(0);
- expect(countTraces('choropleth')).toBe(1);
-
- return Plotly.restyle(gd, 'visible', true, [0]);
- }).then(function() {
- expect(countTraces('scattergeo')).toBe(1);
- expect(countTraces('choropleth')).toBe(1);
-
- done();
- });
- });
-
- it('should toggle choropleth elements', function(done) {
- expect(countTraces('scattergeo')).toBe(1);
- expect(countTraces('choropleth')).toBe(1);
-
- Plotly.restyle(gd, 'visible', false, [1]).then(function() {
- expect(countTraces('scattergeo')).toBe(1);
- expect(countTraces('choropleth')).toBe(0);
-
- return Plotly.restyle(gd, 'visible', true, [1]);
- }).then(function() {
- expect(countTraces('scattergeo')).toBe(1);
- expect(countTraces('choropleth')).toBe(1);
+ mouseEventChoropleth("mouseover");
+ mouseEventChoropleth("mouseout");
+ });
+
+ it("should contain the correct fields", function() {
+ expect(Object.keys(ptData)).toEqual([
+ "data",
+ "fullData",
+ "curveNumber",
+ "pointNumber",
+ "location",
+ "z"
+ ]);
+ });
+
+ it("should show the correct point data", function() {
+ expect(ptData.location).toBe("RUS");
+ expect(ptData.z).toEqual(10);
+ expect(ptData.curveNumber).toEqual(1);
+ expect(ptData.pointNumber).toEqual(2);
+ });
+ });
- done();
- });
- });
+ describe("trace visibility toggle", function() {
+ it("should toggle scattergeo elements", function(done) {
+ expect(countTraces("scattergeo")).toBe(1);
+ expect(countTraces("choropleth")).toBe(1);
+
+ Plotly.restyle(gd, "visible", false, [0])
+ .then(function() {
+ expect(countTraces("scattergeo")).toBe(0);
+ expect(countTraces("choropleth")).toBe(1);
+
+ return Plotly.restyle(gd, "visible", true, [0]);
+ })
+ .then(function() {
+ expect(countTraces("scattergeo")).toBe(1);
+ expect(countTraces("choropleth")).toBe(1);
+
+ done();
+ });
+ });
+
+ it("should toggle choropleth elements", function(done) {
+ expect(countTraces("scattergeo")).toBe(1);
+ expect(countTraces("choropleth")).toBe(1);
+
+ Plotly.restyle(gd, "visible", false, [1])
+ .then(function() {
+ expect(countTraces("scattergeo")).toBe(1);
+ expect(countTraces("choropleth")).toBe(0);
+
+ return Plotly.restyle(gd, "visible", true, [1]);
+ })
+ .then(function() {
+ expect(countTraces("scattergeo")).toBe(1);
+ expect(countTraces("choropleth")).toBe(1);
+
+ done();
+ });
+ });
+ });
- });
+ describe("deleting traces and geos", function() {
+ it("should delete traces in succession", function(done) {
+ expect(countTraces("scattergeo")).toBe(1);
+ expect(countTraces("choropleth")).toBe(1);
+ expect(countGeos()).toBe(1);
+ expect(countColorBars()).toBe(1);
+
+ Plotly.deleteTraces(gd, [0])
+ .then(function() {
+ expect(countTraces("scattergeo")).toBe(0);
+ expect(countTraces("choropleth")).toBe(1);
+ expect(countGeos()).toBe(1);
+ expect(countColorBars()).toBe(1);
+
+ return Plotly.deleteTraces(gd, [0]);
+ })
+ .then(function() {
+ expect(countTraces("scattergeo")).toBe(0);
+ expect(countTraces("choropleth")).toBe(0);
+ expect(countGeos()).toBe(0, "- trace-less geo subplot are deleted");
+ expect(countColorBars()).toBe(0);
+
+ return Plotly.relayout(gd, "geo", null);
+ })
+ .then(function() {
+ expect(countTraces("scattergeo")).toBe(0);
+ expect(countTraces("choropleth")).toBe(0);
+ expect(countGeos()).toBe(0);
+ expect(countColorBars()).toBe(0);
+
+ done();
+ });
+ });
+ });
- describe('deleting traces and geos', function() {
- it('should delete traces in succession', function(done) {
- expect(countTraces('scattergeo')).toBe(1);
- expect(countTraces('choropleth')).toBe(1);
- expect(countGeos()).toBe(1);
- expect(countColorBars()).toBe(1);
-
- Plotly.deleteTraces(gd, [0]).then(function() {
- expect(countTraces('scattergeo')).toBe(0);
- expect(countTraces('choropleth')).toBe(1);
- expect(countGeos()).toBe(1);
- expect(countColorBars()).toBe(1);
-
- return Plotly.deleteTraces(gd, [0]);
- }).then(function() {
- expect(countTraces('scattergeo')).toBe(0);
- expect(countTraces('choropleth')).toBe(0);
- expect(countGeos()).toBe(0, '- trace-less geo subplot are deleted');
- expect(countColorBars()).toBe(0);
-
- return Plotly.relayout(gd, 'geo', null);
- }).then(function() {
- expect(countTraces('scattergeo')).toBe(0);
- expect(countTraces('choropleth')).toBe(0);
- expect(countGeos()).toBe(0);
- expect(countColorBars()).toBe(0);
-
- done();
- });
- });
+ describe("streaming calls", function() {
+ var INTERVAL = 10;
+
+ var N_MARKERS_AT_START = Math.min(
+ mock.data[0].lat.length,
+ mock.data[0].lon.length
+ );
+
+ var N_LOCATIONS_AT_START = mock.data[1].locations.length;
+
+ var lonQueue = [45, -45, 12, 20],
+ latQueue = [-75, 80, 5, 10],
+ textQueue = ["c", "d", "e", "f"],
+ locationsQueue = ["AUS", "FRA", "DEU", "MEX"],
+ zQueue = [100, 20, 30, 12];
+
+ beforeEach(function(done) {
+ var update = {
+ mode: "lines+markers+text",
+ text: [["a", "b"]],
+ "marker.size": 10
+ };
+
+ Plotly.restyle(gd, update, [0]).then(done);
+ });
+
+ function countScatterGeoLines() {
+ return d3
+ .selectAll("g.trace.scattergeo")
+ .selectAll("path.js-line")
+ .size();
+ }
+
+ function countScatterGeoMarkers() {
+ return d3
+ .selectAll("g.trace.scattergeo")
+ .selectAll("path.point")
+ .size();
+ }
+
+ function countScatterGeoTextGroups() {
+ return d3.selectAll("g.trace.scattergeo").selectAll("g").size();
+ }
+
+ function countScatterGeoTextNodes() {
+ return d3
+ .selectAll("g.trace.scattergeo")
+ .selectAll("g")
+ .select("text")
+ .size();
+ }
+
+ function checkScatterGeoOrder() {
+ var order = ["js-path", "point", null];
+ var nodes = d3.selectAll("g.trace.scattergeo");
+
+ nodes.each(function() {
+ var list = [];
+
+ d3.select(this).selectAll("*").each(function() {
+ var className = d3.select(this).attr("class");
+ list.push(className);
+ });
+
+ var listSorted = list.slice().sort(function(a, b) {
+ return order.indexOf(a) - order.indexOf(b);
+ });
+
+ expect(list).toEqual(listSorted);
});
-
- describe('streaming calls', function() {
- var INTERVAL = 10;
-
- var N_MARKERS_AT_START = Math.min(
- mock.data[0].lat.length,
- mock.data[0].lon.length
- );
-
- var N_LOCATIONS_AT_START = mock.data[1].locations.length;
-
- var lonQueue = [45, -45, 12, 20],
- latQueue = [-75, 80, 5, 10],
- textQueue = ['c', 'd', 'e', 'f'],
- locationsQueue = ['AUS', 'FRA', 'DEU', 'MEX'],
- zQueue = [100, 20, 30, 12];
-
- beforeEach(function(done) {
- var update = {
- mode: 'lines+markers+text',
- text: [['a', 'b']],
- 'marker.size': 10
- };
-
- Plotly.restyle(gd, update, [0]).then(done);
- });
-
- function countScatterGeoLines() {
- return d3.selectAll('g.trace.scattergeo')
- .selectAll('path.js-line')
- .size();
- }
-
- function countScatterGeoMarkers() {
- return d3.selectAll('g.trace.scattergeo')
- .selectAll('path.point')
- .size();
+ }
+
+ function countChoroplethPaths() {
+ return d3
+ .selectAll("g.trace.choropleth")
+ .selectAll("path.choroplethlocation")
+ .size();
+ }
+
+ it("should be able to add line/marker/text nodes", function(done) {
+ var i = 0;
+
+ var interval = setInterval(
+ function() {
+ expect(countTraces("scattergeo")).toBe(1);
+ expect(countTraces("choropleth")).toBe(1);
+ expect(countScatterGeoLines()).toBe(1);
+ expect(countScatterGeoMarkers()).toBe(N_MARKERS_AT_START + i);
+ expect(countScatterGeoTextGroups()).toBe(N_MARKERS_AT_START + i);
+ expect(countScatterGeoTextNodes()).toBe(N_MARKERS_AT_START + i);
+ checkScatterGeoOrder();
+
+ var trace = gd.data[0];
+ trace.lon.push(lonQueue[i]);
+ trace.lat.push(latQueue[i]);
+ trace.text.push(textQueue[i]);
+
+ if (i === lonQueue.length - 1) {
+ clearInterval(interval);
+ done();
}
- function countScatterGeoTextGroups() {
- return d3.selectAll('g.trace.scattergeo')
- .selectAll('g')
- .size();
+ gd.calcdata = undefined;
+ Plotly.plot(gd);
+ i++;
+ },
+ INTERVAL
+ );
+ });
+
+ it("should be able to shift line/marker/text nodes", function(done) {
+ var i = 0;
+
+ var interval = setInterval(
+ function() {
+ expect(countTraces("scattergeo")).toBe(1);
+ expect(countTraces("choropleth")).toBe(1);
+ expect(countScatterGeoLines()).toBe(1);
+ expect(countScatterGeoMarkers()).toBe(N_MARKERS_AT_START);
+ expect(countScatterGeoTextGroups()).toBe(N_MARKERS_AT_START);
+ expect(countScatterGeoTextNodes()).toBe(N_MARKERS_AT_START);
+ checkScatterGeoOrder();
+
+ var trace = gd.data[0];
+ trace.lon.push(lonQueue[i]);
+ trace.lat.push(latQueue[i]);
+ trace.text.push(textQueue[i]);
+ trace.lon.shift();
+ trace.lat.shift();
+ trace.text.shift();
+
+ if (i === lonQueue.length - 1) {
+ clearInterval(interval);
+ done();
}
- function countScatterGeoTextNodes() {
- return d3.selectAll('g.trace.scattergeo')
- .selectAll('g')
- .select('text')
- .size();
+ gd.calcdata = undefined;
+ Plotly.plot(gd);
+ i++;
+ },
+ INTERVAL
+ );
+ });
+
+ it("should be able to update line/marker/text nodes", function(done) {
+ var i = 0;
+
+ var interval = setInterval(
+ function() {
+ expect(countTraces("scattergeo")).toBe(1);
+ expect(countTraces("choropleth")).toBe(1);
+ expect(countScatterGeoLines()).toBe(1);
+ expect(countScatterGeoMarkers()).toBe(N_MARKERS_AT_START);
+ expect(countScatterGeoTextGroups()).toBe(N_MARKERS_AT_START);
+ expect(countScatterGeoTextNodes()).toBe(N_MARKERS_AT_START);
+ checkScatterGeoOrder();
+
+ var trace = gd.data[0];
+ trace.lon.push(lonQueue[i]);
+ trace.lat.push(latQueue[i]);
+ trace.text.push(textQueue[i]);
+ trace.lon.shift();
+ trace.lat.shift();
+ trace.text.shift();
+
+ if (i === lonQueue.length - 1) {
+ clearInterval(interval);
+ done();
}
- function checkScatterGeoOrder() {
- var order = ['js-path', 'point', null];
- var nodes = d3.selectAll('g.trace.scattergeo');
-
- nodes.each(function() {
- var list = [];
-
- d3.select(this).selectAll('*').each(function() {
- var className = d3.select(this).attr('class');
- list.push(className);
- });
-
- var listSorted = list.slice().sort(function(a, b) {
- return order.indexOf(a) - order.indexOf(b);
- });
-
- expect(list).toEqual(listSorted);
- });
- }
-
- function countChoroplethPaths() {
- return d3.selectAll('g.trace.choropleth')
- .selectAll('path.choroplethlocation')
- .size();
- }
-
- it('should be able to add line/marker/text nodes', function(done) {
- var i = 0;
-
- var interval = setInterval(function() {
- expect(countTraces('scattergeo')).toBe(1);
- expect(countTraces('choropleth')).toBe(1);
- expect(countScatterGeoLines()).toBe(1);
- expect(countScatterGeoMarkers()).toBe(N_MARKERS_AT_START + i);
- expect(countScatterGeoTextGroups()).toBe(N_MARKERS_AT_START + i);
- expect(countScatterGeoTextNodes()).toBe(N_MARKERS_AT_START + i);
- checkScatterGeoOrder();
-
- var trace = gd.data[0];
- trace.lon.push(lonQueue[i]);
- trace.lat.push(latQueue[i]);
- trace.text.push(textQueue[i]);
-
- if(i === lonQueue.length - 1) {
- clearInterval(interval);
- done();
- }
-
- gd.calcdata = undefined;
- Plotly.plot(gd);
- i++;
- }, INTERVAL);
- });
-
- it('should be able to shift line/marker/text nodes', function(done) {
- var i = 0;
-
- var interval = setInterval(function() {
- expect(countTraces('scattergeo')).toBe(1);
- expect(countTraces('choropleth')).toBe(1);
- expect(countScatterGeoLines()).toBe(1);
- expect(countScatterGeoMarkers()).toBe(N_MARKERS_AT_START);
- expect(countScatterGeoTextGroups()).toBe(N_MARKERS_AT_START);
- expect(countScatterGeoTextNodes()).toBe(N_MARKERS_AT_START);
- checkScatterGeoOrder();
-
- var trace = gd.data[0];
- trace.lon.push(lonQueue[i]);
- trace.lat.push(latQueue[i]);
- trace.text.push(textQueue[i]);
- trace.lon.shift();
- trace.lat.shift();
- trace.text.shift();
-
- if(i === lonQueue.length - 1) {
- clearInterval(interval);
- done();
- }
-
- gd.calcdata = undefined;
- Plotly.plot(gd);
- i++;
- }, INTERVAL);
- });
-
- it('should be able to update line/marker/text nodes', function(done) {
- var i = 0;
-
- var interval = setInterval(function() {
- expect(countTraces('scattergeo')).toBe(1);
- expect(countTraces('choropleth')).toBe(1);
- expect(countScatterGeoLines()).toBe(1);
- expect(countScatterGeoMarkers()).toBe(N_MARKERS_AT_START);
- expect(countScatterGeoTextGroups()).toBe(N_MARKERS_AT_START);
- expect(countScatterGeoTextNodes()).toBe(N_MARKERS_AT_START);
- checkScatterGeoOrder();
-
- var trace = gd.data[0];
- trace.lon.push(lonQueue[i]);
- trace.lat.push(latQueue[i]);
- trace.text.push(textQueue[i]);
- trace.lon.shift();
- trace.lat.shift();
- trace.text.shift();
-
- if(i === lonQueue.length - 1) {
- clearInterval(interval);
- done();
- }
-
- gd.calcdata = undefined;
- Plotly.plot(gd);
- i++;
- }, INTERVAL);
- });
-
- it('should be able to delete line/marker/text nodes and choropleth paths', function(done) {
- var trace0 = gd.data[0];
- trace0.lon.shift();
- trace0.lat.shift();
- trace0.text.shift();
-
- var trace1 = gd.data[1];
- trace1.locations.shift();
-
- gd.calcdata = undefined;
- Plotly.plot(gd).then(function() {
- expect(countTraces('scattergeo')).toBe(1);
- expect(countTraces('choropleth')).toBe(1);
-
- expect(countScatterGeoLines()).toBe(1);
- expect(countScatterGeoMarkers()).toBe(N_MARKERS_AT_START - 1);
- expect(countScatterGeoTextGroups()).toBe(N_MARKERS_AT_START - 1);
- expect(countScatterGeoTextNodes()).toBe(N_MARKERS_AT_START - 1);
- checkScatterGeoOrder();
-
- expect(countChoroplethPaths()).toBe(N_LOCATIONS_AT_START - 1);
-
- done();
- });
- });
-
- it('should be able to update line/marker/text nodes and choropleth paths', function(done) {
- var trace0 = gd.data[0];
- trace0.lon = lonQueue;
- trace0.lat = latQueue;
- trace0.text = textQueue;
-
- var trace1 = gd.data[1];
- trace1.locations = locationsQueue;
- trace1.z = zQueue;
-
- gd.calcdata = undefined;
- Plotly.plot(gd).then(function() {
- expect(countTraces('scattergeo')).toBe(1);
- expect(countTraces('choropleth')).toBe(1);
-
- expect(countScatterGeoLines()).toBe(1);
- expect(countScatterGeoMarkers()).toBe(lonQueue.length);
- expect(countScatterGeoTextGroups()).toBe(textQueue.length);
- expect(countScatterGeoTextNodes()).toBe(textQueue.length);
- checkScatterGeoOrder();
-
- expect(countChoroplethPaths()).toBe(locationsQueue.length);
-
- done();
- });
- });
-
- });
+ gd.calcdata = undefined;
+ Plotly.plot(gd);
+ i++;
+ },
+ INTERVAL
+ );
+ });
+
+ it(
+ "should be able to delete line/marker/text nodes and choropleth paths",
+ function(done) {
+ var trace0 = gd.data[0];
+ trace0.lon.shift();
+ trace0.lat.shift();
+ trace0.text.shift();
+
+ var trace1 = gd.data[1];
+ trace1.locations.shift();
+
+ gd.calcdata = undefined;
+ Plotly.plot(gd).then(function() {
+ expect(countTraces("scattergeo")).toBe(1);
+ expect(countTraces("choropleth")).toBe(1);
+
+ expect(countScatterGeoLines()).toBe(1);
+ expect(countScatterGeoMarkers()).toBe(N_MARKERS_AT_START - 1);
+ expect(countScatterGeoTextGroups()).toBe(N_MARKERS_AT_START - 1);
+ expect(countScatterGeoTextNodes()).toBe(N_MARKERS_AT_START - 1);
+ checkScatterGeoOrder();
+
+ expect(countChoroplethPaths()).toBe(N_LOCATIONS_AT_START - 1);
+
+ done();
+ });
+ }
+ );
+
+ it(
+ "should be able to update line/marker/text nodes and choropleth paths",
+ function(done) {
+ var trace0 = gd.data[0];
+ trace0.lon = lonQueue;
+ trace0.lat = latQueue;
+ trace0.text = textQueue;
+
+ var trace1 = gd.data[1];
+ trace1.locations = locationsQueue;
+ trace1.z = zQueue;
+
+ gd.calcdata = undefined;
+ Plotly.plot(gd).then(function() {
+ expect(countTraces("scattergeo")).toBe(1);
+ expect(countTraces("choropleth")).toBe(1);
+
+ expect(countScatterGeoLines()).toBe(1);
+ expect(countScatterGeoMarkers()).toBe(lonQueue.length);
+ expect(countScatterGeoTextGroups()).toBe(textQueue.length);
+ expect(countScatterGeoTextNodes()).toBe(textQueue.length);
+ checkScatterGeoOrder();
+
+ expect(countChoroplethPaths()).toBe(locationsQueue.length);
+
+ done();
+ });
+ }
+ );
});
+ });
});
diff --git a/test/jasmine/tests/gl2d_click_test.js b/test/jasmine/tests/gl2d_click_test.js
index 8e001d55873..4633e448f1c 100644
--- a/test/jasmine/tests/gl2d_click_test.js
+++ b/test/jasmine/tests/gl2d_click_test.js
@@ -1,591 +1,612 @@
-var Plotly = require('@lib/index');
-var Lib = require('@src/lib');
+var Plotly = require("@lib/index");
+var Lib = require("@src/lib");
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var customMatchers = require('../assets/custom_matchers');
-var hasWebGLSupport = require('../assets/has_webgl_support');
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var customMatchers = require("../assets/custom_matchers");
+var hasWebGLSupport = require("../assets/has_webgl_support");
// cartesian click events events use the hover data
// from the mousemove events and then simulate
// a click event on mouseup
-var click = require('../assets/timed_click');
-var hover = require('../assets/hover');
+var click = require("../assets/timed_click");
+var hover = require("../assets/hover");
// contourgl is not part of the dist plotly.js bundle initially
-Plotly.register([
- require('@lib/contourgl')
-]);
-
-describe('Test hover and click interactions', function() {
-
- if(!hasWebGLSupport('gl2d_click_test')) return;
-
- var mock = require('@mocks/gl2d_14.json');
- var mock2 = require('@mocks/gl2d_pointcloud-basic.json');
- var mock3 = {
- 'data': [
- {
- 'type': 'contourgl',
- 'z': [
- [
- 10,
- 10.625,
- 12.5,
- 15.625,
- 20
- ],
- [
- 5.625,
- 6.25,
- 8.125,
- 11.25,
- 15.625
- ],
- [
- 2.5,
- 3.125,
- 5,
- 8.125,
- 12.5
- ],
- [
- 0.625,
- 1.25,
- 3.125,
- 6.25,
- 10.625
- ],
- [
- 0,
- 0.625,
- 2.5,
- 5.625,
- 10
- ]
- ],
- 'colorscale': 'Jet',
-/* 'contours': {
+Plotly.register([require("@lib/contourgl")]);
+
+describe("Test hover and click interactions", function() {
+ if (!hasWebGLSupport("gl2d_click_test")) return;
+
+ var mock = require("@mocks/gl2d_14.json");
+ var mock2 = require("@mocks/gl2d_pointcloud-basic.json");
+ var mock3 = {
+ data: [
+ {
+ type: "contourgl",
+ z: [
+ [10, 10.625, 12.5, 15.625, 20],
+ [5.625, 6.25, 8.125, 11.25, 15.625],
+ [2.5, 3.125, 5, 8.125, 12.5],
+ [0.625, 1.25, 3.125, 6.25, 10.625],
+ [0, 0.625, 2.5, 5.625, 10]
+ ],
+ colorscale: "Jet",
+ /* 'contours': {
'start': 2,
'end': 10,
'size': 1
- },*/
- 'uid': 'ad5624',
- 'zmin': 0,
- 'zmax': 20
- }
- ],
- 'layout': {
- 'xaxis': {
- 'range': [
- 0,
- 4
- ],
- 'autorange': true
- },
- 'yaxis': {
- 'range': [
- 0,
- 4
- ],
- 'autorange': true
- },
- 'height': 450,
- 'width': 1000,
- 'autosize': true
- }
- };
- var mock4 = {
- data: [
- {
- x: [1, 2, 3, 4],
- y: [12, 3, 14, 4],
- type: 'scattergl',
- mode: 'markers'
- },
- {
- x: [4, 5, 6, 7],
- y: [1, 31, 24, 14],
- type: 'scattergl',
- mode: 'markers'
- },
- {
- x: [8, 9, 10, 11],
- y: [18, 13, 10, 3],
- type: 'scattergl',
- mode: 'markers'
- }],
- layout: {}
- };
-
- var mockCopy, gd;
-
- function check(pt) {
- expect(Object.keys(pt)).toEqual([
- 'x', 'y', 'curveNumber', 'pointNumber', 'data', 'fullData', 'xaxis', 'yaxis'
- ]);
-
- expect(pt.x).toEqual(15.772);
- expect(pt.y).toEqual(0.387);
- expect(pt.curveNumber).toEqual(0);
- expect(pt.pointNumber).toEqual(33);
- expect(pt.fullData.length).toEqual(1);
- expect(typeof pt.data.uid).toEqual('string');
- expect(pt.xaxis.domain.length).toEqual(2);
- expect(pt.yaxis.domain.length).toEqual(2);
+ }, */
+ uid: "ad5624",
+ zmin: 0,
+ zmax: 20
+ }
+ ],
+ layout: {
+ xaxis: { range: [0, 4], autorange: true },
+ yaxis: { range: [0, 4], autorange: true },
+ height: 450,
+ width: 1000,
+ autosize: true
}
-
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
- });
-
- beforeEach(function() {
- gd = createGraphDiv();
- mockCopy = Lib.extendDeep({}, mock);
- });
-
- afterEach(destroyGraphDiv);
-
- describe('hover event is fired on hover', function() {
- var futureData;
-
- it('in general', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
- .then(new Promise(function() {
-
- gd.on('plotly_hover', function(data) {
- futureData = data;
- });
-
- hover(654.7712871743302, 316.97670766680994);
-
- window.setTimeout(function() {
-
- expect(futureData.points.length).toEqual(1);
-
- var pt = futureData.points[0];
-
- check(pt);
-
- done();
- }, 250);
- }));
-
-
+ };
+ var mock4 = {
+ data: [
+ {
+ x: [1, 2, 3, 4],
+ y: [12, 3, 14, 4],
+ type: "scattergl",
+ mode: "markers"
+ },
+ {
+ x: [4, 5, 6, 7],
+ y: [1, 31, 24, 14],
+ type: "scattergl",
+ mode: "markers"
+ },
+ {
+ x: [8, 9, 10, 11],
+ y: [18, 13, 10, 3],
+ type: "scattergl",
+ mode: "markers"
+ }
+ ],
+ layout: {}
+ };
+
+ var mockCopy, gd;
+
+ function check(pt) {
+ expect(Object.keys(pt)).toEqual([
+ "x",
+ "y",
+ "curveNumber",
+ "pointNumber",
+ "data",
+ "fullData",
+ "xaxis",
+ "yaxis"
+ ]);
+
+ expect(pt.x).toEqual(15.772);
+ expect(pt.y).toEqual(0.387);
+ expect(pt.curveNumber).toEqual(0);
+ expect(pt.pointNumber).toEqual(33);
+ expect(pt.fullData.length).toEqual(1);
+ expect(typeof pt.data.uid).toEqual("string");
+ expect(pt.xaxis.domain.length).toEqual(2);
+ expect(pt.yaxis.domain.length).toEqual(2);
+ }
+
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
+
+ beforeEach(function() {
+ gd = createGraphDiv();
+ mockCopy = Lib.extendDeep({}, mock);
+ });
+
+ afterEach(destroyGraphDiv);
+
+ describe("hover event is fired on hover", function() {
+ var futureData;
+
+ it("in general", function(done) {
+ var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
+
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ gd.on("plotly_hover", function(data) {
+ futureData = data;
});
- it('even when hoverinfo (== plotly tooltip) is set to none', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
- modifiedMockCopy.data[0].hoverinfo = 'none';
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
- .then(new Promise(function() {
-
- gd.on('plotly_hover', function(data) {
- futureData = data;
- });
+ hover(654.7712871743302, 316.97670766680994);
- hover(654.7712871743302, 316.97670766680994);
+ window.setTimeout(
+ function() {
+ expect(futureData.points.length).toEqual(1);
- window.setTimeout(function() {
+ var pt = futureData.points[0];
- expect(futureData.points.length).toEqual(1);
-
- var pt = futureData.points[0];
-
- check(pt);
-
- done();
- }, 250);
- }));
+ check(pt);
+ done();
+ },
+ 250
+ );
+ }));
+ });
+ it("even when hoverinfo (== plotly tooltip) is set to none", function(
+ done
+ ) {
+ var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
+ modifiedMockCopy.data[0].hoverinfo = "none";
+
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ gd.on("plotly_hover", function(data) {
+ futureData = data;
});
- it('event happens even on a click interaction', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
- modifiedMockCopy.data[0].hoverinfo = 'none';
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
- .then(new Promise(function() {
-
- gd.on('plotly_hover', function(data) {
- futureData = data;
- });
+ hover(654.7712871743302, 316.97670766680994);
- click(654.7712871743302, 316.97670766680994);
+ window.setTimeout(
+ function() {
+ expect(futureData.points.length).toEqual(1);
- window.setTimeout(function() {
+ var pt = futureData.points[0];
- expect(futureData.points.length).toEqual(1);
-
- var pt = futureData.points[0];
-
- check(pt);
-
- done();
- }, 250);
- }));
+ check(pt);
+ done();
+ },
+ 250
+ );
+ }));
+ });
+ it("event happens even on a click interaction", function(done) {
+ var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
+ modifiedMockCopy.data[0].hoverinfo = "none";
+
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ gd.on("plotly_hover", function(data) {
+ futureData = data;
});
- it('unhover happens', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
- modifiedMockCopy.data[0].hoverinfo = 'none';
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
- .then(new Promise(function() {
-
- futureData = undefined;
-
- gd.on('plotly_unhover', function() {
- futureData = 'emitted plotly_unhover';
- });
+ click(654.7712871743302, 316.97670766680994);
- hover(654.7712871743302, 316.97670766680994);
+ window.setTimeout(
+ function() {
+ expect(futureData.points.length).toEqual(1);
- // fairly realistic simulation of moving with the cursor
- window.setTimeout(function() {
+ var pt = futureData.points[0];
- var x = 654, y = 316; // we start here
- var canceler = window.setInterval(function() {
- hover(x--, y++); // move the cursor
- }, 10);
+ check(pt);
- window.setTimeout(function() {
- window.clearInterval(canceler); // stop the mouse at some point
- }, 250);
-
- window.setTimeout(function() {
-
- expect(futureData).toEqual('emitted plotly_unhover');
-
- done();
+ done();
+ },
+ 250
+ );
+ }));
+ });
- }, 250);
+ it("unhover happens", function(done) {
+ var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
+ modifiedMockCopy.data[0].hoverinfo = "none";
- }, 250);
- }));
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ futureData = undefined;
+ gd.on("plotly_unhover", function() {
+ futureData = "emitted plotly_unhover";
});
-
+ hover(654.7712871743302, 316.97670766680994);
+
+ // fairly realistic simulation of moving with the cursor
+ window.setTimeout(
+ function() {
+ var x = 654, y = 316;
+ // we start here
+ var canceler = window.setInterval(
+ function() {
+ hover((x--), (y++)); // move the cursor
+ },
+ 10
+ );
+
+ window.setTimeout(
+ function() {
+ window.clearInterval(canceler); // stop the mouse at some point
+ },
+ 250
+ );
+
+ window.setTimeout(
+ function() {
+ expect(futureData).toEqual("emitted plotly_unhover");
+
+ done();
+ },
+ 250
+ );
+ },
+ 250
+ );
+ }));
});
+ });
- describe('hover event is fired for other gl2d plot types', function() {
- var futureData;
-
- it('pointcloud', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mock2);
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
- .then(new Promise(function() {
-
- gd.on('plotly_hover', function(data) {
- futureData = data;
- });
-
- hover(540, 150);
-
- window.setTimeout(function() {
-
- expect(futureData.points.length).toEqual(1);
-
- var pt = futureData.points[0];
-
- expect(Object.keys(pt)).toEqual([
- 'x', 'y', 'curveNumber', 'pointNumber', 'data', 'fullData', 'xaxis', 'yaxis'
- ]);
-
- expect(pt.x).toEqual(4.5);
- expect(pt.y).toEqual(9);
- expect(pt.curveNumber).toEqual(2);
- expect(pt.pointNumber).toEqual(1);
- expect(pt.fullData.length).toEqual(3);
- expect(typeof pt.data.uid).toEqual('string');
- expect(pt.xaxis.domain.length).toEqual(2);
- expect(pt.yaxis.domain.length).toEqual(2);
-
- done();
- }, 350);
- }));
+ describe("hover event is fired for other gl2d plot types", function() {
+ var futureData;
+ it("pointcloud", function(done) {
+ var modifiedMockCopy = Lib.extendDeep({}, mock2);
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ gd.on("plotly_hover", function(data) {
+ futureData = data;
});
- it('heatmapgl', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mock3);
- modifiedMockCopy.data[0].type = 'heatmapgl';
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
- .then(new Promise(function() {
-
- gd.on('plotly_hover', function(data) {
- futureData = data;
- });
-
- hover(540, 150);
-
- window.setTimeout(function() {
-
- expect(futureData.points.length).toEqual(1);
-
- var pt = futureData.points[0];
-
- expect(Object.keys(pt)).toEqual([
- 'x', 'y', 'curveNumber', 'pointNumber', 'data', 'fullData', 'xaxis', 'yaxis'
- ]);
-
- expect(pt.x).toEqual(2);
- expect(pt.y).toEqual(3);
- expect(pt.curveNumber).toEqual(0);
- expect(pt.pointNumber).toEqual([2, 3]);
- expect(pt.fullData.length).toEqual(1);
- expect(typeof pt.data.uid).toEqual('string');
- expect(pt.xaxis.domain.length).toEqual(2);
- expect(pt.yaxis.domain.length).toEqual(2);
-
- done();
- }, 350);
- }));
-
+ hover(540, 150);
+
+ window.setTimeout(
+ function() {
+ expect(futureData.points.length).toEqual(1);
+
+ var pt = futureData.points[0];
+
+ expect(Object.keys(pt)).toEqual([
+ "x",
+ "y",
+ "curveNumber",
+ "pointNumber",
+ "data",
+ "fullData",
+ "xaxis",
+ "yaxis"
+ ]);
+
+ expect(pt.x).toEqual(4.5);
+ expect(pt.y).toEqual(9);
+ expect(pt.curveNumber).toEqual(2);
+ expect(pt.pointNumber).toEqual(1);
+ expect(pt.fullData.length).toEqual(3);
+ expect(typeof pt.data.uid).toEqual("string");
+ expect(pt.xaxis.domain.length).toEqual(2);
+ expect(pt.yaxis.domain.length).toEqual(2);
+
+ done();
+ },
+ 350
+ );
+ }));
+ });
+ it("heatmapgl", function(done) {
+ var modifiedMockCopy = Lib.extendDeep({}, mock3);
+ modifiedMockCopy.data[0].type = "heatmapgl";
+
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ gd.on("plotly_hover", function(data) {
+ futureData = data;
});
- it('scattergl', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mock4);
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
- .then(new Promise(function() {
-
- gd.on('plotly_hover', function(data) {
- futureData = data;
- });
-
- hover(435, 216);
-
- window.setTimeout(function() {
-
- expect(futureData.points.length).toEqual(1);
-
- var pt = futureData.points[0];
-
- expect(Object.keys(pt)).toEqual([
- 'x', 'y', 'curveNumber', 'pointNumber', 'data', 'fullData', 'xaxis', 'yaxis'
- ]);
+ hover(540, 150);
+
+ window.setTimeout(
+ function() {
+ expect(futureData.points.length).toEqual(1);
+
+ var pt = futureData.points[0];
+
+ expect(Object.keys(pt)).toEqual([
+ "x",
+ "y",
+ "curveNumber",
+ "pointNumber",
+ "data",
+ "fullData",
+ "xaxis",
+ "yaxis"
+ ]);
+
+ expect(pt.x).toEqual(2);
+ expect(pt.y).toEqual(3);
+ expect(pt.curveNumber).toEqual(0);
+ expect(pt.pointNumber).toEqual([2, 3]);
+ expect(pt.fullData.length).toEqual(1);
+ expect(typeof pt.data.uid).toEqual("string");
+ expect(pt.xaxis.domain.length).toEqual(2);
+ expect(pt.yaxis.domain.length).toEqual(2);
+
+ done();
+ },
+ 350
+ );
+ }));
+ });
- expect(pt.x).toEqual(8);
- expect(pt.y).toEqual(18);
- expect(pt.curveNumber).toEqual(2);
- expect(pt.pointNumber).toEqual(0);
- expect(pt.fullData.length).toEqual(3);
- expect(typeof pt.data.uid).toEqual('string');
- expect(pt.xaxis.domain.length).toEqual(2);
- expect(pt.yaxis.domain.length).toEqual(2);
+ it("scattergl", function(done) {
+ var modifiedMockCopy = Lib.extendDeep({}, mock4);
- done();
- }, 350);
- }));
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ gd.on("plotly_hover", function(data) {
+ futureData = data;
});
- it('scattergl-fancy', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mock4);
- modifiedMockCopy.data[0].mode = 'markers+lines';
- modifiedMockCopy.data[1].mode = 'markers+lines';
- modifiedMockCopy.data[2].mode = 'markers+lines';
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
- .then(new Promise(function() {
-
- gd.on('plotly_hover', function(data) {
- futureData = data;
- });
-
- hover(435, 216);
-
- window.setTimeout(function() {
-
- expect(futureData.points.length).toEqual(1);
-
- var pt = futureData.points[0];
-
- expect(Object.keys(pt)).toEqual([
- 'x', 'y', 'curveNumber', 'pointNumber', 'data', 'fullData', 'xaxis', 'yaxis'
- ]);
-
- expect(pt.x).toEqual(8);
- expect(pt.y).toEqual(18);
- expect(pt.curveNumber).toEqual(2);
- expect(pt.pointNumber).toEqual(0);
- expect(pt.fullData.length).toEqual(3);
- expect(typeof pt.data.uid).toEqual('string');
- expect(pt.xaxis.domain.length).toEqual(2);
- expect(pt.yaxis.domain.length).toEqual(2);
+ hover(435, 216);
+
+ window.setTimeout(
+ function() {
+ expect(futureData.points.length).toEqual(1);
+
+ var pt = futureData.points[0];
+
+ expect(Object.keys(pt)).toEqual([
+ "x",
+ "y",
+ "curveNumber",
+ "pointNumber",
+ "data",
+ "fullData",
+ "xaxis",
+ "yaxis"
+ ]);
+
+ expect(pt.x).toEqual(8);
+ expect(pt.y).toEqual(18);
+ expect(pt.curveNumber).toEqual(2);
+ expect(pt.pointNumber).toEqual(0);
+ expect(pt.fullData.length).toEqual(3);
+ expect(typeof pt.data.uid).toEqual("string");
+ expect(pt.xaxis.domain.length).toEqual(2);
+ expect(pt.yaxis.domain.length).toEqual(2);
+
+ done();
+ },
+ 350
+ );
+ }));
+ });
- done();
- }, 350);
- }));
+ it("scattergl-fancy", function(done) {
+ var modifiedMockCopy = Lib.extendDeep({}, mock4);
+ modifiedMockCopy.data[0].mode = "markers+lines";
+ modifiedMockCopy.data[1].mode = "markers+lines";
+ modifiedMockCopy.data[2].mode = "markers+lines";
+
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ gd.on("plotly_hover", function(data) {
+ futureData = data;
});
- it('contourgl', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mock3);
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
- .then(new Promise(function() {
-
- gd.on('plotly_hover', function(data) {
- futureData = data;
- });
-
- hover(540, 150);
-
- window.setTimeout(function() {
-
- expect(futureData.points.length).toEqual(1);
-
- var pt = futureData.points[0];
-
- expect(Object.keys(pt)).toEqual([
- 'x', 'y', 'curveNumber', 'pointNumber', 'data', 'fullData', 'xaxis', 'yaxis'
- ]);
-
- expect(pt.x).toEqual(2);
- expect(pt.y).toEqual(3);
- expect(pt.curveNumber).toEqual(0);
- expect(pt.pointNumber).toEqual([2, 3]);
- expect(pt.fullData.length).toEqual(1);
- expect(typeof pt.data.uid).toEqual('string');
- expect(pt.xaxis.domain.length).toEqual(2);
- expect(pt.yaxis.domain.length).toEqual(2);
-
- done();
- }, 350);
- }));
- });
+ hover(435, 216);
+
+ window.setTimeout(
+ function() {
+ expect(futureData.points.length).toEqual(1);
+
+ var pt = futureData.points[0];
+
+ expect(Object.keys(pt)).toEqual([
+ "x",
+ "y",
+ "curveNumber",
+ "pointNumber",
+ "data",
+ "fullData",
+ "xaxis",
+ "yaxis"
+ ]);
+
+ expect(pt.x).toEqual(8);
+ expect(pt.y).toEqual(18);
+ expect(pt.curveNumber).toEqual(2);
+ expect(pt.pointNumber).toEqual(0);
+ expect(pt.fullData.length).toEqual(3);
+ expect(typeof pt.data.uid).toEqual("string");
+ expect(pt.xaxis.domain.length).toEqual(2);
+ expect(pt.yaxis.domain.length).toEqual(2);
+
+ done();
+ },
+ 350
+ );
+ }));
});
- describe('click event is fired on click', function() {
- var futureData;
-
- it('in general', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
- .then(new Promise(function() {
-
- gd.on('plotly_click', function(data) {
- futureData = data;
- });
-
- click(654.7712871743302, 316.97670766680994);
-
- window.setTimeout(function() {
-
- var pt = futureData.points[0];
-
- check(pt);
-
- done();
-
- }, 350);
- }));
+ it("contourgl", function(done) {
+ var modifiedMockCopy = Lib.extendDeep({}, mock3);
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ gd.on("plotly_hover", function(data) {
+ futureData = data;
});
- it('even when hoverinfo (== plotly tooltip) is set to none', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
- modifiedMockCopy.data[0].hoverinfo = 'none';
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
-
- .then(new Promise(function() {
-
- gd.on('plotly_hover', function(data) {
- futureData = data;
- });
-
- hover(654.7712871743302, 316.97670766680994);
-
- window.setTimeout(function() {
-
- expect(futureData.points.length).toEqual(1);
-
- var pt = futureData.points[0];
-
- check(pt);
+ hover(540, 150);
+
+ window.setTimeout(
+ function() {
+ expect(futureData.points.length).toEqual(1);
+
+ var pt = futureData.points[0];
+
+ expect(Object.keys(pt)).toEqual([
+ "x",
+ "y",
+ "curveNumber",
+ "pointNumber",
+ "data",
+ "fullData",
+ "xaxis",
+ "yaxis"
+ ]);
+
+ expect(pt.x).toEqual(2);
+ expect(pt.y).toEqual(3);
+ expect(pt.curveNumber).toEqual(0);
+ expect(pt.pointNumber).toEqual([2, 3]);
+ expect(pt.fullData.length).toEqual(1);
+ expect(typeof pt.data.uid).toEqual("string");
+ expect(pt.xaxis.domain.length).toEqual(2);
+ expect(pt.yaxis.domain.length).toEqual(2);
+
+ done();
+ },
+ 350
+ );
+ }));
+ });
+ });
- done();
- }, 250);
- }));
+ describe("click event is fired on click", function() {
+ var futureData;
+ it("in general", function(done) {
+ var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ gd.on("plotly_click", function(data) {
+ futureData = data;
});
- it('unhover happens', function(done) {
-
- var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
- modifiedMockCopy.data[0].hoverinfo = 'none';
-
- Plotly.plot(gd, modifiedMockCopy.data, modifiedMockCopy.layout)
+ click(654.7712871743302, 316.97670766680994);
- .then(new Promise(function() {
+ window.setTimeout(
+ function() {
+ var pt = futureData.points[0];
- futureData = undefined;
+ check(pt);
- gd.on('plotly_unhover', function() {
- futureData = 'emitted plotly_unhover';
- });
-
- hover(654.7712871743302, 316.97670766680994);
+ done();
+ },
+ 350
+ );
+ }));
+ });
- // fairly realistic simulation of moving with the cursor
- window.setTimeout(function() {
+ it("even when hoverinfo (== plotly tooltip) is set to none", function(
+ done
+ ) {
+ var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
+ modifiedMockCopy.data[0].hoverinfo = "none";
+
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ gd.on("plotly_hover", function(data) {
+ futureData = data;
+ });
- var x = 654, y = 316; // we start here
- var canceler = window.setInterval(function() {
- hover(x--, y++); // move the cursor
- }, 10);
+ hover(654.7712871743302, 316.97670766680994);
- window.setTimeout(function() {
- window.clearInterval(canceler); // stop the mouse at some point
- }, 250);
+ window.setTimeout(
+ function() {
+ expect(futureData.points.length).toEqual(1);
- window.setTimeout(function() {
+ var pt = futureData.points[0];
- expect(futureData).toEqual('emitted plotly_unhover');
+ check(pt);
- done();
+ done();
+ },
+ 250
+ );
+ }));
+ });
- }, 250);
+ it("unhover happens", function(done) {
+ var modifiedMockCopy = Lib.extendDeep({}, mockCopy);
+ modifiedMockCopy.data[0].hoverinfo = "none";
- }, 250);
- }));
+ Plotly.plot(
+ gd,
+ modifiedMockCopy.data,
+ modifiedMockCopy.layout
+ ).then(new Promise(function() {
+ futureData = undefined;
+ gd.on("plotly_unhover", function() {
+ futureData = "emitted plotly_unhover";
});
+ hover(654.7712871743302, 316.97670766680994);
+
+ // fairly realistic simulation of moving with the cursor
+ window.setTimeout(
+ function() {
+ var x = 654, y = 316;
+ // we start here
+ var canceler = window.setInterval(
+ function() {
+ hover((x--), (y++)); // move the cursor
+ },
+ 10
+ );
+
+ window.setTimeout(
+ function() {
+ window.clearInterval(canceler); // stop the mouse at some point
+ },
+ 250
+ );
+
+ window.setTimeout(
+ function() {
+ expect(futureData).toEqual("emitted plotly_unhover");
+
+ done();
+ },
+ 250
+ );
+ },
+ 250
+ );
+ }));
});
+ });
});
diff --git a/test/jasmine/tests/gl2d_date_axis_render_test.js b/test/jasmine/tests/gl2d_date_axis_render_test.js
index 53392de3e76..4ce251c7c06 100644
--- a/test/jasmine/tests/gl2d_date_axis_render_test.js
+++ b/test/jasmine/tests/gl2d_date_axis_render_test.js
@@ -1,99 +1,113 @@
-var PlotlyInternal = require('@src/plotly');
-
-var hasWebGLSupport = require('../assets/has_webgl_support');
-
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-
-describe('date axis', function() {
-
- if(!hasWebGLSupport('axes_test date axis')) return;
-
- var gd;
-
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(destroyGraphDiv);
-
- it('should use the fancy gl-vis/gl-scatter2d', function() {
- PlotlyInternal.plot(gd, [{
- type: 'scattergl',
- 'marker': {
- 'color': 'rgb(31, 119, 180)',
- 'size': 18,
- 'symbol': [
- 'diamond',
- 'cross'
- ]
- },
- x: [new Date('2016-10-10'), new Date('2016-10-12')],
- y: [15, 16]
- }]);
-
- expect(gd._fullLayout.xaxis.type).toBe('date');
- expect(gd._fullLayout.yaxis.type).toBe('linear');
- expect(gd._fullData[0].type).toBe('scattergl');
- expect(gd._fullData[0]._module.basePlotModule.name).toBe('gl2d');
-
- // one way of check which renderer - fancy vs not - we're using
- expect(gd._fullLayout._plots.xy._scene2d.glplot.objects[3].pointCount).toBe(0);
- });
-
- it('should use the fancy gl-vis/gl-scatter2d once again', function() {
- PlotlyInternal.plot(gd, [{
- type: 'scattergl',
- 'marker': {
- 'color': 'rgb(31, 119, 180)',
- 'size': 36,
- 'symbol': [
- 'circle',
- 'cross'
- ]
- },
- x: [new Date('2016-10-10'), new Date('2016-10-11')],
- y: [15, 16]
- }]);
-
- expect(gd._fullLayout.xaxis.type).toBe('date');
- expect(gd._fullLayout.yaxis.type).toBe('linear');
- expect(gd._fullData[0].type).toBe('scattergl');
- expect(gd._fullData[0]._module.basePlotModule.name).toBe('gl2d');
-
- // one way of check which renderer - fancy vs not - we're using
- expect(gd._fullLayout._plots.xy._scene2d.glplot.objects[3].pointCount).toBe(0);
- });
-
- it('should now use the non-fancy gl-vis/gl-scatter2d', function() {
- PlotlyInternal.plot(gd, [{
- type: 'scattergl',
- mode: 'markers', // important, as otherwise lines are assumed (which needs fancy)
- x: [new Date('2016-10-10'), new Date('2016-10-11')],
- y: [15, 16]
- }]);
-
- expect(gd._fullLayout.xaxis.type).toBe('date');
- expect(gd._fullLayout.yaxis.type).toBe('linear');
- expect(gd._fullData[0].type).toBe('scattergl');
- expect(gd._fullData[0]._module.basePlotModule.name).toBe('gl2d');
-
- expect(gd._fullLayout._plots.xy._scene2d.glplot.objects[3].pointCount).toBe(2);
- });
-
- it('should use the non-fancy gl-vis/gl-scatter2d with string dates', function() {
- PlotlyInternal.plot(gd, [{
- type: 'scattergl',
- mode: 'markers', // important, as otherwise lines are assumed (which needs fancy)
- x: ['2016-10-10', '2016-10-11'],
- y: [15, 16]
- }]);
-
- expect(gd._fullLayout.xaxis.type).toBe('date');
- expect(gd._fullLayout.yaxis.type).toBe('linear');
- expect(gd._fullData[0].type).toBe('scattergl');
- expect(gd._fullData[0]._module.basePlotModule.name).toBe('gl2d');
-
- expect(gd._fullLayout._plots.xy._scene2d.glplot.objects[3].pointCount).toBe(2);
- });
+var PlotlyInternal = require("@src/plotly");
+
+var hasWebGLSupport = require("../assets/has_webgl_support");
+
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+
+describe("date axis", function() {
+ if (!hasWebGLSupport("axes_test date axis")) return;
+
+ var gd;
+
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
+
+ afterEach(destroyGraphDiv);
+
+ it("should use the fancy gl-vis/gl-scatter2d", function() {
+ PlotlyInternal.plot(gd, [
+ {
+ type: "scattergl",
+ marker: {
+ color: "rgb(31, 119, 180)",
+ size: 18,
+ symbol: ["diamond", "cross"]
+ },
+ x: [new Date("2016-10-10"), new Date("2016-10-12")],
+ y: [15, 16]
+ }
+ ]);
+
+ expect(gd._fullLayout.xaxis.type).toBe("date");
+ expect(gd._fullLayout.yaxis.type).toBe("linear");
+ expect(gd._fullData[0].type).toBe("scattergl");
+ expect(gd._fullData[0]._module.basePlotModule.name).toBe("gl2d");
+
+ // one way of check which renderer - fancy vs not - we're using
+ expect(gd._fullLayout._plots.xy._scene2d.glplot.objects[3].pointCount).toBe(
+ 0
+ );
+ });
+
+ it("should use the fancy gl-vis/gl-scatter2d once again", function() {
+ PlotlyInternal.plot(gd, [
+ {
+ type: "scattergl",
+ marker: {
+ color: "rgb(31, 119, 180)",
+ size: 36,
+ symbol: ["circle", "cross"]
+ },
+ x: [new Date("2016-10-10"), new Date("2016-10-11")],
+ y: [15, 16]
+ }
+ ]);
+
+ expect(gd._fullLayout.xaxis.type).toBe("date");
+ expect(gd._fullLayout.yaxis.type).toBe("linear");
+ expect(gd._fullData[0].type).toBe("scattergl");
+ expect(gd._fullData[0]._module.basePlotModule.name).toBe("gl2d");
+
+ // one way of check which renderer - fancy vs not - we're using
+ expect(gd._fullLayout._plots.xy._scene2d.glplot.objects[3].pointCount).toBe(
+ 0
+ );
+ });
+
+ it("should now use the non-fancy gl-vis/gl-scatter2d", function() {
+ PlotlyInternal.plot(gd, [
+ {
+ type: "scattergl",
+ mode: "markers",
+ // important, as otherwise lines are assumed (which needs fancy)
+ x: [new Date("2016-10-10"), new Date("2016-10-11")],
+ y: [15, 16]
+ }
+ ]);
+
+ expect(gd._fullLayout.xaxis.type).toBe("date");
+ expect(gd._fullLayout.yaxis.type).toBe("linear");
+ expect(gd._fullData[0].type).toBe("scattergl");
+ expect(gd._fullData[0]._module.basePlotModule.name).toBe("gl2d");
+
+ expect(gd._fullLayout._plots.xy._scene2d.glplot.objects[3].pointCount).toBe(
+ 2
+ );
+ });
+
+ it(
+ "should use the non-fancy gl-vis/gl-scatter2d with string dates",
+ function() {
+ PlotlyInternal.plot(gd, [
+ {
+ type: "scattergl",
+ mode: "markers",
+ // important, as otherwise lines are assumed (which needs fancy)
+ x: ["2016-10-10", "2016-10-11"],
+ y: [15, 16]
+ }
+ ]);
+
+ expect(gd._fullLayout.xaxis.type).toBe("date");
+ expect(gd._fullLayout.yaxis.type).toBe("linear");
+ expect(gd._fullData[0].type).toBe("scattergl");
+ expect(gd._fullData[0]._module.basePlotModule.name).toBe("gl2d");
+
+ expect(
+ gd._fullLayout._plots.xy._scene2d.glplot.objects[3].pointCount
+ ).toBe(2);
+ }
+ );
});
diff --git a/test/jasmine/tests/gl2d_pointcloud_test.js b/test/jasmine/tests/gl2d_pointcloud_test.js
index 6cc0017ad21..ba0546af37f 100644
--- a/test/jasmine/tests/gl2d_pointcloud_test.js
+++ b/test/jasmine/tests/gl2d_pointcloud_test.js
@@ -1,211 +1,230 @@
-'use strict';
-
-var Plotly = require('@lib/index');
+"use strict";
+var Plotly = require("@lib/index");
// Test utilities
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var failTest = require('../assets/fail_test');
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var failTest = require("../assets/fail_test");
var plotData = {
- 'data': [
- {
- 'type': 'pointcloud',
- 'mode': 'markers',
- 'marker': {
- 'sizemin': 0.5,
- 'sizemax': 100,
- 'arearatio': 0,
- 'color': 'rgba(255, 0, 0, 0.6)'
- },
- 'x': [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
- 'y': [9, 8, 7, 6, 5, 4, 3, 2, 1, 0]
- },
- {
- 'type': 'pointcloud',
- 'mode': 'markers',
- 'marker': {
- 'sizemin': 0.5,
- 'sizemax': 100,
- 'arearatio': 0,
- 'color': 'rgba(0, 0, 255, 0.9)',
- 'opacity': 0.8,
- 'blend': true
- },
- 'opacity': 0.7,
- 'x': [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
- 'y': [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
- },
- {
- 'type': 'pointcloud',
- 'mode': 'markers',
- 'marker': {
- 'sizemin': 0.5,
- 'sizemax': 100,
- 'border': {
- 'color': 'rgb(0, 0, 0)',
- 'arearatio': 0.7071
- },
- 'color': 'green',
- 'opacity': 0.8,
- 'blend': true
- },
- 'opacity': 0.7,
- 'x': [3, 4.5, 6],
- 'y': [9, 9, 9]
- },
- {
- 'type': 'pointcloud',
- 'mode': 'markers',
- 'marker': {
- 'sizemin': 0.5,
- 'sizemax': 100,
- 'color': 'yellow',
- 'opacity': 0.8,
- 'blend': true
- },
- 'opacity': 0.7,
- 'xy': new Float32Array([1, 3, 9, 3]),
- 'indices': new Int32Array([0, 1]),
- 'xbounds': [1, 9],
- 'ybounds': [3, 3]
- },
- {
- 'type': 'pointcloud',
- 'mode': 'markers',
- 'marker': {
- 'sizemin': 0.5,
- 'sizemax': 100,
- 'color': 'orange',
- 'opacity': 0.8,
- 'blend': true
- },
- 'opacity': 0.7,
- 'xy': new Float32Array([1, 4, 9, 4]),
- 'indices': new Int32Array([0, 1])
- },
- {
- 'type': 'pointcloud',
- 'mode': 'markers',
- 'marker': {
- 'sizemin': 0.5,
- 'sizemax': 100,
- 'color': 'darkorange',
- 'opacity': 0.8,
- 'blend': true
- },
- 'opacity': 0.7,
- 'xy': new Float32Array([1, 5, 9, 5]),
- 'xbounds': [1, 9],
- 'ybounds': [5, 5]
- },
- {
- 'type': 'pointcloud',
- 'mode': 'markers',
- 'marker': {
- 'sizemin': 0.5,
- 'sizemax': 100,
- 'color': 'red',
- 'opacity': 0.8,
- 'blend': true
- },
- 'opacity': 0.7,
- 'xy': new Float32Array([1, 6, 9, 6])
- }
- ],
- 'layout': {
- 'title': 'Point Cloud - basic',
- 'xaxis': {
- 'type': 'linear',
- 'range': [
- -2.501411175139456,
- 43.340777299865266
- ],
- 'autorange': true
- },
- 'yaxis': {
- 'type': 'linear',
- 'range': [
- 4,
- 6
- ],
- 'autorange': true
- },
- 'height': 598,
- 'width': 1080,
- 'autosize': true,
- 'showlegend': false
+ data: [
+ {
+ type: "pointcloud",
+ mode: "markers",
+ marker: {
+ sizemin: 0.5,
+ sizemax: 100,
+ arearatio: 0,
+ color: "rgba(255, 0, 0, 0.6)"
+ },
+ x: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
+ y: [9, 8, 7, 6, 5, 4, 3, 2, 1, 0]
+ },
+ {
+ type: "pointcloud",
+ mode: "markers",
+ marker: {
+ sizemin: 0.5,
+ sizemax: 100,
+ arearatio: 0,
+ color: "rgba(0, 0, 255, 0.9)",
+ opacity: 0.8,
+ blend: true
+ },
+ opacity: 0.7,
+ x: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
+ y: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
+ },
+ {
+ type: "pointcloud",
+ mode: "markers",
+ marker: {
+ sizemin: 0.5,
+ sizemax: 100,
+ border: { color: "rgb(0, 0, 0)", arearatio: 0.7071 },
+ color: "green",
+ opacity: 0.8,
+ blend: true
+ },
+ opacity: 0.7,
+ x: [3, 4.5, 6],
+ y: [9, 9, 9]
+ },
+ {
+ type: "pointcloud",
+ mode: "markers",
+ marker: {
+ sizemin: 0.5,
+ sizemax: 100,
+ color: "yellow",
+ opacity: 0.8,
+ blend: true
+ },
+ opacity: 0.7,
+ xy: new Float32Array([1, 3, 9, 3]),
+ indices: new Int32Array([0, 1]),
+ xbounds: [1, 9],
+ ybounds: [3, 3]
+ },
+ {
+ type: "pointcloud",
+ mode: "markers",
+ marker: {
+ sizemin: 0.5,
+ sizemax: 100,
+ color: "orange",
+ opacity: 0.8,
+ blend: true
+ },
+ opacity: 0.7,
+ xy: new Float32Array([1, 4, 9, 4]),
+ indices: new Int32Array([0, 1])
+ },
+ {
+ type: "pointcloud",
+ mode: "markers",
+ marker: {
+ sizemin: 0.5,
+ sizemax: 100,
+ color: "darkorange",
+ opacity: 0.8,
+ blend: true
+ },
+ opacity: 0.7,
+ xy: new Float32Array([1, 5, 9, 5]),
+ xbounds: [1, 9],
+ ybounds: [5, 5]
+ },
+ {
+ type: "pointcloud",
+ mode: "markers",
+ marker: {
+ sizemin: 0.5,
+ sizemax: 100,
+ color: "red",
+ opacity: 0.8,
+ blend: true
+ },
+ opacity: 0.7,
+ xy: new Float32Array([1, 6, 9, 6])
}
+ ],
+ layout: {
+ title: "Point Cloud - basic",
+ xaxis: {
+ type: "linear",
+ range: [-2.501411175139456, 43.340777299865266],
+ autorange: true
+ },
+ yaxis: { type: "linear", range: [4, 6], autorange: true },
+ height: 598,
+ width: 1080,
+ autosize: true,
+ showlegend: false
+ }
};
function makePlot(gd, mock, done) {
- return Plotly.plot(gd, mock.data, mock.layout)
- .then(null, failTest)
- .then(done);
+ return Plotly.plot(gd, mock.data, mock.layout)
+ .then(null, failTest)
+ .then(done);
}
-describe('contourgl plots', function() {
-
- var gd;
-
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
-
- it('render without raising an error', function(done) {
- makePlot(gd, plotData, done);
- });
-
- it('should update properly', function(done) {
- var mock = plotData;
- var scene2d;
-
- var xBaselineMins = [{'val': 0, 'pad': 50}, {'val': 0, 'pad': 50}, {'val': 3, 'pad': 50}, {'val': 1, 'pad': 50}, {'val': 1, 'pad': 50}, {'val': 1, 'pad': 50}, {'val': 1, 'pad': 50}];
- var xBaselineMaxes = [{'val': 9, 'pad': 50}, {'val': 9, 'pad': 50}, {'val': 6, 'pad': 50}, {'val': 9, 'pad': 50}, {'val': 9, 'pad': 50}, {'val': 9, 'pad': 50}, {'val': 9, 'pad': 50}];
-
- var yBaselineMins = [{'val': 0, 'pad': 50}, {'val': 0, 'pad': 50}, {'val': 9, 'pad': 50}, {'val': 3, 'pad': 50}, {'val': 4, 'pad': 50}, {'val': 5, 'pad': 50}, {'val': 6, 'pad': 50}];
- var yBaselineMaxes = [{'val': 9, 'pad': 50}, {'val': 9, 'pad': 50}, {'val': 9, 'pad': 50}, {'val': 3, 'pad': 50}, {'val': 4, 'pad': 50}, {'val': 5, 'pad': 50}, {'val': 6, 'pad': 50}];
-
- Plotly.plot(gd, mock.data, mock.layout).then(function() {
- scene2d = gd._fullLayout._plots.xy._scene2d;
-
- expect(scene2d.traces[mock.data[0].uid].type).toEqual('pointcloud');
-
- expect(scene2d.xaxis._min).toEqual(xBaselineMins);
- expect(scene2d.xaxis._max).toEqual(xBaselineMaxes);
-
- expect(scene2d.yaxis._min).toEqual(yBaselineMins);
- expect(scene2d.yaxis._max).toEqual(yBaselineMaxes);
-
- return Plotly.relayout(gd, 'xaxis.range', [3, 6]);
- }).then(function() {
-
- expect(scene2d.xaxis._min).toEqual(xBaselineMins);
- expect(scene2d.xaxis._max).toEqual(xBaselineMaxes);
-
- return Plotly.relayout(gd, 'xaxis.autorange', true);
- }).then(function() {
-
- expect(scene2d.xaxis._min).toEqual(xBaselineMins);
- expect(scene2d.xaxis._max).toEqual(xBaselineMaxes);
-
- return Plotly.relayout(gd, 'yaxis.range', [8, 20]);
- }).then(function() {
-
- expect(scene2d.yaxis._min).toEqual(yBaselineMins);
- expect(scene2d.yaxis._max).toEqual(yBaselineMaxes);
-
- return Plotly.relayout(gd, 'yaxis.autorange', true);
- }).then(function() {
- expect(scene2d.yaxis._min).toEqual(yBaselineMins);
- expect(scene2d.yaxis._max).toEqual(yBaselineMaxes);
-
- done();
- });
- });
+describe("contourgl plots", function() {
+ var gd;
+
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
+
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
+
+ it("render without raising an error", function(done) {
+ makePlot(gd, plotData, done);
+ });
+
+ it("should update properly", function(done) {
+ var mock = plotData;
+ var scene2d;
+
+ var xBaselineMins = [
+ { val: 0, pad: 50 },
+ { val: 0, pad: 50 },
+ { val: 3, pad: 50 },
+ { val: 1, pad: 50 },
+ { val: 1, pad: 50 },
+ { val: 1, pad: 50 },
+ { val: 1, pad: 50 }
+ ];
+ var xBaselineMaxes = [
+ { val: 9, pad: 50 },
+ { val: 9, pad: 50 },
+ { val: 6, pad: 50 },
+ { val: 9, pad: 50 },
+ { val: 9, pad: 50 },
+ { val: 9, pad: 50 },
+ { val: 9, pad: 50 }
+ ];
+
+ var yBaselineMins = [
+ { val: 0, pad: 50 },
+ { val: 0, pad: 50 },
+ { val: 9, pad: 50 },
+ { val: 3, pad: 50 },
+ { val: 4, pad: 50 },
+ { val: 5, pad: 50 },
+ { val: 6, pad: 50 }
+ ];
+ var yBaselineMaxes = [
+ { val: 9, pad: 50 },
+ { val: 9, pad: 50 },
+ { val: 9, pad: 50 },
+ { val: 3, pad: 50 },
+ { val: 4, pad: 50 },
+ { val: 5, pad: 50 },
+ { val: 6, pad: 50 }
+ ];
+
+ Plotly.plot(gd, mock.data, mock.layout)
+ .then(function() {
+ scene2d = gd._fullLayout._plots.xy._scene2d;
+
+ expect(scene2d.traces[mock.data[0].uid].type).toEqual("pointcloud");
+
+ expect(scene2d.xaxis._min).toEqual(xBaselineMins);
+ expect(scene2d.xaxis._max).toEqual(xBaselineMaxes);
+
+ expect(scene2d.yaxis._min).toEqual(yBaselineMins);
+ expect(scene2d.yaxis._max).toEqual(yBaselineMaxes);
+
+ return Plotly.relayout(gd, "xaxis.range", [3, 6]);
+ })
+ .then(function() {
+ expect(scene2d.xaxis._min).toEqual(xBaselineMins);
+ expect(scene2d.xaxis._max).toEqual(xBaselineMaxes);
+
+ return Plotly.relayout(gd, "xaxis.autorange", true);
+ })
+ .then(function() {
+ expect(scene2d.xaxis._min).toEqual(xBaselineMins);
+ expect(scene2d.xaxis._max).toEqual(xBaselineMaxes);
+
+ return Plotly.relayout(gd, "yaxis.range", [8, 20]);
+ })
+ .then(function() {
+ expect(scene2d.yaxis._min).toEqual(yBaselineMins);
+ expect(scene2d.yaxis._max).toEqual(yBaselineMaxes);
+
+ return Plotly.relayout(gd, "yaxis.autorange", true);
+ })
+ .then(function() {
+ expect(scene2d.yaxis._min).toEqual(yBaselineMins);
+ expect(scene2d.yaxis._max).toEqual(yBaselineMaxes);
+
+ done();
+ });
+ });
});
diff --git a/test/jasmine/tests/gl2d_scatterplot_contour_test.js b/test/jasmine/tests/gl2d_scatterplot_contour_test.js
index b0c65b9fda2..dcc3912b739 100644
--- a/test/jasmine/tests/gl2d_scatterplot_contour_test.js
+++ b/test/jasmine/tests/gl2d_scatterplot_contour_test.js
@@ -1,257 +1,210 @@
-'use strict';
-
-var Plotly = require('@lib/index');
-var Lib = require('@src/lib');
-var d3 = require('d3');
+"use strict";
+var Plotly = require("@lib/index");
+var Lib = require("@src/lib");
+var d3 = require("d3");
// contourgl is not part of the dist plotly.js bundle initially
-Plotly.register([
- require('@lib/contourgl')
-]);
+Plotly.register([require("@lib/contourgl")]);
// Test utilities
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var failTest = require('../assets/fail_test');
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var failTest = require("../assets/fail_test");
var plotData = {
- 'data': [
- {
- 'type': 'contourgl',
- 'z': [
- [
- 10,
- 10.625,
- 12.5,
- 15.625,
- 20
- ],
- [
- 5.625,
- 6.25,
- 8.125,
- 11.25,
- 15.625
- ],
- [
- 2.5,
- 3.125,
- 5,
- 8.125,
- 12.5
- ],
- [
- 0.625,
- 1.25,
- 3.125,
- 6.25,
- 10.625
- ],
- [
- 0,
- 0.625,
- 2.5,
- 5.625,
- 10
- ]
- ],
- 'colorscale': 'Jet',
- 'contours': {
- 'start': 2,
- 'end': 10,
- 'size': 1
- },
- 'uid': 'ad5624',
- 'zmin': 0,
- 'zmax': 20
- }
- ],
- 'layout': {
- 'xaxis': {
- 'range': [
- 0,
- 4
- ],
- 'autorange': true
- },
- 'yaxis': {
- 'range': [
- 0,
- 4
- ],
- 'autorange': true
- },
- 'height': 450,
- 'width': 1000,
- 'autosize': true
+ data: [
+ {
+ type: "contourgl",
+ z: [
+ [10, 10.625, 12.5, 15.625, 20],
+ [5.625, 6.25, 8.125, 11.25, 15.625],
+ [2.5, 3.125, 5, 8.125, 12.5],
+ [0.625, 1.25, 3.125, 6.25, 10.625],
+ [0, 0.625, 2.5, 5.625, 10]
+ ],
+ colorscale: "Jet",
+ contours: { start: 2, end: 10, size: 1 },
+ uid: "ad5624",
+ zmin: 0,
+ zmax: 20
}
+ ],
+ layout: {
+ xaxis: { range: [0, 4], autorange: true },
+ yaxis: { range: [0, 4], autorange: true },
+ height: 450,
+ width: 1000,
+ autosize: true
+ }
};
function transpose(a) {
- return a[0].map(function(ignore, columnIndex) {return a.map(function(row) {return row[columnIndex];});});
+ return a[0].map(function(ignore, columnIndex) {
+ return a.map(function(row) {
+ return row[columnIndex];
+ });
+ });
}
function jitter(maxJitterRatio, n) {
- return n * (1 + maxJitterRatio * (2 * Math.random() - 1));
+ return n * (1 + maxJitterRatio * (2 * Math.random() - 1));
}
function rotate(rad, point) {
- return {
- x: point.x * Math.cos(rad) - point.y * Math.sin(rad),
- y: point.x * Math.sin(rad) + point.y * Math.cos(rad)
- };
+ return {
+ x: point.x * Math.cos(rad) - point.y * Math.sin(rad),
+ y: point.x * Math.sin(rad) + point.y * Math.cos(rad)
+ };
}
function generate(maxJitter) {
- var x = d3.range(-1, 1.5, 0.5); // left closed, right open interval
- var y = d3.range(-1, 1.5, 0.5); // left closed, right open interval
- var i, j, p, z = new Array(x.length);
- for(i = 0; i < x.length; i++) {
- z[i] = new Array(y.length);
- for(j = 0; j < y.length; j++) {
- p = rotate(Math.PI / 4, {x: x[i], y: -y[j]});
- z[i][j] = jitter(maxJitter, Math.pow(p.x, 2) + Math.pow(p.y, 2));
- }
+ var x = d3.range(-1, 1.5, 0.5);
+ // left closed, right open interval
+ var y = d3.range(-1, 1.5, 0.5);
+ // left closed, right open interval
+ var i, j, p, z = new Array(x.length);
+ for (i = 0; i < x.length; i++) {
+ z[i] = new Array(y.length);
+ for (j = 0; j < y.length; j++) {
+ p = rotate(Math.PI / 4, { x: x[i], y: -y[j] });
+ z[i][j] = jitter(maxJitter, Math.pow(p.x, 2) + Math.pow(p.y, 2));
}
- return {x: x, y: y, z: z}; // looking forward to the ES2015 return {x, y, z}
+ }
+ return { x: x, y: y, z: z }; // looking forward to the ES2015 return {x, y, z}
}
// equivalent to the new example case in gl-contour2d
var plotDataElliptical = function(maxJitter) {
- var model = generate(maxJitter);
- return {
- 'data': [
- {
- 'type': 'contourgl',
- 'x': model.x,
- 'y': model.y,
- 'z': transpose(model.z), // gl-vis is column-major order while ploly is row-major order
- 'colorscale': 'Jet',
- 'contours': {
- 'start': 0,
- 'end': 2,
- 'size': 0.1,
- 'coloring': 'fill'
- },
- 'uid': 'ad5624',
- 'zmin': 0,
- 'zmax': 2
- }
- ],
- 'layout': {
- 'xaxis': {
- 'range': [
- -10,
- 10
- ],
- 'autorange': true
- },
- 'yaxis': {
- 'range': [
- -10,
- 10
- ],
- 'autorange': true
- },
- 'height': 600,
- 'width': 600,
- 'autosize': true
- }
- };
+ var model = generate(maxJitter);
+ return {
+ data: [
+ {
+ type: "contourgl",
+ x: model.x,
+ y: model.y,
+ z: transpose(model.z),
+ // gl-vis is column-major order while ploly is row-major order
+ colorscale: "Jet",
+ contours: { start: 0, end: 2, size: 0.1, coloring: "fill" },
+ uid: "ad5624",
+ zmin: 0,
+ zmax: 2
+ }
+ ],
+ layout: {
+ xaxis: { range: [-10, 10], autorange: true },
+ yaxis: { range: [-10, 10], autorange: true },
+ height: 600,
+ width: 600,
+ autosize: true
+ }
+ };
};
-
function makePlot(gd, mock, done) {
- return Plotly.plot(gd, mock.data, mock.layout)
- .then(null, failTest)
- .then(done);
+ return Plotly.plot(gd, mock.data, mock.layout)
+ .then(null, failTest)
+ .then(done);
}
-describe('contourgl plots', function() {
-
- var gd;
-
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
-
- // this first dataset is a special case, very forgiving to the contour renderer, as it's convex,
- // contains no inflexion points etc.
- it('render without raising an error', function(done) {
- makePlot(gd, plotData, done);
- });
-
- it('render without raising an error', function(done) {
- var mock = require('@mocks/simple_contour.json'),
- mockCopy = Lib.extendDeep({}, mock);
-
- mockCopy.data[0].type = 'contourgl';
- mockCopy.data[0].contours = { coloring: 'fill' };
-
- makePlot(gd, mockCopy, done);
- });
-
- it('render without raising an error (coloring: "lines")', function(done) {
- var mock = Lib.extendDeep({}, plotDataElliptical(0));
- mock.data[0].contours.coloring = 'lines'; // 'fill' is the default
- makePlot(gd, mock, done);
- });
-
- it('render smooth, regular ellipses without raising an error (coloring: "fill")', function(done) {
- var mock = plotDataElliptical(0);
- makePlot(gd, mock, done);
- });
-
- it('render ellipses with added noise without raising an error (coloring: "fill")', function(done) {
- var mock = plotDataElliptical(0.5);
- mock.data[0].contours.coloring = 'fill'; // 'fill' is the default
- mock.data[0].line = {smoothing: 0};
- makePlot(gd, mock, done);
- });
-
- it('should update properly', function(done) {
- var mock = plotDataElliptical(0);
- var scene2d;
-
- Plotly.plot(gd, mock.data, mock.layout).then(function() {
- scene2d = gd._fullLayout._plots.xy._scene2d;
-
- expect(scene2d.traces[mock.data[0].uid].type).toEqual('contourgl');
- expect(scene2d.xaxis._min).toEqual([{ val: -1, pad: 0}]);
- expect(scene2d.xaxis._max).toEqual([{ val: 1, pad: 0}]);
-
- return Plotly.relayout(gd, 'xaxis.range', [0, -10]);
- }).then(function() {
- expect(scene2d.xaxis._min).toEqual([]);
- expect(scene2d.xaxis._max).toEqual([]);
-
- return Plotly.relayout(gd, 'xaxis.autorange', true);
- }).then(function() {
- expect(scene2d.xaxis._min).toEqual([{ val: -1, pad: 0}]);
- expect(scene2d.xaxis._max).toEqual([{ val: 1, pad: 0}]);
-
- return Plotly.restyle(gd, 'type', 'heatmapgl');
- }).then(function() {
- expect(scene2d.traces[mock.data[0].uid].type).toEqual('heatmapgl');
- expect(scene2d.xaxis._min).toEqual([{ val: -1, pad: 0}]);
- expect(scene2d.xaxis._max).toEqual([{ val: 1, pad: 0}]);
-
- return Plotly.relayout(gd, 'xaxis.range', [0, -10]);
- }).then(function() {
- expect(scene2d.xaxis._min).toEqual([]);
- expect(scene2d.xaxis._max).toEqual([]);
-
- return Plotly.relayout(gd, 'xaxis.autorange', true);
- }).then(function() {
- expect(scene2d.xaxis._min).toEqual([{ val: -1, pad: 0}]);
- expect(scene2d.xaxis._max).toEqual([{ val: 1, pad: 0}]);
-
- done();
- });
- });
+describe("contourgl plots", function() {
+ var gd;
+
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
+
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
+
+ // this first dataset is a special case, very forgiving to the contour renderer, as it's convex,
+ // contains no inflexion points etc.
+ it("render without raising an error", function(done) {
+ makePlot(gd, plotData, done);
+ });
+
+ it("render without raising an error", function(done) {
+ var mock = require("@mocks/simple_contour.json"),
+ mockCopy = Lib.extendDeep({}, mock);
+
+ mockCopy.data[0].type = "contourgl";
+ mockCopy.data[0].contours = { coloring: "fill" };
+
+ makePlot(gd, mockCopy, done);
+ });
+
+ it('render without raising an error (coloring: "lines")', function(done) {
+ var mock = Lib.extendDeep({}, plotDataElliptical(0));
+ mock.data[0].contours.coloring = "lines";
+ // 'fill' is the default
+ makePlot(gd, mock, done);
+ });
+
+ it(
+ 'render smooth, regular ellipses without raising an error (coloring: "fill")',
+ function(done) {
+ var mock = plotDataElliptical(0);
+ makePlot(gd, mock, done);
+ }
+ );
+
+ it(
+ 'render ellipses with added noise without raising an error (coloring: "fill")',
+ function(done) {
+ var mock = plotDataElliptical(0.5);
+ mock.data[0].contours.coloring = "fill";
+ // 'fill' is the default
+ mock.data[0].line = { smoothing: 0 };
+ makePlot(gd, mock, done);
+ }
+ );
+
+ it("should update properly", function(done) {
+ var mock = plotDataElliptical(0);
+ var scene2d;
+
+ Plotly.plot(gd, mock.data, mock.layout)
+ .then(function() {
+ scene2d = gd._fullLayout._plots.xy._scene2d;
+
+ expect(scene2d.traces[mock.data[0].uid].type).toEqual("contourgl");
+ expect(scene2d.xaxis._min).toEqual([{ val: -1, pad: 0 }]);
+ expect(scene2d.xaxis._max).toEqual([{ val: 1, pad: 0 }]);
+
+ return Plotly.relayout(gd, "xaxis.range", [0, -10]);
+ })
+ .then(function() {
+ expect(scene2d.xaxis._min).toEqual([]);
+ expect(scene2d.xaxis._max).toEqual([]);
+
+ return Plotly.relayout(gd, "xaxis.autorange", true);
+ })
+ .then(function() {
+ expect(scene2d.xaxis._min).toEqual([{ val: -1, pad: 0 }]);
+ expect(scene2d.xaxis._max).toEqual([{ val: 1, pad: 0 }]);
+
+ return Plotly.restyle(gd, "type", "heatmapgl");
+ })
+ .then(function() {
+ expect(scene2d.traces[mock.data[0].uid].type).toEqual("heatmapgl");
+ expect(scene2d.xaxis._min).toEqual([{ val: -1, pad: 0 }]);
+ expect(scene2d.xaxis._max).toEqual([{ val: 1, pad: 0 }]);
+
+ return Plotly.relayout(gd, "xaxis.range", [0, -10]);
+ })
+ .then(function() {
+ expect(scene2d.xaxis._min).toEqual([]);
+ expect(scene2d.xaxis._max).toEqual([]);
+
+ return Plotly.relayout(gd, "xaxis.autorange", true);
+ })
+ .then(function() {
+ expect(scene2d.xaxis._min).toEqual([{ val: -1, pad: 0 }]);
+ expect(scene2d.xaxis._max).toEqual([{ val: 1, pad: 0 }]);
+
+ done();
+ });
+ });
});
diff --git a/test/jasmine/tests/gl3daxes_test.js b/test/jasmine/tests/gl3daxes_test.js
index fad1f8c222b..de9602ceb6c 100644
--- a/test/jasmine/tests/gl3daxes_test.js
+++ b/test/jasmine/tests/gl3daxes_test.js
@@ -1,109 +1,109 @@
-var supplyLayoutDefaults = require('@src/plots/gl3d/layout/axis_defaults');
+var supplyLayoutDefaults = require("@src/plots/gl3d/layout/axis_defaults");
+describe("Test Gl3dAxes", function() {
+ "use strict";
+ describe("supplyLayoutDefaults supplies defaults", function() {
+ var layoutIn, layoutOut;
-describe('Test Gl3dAxes', function() {
- 'use strict';
+ var options = {
+ font: "Open Sans",
+ scene: { id: "scene" },
+ data: [{ x: [], y: [] }],
+ bgColor: "#fff"
+ };
- describe('supplyLayoutDefaults supplies defaults', function() {
- var layoutIn,
- layoutOut;
-
- var options = {
- font: 'Open Sans',
- scene: {id: 'scene'},
- data: [{x: [], y: []}],
- bgColor: '#fff'
- };
-
- beforeEach(function() {
- layoutOut = {};
- });
+ beforeEach(function() {
+ layoutOut = {};
+ });
- it('should define specific default set with empty initial layout', function() {
- layoutIn = {};
+ it(
+ "should define specific default set with empty initial layout",
+ function() {
+ layoutIn = {};
- var expected = {
- 'xaxis': {
- 'showline': false,
- 'showgrid': true,
- 'gridcolor': 'rgb(204, 204, 204)',
- 'gridwidth': 1,
- 'showspikes': true,
- 'spikesides': true,
- 'spikethickness': 2,
- 'spikecolor': '#444',
- 'showbackground': false,
- 'showaxeslabels': true
- },
- 'yaxis': {
- 'showline': false,
- 'showgrid': true,
- 'gridcolor': 'rgb(204, 204, 204)',
- 'gridwidth': 1,
- 'showspikes': true,
- 'spikesides': true,
- 'spikethickness': 2,
- 'spikecolor': '#444',
- 'showbackground': false,
- 'showaxeslabels': true
- },
- 'zaxis': {
- 'showline': false,
- 'showgrid': true,
- 'gridcolor': 'rgb(204, 204, 204)',
- 'gridwidth': 1,
- 'showspikes': true,
- 'spikesides': true,
- 'spikethickness': 2,
- 'spikecolor': '#444',
- 'showbackground': false,
- 'showaxeslabels': true
- }
- };
+ var expected = {
+ xaxis: {
+ showline: false,
+ showgrid: true,
+ gridcolor: "rgb(204, 204, 204)",
+ gridwidth: 1,
+ showspikes: true,
+ spikesides: true,
+ spikethickness: 2,
+ spikecolor: "#444",
+ showbackground: false,
+ showaxeslabels: true
+ },
+ yaxis: {
+ showline: false,
+ showgrid: true,
+ gridcolor: "rgb(204, 204, 204)",
+ gridwidth: 1,
+ showspikes: true,
+ spikesides: true,
+ spikethickness: 2,
+ spikecolor: "#444",
+ showbackground: false,
+ showaxeslabels: true
+ },
+ zaxis: {
+ showline: false,
+ showgrid: true,
+ gridcolor: "rgb(204, 204, 204)",
+ gridwidth: 1,
+ showspikes: true,
+ spikesides: true,
+ spikethickness: 2,
+ spikecolor: "#444",
+ showbackground: false,
+ showaxeslabels: true
+ }
+ };
- function checkKeys(validObject, testObject) {
- var keys = Object.keys(validObject);
- for(var i = 0; i < keys.length; i++) {
- var k = keys[i];
- expect(validObject[k]).toBe(testObject[k]);
- }
- return true;
- }
+ function checkKeys(validObject, testObject) {
+ var keys = Object.keys(validObject);
+ for (var i = 0; i < keys.length; i++) {
+ var k = keys[i];
+ expect(validObject[k]).toBe(testObject[k]);
+ }
+ return true;
+ }
- supplyLayoutDefaults(layoutIn, layoutOut, options);
- ['xaxis', 'yaxis', 'zaxis'].forEach(function(axis) {
- checkKeys(expected[axis], layoutOut[axis]);
- });
+ supplyLayoutDefaults(layoutIn, layoutOut, options);
+ ["xaxis", "yaxis", "zaxis"].forEach(function(axis) {
+ checkKeys(expected[axis], layoutOut[axis]);
});
+ }
+ );
- it('should inherit layout.calendar', function() {
- layoutIn = {
- xaxis: {type: 'date'},
- yaxis: {type: 'date'},
- zaxis: {type: 'date'}
- };
- options.calendar = 'taiwan';
+ it("should inherit layout.calendar", function() {
+ layoutIn = {
+ xaxis: { type: "date" },
+ yaxis: { type: "date" },
+ zaxis: { type: "date" }
+ };
+ options.calendar = "taiwan";
- supplyLayoutDefaults(layoutIn, layoutOut, options);
+ supplyLayoutDefaults(layoutIn, layoutOut, options);
- expect(layoutOut.xaxis.calendar).toBe('taiwan');
- expect(layoutOut.yaxis.calendar).toBe('taiwan');
- expect(layoutOut.zaxis.calendar).toBe('taiwan');
- });
+ expect(layoutOut.xaxis.calendar).toBe("taiwan");
+ expect(layoutOut.yaxis.calendar).toBe("taiwan");
+ expect(layoutOut.zaxis.calendar).toBe("taiwan");
+ });
- it('should accept its own calendar', function() {
- layoutIn = {
- xaxis: {type: 'date', calendar: 'hebrew'},
- yaxis: {type: 'date', calendar: 'ummalqura'},
- zaxis: {type: 'date', calendar: 'discworld'}
- };
- options.calendar = 'taiwan';
+ it("should accept its own calendar", function() {
+ layoutIn = {
+ xaxis: { type: "date", calendar: "hebrew" },
+ yaxis: { type: "date", calendar: "ummalqura" },
+ zaxis: { type: "date", calendar: "discworld" }
+ };
+ options.calendar = "taiwan";
- supplyLayoutDefaults(layoutIn, layoutOut, options);
+ supplyLayoutDefaults(layoutIn, layoutOut, options);
- expect(layoutOut.xaxis.calendar).toBe('hebrew');
- expect(layoutOut.yaxis.calendar).toBe('ummalqura');
- expect(layoutOut.zaxis.calendar).toBe('discworld');
- });
+ expect(layoutOut.xaxis.calendar).toBe("hebrew");
+ expect(layoutOut.yaxis.calendar).toBe("ummalqura");
+ expect(layoutOut.zaxis.calendar).toBe("discworld");
});
+ });
});
diff --git a/test/jasmine/tests/gl3dlayout_test.js b/test/jasmine/tests/gl3dlayout_test.js
index f6e2fd24d07..a6694757bd5 100644
--- a/test/jasmine/tests/gl3dlayout_test.js
+++ b/test/jasmine/tests/gl3dlayout_test.js
@@ -1,257 +1,226 @@
-var Gl3d = require('@src/plots/gl3d');
-var Plots = require('@src/plots/plots');
-
-var tinycolor = require('tinycolor2');
-var Color = require('@src/components/color');
-
-
-describe('Test Gl3d layout defaults', function() {
- 'use strict';
-
- describe('supplyLayoutDefaults', function() {
- var layoutIn, layoutOut, fullData;
-
- var supplyLayoutDefaults = Gl3d.supplyLayoutDefaults;
-
- beforeEach(function() {
- layoutOut = {
- _has: Plots._hasPlotType
- };
-
- // needs a scene-ref in a trace in order to be detected
- fullData = [ { type: 'scatter3d', scene: 'scene' }];
- });
-
- it('should coerce aspectmode=ratio when ratio data is valid', function() {
- var aspectratio = {
- x: 1,
- y: 2,
- z: 1
- };
-
- layoutIn = {
- scene: {
- aspectmode: 'manual',
- aspectratio: aspectratio
- }
- };
-
- var expected = {
- scene: {
- aspectmode: 'manual',
- aspectratio: aspectratio,
- bgcolor: 'rgba(0,0,0,0)'
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.aspectmode).toBe(expected.scene.aspectmode);
- expect(layoutOut.scene.aspectratio).toEqual(expected.scene.aspectratio);
- expect(layoutOut.scene.bgcolor).toBe(expected.scene.bgcolor);
- });
-
-
- it('should coerce aspectmode=auto when aspect ratio data is invalid', function() {
- var aspectratio = {
- x: 'g',
- y: 2,
- z: 1
- };
-
- layoutIn = {
- scene: {
- aspectmode: 'manual',
- aspectratio: aspectratio
- }
- };
-
- var expected = {
- scene: {
- aspectmode: 'auto',
- aspectratio: {x: 1, y: 1, z: 1}
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.aspectmode).toBe(expected.scene.aspectmode);
- expect(layoutOut.scene.aspectratio).toEqual(expected.scene.aspectratio);
- });
-
-
- it('should coerce manual when valid ratio data but invalid aspectmode', function() {
- var aspectratio = {
- x: 1,
- y: 2,
- z: 1
- };
-
- layoutIn = {
- scene: {
- aspectmode: {},
- aspectratio: aspectratio
- }
- };
-
- var expected = {
- scene: {
- aspectmode: 'manual',
- aspectratio: {x: 1, y: 2, z: 1}
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.aspectmode).toBe(expected.scene.aspectmode);
- expect(layoutOut.scene.aspectratio).toEqual(expected.scene.aspectratio);
- });
-
-
- it('should not coerce manual when invalid ratio data but invalid aspectmode', function() {
- var aspectratio = {
- x: 'g',
- y: 2,
- z: 1
- };
-
- layoutIn = {
- scene: {
- aspectmode: {},
- aspectratio: aspectratio
- }
- };
-
- var expected = {
- scene: {
- aspectmode: 'auto',
- aspectratio: {x: 1, y: 1, z: 1}
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.aspectmode).toBe(expected.scene.aspectmode);
- expect(layoutOut.scene.aspectratio).toEqual(expected.scene.aspectratio);
- });
-
-
- it('should not coerce manual when valid ratio data and valid non-manual aspectmode', function() {
- var aspectratio = {
- x: 1,
- y: 2,
- z: 1
- };
-
- layoutIn = {
- scene: {
- aspectmode: 'cube',
- aspectratio: aspectratio
- }
- };
-
- var expected = {
- scene: {
- aspectmode: 'cube',
- aspectratio: {x: 1, y: 2, z: 1}
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.aspectmode).toBe(expected.scene.aspectmode);
- expect(layoutOut.scene.aspectratio).toEqual(expected.scene.aspectratio);
- });
-
- it('should coerce dragmode', function() {
- layoutIn = { scene: {} };
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.dragmode)
- .toBe('turntable', 'to turntable by default');
-
- layoutIn = { scene: { dragmode: 'orbit' } };
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.dragmode)
- .toBe('orbit', 'to user val if valid');
-
- layoutIn = { scene: {}, dragmode: 'orbit' };
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.dragmode)
- .toBe('orbit', 'to user layout val if valid and 3d only');
-
- layoutIn = { scene: {}, dragmode: 'orbit' };
- layoutOut._basePlotModules = [{ name: 'cartesian' }];
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.dragmode)
- .toBe('turntable', 'to default if not 3d only');
-
- layoutIn = { scene: {}, dragmode: 'not gonna work' };
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.dragmode)
- .toBe('turntable', 'to default if not valid');
- });
-
- it('should coerce hovermode', function() {
- layoutIn = { scene: {} };
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.hovermode)
- .toBe('closest', 'to closest by default');
-
- layoutIn = { scene: { hovermode: false } };
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.hovermode)
- .toBe(false, 'to user val if valid');
-
- layoutIn = { scene: {}, hovermode: false };
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.hovermode)
- .toBe(false, 'to user layout val if valid and 3d only');
-
- layoutIn = { scene: {}, hovermode: false };
- layoutOut._basePlotModules = [{ name: 'cartesian' }];
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.hovermode)
- .toBe('closest', 'to default if not 3d only');
-
- layoutIn = { scene: {}, hovermode: 'not gonna work' };
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.hovermode)
- .toBe('closest', 'to default if not valid');
- });
-
- it('should add data-only scenes into layoutIn', function() {
- layoutIn = {};
- fullData = [{ type: 'scatter3d', scene: 'scene' }];
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutIn.scene).toEqual({
- aspectratio: { x: 1, y: 1, z: 1 }
- });
- });
-
- it('should add scene data-only scenes into layoutIn (converse)', function() {
- layoutIn = {};
- fullData = [{ type: 'scatter' }];
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutIn.scene).toBe(undefined);
- });
-
- it('should use combo of \'axis.color\', bgcolor and lightFraction as default for \'axis.gridcolor\'', function() {
- layoutIn = {
- paper_bgcolor: 'green',
- scene: {
- bgcolor: 'yellow',
- xaxis: { showgrid: true, color: 'red' },
- yaxis: { gridcolor: 'blue' },
- zaxis: { showgrid: true }
- }
- };
-
- var bgColor = Color.combine('yellow', 'green'),
- frac = 100 * (204 - 0x44) / (255 - 0x44);
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.scene.xaxis.gridcolor)
- .toEqual(tinycolor.mix('red', bgColor, frac).toRgbString());
- expect(layoutOut.scene.yaxis.gridcolor).toEqual('blue');
- expect(layoutOut.scene.zaxis.gridcolor)
- .toEqual(tinycolor.mix('#444', bgColor, frac).toRgbString());
- });
+var Gl3d = require("@src/plots/gl3d");
+var Plots = require("@src/plots/plots");
+
+var tinycolor = require("tinycolor2");
+var Color = require("@src/components/color");
+
+describe("Test Gl3d layout defaults", function() {
+ "use strict";
+ describe("supplyLayoutDefaults", function() {
+ var layoutIn, layoutOut, fullData;
+
+ var supplyLayoutDefaults = Gl3d.supplyLayoutDefaults;
+
+ beforeEach(function() {
+ layoutOut = { _has: Plots._hasPlotType };
+
+ // needs a scene-ref in a trace in order to be detected
+ fullData = [{ type: "scatter3d", scene: "scene" }];
+ });
+
+ it("should coerce aspectmode=ratio when ratio data is valid", function() {
+ var aspectratio = { x: 1, y: 2, z: 1 };
+
+ layoutIn = { scene: { aspectmode: "manual", aspectratio: aspectratio } };
+
+ var expected = {
+ scene: {
+ aspectmode: "manual",
+ aspectratio: aspectratio,
+ bgcolor: "rgba(0,0,0,0)"
+ }
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.aspectmode).toBe(expected.scene.aspectmode);
+ expect(layoutOut.scene.aspectratio).toEqual(expected.scene.aspectratio);
+ expect(layoutOut.scene.bgcolor).toBe(expected.scene.bgcolor);
+ });
+
+ it(
+ "should coerce aspectmode=auto when aspect ratio data is invalid",
+ function() {
+ var aspectratio = { x: "g", y: 2, z: 1 };
+
+ layoutIn = {
+ scene: { aspectmode: "manual", aspectratio: aspectratio }
+ };
+
+ var expected = {
+ scene: { aspectmode: "auto", aspectratio: { x: 1, y: 1, z: 1 } }
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.aspectmode).toBe(expected.scene.aspectmode);
+ expect(layoutOut.scene.aspectratio).toEqual(expected.scene.aspectratio);
+ }
+ );
+
+ it(
+ "should coerce manual when valid ratio data but invalid aspectmode",
+ function() {
+ var aspectratio = { x: 1, y: 2, z: 1 };
+
+ layoutIn = { scene: { aspectmode: {}, aspectratio: aspectratio } };
+
+ var expected = {
+ scene: { aspectmode: "manual", aspectratio: { x: 1, y: 2, z: 1 } }
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.aspectmode).toBe(expected.scene.aspectmode);
+ expect(layoutOut.scene.aspectratio).toEqual(expected.scene.aspectratio);
+ }
+ );
+
+ it(
+ "should not coerce manual when invalid ratio data but invalid aspectmode",
+ function() {
+ var aspectratio = { x: "g", y: 2, z: 1 };
+
+ layoutIn = { scene: { aspectmode: {}, aspectratio: aspectratio } };
+
+ var expected = {
+ scene: { aspectmode: "auto", aspectratio: { x: 1, y: 1, z: 1 } }
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.aspectmode).toBe(expected.scene.aspectmode);
+ expect(layoutOut.scene.aspectratio).toEqual(expected.scene.aspectratio);
+ }
+ );
+
+ it(
+ "should not coerce manual when valid ratio data and valid non-manual aspectmode",
+ function() {
+ var aspectratio = { x: 1, y: 2, z: 1 };
+
+ layoutIn = { scene: { aspectmode: "cube", aspectratio: aspectratio } };
+
+ var expected = {
+ scene: { aspectmode: "cube", aspectratio: { x: 1, y: 2, z: 1 } }
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.aspectmode).toBe(expected.scene.aspectmode);
+ expect(layoutOut.scene.aspectratio).toEqual(expected.scene.aspectratio);
+ }
+ );
+
+ it("should coerce dragmode", function() {
+ layoutIn = { scene: {} };
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.dragmode).toBe(
+ "turntable",
+ "to turntable by default"
+ );
+
+ layoutIn = { scene: { dragmode: "orbit" } };
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.dragmode).toBe("orbit", "to user val if valid");
+
+ layoutIn = { scene: {}, dragmode: "orbit" };
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.dragmode).toBe(
+ "orbit",
+ "to user layout val if valid and 3d only"
+ );
+
+ layoutIn = { scene: {}, dragmode: "orbit" };
+ layoutOut._basePlotModules = [{ name: "cartesian" }];
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.dragmode).toBe(
+ "turntable",
+ "to default if not 3d only"
+ );
+
+ layoutIn = { scene: {}, dragmode: "not gonna work" };
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.dragmode).toBe(
+ "turntable",
+ "to default if not valid"
+ );
+ });
+
+ it("should coerce hovermode", function() {
+ layoutIn = { scene: {} };
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.hovermode).toBe(
+ "closest",
+ "to closest by default"
+ );
+
+ layoutIn = { scene: { hovermode: false } };
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.hovermode).toBe(false, "to user val if valid");
+
+ layoutIn = { scene: {}, hovermode: false };
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.hovermode).toBe(
+ false,
+ "to user layout val if valid and 3d only"
+ );
+
+ layoutIn = { scene: {}, hovermode: false };
+ layoutOut._basePlotModules = [{ name: "cartesian" }];
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.hovermode).toBe(
+ "closest",
+ "to default if not 3d only"
+ );
+
+ layoutIn = { scene: {}, hovermode: "not gonna work" };
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.hovermode).toBe(
+ "closest",
+ "to default if not valid"
+ );
});
+
+ it("should add data-only scenes into layoutIn", function() {
+ layoutIn = {};
+ fullData = [{ type: "scatter3d", scene: "scene" }];
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutIn.scene).toEqual({ aspectratio: { x: 1, y: 1, z: 1 } });
+ });
+
+ it(
+ "should add scene data-only scenes into layoutIn (converse)",
+ function() {
+ layoutIn = {};
+ fullData = [{ type: "scatter" }];
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutIn.scene).toBe(undefined);
+ }
+ );
+
+ it(
+ "should use combo of 'axis.color', bgcolor and lightFraction as default for 'axis.gridcolor'",
+ function() {
+ layoutIn = {
+ paper_bgcolor: "green",
+ scene: {
+ bgcolor: "yellow",
+ xaxis: { showgrid: true, color: "red" },
+ yaxis: { gridcolor: "blue" },
+ zaxis: { showgrid: true }
+ }
+ };
+
+ var bgColor = Color.combine("yellow", "green"),
+ frac = 100 * (204 - 0x44) / (255 - 0x44);
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.scene.xaxis.gridcolor).toEqual(
+ tinycolor.mix("red", bgColor, frac).toRgbString()
+ );
+ expect(layoutOut.scene.yaxis.gridcolor).toEqual("blue");
+ expect(layoutOut.scene.zaxis.gridcolor).toEqual(
+ tinycolor.mix("#444", bgColor, frac).toRgbString()
+ );
+ }
+ );
+ });
});
diff --git a/test/jasmine/tests/gl_plot_interact_basic_test.js b/test/jasmine/tests/gl_plot_interact_basic_test.js
index 0397084d1a6..11aa25b1be7 100644
--- a/test/jasmine/tests/gl_plot_interact_basic_test.js
+++ b/test/jasmine/tests/gl_plot_interact_basic_test.js
@@ -1,83 +1,98 @@
-'use strict';
-
-var Plotly = require('@lib/index');
-var mouseEvent = require('../assets/mouse_event');
+"use strict";
+var Plotly = require("@lib/index");
+var mouseEvent = require("../assets/mouse_event");
// Test utilities
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var failTest = require('../assets/fail_test');
-
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var failTest = require("../assets/fail_test");
// Expected shape of projection-related data
var cameraStructure = {
- up: {x: jasmine.any(Number), y: jasmine.any(Number), z: jasmine.any(Number)},
- center: {x: jasmine.any(Number), y: jasmine.any(Number), z: jasmine.any(Number)},
- eye: {x: jasmine.any(Number), y: jasmine.any(Number), z: jasmine.any(Number)}
+ up: {
+ x: jasmine.any(Number),
+ y: jasmine.any(Number),
+ z: jasmine.any(Number)
+ },
+ center: {
+ x: jasmine.any(Number),
+ y: jasmine.any(Number),
+ z: jasmine.any(Number)
+ },
+ eye: {
+ x: jasmine.any(Number),
+ y: jasmine.any(Number),
+ z: jasmine.any(Number)
+ }
};
function makePlot(gd, mock) {
- return Plotly.plot(gd, mock.data, mock.layout);
+ return Plotly.plot(gd, mock.data, mock.layout);
}
function addEventCallback(graphDiv) {
- var relayoutCallback = jasmine.createSpy('relayoutCallback');
- graphDiv.on('plotly_relayout', relayoutCallback);
- return {graphDiv: graphDiv, relayoutCallback: relayoutCallback};
+ var relayoutCallback = jasmine.createSpy("relayoutCallback");
+ graphDiv.on("plotly_relayout", relayoutCallback);
+ return { graphDiv: graphDiv, relayoutCallback: relayoutCallback };
}
function verifyInteractionEffects(tuple) {
+ // One 'drag': simulating fairly thoroughly as the mouseup event is also needed here
+ mouseEvent("mousemove", 400, 200);
+ mouseEvent("mousedown", 400, 200);
+ mouseEvent("mousemove", 320, 320, { buttons: 1 });
+ mouseEvent("mouseup", 320, 320);
- // One 'drag': simulating fairly thoroughly as the mouseup event is also needed here
- mouseEvent('mousemove', 400, 200);
- mouseEvent('mousedown', 400, 200);
- mouseEvent('mousemove', 320, 320, {buttons: 1});
- mouseEvent('mouseup', 320, 320);
+ // Check event emission count
+ expect(tuple.relayoutCallback).toHaveBeenCalledTimes(1);
- // Check event emission count
- expect(tuple.relayoutCallback).toHaveBeenCalledTimes(1);
+ // Check structure of event callback value contents
+ expect(tuple.relayoutCallback).toHaveBeenCalledWith(
+ jasmine.objectContaining({ scene: cameraStructure })
+ );
- // Check structure of event callback value contents
- expect(tuple.relayoutCallback).toHaveBeenCalledWith(jasmine.objectContaining({scene: cameraStructure}));
+ // Check camera contents on the DIV layout
+ var divCamera = tuple.graphDiv.layout.scene.camera;
- // Check camera contents on the DIV layout
- var divCamera = tuple.graphDiv.layout.scene.camera;
+ expect(divCamera).toEqual(cameraStructure);
- expect(divCamera).toEqual(cameraStructure);
-
- return tuple.graphDiv;
+ return tuple.graphDiv;
}
function testEvents(plot) {
- return plot
- .then(function(graphDiv) {
- var tuple = addEventCallback(graphDiv); // TODO disuse tuple with ES6
- verifyInteractionEffects(tuple);
- });
+ return plot.then(function(graphDiv) {
+ var tuple = addEventCallback(graphDiv);
+ // TODO disuse tuple with ES6
+ verifyInteractionEffects(tuple);
+ });
}
-describe('gl3d plots', function() {
-
- var gd;
-
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
-
- it('should respond to drag interactions with mock of unset camera', function(done) {
- testEvents(makePlot(gd, require('@mocks/gl3d_scatter3d-connectgaps.json')))
- .then(null, failTest) // current linter balks on .catch with 'dot-notation'; fixme a linter
- .then(done);
- });
-
- it('should respond to drag interactions with mock of partially set camera', function(done) {
- testEvents(makePlot(gd, require('@mocks/gl3d_errorbars_zx.json')))
- .then(null, failTest)
- .then(done);
- });
+describe("gl3d plots", function() {
+ var gd;
+
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
+
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
+
+ it("should respond to drag interactions with mock of unset camera", function(
+ done
+ ) {
+ testEvents(makePlot(gd, require("@mocks/gl3d_scatter3d-connectgaps.json")))
+ .then(null, failTest)
+ .then(done);
+ });
+
+ it(
+ "should respond to drag interactions with mock of partially set camera",
+ function(done) {
+ testEvents(makePlot(gd, require("@mocks/gl3d_errorbars_zx.json")))
+ .then(null, failTest)
+ .then(done);
+ }
+ );
});
diff --git a/test/jasmine/tests/gl_plot_interact_test.js b/test/jasmine/tests/gl_plot_interact_test.js
index 2a7960b93e3..aaf0d1029ff 100644
--- a/test/jasmine/tests/gl_plot_interact_test.js
+++ b/test/jasmine/tests/gl_plot_interact_test.js
@@ -1,905 +1,926 @@
-var d3 = require('d3');
+var d3 = require("d3");
-var Plotly = require('@lib/index');
-var Plots = require('@src/plots/plots');
-var Lib = require('@src/lib');
-var Drawing = require('@src/components/drawing');
+var Plotly = require("@lib/index");
+var Plots = require("@src/plots/plots");
+var Lib = require("@src/lib");
+var Drawing = require("@src/components/drawing");
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var mouseEvent = require('../assets/mouse_event');
-var selectButton = require('../assets/modebar_button');
-var customMatchers = require('../assets/custom_matchers');
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var mouseEvent = require("../assets/mouse_event");
+var selectButton = require("../assets/modebar_button");
+var customMatchers = require("../assets/custom_matchers");
/*
* WebGL interaction test cases fail on the CircleCI
* most likely due to a WebGL/driver issue
*
*/
-
var MODEBAR_DELAY = 500;
+describe("Test gl plot interactions", function() {
+ "use strict";
+ var gd;
-describe('Test gl plot interactions', function() {
- 'use strict';
+ beforeEach(function() {
+ jasmine.addMatchers(customMatchers);
+ });
- var gd;
+ afterEach(function() {
+ var fullLayout = gd._fullLayout, sceneIds;
- beforeEach(function() {
- jasmine.addMatchers(customMatchers);
- });
+ sceneIds = Plots.getSubplotIds(fullLayout, "gl3d");
+ sceneIds.forEach(function(id) {
+ var scene = fullLayout[id]._scene;
- afterEach(function() {
- var fullLayout = gd._fullLayout,
- sceneIds;
+ if (scene.glplot) scene.destroy();
+ });
- sceneIds = Plots.getSubplotIds(fullLayout, 'gl3d');
- sceneIds.forEach(function(id) {
- var scene = fullLayout[id]._scene;
+ sceneIds = Plots.getSubplotIds(fullLayout, "gl2d");
+ sceneIds.forEach(function(id) {
+ var scene2d = fullLayout._plots[id]._scene2d;
- if(scene.glplot) scene.destroy();
- });
+ if (scene2d.glplot) {
+ scene2d.stopped = true;
+ scene2d.destroy();
+ }
+ });
- sceneIds = Plots.getSubplotIds(fullLayout, 'gl2d');
- sceneIds.forEach(function(id) {
- var scene2d = fullLayout._plots[id]._scene2d;
+ destroyGraphDiv();
+ });
- if(scene2d.glplot) {
- scene2d.stopped = true;
- scene2d.destroy();
- }
- });
+ // put callback in the event queue
+ function delay(done) {
+ setTimeout(done, 0);
+ }
- destroyGraphDiv();
- });
+ describe("gl3d plots", function() {
+ var mock = require("@mocks/gl3d_marker-arrays.json");
- // put callback in the event queue
- function delay(done) {
- setTimeout(done, 0);
+ function mouseEventScatter3d(type, opts) {
+ mouseEvent(type, 605, 271, opts);
}
- describe('gl3d plots', function() {
- var mock = require('@mocks/gl3d_marker-arrays.json');
+ function countCanvases() {
+ return d3.selectAll("canvas").size();
+ }
- function mouseEventScatter3d(type, opts) {
- mouseEvent(type, 605, 271, opts);
- }
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- function countCanvases() {
- return d3.selectAll('canvas').size();
- }
+ var mockCopy = Lib.extendDeep({}, mock);
- beforeEach(function(done) {
- gd = createGraphDiv();
+ // lines, markers, text, error bars and surfaces each
+ // correspond to one glplot object
+ mockCopy.data[0].mode = "lines+markers+text";
+ mockCopy.data[0].error_z = { value: 10 };
+ mockCopy.data[0].surfaceaxis = 2;
+ mockCopy.layout.showlegend = true;
- var mockCopy = Lib.extendDeep({}, mock);
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
+ delay(done);
+ });
+ });
- // lines, markers, text, error bars and surfaces each
- // correspond to one glplot object
- mockCopy.data[0].mode = 'lines+markers+text';
- mockCopy.data[0].error_z = { value: 10 };
- mockCopy.data[0].surfaceaxis = 2;
- mockCopy.layout.showlegend = true;
+ describe("scatter3d hover", function() {
+ var node, ptData;
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
- delay(done);
- });
+ beforeEach(function(done) {
+ gd.on("plotly_hover", function(eventData) {
+ ptData = eventData.points[0];
});
- describe('scatter3d hover', function() {
-
- var node, ptData;
-
- beforeEach(function(done) {
- gd.on('plotly_hover', function(eventData) {
- ptData = eventData.points[0];
- });
-
- mouseEventScatter3d('mouseover');
-
- delay(done);
- });
-
- it('should have', function() {
- node = d3.selectAll('g.hovertext');
- expect(node.size()).toEqual(1, 'one hover text group');
-
- node = d3.selectAll('g.hovertext').selectAll('tspan')[0];
- expect(node[0].innerHTML).toEqual('x: 140.72', 'x val on hover');
- expect(node[1].innerHTML).toEqual('y: −96.97', 'y val on hover');
- expect(node[2].innerHTML).toEqual('z: −96.97', 'z val on hover');
-
- expect(Object.keys(ptData)).toEqual([
- 'x', 'y', 'z',
- 'data', 'fullData', 'curveNumber', 'pointNumber'
- ], 'correct hover data fields');
-
- expect(ptData.x).toBe('140.72', 'x val hover data');
- expect(ptData.y).toBe('−96.97', 'y val hover data');
- expect(ptData.z).toEqual('−96.97', 'z val hover data');
- expect(ptData.curveNumber).toEqual(0, 'curveNumber hover data');
- expect(ptData.pointNumber).toEqual(2, 'pointNumber hover data');
- });
-
- });
+ mouseEventScatter3d("mouseover");
- describe('scatter3d click events', function() {
- var ptData;
+ delay(done);
+ });
- beforeEach(function(done) {
- gd.on('plotly_click', function(eventData) {
- ptData = eventData.points[0];
- });
+ it("should have", function() {
+ node = d3.selectAll("g.hovertext");
+ expect(node.size()).toEqual(1, "one hover text group");
- // N.B. gl3d click events are 'mouseover' events
- // with button 1 pressed
- mouseEventScatter3d('mouseover', {buttons: 1});
+ node = d3.selectAll("g.hovertext").selectAll("tspan")[0];
+ expect(node[0].innerHTML).toEqual("x: 140.72", "x val on hover");
+ expect(node[1].innerHTML).toEqual("y: \u221296.97", "y val on hover");
+ expect(node[2].innerHTML).toEqual("z: \u221296.97", "z val on hover");
- delay(done);
- });
+ expect(Object.keys(ptData)).toEqual(
+ ["x", "y", "z", "data", "fullData", "curveNumber", "pointNumber"],
+ "correct hover data fields"
+ );
- it('should have', function() {
- expect(Object.keys(ptData)).toEqual([
- 'x', 'y', 'z',
- 'data', 'fullData', 'curveNumber', 'pointNumber'
- ], 'correct hover data fields');
+ expect(ptData.x).toBe("140.72", "x val hover data");
+ expect(ptData.y).toBe("\u221296.97", "y val hover data");
+ expect(ptData.z).toEqual("\u221296.97", "z val hover data");
+ expect(ptData.curveNumber).toEqual(0, "curveNumber hover data");
+ expect(ptData.pointNumber).toEqual(2, "pointNumber hover data");
+ });
+ });
+ describe("scatter3d click events", function() {
+ var ptData;
- expect(ptData.x).toBe('140.72', 'x val click data');
- expect(ptData.y).toBe('−96.97', 'y val click data');
- expect(ptData.z).toEqual('−96.97', 'z val click data');
- expect(ptData.curveNumber).toEqual(0, 'curveNumber click data');
- expect(ptData.pointNumber).toEqual(2, 'pointNumber click data');
- });
+ beforeEach(function(done) {
+ gd.on("plotly_click", function(eventData) {
+ ptData = eventData.points[0];
});
- it('should be able to reversibly change trace type', function(done) {
- var sceneLayout = { aspectratio: { x: 1, y: 1, z: 1 } };
-
- expect(countCanvases()).toEqual(1);
- expect(gd.layout.scene).toEqual(sceneLayout);
- expect(gd.layout.xaxis).toBeUndefined();
- expect(gd.layout.yaxis).toBeUndefined();
- expect(gd._fullLayout._has('gl3d')).toBe(true);
- expect(gd._fullLayout.scene._scene).toBeDefined();
-
- Plotly.restyle(gd, 'type', 'scatter').then(function() {
- expect(countCanvases()).toEqual(0);
- expect(gd.layout.scene).toEqual(sceneLayout);
- expect(gd.layout.xaxis).toBeDefined();
- expect(gd.layout.yaxis).toBeDefined();
- expect(gd._fullLayout._has('gl3d')).toBe(false);
- expect(gd._fullLayout.scene).toBeUndefined();
-
- return Plotly.restyle(gd, 'type', 'scatter3d');
- }).then(function() {
- expect(countCanvases()).toEqual(1);
- expect(gd.layout.scene).toEqual(sceneLayout);
- expect(gd.layout.xaxis).toBeDefined();
- expect(gd.layout.yaxis).toBeDefined();
- expect(gd._fullLayout._has('gl3d')).toBe(true);
- expect(gd._fullLayout.scene._scene).toBeDefined();
+ // N.B. gl3d click events are 'mouseover' events
+ // with button 1 pressed
+ mouseEventScatter3d("mouseover", { buttons: 1 });
+
+ delay(done);
+ });
+
+ it("should have", function() {
+ expect(Object.keys(ptData)).toEqual(
+ ["x", "y", "z", "data", "fullData", "curveNumber", "pointNumber"],
+ "correct hover data fields"
+ );
+
+ expect(ptData.x).toBe("140.72", "x val click data");
+ expect(ptData.y).toBe("\u221296.97", "y val click data");
+ expect(ptData.z).toEqual("\u221296.97", "z val click data");
+ expect(ptData.curveNumber).toEqual(0, "curveNumber click data");
+ expect(ptData.pointNumber).toEqual(2, "pointNumber click data");
+ });
+ });
- done();
- });
- });
+ it("should be able to reversibly change trace type", function(done) {
+ var sceneLayout = { aspectratio: { x: 1, y: 1, z: 1 } };
- it('should be able to delete the last trace', function(done) {
- Plotly.deleteTraces(gd, [0]).then(function() {
- expect(countCanvases()).toEqual(0);
- expect(gd._fullLayout._has('gl3d')).toBe(false);
- expect(gd._fullLayout.scene).toBeUndefined();
+ expect(countCanvases()).toEqual(1);
+ expect(gd.layout.scene).toEqual(sceneLayout);
+ expect(gd.layout.xaxis).toBeUndefined();
+ expect(gd.layout.yaxis).toBeUndefined();
+ expect(gd._fullLayout._has("gl3d")).toBe(true);
+ expect(gd._fullLayout.scene._scene).toBeDefined();
- done();
- });
+ Plotly.restyle(gd, "type", "scatter")
+ .then(function() {
+ expect(countCanvases()).toEqual(0);
+ expect(gd.layout.scene).toEqual(sceneLayout);
+ expect(gd.layout.xaxis).toBeDefined();
+ expect(gd.layout.yaxis).toBeDefined();
+ expect(gd._fullLayout._has("gl3d")).toBe(false);
+ expect(gd._fullLayout.scene).toBeUndefined();
+
+ return Plotly.restyle(gd, "type", "scatter3d");
+ })
+ .then(function() {
+ expect(countCanvases()).toEqual(1);
+ expect(gd.layout.scene).toEqual(sceneLayout);
+ expect(gd.layout.xaxis).toBeDefined();
+ expect(gd.layout.yaxis).toBeDefined();
+ expect(gd._fullLayout._has("gl3d")).toBe(true);
+ expect(gd._fullLayout.scene._scene).toBeDefined();
+
+ done();
});
+ });
- it('should be able to toggle visibility', function(done) {
- var objects = gd._fullLayout.scene._scene.glplot.objects;
-
- expect(objects.length).toEqual(5);
-
- Plotly.restyle(gd, 'visible', 'legendonly').then(function() {
- expect(objects.length).toEqual(0);
-
- return Plotly.restyle(gd, 'visible', true);
- }).then(function() {
- expect(objects.length).toEqual(5);
-
- done();
- });
- });
+ it("should be able to delete the last trace", function(done) {
+ Plotly.deleteTraces(gd, [0]).then(function() {
+ expect(countCanvases()).toEqual(0);
+ expect(gd._fullLayout._has("gl3d")).toBe(false);
+ expect(gd._fullLayout.scene).toBeUndefined();
+ done();
+ });
});
- describe('gl2d plots', function() {
- var mock = require('@mocks/gl2d_10.json'),
- modeBar, relayoutCallback;
-
- beforeEach(function(done) {
- gd = createGraphDiv();
+ it("should be able to toggle visibility", function(done) {
+ var objects = gd._fullLayout.scene._scene.glplot.objects;
- Plotly.plot(gd, mock.data, mock.layout).then(function() {
+ expect(objects.length).toEqual(5);
- modeBar = gd._fullLayout._modeBar;
- relayoutCallback = jasmine.createSpy('relayoutCallback');
+ Plotly.restyle(gd, "visible", "legendonly")
+ .then(function() {
+ expect(objects.length).toEqual(0);
- gd.on('plotly_relayout', relayoutCallback);
+ return Plotly.restyle(gd, "visible", true);
+ })
+ .then(function() {
+ expect(objects.length).toEqual(5);
- delay(done);
- });
+ done();
});
+ });
+ });
- it('has one *canvas* node', function() {
- var nodes = d3.selectAll('canvas');
- expect(nodes[0].length).toEqual(1);
- });
+ describe("gl2d plots", function() {
+ var mock = require("@mocks/gl2d_10.json"), modeBar, relayoutCallback;
- it('should respond to drag interactions', function(done) {
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- function mouseTo(p0, p1) {
- mouseEvent('mousemove', p0[0], p0[1]);
- mouseEvent('mousedown', p0[0], p0[1], { buttons: 1 });
- mouseEvent('mousemove', p1[0], p1[1], { buttons: 1 });
- mouseEvent('mouseup', p1[0], p1[1]);
- }
+ Plotly.plot(gd, mock.data, mock.layout).then(function() {
+ modeBar = gd._fullLayout._modeBar;
+ relayoutCallback = jasmine.createSpy("relayoutCallback");
- jasmine.addMatchers(customMatchers);
+ gd.on("plotly_relayout", relayoutCallback);
- var precision = 5;
+ delay(done);
+ });
+ });
- var buttonPan = selectButton(modeBar, 'pan2d');
+ it("has one *canvas* node", function() {
+ var nodes = d3.selectAll("canvas");
+ expect(nodes[0].length).toEqual(1);
+ });
- var originalX = [-0.022068095838587643, 5.022068095838588];
- var originalY = [-0.21331533513634046, 5.851205650049042];
+ it("should respond to drag interactions", function(done) {
+ function mouseTo(p0, p1) {
+ mouseEvent("mousemove", p0[0], p0[1]);
+ mouseEvent("mousedown", p0[0], p0[1], { buttons: 1 });
+ mouseEvent("mousemove", p1[0], p1[1], { buttons: 1 });
+ mouseEvent("mouseup", p1[0], p1[1]);
+ }
- var newX = [-0.23224043715846995, 4.811895754518705];
- var newY = [-1.2962655110623016, 4.768255474123081];
+ jasmine.addMatchers(customMatchers);
- expect(gd.layout.xaxis.autorange).toBe(true);
- expect(gd.layout.yaxis.autorange).toBe(true);
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+ var precision = 5;
- // Switch to pan mode
- expect(buttonPan.isActive()).toBe(false); // initially, zoom is active
- buttonPan.click();
- expect(buttonPan.isActive()).toBe(true); // switched on dragmode
+ var buttonPan = selectButton(modeBar, "pan2d");
- // Switching mode must not change visible range
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+ var originalX = [-0.022068095838587643, 5.022068095838588];
+ var originalY = [-0.21331533513634046, 5.851205650049042];
- setTimeout(function() {
- relayoutCallback.calls.reset();
+ var newX = [-0.23224043715846995, 4.811895754518705];
+ var newY = [-1.2962655110623016, 4.768255474123081];
- // Drag scene along the X axis
- mouseTo([200, 200], [220, 200]);
+ expect(gd.layout.xaxis.autorange).toBe(true);
+ expect(gd.layout.yaxis.autorange).toBe(true);
+ expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
- expect(gd.layout.xaxis.autorange).toBe(false);
- expect(gd.layout.yaxis.autorange).toBe(false);
+ // Switch to pan mode
+ expect(buttonPan.isActive()).toBe(false);
+ // initially, zoom is active
+ buttonPan.click();
+ expect(buttonPan.isActive()).toBe(true);
- expect(gd.layout.xaxis.range).toBeCloseToArray(newX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+ // switched on dragmode
+ // Switching mode must not change visible range
+ expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
- // Drag scene back along the X axis
- mouseTo([220, 200], [200, 200]);
+ setTimeout(
+ function() {
+ relayoutCallback.calls.reset();
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+ // Drag scene along the X axis
+ mouseTo([200, 200], [220, 200]);
- // Drag scene along the Y axis
- mouseTo([200, 200], [200, 150]);
+ expect(gd.layout.xaxis.autorange).toBe(false);
+ expect(gd.layout.yaxis.autorange).toBe(false);
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(newY, precision);
+ expect(gd.layout.xaxis.range).toBeCloseToArray(newX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
- // Drag scene back along the Y axis
- mouseTo([200, 150], [200, 200]);
+ // Drag scene back along the X axis
+ mouseTo([220, 200], [200, 200]);
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+ expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
- // Drag scene along both the X and Y axis
- mouseTo([200, 200], [220, 150]);
+ // Drag scene along the Y axis
+ mouseTo([200, 200], [200, 150]);
- expect(gd.layout.xaxis.range).toBeCloseToArray(newX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(newY, precision);
+ expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(newY, precision);
- // Drag scene back along the X and Y axis
- mouseTo([220, 150], [200, 200]);
+ // Drag scene back along the Y axis
+ mouseTo([200, 150], [200, 200]);
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+ expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
- setTimeout(function() {
+ // Drag scene along both the X and Y axis
+ mouseTo([200, 200], [220, 150]);
- // callback count expectation: X and back; Y and back; XY and back
- expect(relayoutCallback).toHaveBeenCalledTimes(6);
+ expect(gd.layout.xaxis.range).toBeCloseToArray(newX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(newY, precision);
- // a callback value structure and contents check
- expect(relayoutCallback).toHaveBeenCalledWith(jasmine.objectContaining({
- lastInputTime: jasmine.any(Number),
- xaxis: [jasmine.any(Number), jasmine.any(Number)],
- yaxis: [jasmine.any(Number), jasmine.any(Number)]
- }));
+ // Drag scene back along the X and Y axis
+ mouseTo([220, 150], [200, 200]);
- done();
+ expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
- }, MODEBAR_DELAY);
+ setTimeout(
+ function() {
+ // callback count expectation: X and back; Y and back; XY and back
+ expect(relayoutCallback).toHaveBeenCalledTimes(6);
- }, MODEBAR_DELAY);
- });
+ // a callback value structure and contents check
+ expect(relayoutCallback).toHaveBeenCalledWith(
+ jasmine.objectContaining({
+ lastInputTime: jasmine.any(Number),
+ xaxis: [jasmine.any(Number), jasmine.any(Number)],
+ yaxis: [jasmine.any(Number), jasmine.any(Number)]
+ })
+ );
+
+ done();
+ },
+ MODEBAR_DELAY
+ );
+ },
+ MODEBAR_DELAY
+ );
+ });
- it('should be able to toggle visibility', function(done) {
- var OBJECT_PER_TRACE = 5;
+ it("should be able to toggle visibility", function(done) {
+ var OBJECT_PER_TRACE = 5;
- var objects = function() {
- return gd._fullLayout._plots.xy._scene2d.glplot.objects;
- };
+ var objects = function() {
+ return gd._fullLayout._plots.xy._scene2d.glplot.objects;
+ };
- expect(objects().length).toEqual(OBJECT_PER_TRACE);
+ expect(objects().length).toEqual(OBJECT_PER_TRACE);
- Plotly.restyle(gd, 'visible', 'legendonly').then(function() {
- expect(objects().length).toEqual(OBJECT_PER_TRACE);
- expect(objects()[0].data.length).toEqual(0);
+ Plotly.restyle(gd, "visible", "legendonly")
+ .then(function() {
+ expect(objects().length).toEqual(OBJECT_PER_TRACE);
+ expect(objects()[0].data.length).toEqual(0);
- return Plotly.restyle(gd, 'visible', true);
- })
- .then(function() {
- expect(objects().length).toEqual(OBJECT_PER_TRACE);
- expect(objects()[0].data.length).not.toEqual(0);
+ return Plotly.restyle(gd, "visible", true);
+ })
+ .then(function() {
+ expect(objects().length).toEqual(OBJECT_PER_TRACE);
+ expect(objects()[0].data.length).not.toEqual(0);
- return Plotly.restyle(gd, 'visible', false);
- })
- .then(function() {
- expect(gd._fullLayout._plots.xy._scene2d).toBeUndefined();
+ return Plotly.restyle(gd, "visible", false);
+ })
+ .then(function() {
+ expect(gd._fullLayout._plots.xy._scene2d).toBeUndefined();
- return Plotly.restyle(gd, 'visible', true);
- })
- .then(function() {
- expect(objects().length).toEqual(OBJECT_PER_TRACE);
- expect(objects()[0].data.length).not.toEqual(0);
- })
- .then(done);
- });
+ return Plotly.restyle(gd, "visible", true);
+ })
+ .then(function() {
+ expect(objects().length).toEqual(OBJECT_PER_TRACE);
+ expect(objects()[0].data.length).not.toEqual(0);
+ })
+ .then(done);
});
+ });
- describe('gl3d event handlers', function() {
- var modeBar, relayoutCallback;
+ describe("gl3d event handlers", function() {
+ var modeBar, relayoutCallback;
- beforeEach(function(done) {
- var mockData = [{
- type: 'scatter3d'
- }, {
- type: 'surface', scene: 'scene2'
- }];
+ beforeEach(function(done) {
+ var mockData = [
+ { type: "scatter3d" },
+ { type: "surface", scene: "scene2" }
+ ];
- var mockLayout = {
- scene: { camera: { eye: { x: 0.1, y: 0.1, z: 1 }}},
- scene2: { camera: { eye: { x: 2.5, y: 2.5, z: 2.5 }}}
- };
+ var mockLayout = {
+ scene: { camera: { eye: { x: 0.1, y: 0.1, z: 1 } } },
+ scene2: { camera: { eye: { x: 2.5, y: 2.5, z: 2.5 } } }
+ };
- gd = createGraphDiv();
- Plotly.plot(gd, mockData, mockLayout).then(function() {
+ gd = createGraphDiv();
+ Plotly.plot(gd, mockData, mockLayout).then(function() {
+ modeBar = gd._fullLayout._modeBar;
- modeBar = gd._fullLayout._modeBar;
+ relayoutCallback = jasmine.createSpy("relayoutCallback");
- relayoutCallback = jasmine.createSpy('relayoutCallback');
+ gd.on("plotly_relayout", relayoutCallback);
- gd.on('plotly_relayout', relayoutCallback);
+ delay(done);
+ });
+ });
- delay(done);
- });
- });
+ function assertScenes(cont, attr, val) {
+ var sceneIds = Plots.getSubplotIds(cont, "gl3d");
- function assertScenes(cont, attr, val) {
- var sceneIds = Plots.getSubplotIds(cont, 'gl3d');
+ sceneIds.forEach(function(sceneId) {
+ var thisVal = Lib.nestedProperty(cont[sceneId], attr).get();
+ expect(thisVal).toEqual(val);
+ });
+ }
- sceneIds.forEach(function(sceneId) {
- var thisVal = Lib.nestedProperty(cont[sceneId], attr).get();
- expect(thisVal).toEqual(val);
- });
+ describe("modebar click handlers", function() {
+ it(
+ "button zoom3d should updates the scene dragmode and dragmode button",
+ function() {
+ var buttonTurntable = selectButton(modeBar, "tableRotation"),
+ buttonZoom3d = selectButton(modeBar, "zoom3d");
+
+ assertScenes(gd._fullLayout, "dragmode", "turntable");
+ expect(buttonTurntable.isActive()).toBe(true);
+ expect(buttonZoom3d.isActive()).toBe(false);
+
+ buttonZoom3d.click();
+ assertScenes(gd.layout, "dragmode", "zoom");
+ expect(gd.layout.dragmode).toBe(undefined);
+ expect(gd._fullLayout.dragmode).toBe("zoom");
+ expect(buttonTurntable.isActive()).toBe(false);
+ expect(buttonZoom3d.isActive()).toBe(true);
+
+ buttonTurntable.click();
+ assertScenes(gd._fullLayout, "dragmode", "turntable");
+ expect(buttonTurntable.isActive()).toBe(true);
+ expect(buttonZoom3d.isActive()).toBe(false);
+ }
+ );
+
+ it(
+ "button pan3d should updates the scene dragmode and dragmode button",
+ function() {
+ var buttonTurntable = selectButton(modeBar, "tableRotation"),
+ buttonPan3d = selectButton(modeBar, "pan3d");
+
+ assertScenes(gd._fullLayout, "dragmode", "turntable");
+ expect(buttonTurntable.isActive()).toBe(true);
+ expect(buttonPan3d.isActive()).toBe(false);
+
+ buttonPan3d.click();
+ assertScenes(gd.layout, "dragmode", "pan");
+ expect(gd.layout.dragmode).toBe(undefined);
+ expect(gd._fullLayout.dragmode).toBe("zoom");
+ expect(buttonTurntable.isActive()).toBe(false);
+ expect(buttonPan3d.isActive()).toBe(true);
+
+ buttonTurntable.click();
+ assertScenes(gd._fullLayout, "dragmode", "turntable");
+ expect(buttonTurntable.isActive()).toBe(true);
+ expect(buttonPan3d.isActive()).toBe(false);
+ }
+ );
+
+ it(
+ "button orbitRotation should updates the scene dragmode and dragmode button",
+ function() {
+ var buttonTurntable = selectButton(modeBar, "tableRotation"),
+ buttonOrbit = selectButton(modeBar, "orbitRotation");
+
+ assertScenes(gd._fullLayout, "dragmode", "turntable");
+ expect(buttonTurntable.isActive()).toBe(true);
+ expect(buttonOrbit.isActive()).toBe(false);
+
+ buttonOrbit.click();
+ assertScenes(gd.layout, "dragmode", "orbit");
+ expect(gd.layout.dragmode).toBe(undefined);
+ expect(gd._fullLayout.dragmode).toBe("zoom");
+ expect(buttonTurntable.isActive()).toBe(false);
+ expect(buttonOrbit.isActive()).toBe(true);
+
+ buttonTurntable.click();
+ assertScenes(gd._fullLayout, "dragmode", "turntable");
+ expect(buttonTurntable.isActive()).toBe(true);
+ expect(buttonOrbit.isActive()).toBe(false);
}
+ );
+
+ it(
+ "button hoverClosest3d should update the scene hovermode and spikes",
+ function() {
+ var buttonHover = selectButton(modeBar, "hoverClosest3d");
+
+ assertScenes(gd._fullLayout, "hovermode", "closest");
+ expect(buttonHover.isActive()).toBe(true);
+
+ buttonHover.click();
+ assertScenes(gd._fullLayout, "hovermode", false);
+ assertScenes(gd._fullLayout, "xaxis.showspikes", false);
+ assertScenes(gd._fullLayout, "yaxis.showspikes", false);
+ assertScenes(gd._fullLayout, "zaxis.showspikes", false);
+ expect(buttonHover.isActive()).toBe(false);
+
+ buttonHover.click();
+ assertScenes(gd._fullLayout, "hovermode", "closest");
+ assertScenes(gd._fullLayout, "xaxis.showspikes", true);
+ assertScenes(gd._fullLayout, "yaxis.showspikes", true);
+ assertScenes(gd._fullLayout, "zaxis.showspikes", true);
+ expect(buttonHover.isActive()).toBe(true);
+ }
+ );
- describe('modebar click handlers', function() {
-
- it('button zoom3d should updates the scene dragmode and dragmode button', function() {
- var buttonTurntable = selectButton(modeBar, 'tableRotation'),
- buttonZoom3d = selectButton(modeBar, 'zoom3d');
-
- assertScenes(gd._fullLayout, 'dragmode', 'turntable');
- expect(buttonTurntable.isActive()).toBe(true);
- expect(buttonZoom3d.isActive()).toBe(false);
-
- buttonZoom3d.click();
- assertScenes(gd.layout, 'dragmode', 'zoom');
- expect(gd.layout.dragmode).toBe(undefined);
- expect(gd._fullLayout.dragmode).toBe('zoom');
- expect(buttonTurntable.isActive()).toBe(false);
- expect(buttonZoom3d.isActive()).toBe(true);
-
- buttonTurntable.click();
- assertScenes(gd._fullLayout, 'dragmode', 'turntable');
- expect(buttonTurntable.isActive()).toBe(true);
- expect(buttonZoom3d.isActive()).toBe(false);
- });
-
- it('button pan3d should updates the scene dragmode and dragmode button', function() {
- var buttonTurntable = selectButton(modeBar, 'tableRotation'),
- buttonPan3d = selectButton(modeBar, 'pan3d');
-
- assertScenes(gd._fullLayout, 'dragmode', 'turntable');
- expect(buttonTurntable.isActive()).toBe(true);
- expect(buttonPan3d.isActive()).toBe(false);
-
- buttonPan3d.click();
- assertScenes(gd.layout, 'dragmode', 'pan');
- expect(gd.layout.dragmode).toBe(undefined);
- expect(gd._fullLayout.dragmode).toBe('zoom');
- expect(buttonTurntable.isActive()).toBe(false);
- expect(buttonPan3d.isActive()).toBe(true);
-
- buttonTurntable.click();
- assertScenes(gd._fullLayout, 'dragmode', 'turntable');
- expect(buttonTurntable.isActive()).toBe(true);
- expect(buttonPan3d.isActive()).toBe(false);
- });
-
- it('button orbitRotation should updates the scene dragmode and dragmode button', function() {
- var buttonTurntable = selectButton(modeBar, 'tableRotation'),
- buttonOrbit = selectButton(modeBar, 'orbitRotation');
-
- assertScenes(gd._fullLayout, 'dragmode', 'turntable');
- expect(buttonTurntable.isActive()).toBe(true);
- expect(buttonOrbit.isActive()).toBe(false);
-
- buttonOrbit.click();
- assertScenes(gd.layout, 'dragmode', 'orbit');
- expect(gd.layout.dragmode).toBe(undefined);
- expect(gd._fullLayout.dragmode).toBe('zoom');
- expect(buttonTurntable.isActive()).toBe(false);
- expect(buttonOrbit.isActive()).toBe(true);
-
- buttonTurntable.click();
- assertScenes(gd._fullLayout, 'dragmode', 'turntable');
- expect(buttonTurntable.isActive()).toBe(true);
- expect(buttonOrbit.isActive()).toBe(false);
- });
-
- it('button hoverClosest3d should update the scene hovermode and spikes', function() {
- var buttonHover = selectButton(modeBar, 'hoverClosest3d');
-
- assertScenes(gd._fullLayout, 'hovermode', 'closest');
- expect(buttonHover.isActive()).toBe(true);
-
- buttonHover.click();
- assertScenes(gd._fullLayout, 'hovermode', false);
- assertScenes(gd._fullLayout, 'xaxis.showspikes', false);
- assertScenes(gd._fullLayout, 'yaxis.showspikes', false);
- assertScenes(gd._fullLayout, 'zaxis.showspikes', false);
- expect(buttonHover.isActive()).toBe(false);
-
- buttonHover.click();
- assertScenes(gd._fullLayout, 'hovermode', 'closest');
- assertScenes(gd._fullLayout, 'xaxis.showspikes', true);
- assertScenes(gd._fullLayout, 'yaxis.showspikes', true);
- assertScenes(gd._fullLayout, 'zaxis.showspikes', true);
- expect(buttonHover.isActive()).toBe(true);
- });
-
- it('button resetCameraDefault3d should reset camera to default', function(done) {
- var buttonDefault = selectButton(modeBar, 'resetCameraDefault3d');
-
- expect(gd._fullLayout.scene._scene.cameraInitial.eye).toEqual({ x: 0.1, y: 0.1, z: 1 });
- expect(gd._fullLayout.scene2._scene.cameraInitial.eye).toEqual({ x: 2.5, y: 2.5, z: 2.5 });
-
- gd.once('plotly_relayout', function() {
- assertScenes(gd._fullLayout, 'camera.eye.x', 1.25);
- assertScenes(gd._fullLayout, 'camera.eye.y', 1.25);
- assertScenes(gd._fullLayout, 'camera.eye.z', 1.25);
-
- expect(gd._fullLayout.scene._scene.getCamera().eye.z).toBeCloseTo(1.25);
- expect(gd._fullLayout.scene2._scene.getCamera().eye.z).toBeCloseTo(1.25);
-
- done();
- });
+ it("button resetCameraDefault3d should reset camera to default", function(
+ done
+ ) {
+ var buttonDefault = selectButton(modeBar, "resetCameraDefault3d");
- buttonDefault.click();
- });
-
- it('button resetCameraLastSave3d should reset camera to default', function(done) {
- var buttonDefault = selectButton(modeBar, 'resetCameraDefault3d');
- var buttonLastSave = selectButton(modeBar, 'resetCameraLastSave3d');
-
- function assertCameraEye(sceneLayout, eyeX, eyeY, eyeZ) {
- expect(sceneLayout.camera.eye.x).toEqual(eyeX);
- expect(sceneLayout.camera.eye.y).toEqual(eyeY);
- expect(sceneLayout.camera.eye.z).toEqual(eyeZ);
-
- var camera = sceneLayout._scene.getCamera();
- expect(camera.eye.x).toBeCloseTo(eyeX);
- expect(camera.eye.y).toBeCloseTo(eyeY);
- expect(camera.eye.z).toBeCloseTo(eyeZ);
- }
-
- Plotly.relayout(gd, {
- 'scene.camera.eye.z': 4,
- 'scene2.camera.eye.z': 5
- })
- .then(function() {
- assertCameraEye(gd._fullLayout.scene, 0.1, 0.1, 4);
- assertCameraEye(gd._fullLayout.scene2, 2.5, 2.5, 5);
-
- return new Promise(function(resolve) {
- gd.once('plotly_relayout', resolve);
- buttonLastSave.click();
- });
- })
- .then(function() {
- assertCameraEye(gd._fullLayout.scene, 0.1, 0.1, 1);
- assertCameraEye(gd._fullLayout.scene2, 2.5, 2.5, 2.5);
-
- return new Promise(function(resolve) {
- gd.once('plotly_relayout', resolve);
- buttonDefault.click();
- });
- })
- .then(function() {
- assertCameraEye(gd._fullLayout.scene, 1.25, 1.25, 1.25);
- assertCameraEye(gd._fullLayout.scene2, 1.25, 1.25, 1.25);
-
- return new Promise(function(resolve) {
- gd.once('plotly_relayout', resolve);
- buttonLastSave.click();
- });
- })
- .then(function() {
- assertCameraEye(gd._fullLayout.scene, 0.1, 0.1, 1);
- assertCameraEye(gd._fullLayout.scene2, 2.5, 2.5, 2.5);
-
- delete gd._fullLayout.scene._scene.cameraInitial;
- delete gd._fullLayout.scene2._scene.cameraInitial;
-
- Plotly.relayout(gd, {
- 'scene.bgcolor': '#d3d3d3',
- 'scene.camera.eye.z': 4,
- 'scene2.camera.eye.z': 5
- });
- })
- .then(function() {
- assertCameraEye(gd._fullLayout.scene, 0.1, 0.1, 4);
- assertCameraEye(gd._fullLayout.scene2, 2.5, 2.5, 5);
-
- return new Promise(function(resolve) {
- gd.once('plotly_relayout', resolve);
- buttonDefault.click();
- });
- })
- .then(function() {
- assertCameraEye(gd._fullLayout.scene, 1.25, 1.25, 1.25);
- assertCameraEye(gd._fullLayout.scene2, 1.25, 1.25, 1.25);
-
- return new Promise(function(resolve) {
- gd.once('plotly_relayout', resolve);
- buttonLastSave.click();
- });
- })
- .then(function() {
- assertCameraEye(gd._fullLayout.scene, 0.1, 0.1, 4);
- assertCameraEye(gd._fullLayout.scene2, 2.5, 2.5, 5);
- })
- .then(done);
-
- });
+ expect(gd._fullLayout.scene._scene.cameraInitial.eye).toEqual({
+ x: 0.1,
+ y: 0.1,
+ z: 1
+ });
+ expect(gd._fullLayout.scene2._scene.cameraInitial.eye).toEqual({
+ x: 2.5,
+ y: 2.5,
+ z: 2.5
});
- describe('drag and wheel interactions', function() {
- it('should update the scene camera', function(done) {
- var sceneLayout = gd._fullLayout.scene,
- sceneLayout2 = gd._fullLayout.scene2,
- sceneTarget = gd.querySelector('.svg-container .gl-container #scene canvas'),
- sceneTarget2 = gd.querySelector('.svg-container .gl-container #scene2 canvas');
-
- expect(sceneLayout.camera.eye)
- .toEqual({x: 0.1, y: 0.1, z: 1});
- expect(sceneLayout2.camera.eye)
- .toEqual({x: 2.5, y: 2.5, z: 2.5});
-
- // Wheel scene 1
- sceneTarget.dispatchEvent(new WheelEvent('wheel', {deltaY: 1}));
-
- // Wheel scene 2
- sceneTarget2.dispatchEvent(new WheelEvent('wheel', {deltaY: 1}));
+ gd.once("plotly_relayout", function() {
+ assertScenes(gd._fullLayout, "camera.eye.x", 1.25);
+ assertScenes(gd._fullLayout, "camera.eye.y", 1.25);
+ assertScenes(gd._fullLayout, "camera.eye.z", 1.25);
- setTimeout(function() {
+ expect(gd._fullLayout.scene._scene.getCamera().eye.z).toBeCloseTo(
+ 1.25
+ );
+ expect(gd._fullLayout.scene2._scene.getCamera().eye.z).toBeCloseTo(
+ 1.25
+ );
- expect(relayoutCallback).toHaveBeenCalledTimes(2);
+ done();
+ });
- relayoutCallback.calls.reset();
+ buttonDefault.click();
+ });
+
+ it(
+ "button resetCameraLastSave3d should reset camera to default",
+ function(done) {
+ var buttonDefault = selectButton(modeBar, "resetCameraDefault3d");
+ var buttonLastSave = selectButton(modeBar, "resetCameraLastSave3d");
+
+ function assertCameraEye(sceneLayout, eyeX, eyeY, eyeZ) {
+ expect(sceneLayout.camera.eye.x).toEqual(eyeX);
+ expect(sceneLayout.camera.eye.y).toEqual(eyeY);
+ expect(sceneLayout.camera.eye.z).toEqual(eyeZ);
+
+ var camera = sceneLayout._scene.getCamera();
+ expect(camera.eye.x).toBeCloseTo(eyeX);
+ expect(camera.eye.y).toBeCloseTo(eyeY);
+ expect(camera.eye.z).toBeCloseTo(eyeZ);
+ }
+
+ Plotly.relayout(gd, {
+ "scene.camera.eye.z": 4,
+ "scene2.camera.eye.z": 5
+ })
+ .then(function() {
+ assertCameraEye(gd._fullLayout.scene, 0.1, 0.1, 4);
+ assertCameraEye(gd._fullLayout.scene2, 2.5, 2.5, 5);
- // Drag scene 1
- sceneTarget.dispatchEvent(new MouseEvent('mousedown', {x: 0, y: 0}));
- sceneTarget.dispatchEvent(new MouseEvent('mousemove', { x: 100, y: 100}));
- sceneTarget.dispatchEvent(new MouseEvent('mouseup', { x: 100, y: 100}));
+ return new Promise(function(resolve) {
+ gd.once("plotly_relayout", resolve);
+ buttonLastSave.click();
+ });
+ })
+ .then(function() {
+ assertCameraEye(gd._fullLayout.scene, 0.1, 0.1, 1);
+ assertCameraEye(gd._fullLayout.scene2, 2.5, 2.5, 2.5);
- // Drag scene 2
- sceneTarget2.dispatchEvent(new MouseEvent('mousedown', {x: 0, y: 0 }));
- sceneTarget2.dispatchEvent(new MouseEvent('mousemove', {x: 100, y: 100}));
- sceneTarget2.dispatchEvent(new MouseEvent('mouseup', {x: 100, y: 100}));
+ return new Promise(function(resolve) {
+ gd.once("plotly_relayout", resolve);
+ buttonDefault.click();
+ });
+ })
+ .then(function() {
+ assertCameraEye(gd._fullLayout.scene, 1.25, 1.25, 1.25);
+ assertCameraEye(gd._fullLayout.scene2, 1.25, 1.25, 1.25);
- setTimeout(function() {
+ return new Promise(function(resolve) {
+ gd.once("plotly_relayout", resolve);
+ buttonLastSave.click();
+ });
+ })
+ .then(function() {
+ assertCameraEye(gd._fullLayout.scene, 0.1, 0.1, 1);
+ assertCameraEye(gd._fullLayout.scene2, 2.5, 2.5, 2.5);
- expect(relayoutCallback).toHaveBeenCalledTimes(2);
+ delete gd._fullLayout.scene._scene.cameraInitial;
+ delete gd._fullLayout.scene2._scene.cameraInitial;
- done();
+ Plotly.relayout(gd, {
+ "scene.bgcolor": "#d3d3d3",
+ "scene.camera.eye.z": 4,
+ "scene2.camera.eye.z": 5
+ });
+ })
+ .then(function() {
+ assertCameraEye(gd._fullLayout.scene, 0.1, 0.1, 4);
+ assertCameraEye(gd._fullLayout.scene2, 2.5, 2.5, 5);
- }, MODEBAR_DELAY);
+ return new Promise(function(resolve) {
+ gd.once("plotly_relayout", resolve);
+ buttonDefault.click();
+ });
+ })
+ .then(function() {
+ assertCameraEye(gd._fullLayout.scene, 1.25, 1.25, 1.25);
+ assertCameraEye(gd._fullLayout.scene2, 1.25, 1.25, 1.25);
- }, MODEBAR_DELAY);
- });
- });
+ return new Promise(function(resolve) {
+ gd.once("plotly_relayout", resolve);
+ buttonLastSave.click();
+ });
+ })
+ .then(function() {
+ assertCameraEye(gd._fullLayout.scene, 0.1, 0.1, 4);
+ assertCameraEye(gd._fullLayout.scene2, 2.5, 2.5, 5);
+ })
+ .then(done);
+ }
+ );
});
- describe('Removal of gl contexts', function() {
-
- var mockData2d = [{
- type: 'scattergl',
- x: [1, 2, 3],
- y: [2, 1, 3]
- }];
-
-
- var mockData3d = [{
- type: 'scatter3d',
- x: [1, 2, 3],
- y: [2, 1, 3],
- z: [3, 2, 1]
- }];
-
- describe('Plots.cleanPlot', function() {
-
- it('should remove gl context from the graph div of a gl3d plot', function(done) {
- gd = createGraphDiv();
+ describe("drag and wheel interactions", function() {
+ it("should update the scene camera", function(done) {
+ var sceneLayout = gd._fullLayout.scene,
+ sceneLayout2 = gd._fullLayout.scene2,
+ sceneTarget = gd.querySelector(
+ ".svg-container .gl-container #scene canvas"
+ ),
+ sceneTarget2 = gd.querySelector(
+ ".svg-container .gl-container #scene2 canvas"
+ );
+
+ expect(sceneLayout.camera.eye).toEqual({ x: 0.1, y: 0.1, z: 1 });
+ expect(sceneLayout2.camera.eye).toEqual({ x: 2.5, y: 2.5, z: 2.5 });
+
+ // Wheel scene 1
+ sceneTarget.dispatchEvent(new WheelEvent("wheel", { deltaY: 1 }));
+
+ // Wheel scene 2
+ sceneTarget2.dispatchEvent(new WheelEvent("wheel", { deltaY: 1 }));
+
+ setTimeout(
+ function() {
+ expect(relayoutCallback).toHaveBeenCalledTimes(2);
+
+ relayoutCallback.calls.reset();
+
+ // Drag scene 1
+ sceneTarget.dispatchEvent(new MouseEvent("mousedown", {
+ x: 0,
+ y: 0
+ }));
+ sceneTarget.dispatchEvent(new MouseEvent("mousemove", {
+ x: 100,
+ y: 100
+ }));
+ sceneTarget.dispatchEvent(new MouseEvent("mouseup", {
+ x: 100,
+ y: 100
+ }));
+
+ // Drag scene 2
+ sceneTarget2.dispatchEvent(new MouseEvent("mousedown", {
+ x: 0,
+ y: 0
+ }));
+ sceneTarget2.dispatchEvent(new MouseEvent("mousemove", {
+ x: 100,
+ y: 100
+ }));
+ sceneTarget2.dispatchEvent(new MouseEvent("mouseup", {
+ x: 100,
+ y: 100
+ }));
+
+ setTimeout(
+ function() {
+ expect(relayoutCallback).toHaveBeenCalledTimes(2);
- Plotly.plot(gd, mockData3d).then(function() {
- expect(gd._fullLayout.scene._scene.glplot).toBeDefined();
+ done();
+ },
+ MODEBAR_DELAY
+ );
+ },
+ MODEBAR_DELAY
+ );
+ });
+ });
+ });
- Plots.cleanPlot([], {}, gd._fullData, gd._fullLayout);
- expect(gd._fullLayout.scene._scene.glplot).toBe(null);
+ describe("Removal of gl contexts", function() {
+ var mockData2d = [{ type: "scattergl", x: [1, 2, 3], y: [2, 1, 3] }];
- done();
- });
- });
+ var mockData3d = [
+ { type: "scatter3d", x: [1, 2, 3], y: [2, 1, 3], z: [3, 2, 1] }
+ ];
- it('should remove gl context from the graph div of a gl2d plot', function(done) {
- gd = createGraphDiv();
+ describe("Plots.cleanPlot", function() {
+ it("should remove gl context from the graph div of a gl3d plot", function(
+ done
+ ) {
+ gd = createGraphDiv();
- Plotly.plot(gd, mockData2d).then(function() {
- expect(gd._fullLayout._plots.xy._scene2d.glplot).toBeDefined();
+ Plotly.plot(gd, mockData3d).then(function() {
+ expect(gd._fullLayout.scene._scene.glplot).toBeDefined();
- Plots.cleanPlot([], {}, gd._fullData, gd._fullLayout);
- expect(gd._fullLayout._plots).toEqual({});
+ Plots.cleanPlot([], {}, gd._fullData, gd._fullLayout);
+ expect(gd._fullLayout.scene._scene.glplot).toBe(null);
- done();
- });
- });
+ done();
});
+ });
- describe('Plotly.newPlot', function() {
-
- var mockData2dNew = [{
- type: 'scattergl',
- x: [1, 3, 2],
- y: [2, 3, 1]
- }];
-
-
- var mockData3dNew = [{
- type: 'scatter3d',
- x: [2, 1, 3],
- y: [1, 2, 3],
- z: [2, 1, 3]
- }];
-
-
- it('should remove gl context from the graph div of a gl3d plot', function(done) {
- gd = createGraphDiv();
-
- Plotly.plot(gd, mockData3d).then(function() {
-
- var firstGlplotObject = gd._fullLayout.scene._scene.glplot;
- var firstGlContext = firstGlplotObject.gl;
- var firstCanvas = firstGlContext.canvas;
-
- expect(firstGlplotObject).toBeDefined();
-
- Plotly.newPlot(gd, mockData3dNew, {}).then(function() {
-
- var secondGlplotObject = gd._fullLayout.scene._scene.glplot;
- var secondGlContext = secondGlplotObject.gl;
- var secondCanvas = secondGlContext.canvas;
-
- expect(secondGlplotObject).not.toBe(firstGlplotObject);
- expect(firstGlplotObject.gl === null);
- expect(secondGlContext instanceof WebGLRenderingContext);
- expect(secondGlContext).not.toBe(firstGlContext);
-
- // The same canvas can't possibly be reassinged a new WebGL context, but let's leave room
- // for the implementation to make the context get lost and have the old canvas stick around
- // in a disused state.
- expect(firstCanvas.parentNode === null ||
- firstCanvas !== secondCanvas && firstGlContext.isContextLost());
-
- done();
+ it("should remove gl context from the graph div of a gl2d plot", function(
+ done
+ ) {
+ gd = createGraphDiv();
- });
- });
- });
+ Plotly.plot(gd, mockData2d).then(function() {
+ expect(gd._fullLayout._plots.xy._scene2d.glplot).toBeDefined();
- it('should remove gl context from the graph div of a gl2d plot', function(done) {
- gd = createGraphDiv();
+ Plots.cleanPlot([], {}, gd._fullData, gd._fullLayout);
+ expect(gd._fullLayout._plots).toEqual({});
- Plotly.plot(gd, mockData2d).then(function() {
+ done();
+ });
+ });
+ });
- var firstGlplotObject = gd._fullLayout._plots.xy._scene2d.glplot;
- var firstGlContext = firstGlplotObject.gl;
- var firstCanvas = firstGlContext.canvas;
+ describe("Plotly.newPlot", function() {
+ var mockData2dNew = [{ type: "scattergl", x: [1, 3, 2], y: [2, 3, 1] }];
- expect(firstGlplotObject).toBeDefined();
- expect(firstGlContext).toBeDefined();
- expect(firstGlContext instanceof WebGLRenderingContext);
+ var mockData3dNew = [
+ { type: "scatter3d", x: [2, 1, 3], y: [1, 2, 3], z: [2, 1, 3] }
+ ];
- Plotly.newPlot(gd, mockData2dNew, {}).then(function() {
+ it("should remove gl context from the graph div of a gl3d plot", function(
+ done
+ ) {
+ gd = createGraphDiv();
- var secondGlplotObject = gd._fullLayout._plots.xy._scene2d.glplot;
- var secondGlContext = secondGlplotObject.gl;
- var secondCanvas = secondGlContext.canvas;
+ Plotly.plot(gd, mockData3d).then(function() {
+ var firstGlplotObject = gd._fullLayout.scene._scene.glplot;
+ var firstGlContext = firstGlplotObject.gl;
+ var firstCanvas = firstGlContext.canvas;
+
+ expect(firstGlplotObject).toBeDefined();
+
+ Plotly.newPlot(gd, mockData3dNew, {}).then(function() {
+ var secondGlplotObject = gd._fullLayout.scene._scene.glplot;
+ var secondGlContext = secondGlplotObject.gl;
+ var secondCanvas = secondGlContext.canvas;
+
+ expect(secondGlplotObject).not.toBe(firstGlplotObject);
+ expect(firstGlplotObject.gl === null);
+ expect(secondGlContext instanceof WebGLRenderingContext);
+ expect(secondGlContext).not.toBe(firstGlContext);
+
+ // The same canvas can't possibly be reassinged a new WebGL context, but let's leave room
+ // for the implementation to make the context get lost and have the old canvas stick around
+ // in a disused state.
+ expect(
+ firstCanvas.parentNode === null ||
+ firstCanvas !== secondCanvas && firstGlContext.isContextLost()
+ );
+
+ done();
+ });
+ });
+ });
- expect(Object.keys(gd._fullLayout._plots).length === 1);
- expect(secondGlplotObject).not.toBe(firstGlplotObject);
- expect(firstGlplotObject.gl === null);
- expect(secondGlContext instanceof WebGLRenderingContext);
- expect(secondGlContext).not.toBe(firstGlContext);
- expect(firstCanvas.parentNode === null ||
- firstCanvas !== secondCanvas && firstGlContext.isContextLost());
+ it("should remove gl context from the graph div of a gl2d plot", function(
+ done
+ ) {
+ gd = createGraphDiv();
- done();
- });
- });
- });
+ Plotly.plot(gd, mockData2d).then(function() {
+ var firstGlplotObject = gd._fullLayout._plots.xy._scene2d.glplot;
+ var firstGlContext = firstGlplotObject.gl;
+ var firstCanvas = firstGlContext.canvas;
+
+ expect(firstGlplotObject).toBeDefined();
+ expect(firstGlContext).toBeDefined();
+ expect(firstGlContext instanceof WebGLRenderingContext);
+
+ Plotly.newPlot(gd, mockData2dNew, {}).then(function() {
+ var secondGlplotObject = gd._fullLayout._plots.xy._scene2d.glplot;
+ var secondGlContext = secondGlplotObject.gl;
+ var secondCanvas = secondGlContext.canvas;
+
+ expect(Object.keys(gd._fullLayout._plots).length === 1);
+ expect(secondGlplotObject).not.toBe(firstGlplotObject);
+ expect(firstGlplotObject.gl === null);
+ expect(secondGlContext instanceof WebGLRenderingContext);
+ expect(secondGlContext).not.toBe(firstGlContext);
+ expect(
+ firstCanvas.parentNode === null ||
+ firstCanvas !== secondCanvas && firstGlContext.isContextLost()
+ );
+
+ done();
+ });
});
+ });
});
+ });
});
-describe('Test gl plot side effects', function() {
- var gd;
+describe("Test gl plot side effects", function() {
+ var gd;
- beforeEach(function() {
- gd = createGraphDiv();
- });
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
- afterEach(destroyGraphDiv);
-
- describe('when present with rangeslider', function() {
- it('should not draw the rangeslider', function(done) {
- var data = [{
- x: [1, 2, 3],
- y: [2, 3, 4],
- type: 'scattergl'
- }, {
- x: [1, 2, 3],
- y: [2, 3, 4],
- type: 'scatter'
- }];
-
- var layout = {
- xaxis: { rangeslider: { visible: true } }
- };
-
- Plotly.plot(gd, data, layout).then(function() {
- var rangeSlider = document.getElementsByClassName('range-slider')[0];
- expect(rangeSlider).not.toBeDefined();
- done();
- });
- });
+ afterEach(destroyGraphDiv);
+
+ describe("when present with rangeslider", function() {
+ it("should not draw the rangeslider", function(done) {
+ var data = [
+ { x: [1, 2, 3], y: [2, 3, 4], type: "scattergl" },
+ { x: [1, 2, 3], y: [2, 3, 4], type: "scatter" }
+ ];
+
+ var layout = { xaxis: { rangeslider: { visible: true } } };
+
+ Plotly.plot(gd, data, layout).then(function() {
+ var rangeSlider = document.getElementsByClassName("range-slider")[0];
+ expect(rangeSlider).not.toBeDefined();
+ done();
+ });
});
+ });
- it('should be able to replot from a blank graph', function(done) {
- function countCanvases(cnt) {
- var nodes = d3.selectAll('canvas');
- expect(nodes.size()).toEqual(cnt);
- }
+ it("should be able to replot from a blank graph", function(done) {
+ function countCanvases(cnt) {
+ var nodes = d3.selectAll("canvas");
+ expect(nodes.size()).toEqual(cnt);
+ }
- var data = [{
- type: 'scattergl',
- x: [1, 2, 3],
- y: [2, 1, 2]
- }];
+ var data = [{ type: "scattergl", x: [1, 2, 3], y: [2, 1, 2] }];
- Plotly.plot(gd, []).then(function() {
- countCanvases(0);
+ Plotly.plot(gd, [])
+ .then(function() {
+ countCanvases(0);
- return Plotly.plot(gd, data);
- }).then(function() {
- countCanvases(1);
+ return Plotly.plot(gd, data);
+ })
+ .then(function() {
+ countCanvases(1);
- return Plotly.purge(gd);
- }).then(function() {
- countCanvases(0);
+ return Plotly.purge(gd);
+ })
+ .then(function() {
+ countCanvases(0);
- return Plotly.plot(gd, data);
- }).then(function() {
- countCanvases(1);
+ return Plotly.plot(gd, data);
+ })
+ .then(function() {
+ countCanvases(1);
- return Plotly.deleteTraces(gd, [0]);
- }).then(function() {
- countCanvases(0);
+ return Plotly.deleteTraces(gd, [0]);
+ })
+ .then(function() {
+ countCanvases(0);
- return Plotly.purge(gd);
- }).then(done);
- });
+ return Plotly.purge(gd);
+ })
+ .then(done);
+ });
});
-describe('gl2d interaction', function() {
- var gd;
+describe("gl2d interaction", function() {
+ var gd;
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
- });
-
- beforeEach(function() {
- gd = createGraphDiv();
- });
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
- it('data-referenced annotations should update on drag', function(done) {
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
- function drag(start, end) {
- mouseEvent('mousemove', start[0], start[1]);
- mouseEvent('mousedown', start[0], start[1], { buttons: 1 });
- mouseEvent('mousemove', end[0], end[1], { buttons: 1 });
- mouseEvent('mouseup', end[0], end[1]);
- }
+ it("data-referenced annotations should update on drag", function(done) {
+ function drag(start, end) {
+ mouseEvent("mousemove", start[0], start[1]);
+ mouseEvent("mousedown", start[0], start[1], { buttons: 1 });
+ mouseEvent("mousemove", end[0], end[1], { buttons: 1 });
+ mouseEvent("mouseup", end[0], end[1]);
+ }
- function assertAnnotation(xy) {
- var ann = d3.select('g.annotation-text-g').select('g');
- var translate = Drawing.getTranslate(ann);
+ function assertAnnotation(xy) {
+ var ann = d3.select("g.annotation-text-g").select("g");
+ var translate = Drawing.getTranslate(ann);
- expect(translate.x).toBeWithin(xy[0], 1.5);
- expect(translate.y).toBeWithin(xy[1], 1.5);
- }
+ expect(translate.x).toBeWithin(xy[0], 1.5);
+ expect(translate.y).toBeWithin(xy[1], 1.5);
+ }
- Plotly.plot(gd, [{
- type: 'scattergl',
- x: [1, 2, 3],
- y: [2, 1, 2]
- }], {
- annotations: [{
- x: 2,
- y: 1,
- text: 'text'
- }],
- dragmode: 'pan'
- })
- .then(function() {
- assertAnnotation([327, 325]);
+ Plotly.plot(gd, [{ type: "scattergl", x: [1, 2, 3], y: [2, 1, 2] }], {
+ annotations: [{ x: 2, y: 1, text: "text" }],
+ dragmode: "pan"
+ })
+ .then(function() {
+ assertAnnotation([327, 325]);
- drag([250, 200], [200, 150]);
- assertAnnotation([277, 275]);
+ drag([250, 200], [200, 150]);
+ assertAnnotation([277, 275]);
- return Plotly.relayout(gd, {
- 'xaxis.range': [1.5, 2.5],
- 'yaxis.range': [1, 1.5]
- });
- })
- .then(function() {
- assertAnnotation([327, 331]);
- })
- .then(done);
- });
+ return Plotly.relayout(gd, {
+ "xaxis.range": [1.5, 2.5],
+ "yaxis.range": [1, 1.5]
+ });
+ })
+ .then(function() {
+ assertAnnotation([327, 331]);
+ })
+ .then(done);
+ });
});
diff --git a/test/jasmine/tests/heatmap_test.js b/test/jasmine/tests/heatmap_test.js
index 9141ff5edf1..5475bb5d7d4 100644
--- a/test/jasmine/tests/heatmap_test.js
+++ b/test/jasmine/tests/heatmap_test.js
@@ -1,586 +1,728 @@
-var Plotly = require('@lib/index');
-var Plots = require('@src/plots/plots');
-var Lib = require('@src/lib');
-
-var convertColumnXYZ = require('@src/traces/heatmap/convert_column_xyz');
-var Heatmap = require('@src/traces/heatmap');
-
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var customMatchers = require('../assets/custom_matchers');
-
-
-describe('heatmap supplyDefaults', function() {
- 'use strict';
-
- var traceIn,
- traceOut;
-
- var defaultColor = '#444',
- layout = {
- font: Plots.layoutAttributes.font
- };
-
- var supplyDefaults = Heatmap.supplyDefaults;
-
- beforeEach(function() {
- traceOut = {};
- });
-
- it('should set visible to false when z is empty', function() {
- traceIn = {
- z: []
- };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
-
- traceIn = {
- z: [[]]
- };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
-
- traceIn = {
- z: [[], [], []]
- };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
-
- traceIn = {
- type: 'heatmap',
- z: [[1, 2], []]
- };
- traceOut = Plots.supplyTraceDefaults(traceIn, 0, layout);
-
- traceIn = {
- type: 'heatmap',
- z: [[], [1, 2], [1, 2, 3]]
- };
- traceOut = Plots.supplyTraceDefaults(traceIn, 0, layout);
- expect(traceOut.visible).toBe(true);
- expect(traceOut.visible).toBe(true);
- });
-
- it('should set visible to false when z is non-numeric', function() {
- traceIn = {
- type: 'heatmap',
- z: [['a', 'b'], ['c', 'd']]
- };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
- });
-
- it('should set visible to false when z isn\'t column not a 2d array', function() {
- traceIn = {
- x: [1, 1, 1, 2, 2],
- y: [1, 2, 3, 1, 2],
- z: [1, ['this is considered a column'], 1, 2, 3]
- };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).not.toBe(false);
-
- traceIn = {
- x: [1, 1, 1, 2, 2],
- y: [1, 2, 3, 1, 2],
- z: [[0], ['this is not considered a column'], 1, ['nor 2d']]
- };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
- });
-
- it('should set paddings to 0 when not defined', function() {
- traceIn = {
- type: 'heatmap',
- z: [[1, 2], [3, 4]]
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.xgap).toBe(0);
- expect(traceOut.ygap).toBe(0);
- });
-
- it('should not step on defined paddings', function() {
- traceIn = {
- xgap: 10,
- type: 'heatmap',
- z: [[1, 2], [3, 4]]
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.xgap).toBe(10);
- expect(traceOut.ygap).toBe(0);
- });
-
- it('should not coerce gap if zsmooth is set', function() {
- traceIn = {
- xgap: 10,
- zsmooth: 'best',
- type: 'heatmap',
- z: [[1, 2], [3, 4]]
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.xgap).toBe(undefined);
- expect(traceOut.ygap).toBe(undefined);
- });
-
- it('should inherit layout.calendar', function() {
- traceIn = {
- x: [1, 2],
- y: [1, 2],
- z: [[1, 2], [3, 4]]
- };
- supplyDefaults(traceIn, traceOut, defaultColor, {calendar: 'islamic'});
-
- // we always fill calendar attributes, because it's hard to tell if
- // we're on a date axis at this point.
- expect(traceOut.xcalendar).toBe('islamic');
- expect(traceOut.ycalendar).toBe('islamic');
- });
-
- it('should take its own calendars', function() {
- traceIn = {
- x: [1, 2],
- y: [1, 2],
- z: [[1, 2], [3, 4]],
- xcalendar: 'coptic',
- ycalendar: 'ethiopian'
- };
- supplyDefaults(traceIn, traceOut, defaultColor, {calendar: 'islamic'});
-
- // we always fill calendar attributes, because it's hard to tell if
- // we're on a date axis at this point.
- expect(traceOut.xcalendar).toBe('coptic');
- expect(traceOut.ycalendar).toBe('ethiopian');
- });
+var Plotly = require("@lib/index");
+var Plots = require("@src/plots/plots");
+var Lib = require("@src/lib");
+
+var convertColumnXYZ = require("@src/traces/heatmap/convert_column_xyz");
+var Heatmap = require("@src/traces/heatmap");
+
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var customMatchers = require("../assets/custom_matchers");
+
+describe("heatmap supplyDefaults", function() {
+ "use strict";
+ var traceIn, traceOut;
+
+ var defaultColor = "#444", layout = { font: Plots.layoutAttributes.font };
+
+ var supplyDefaults = Heatmap.supplyDefaults;
+
+ beforeEach(function() {
+ traceOut = {};
+ });
+
+ it("should set visible to false when z is empty", function() {
+ traceIn = { z: [] };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+
+ traceIn = { z: [[]] };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+
+ traceIn = { z: [[], [], []] };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+
+ traceIn = { type: "heatmap", z: [[1, 2], []] };
+ traceOut = Plots.supplyTraceDefaults(traceIn, 0, layout);
+
+ traceIn = { type: "heatmap", z: [[], [1, 2], [1, 2, 3]] };
+ traceOut = Plots.supplyTraceDefaults(traceIn, 0, layout);
+ expect(traceOut.visible).toBe(true);
+ expect(traceOut.visible).toBe(true);
+ });
+
+ it("should set visible to false when z is non-numeric", function() {
+ traceIn = { type: "heatmap", z: [["a", "b"], ["c", "d"]] };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+ });
+
+ it(
+ "should set visible to false when z isn't column not a 2d array",
+ function() {
+ traceIn = {
+ x: [1, 1, 1, 2, 2],
+ y: [1, 2, 3, 1, 2],
+ z: [1, ["this is considered a column"], 1, 2, 3]
+ };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).not.toBe(false);
+
+ traceIn = {
+ x: [1, 1, 1, 2, 2],
+ y: [1, 2, 3, 1, 2],
+ z: [[0], ["this is not considered a column"], 1, ["nor 2d"]]
+ };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+ }
+ );
+
+ it("should set paddings to 0 when not defined", function() {
+ traceIn = { type: "heatmap", z: [[1, 2], [3, 4]] };
+
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.xgap).toBe(0);
+ expect(traceOut.ygap).toBe(0);
+ });
+
+ it("should not step on defined paddings", function() {
+ traceIn = { xgap: 10, type: "heatmap", z: [[1, 2], [3, 4]] };
+
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.xgap).toBe(10);
+ expect(traceOut.ygap).toBe(0);
+ });
+
+ it("should not coerce gap if zsmooth is set", function() {
+ traceIn = {
+ xgap: 10,
+ zsmooth: "best",
+ type: "heatmap",
+ z: [[1, 2], [3, 4]]
+ };
+
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.xgap).toBe(undefined);
+ expect(traceOut.ygap).toBe(undefined);
+ });
+
+ it("should inherit layout.calendar", function() {
+ traceIn = { x: [1, 2], y: [1, 2], z: [[1, 2], [3, 4]] };
+ supplyDefaults(traceIn, traceOut, defaultColor, { calendar: "islamic" });
+
+ // we always fill calendar attributes, because it's hard to tell if
+ // we're on a date axis at this point.
+ expect(traceOut.xcalendar).toBe("islamic");
+ expect(traceOut.ycalendar).toBe("islamic");
+ });
+
+ it("should take its own calendars", function() {
+ traceIn = {
+ x: [1, 2],
+ y: [1, 2],
+ z: [[1, 2], [3, 4]],
+ xcalendar: "coptic",
+ ycalendar: "ethiopian"
+ };
+ supplyDefaults(traceIn, traceOut, defaultColor, { calendar: "islamic" });
+
+ // we always fill calendar attributes, because it's hard to tell if
+ // we're on a date axis at this point.
+ expect(traceOut.xcalendar).toBe("coptic");
+ expect(traceOut.ycalendar).toBe("ethiopian");
+ });
});
-describe('heatmap convertColumnXYZ', function() {
- 'use strict';
-
- var trace;
-
- function makeMockAxis() {
- return {
- d2c: function(v) { return v; }
- };
+describe("heatmap convertColumnXYZ", function() {
+ "use strict";
+ var trace;
+
+ function makeMockAxis() {
+ return {
+ d2c: function(v) {
+ return v;
+ }
+ };
+ }
+
+ var xa = makeMockAxis(), ya = makeMockAxis();
+
+ it("should convert x/y/z columns to z(x,y)", function() {
+ trace = {
+ x: [1, 1, 1, 2, 2, 2],
+ y: [1, 2, 3, 1, 2, 3],
+ z: [1, 2, 3, 4, 5, 6]
+ };
+
+ convertColumnXYZ(trace, xa, ya);
+ expect(trace.x).toEqual([1, 2]);
+ expect(trace.y).toEqual([1, 2, 3]);
+ expect(trace.z).toEqual([[1, 4], [2, 5], [3, 6]]);
+ });
+
+ it(
+ "should convert x/y/z columns to z(x,y) with uneven dimensions",
+ function() {
+ trace = {
+ x: [1, 1, 2, 2, 2, 2, 2, 2, 3, 3, 3],
+ y: [1, 2, 1, 2, 3],
+ z: [1, 2, 4, 5, 6]
+ };
+
+ convertColumnXYZ(trace, xa, ya);
+ expect(trace.x).toEqual([1, 2]);
+ expect(trace.y).toEqual([1, 2, 3]);
+ expect(trace.z).toEqual([[1, 4], [2, 5], [, 6]]);
}
-
- var xa = makeMockAxis(),
- ya = makeMockAxis();
-
- it('should convert x/y/z columns to z(x,y)', function() {
- trace = {
- x: [1, 1, 1, 2, 2, 2],
- y: [1, 2, 3, 1, 2, 3],
- z: [1, 2, 3, 4, 5, 6]
- };
-
- convertColumnXYZ(trace, xa, ya);
- expect(trace.x).toEqual([1, 2]);
- expect(trace.y).toEqual([1, 2, 3]);
- expect(trace.z).toEqual([[1, 4], [2, 5], [3, 6]]);
- });
-
- it('should convert x/y/z columns to z(x,y) with uneven dimensions', function() {
- trace = {
- x: [1, 1, 2, 2, 2, 2, 2, 2, 3, 3, 3],
- y: [1, 2, 1, 2, 3],
- z: [1, 2, 4, 5, 6]
- };
-
- convertColumnXYZ(trace, xa, ya);
- expect(trace.x).toEqual([1, 2]);
- expect(trace.y).toEqual([1, 2, 3]);
- expect(trace.z).toEqual([[1, 4], [2, 5], [, 6]]);
- });
-
- it('should convert x/y/z columns to z(x,y) with missing values', function() {
- trace = {
- x: [1, 1, 2, 2, 2],
- y: [1, 2, 1, 2, 3],
- z: [1, null, 4, 5, 6]
- };
-
- convertColumnXYZ(trace, xa, ya);
- expect(trace.x).toEqual([1, 2]);
- expect(trace.y).toEqual([1, 2, 3]);
- expect(trace.z).toEqual([[1, 4], [null, 5], [, 6]]);
- });
-
- it('should convert x/y/z/text columns to z(x,y) and text(x,y)', function() {
- trace = {
- x: [1, 1, 1, 2, 2, 2],
- y: [1, 2, 3, 1, 2, 3],
- z: [1, 2, 3, 4, 5, 6],
- text: ['a', 'b', 'c', 'd', 'e', 'f', 'g']
- };
-
- convertColumnXYZ(trace, xa, ya);
- expect(trace.text).toEqual([['a', 'd'], ['b', 'e'], ['c', 'f']]);
- });
-
- it('should convert x/y/z columns to z(x,y) with out-of-order data', function() {
- /* eslint no-sparse-arrays: 0*/
-
- trace = {
- x: [
- 50076, -42372, -19260, 3852, 26964, -65484, -42372, -19260,
- 3852, 26964, -88596, -65484, -42372, -19260, 3852, 26964, 50076, 73188,
- -65484, -42372, -19260, 3852, 26964, 50076, -42372, -19260, 3852, 26964,
- -88596, -65484, -42372, -19260, 3852, 26964, 50076, 73188, -88596, -65484,
- -42372, -19260, 3852, 26964, 50076, 73188
- ],
- y: [
- 51851.8, 77841.4, 77841.4, 77841.4, 77841.4, 51851.8, 51851.8, 51851.8,
- 51851.8, 51851.8, -26117, -26117, -26117, -26117, -26117, -26117, -26117, -26117,
- -52106.6, -52106.6, -52106.6, -52106.6, -52106.6, -52106.6, -78096.2, -78096.2,
- -78096.2, -78096.2, -127.4, -127.4, -127.4, -127.4, -127.4, -127.4, -127.4, -127.4,
- 25862.2, 25862.2, 25862.2, 25862.2, 25862.2, 25862.2, 25862.2, 25862.2
- ],
- z: [
- 4.361856, 4.234497, 4.321701, 4.450315, 4.416136, 4.210373,
- 4.32009, 4.246728, 4.293992, 4.316364, 3.908434, 4.433257, 4.364234, 4.308714, 4.275516,
- 4.126979, 4.296483, 4.320471, 4.339848, 4.39907, 4.345006, 4.315032, 4.295618, 4.262052,
- 4.154291, 4.404264, 4.33847, 4.270931, 4.032226, 4.381492, 4.328922, 4.24046, 4.349151,
- 4.202861, 4.256402, 4.28972, 3.956225, 4.337909, 4.31226, 4.259435, 4.146854, 4.235799,
- 4.238752, 4.299876
- ]
- };
-
- convertColumnXYZ(trace, xa, ya);
- expect(trace.x).toEqual(
- [-88596, -65484, -42372, -19260, 3852, 26964, 50076, 73188]);
- expect(trace.y).toEqual(
- [-78096.2, -52106.6, -26117, -127.4, 25862.2, 51851.8, 77841.4]);
- expect(trace.z).toEqual([
- [,, 4.154291, 4.404264, 4.33847, 4.270931,,, ],
- [, 4.339848, 4.39907, 4.345006, 4.315032, 4.295618, 4.262052,, ],
- [3.908434, 4.433257, 4.364234, 4.308714, 4.275516, 4.126979, 4.296483, 4.320471],
- [4.032226, 4.381492, 4.328922, 4.24046, 4.349151, 4.202861, 4.256402, 4.28972],
- [3.956225, 4.337909, 4.31226, 4.259435, 4.146854, 4.235799, 4.238752, 4.299876],
- [, 4.210373, 4.32009, 4.246728, 4.293992, 4.316364, 4.361856,, ],
- [,, 4.234497, 4.321701, 4.450315, 4.416136,,, ]
- ]);
- });
+ );
+
+ it("should convert x/y/z columns to z(x,y) with missing values", function() {
+ trace = {
+ x: [1, 1, 2, 2, 2],
+ y: [1, 2, 1, 2, 3],
+ z: [1, null, 4, 5, 6]
+ };
+
+ convertColumnXYZ(trace, xa, ya);
+ expect(trace.x).toEqual([1, 2]);
+ expect(trace.y).toEqual([1, 2, 3]);
+ expect(trace.z).toEqual([[1, 4], [null, 5], [, 6]]);
+ });
+
+ it("should convert x/y/z/text columns to z(x,y) and text(x,y)", function() {
+ trace = {
+ x: [1, 1, 1, 2, 2, 2],
+ y: [1, 2, 3, 1, 2, 3],
+ z: [1, 2, 3, 4, 5, 6],
+ text: ["a", "b", "c", "d", "e", "f", "g"]
+ };
+
+ convertColumnXYZ(trace, xa, ya);
+ expect(trace.text).toEqual([["a", "d"], ["b", "e"], ["c", "f"]]);
+ });
+
+ it(
+ "should convert x/y/z columns to z(x,y) with out-of-order data",
+ function() {
+ /* eslint no-sparse-arrays: 0 */
+ trace = {
+ x: [
+ 50076,
+ -42372,
+ -19260,
+ 3852,
+ 26964,
+ -65484,
+ -42372,
+ -19260,
+ 3852,
+ 26964,
+ -88596,
+ -65484,
+ -42372,
+ -19260,
+ 3852,
+ 26964,
+ 50076,
+ 73188,
+ -65484,
+ -42372,
+ -19260,
+ 3852,
+ 26964,
+ 50076,
+ -42372,
+ -19260,
+ 3852,
+ 26964,
+ -88596,
+ -65484,
+ -42372,
+ -19260,
+ 3852,
+ 26964,
+ 50076,
+ 73188,
+ -88596,
+ -65484,
+ -42372,
+ -19260,
+ 3852,
+ 26964,
+ 50076,
+ 73188
+ ],
+ y: [
+ 51851.8,
+ 77841.4,
+ 77841.4,
+ 77841.4,
+ 77841.4,
+ 51851.8,
+ 51851.8,
+ 51851.8,
+ 51851.8,
+ 51851.8,
+ -26117,
+ -26117,
+ -26117,
+ -26117,
+ -26117,
+ -26117,
+ -26117,
+ -26117,
+ -52106.6,
+ -52106.6,
+ -52106.6,
+ -52106.6,
+ -52106.6,
+ -52106.6,
+ -78096.2,
+ -78096.2,
+ -78096.2,
+ -78096.2,
+ -127.4,
+ -127.4,
+ -127.4,
+ -127.4,
+ -127.4,
+ -127.4,
+ -127.4,
+ -127.4,
+ 25862.2,
+ 25862.2,
+ 25862.2,
+ 25862.2,
+ 25862.2,
+ 25862.2,
+ 25862.2,
+ 25862.2
+ ],
+ z: [
+ 4.361856,
+ 4.234497,
+ 4.321701,
+ 4.450315,
+ 4.416136,
+ 4.210373,
+ 4.32009,
+ 4.246728,
+ 4.293992,
+ 4.316364,
+ 3.908434,
+ 4.433257,
+ 4.364234,
+ 4.308714,
+ 4.275516,
+ 4.126979,
+ 4.296483,
+ 4.320471,
+ 4.339848,
+ 4.39907,
+ 4.345006,
+ 4.315032,
+ 4.295618,
+ 4.262052,
+ 4.154291,
+ 4.404264,
+ 4.33847,
+ 4.270931,
+ 4.032226,
+ 4.381492,
+ 4.328922,
+ 4.24046,
+ 4.349151,
+ 4.202861,
+ 4.256402,
+ 4.28972,
+ 3.956225,
+ 4.337909,
+ 4.31226,
+ 4.259435,
+ 4.146854,
+ 4.235799,
+ 4.238752,
+ 4.299876
+ ]
+ };
+
+ convertColumnXYZ(trace, xa, ya);
+ expect(trace.x).toEqual([
+ -88596,
+ -65484,
+ -42372,
+ -19260,
+ 3852,
+ 26964,
+ 50076,
+ 73188
+ ]);
+ expect(trace.y).toEqual([
+ -78096.2,
+ -52106.6,
+ -26117,
+ -127.4,
+ 25862.2,
+ 51851.8,
+ 77841.4
+ ]);
+ expect(trace.z).toEqual([
+ [, , 4.154291, 4.404264, 4.33847, 4.270931, , ,],
+ [, 4.339848, 4.39907, 4.345006, 4.315032, 4.295618, 4.262052, ,],
+ [
+ 3.908434,
+ 4.433257,
+ 4.364234,
+ 4.308714,
+ 4.275516,
+ 4.126979,
+ 4.296483,
+ 4.320471
+ ],
+ [
+ 4.032226,
+ 4.381492,
+ 4.328922,
+ 4.24046,
+ 4.349151,
+ 4.202861,
+ 4.256402,
+ 4.28972
+ ],
+ [
+ 3.956225,
+ 4.337909,
+ 4.31226,
+ 4.259435,
+ 4.146854,
+ 4.235799,
+ 4.238752,
+ 4.299876
+ ],
+ [, 4.210373, 4.32009, 4.246728, 4.293992, 4.316364, 4.361856, ,],
+ [, , 4.234497, 4.321701, 4.450315, 4.416136, , ,]
+ ]);
+ }
+ );
});
-describe('heatmap calc', function() {
- 'use strict';
-
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
+describe("heatmap calc", function() {
+ "use strict";
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
+
+ function _calc(opts) {
+ var base = { type: "heatmap" },
+ trace = Lib.extendFlat({}, base, opts),
+ gd = { data: [trace] };
+
+ Plots.supplyDefaults(gd);
+ var fullTrace = gd._fullData[0];
+
+ return Heatmap.calc(gd, fullTrace)[0];
+ }
+
+ it("should fill in bricks if x/y not given", function() {
+ var out = _calc({ z: [[1, 2, 3], [3, 1, 2]] });
+
+ expect(out.x).toBeCloseToArray([-0.5, 0.5, 1.5, 2.5]);
+ expect(out.y).toBeCloseToArray([-0.5, 0.5, 1.5]);
+ expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
+ });
+
+ it("should fill in bricks with x0/dx + y0/dy", function() {
+ var out = _calc({
+ z: [[1, 2, 3], [3, 1, 2]],
+ x0: 10,
+ dx: 0.5,
+ y0: -2,
+ dy: -2
});
- function _calc(opts) {
- var base = { type: 'heatmap' },
- trace = Lib.extendFlat({}, base, opts),
- gd = { data: [trace] };
-
- Plots.supplyDefaults(gd);
- var fullTrace = gd._fullData[0];
-
- return Heatmap.calc(gd, fullTrace)[0];
- }
+ expect(out.x).toBeCloseToArray([9.75, 10.25, 10.75, 11.25]);
+ expect(out.y).toBeCloseToArray([-1, -3, -5]);
+ expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
+ });
- it('should fill in bricks if x/y not given', function() {
- var out = _calc({
- z: [[1, 2, 3], [3, 1, 2]]
- });
-
- expect(out.x).toBeCloseToArray([-0.5, 0.5, 1.5, 2.5]);
- expect(out.y).toBeCloseToArray([-0.5, 0.5, 1.5]);
- expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
- });
-
- it('should fill in bricks with x0/dx + y0/dy', function() {
- var out = _calc({
- z: [[1, 2, 3], [3, 1, 2]],
- x0: 10,
- dx: 0.5,
- y0: -2,
- dy: -2
- });
-
- expect(out.x).toBeCloseToArray([9.75, 10.25, 10.75, 11.25]);
- expect(out.y).toBeCloseToArray([-1, -3, -5]);
- expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
+ it("should convert x/y coordinates into bricks", function() {
+ var out = _calc({
+ x: [1, 2, 3],
+ y: [2, 6],
+ z: [[1, 2, 3], [3, 1, 2]]
});
- it('should convert x/y coordinates into bricks', function() {
- var out = _calc({
- x: [1, 2, 3],
- y: [2, 6],
- z: [[1, 2, 3], [3, 1, 2]]
- });
+ expect(out.x).toBeCloseToArray([0.5, 1.5, 2.5, 3.5]);
+ expect(out.y).toBeCloseToArray([0, 4, 8]);
+ expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
+ });
- expect(out.x).toBeCloseToArray([0.5, 1.5, 2.5, 3.5]);
- expect(out.y).toBeCloseToArray([0, 4, 8]);
- expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
+ it("should respect brick-link /y coordinates", function() {
+ var out = _calc({
+ x: [1, 2, 3, 4],
+ y: [2, 6, 10],
+ z: [[1, 2, 3], [3, 1, 2]]
});
- it('should respect brick-link /y coordinates', function() {
- var out = _calc({
- x: [1, 2, 3, 4],
- y: [2, 6, 10],
- z: [[1, 2, 3], [3, 1, 2]]
- });
+ expect(out.x).toBeCloseToArray([1, 2, 3, 4]);
+ expect(out.y).toBeCloseToArray([2, 6, 10]);
+ expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
+ });
- expect(out.x).toBeCloseToArray([1, 2, 3, 4]);
- expect(out.y).toBeCloseToArray([2, 6, 10]);
- expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
- });
+ it("should handle 1-xy + 1-brick case", function() {
+ var out = _calc({ x: [2], y: [3], z: [[1]] });
- it('should handle 1-xy + 1-brick case', function() {
- var out = _calc({
- x: [2],
- y: [3],
- z: [[1]]
- });
+ expect(out.x).toBeCloseToArray([1.5, 2.5]);
+ expect(out.y).toBeCloseToArray([2.5, 3.5]);
+ expect(out.z).toBeCloseTo2DArray([[1]]);
+ });
- expect(out.x).toBeCloseToArray([1.5, 2.5]);
- expect(out.y).toBeCloseToArray([2.5, 3.5]);
- expect(out.z).toBeCloseTo2DArray([[1]]);
- });
+ it("should handle 1-xy + multi-brick case", function() {
+ var out = _calc({ x: [2], y: [3], z: [[1, 2, 3], [3, 1, 2]] });
- it('should handle 1-xy + multi-brick case', function() {
- var out = _calc({
- x: [2],
- y: [3],
- z: [[1, 2, 3], [3, 1, 2]]
- });
+ expect(out.x).toBeCloseToArray([1.5, 2.5, 3.5, 4.5]);
+ expect(out.y).toBeCloseToArray([2.5, 3.5, 4.5]);
+ expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
+ });
- expect(out.x).toBeCloseToArray([1.5, 2.5, 3.5, 4.5]);
- expect(out.y).toBeCloseToArray([2.5, 3.5, 4.5]);
- expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
- });
+ it("should handle 0-xy + multi-brick case", function() {
+ var out = _calc({ x: [], y: [], z: [[1, 2, 3], [3, 1, 2]] });
- it('should handle 0-xy + multi-brick case', function() {
- var out = _calc({
- x: [],
- y: [],
- z: [[1, 2, 3], [3, 1, 2]]
- });
+ expect(out.x).toBeCloseToArray([-0.5, 0.5, 1.5, 2.5]);
+ expect(out.y).toBeCloseToArray([-0.5, 0.5, 1.5]);
+ expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
+ });
- expect(out.x).toBeCloseToArray([-0.5, 0.5, 1.5, 2.5]);
- expect(out.y).toBeCloseToArray([-0.5, 0.5, 1.5]);
- expect(out.z).toBeCloseTo2DArray([[1, 2, 3], [3, 1, 2]]);
+ it("should handle the category case", function() {
+ var out = _calc({
+ x: ["a", "b", "c"],
+ y: ["z"],
+ z: [[17, 18, 19]]
});
- it('should handle the category case', function() {
- var out = _calc({
- x: ['a', 'b', 'c'],
- y: ['z'],
- z: [[17, 18, 19]]
- });
-
- expect(out.x).toBeCloseToArray([-0.5, 0.5, 1.5, 2.5]);
- expect(out.y).toBeCloseToArray([-0.5, 0.5]);
- expect(out.z).toBeCloseTo2DArray([[17, 18, 19]]);
- });
+ expect(out.x).toBeCloseToArray([-0.5, 0.5, 1.5, 2.5]);
+ expect(out.y).toBeCloseToArray([-0.5, 0.5]);
+ expect(out.z).toBeCloseTo2DArray([[17, 18, 19]]);
+ });
});
-describe('heatmap plot', function() {
- 'use strict';
+describe("heatmap plot", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
- afterEach(destroyGraphDiv);
+ it("should not draw traces that are off-screen", function(done) {
+ var mock = require("@mocks/heatmap_multi-trace.json"),
+ mockCopy = Lib.extendDeep({}, mock),
+ gd = createGraphDiv();
- it('should not draw traces that are off-screen', function(done) {
- var mock = require('@mocks/heatmap_multi-trace.json'),
- mockCopy = Lib.extendDeep({}, mock),
- gd = createGraphDiv();
+ function assertImageCnt(cnt) {
+ var images = d3.selectAll(".hm").select("image");
- function assertImageCnt(cnt) {
- var images = d3.selectAll('.hm').select('image');
+ expect(images.size()).toEqual(cnt);
+ }
- expect(images.size()).toEqual(cnt);
- }
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout)
+ .then(function() {
+ assertImageCnt(5);
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
- assertImageCnt(5);
+ return Plotly.relayout(gd, "xaxis.range", [2, 3]);
+ })
+ .then(function() {
+ assertImageCnt(2);
- return Plotly.relayout(gd, 'xaxis.range', [2, 3]);
- }).then(function() {
- assertImageCnt(2);
+ return Plotly.relayout(gd, "xaxis.autorange", true);
+ })
+ .then(function() {
+ assertImageCnt(5);
- return Plotly.relayout(gd, 'xaxis.autorange', true);
- }).then(function() {
- assertImageCnt(5);
+ done();
+ });
+ });
- done();
- });
- });
+ it("should be able to restyle", function(done) {
+ var mock = require("@mocks/13.json"),
+ mockCopy = Lib.extendDeep({}, mock),
+ gd = createGraphDiv();
- it('should be able to restyle', function(done) {
- var mock = require('@mocks/13.json'),
- mockCopy = Lib.extendDeep({}, mock),
- gd = createGraphDiv();
+ function getImageURL() {
+ return d3.select(".hm > image").attr("href");
+ }
- function getImageURL() {
- return d3.select('.hm > image').attr('href');
- }
+ var imageURLs = [];
- var imageURLs = [];
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout)
+ .then(function() {
+ imageURLs.push(getImageURL());
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
- imageURLs.push(getImageURL());
+ return Plotly.restyle(gd, "colorscale", "Greens");
+ })
+ .then(function() {
+ imageURLs.push(getImageURL());
- return Plotly.restyle(gd, 'colorscale', 'Greens');
- }).then(function() {
- imageURLs.push(getImageURL());
+ expect(imageURLs[0]).not.toEqual(imageURLs[1]);
- expect(imageURLs[0]).not.toEqual(imageURLs[1]);
+ return Plotly.restyle(gd, "colorscale", "Reds");
+ })
+ .then(function() {
+ imageURLs.push(getImageURL());
- return Plotly.restyle(gd, 'colorscale', 'Reds');
- }).then(function() {
- imageURLs.push(getImageURL());
+ expect(imageURLs[1]).not.toEqual(imageURLs[2]);
- expect(imageURLs[1]).not.toEqual(imageURLs[2]);
+ return Plotly.restyle(gd, "colorscale", "Greens");
+ })
+ .then(function() {
+ imageURLs.push(getImageURL());
- return Plotly.restyle(gd, 'colorscale', 'Greens');
- }).then(function() {
- imageURLs.push(getImageURL());
+ expect(imageURLs[1]).toEqual(imageURLs[3]);
- expect(imageURLs[1]).toEqual(imageURLs[3]);
+ done();
+ });
+ });
- done();
- });
- });
+ it("draws canvas with correct margins", function(done) {
+ var mockWithPadding = require("@mocks/heatmap_brick_padding.json"),
+ mockWithoutPadding = Lib.extendDeep({}, mockWithPadding),
+ gd = createGraphDiv(),
+ getContextStub = { fillRect: jasmine.createSpy() },
+ originalCreateElement = document.createElement;
- it('draws canvas with correct margins', function(done) {
- var mockWithPadding = require('@mocks/heatmap_brick_padding.json'),
- mockWithoutPadding = Lib.extendDeep({}, mockWithPadding),
- gd = createGraphDiv(),
- getContextStub = {
- fillRect: jasmine.createSpy()
- },
- originalCreateElement = document.createElement;
-
- mockWithoutPadding.data[0].xgap = 0;
- mockWithoutPadding.data[0].ygap = 0;
-
- spyOn(document, 'createElement').and.callFake(function(elementType) {
- var element = originalCreateElement.call(document, elementType);
- if(elementType === 'canvas') {
- spyOn(element, 'getContext').and.returnValue(getContextStub);
- }
- return element;
- });
-
- var argumentsWithoutPadding = [],
- argumentsWithPadding = [];
- Plotly.plot(gd, mockWithoutPadding.data, mockWithoutPadding.layout).then(function() {
- argumentsWithoutPadding = getContextStub.fillRect.calls.allArgs().slice(0);
- return Plotly.plot(gd, mockWithPadding.data, mockWithPadding.layout);
- }).then(function() {
- var centerXGap = mockWithPadding.data[0].xgap / 3;
- var centerYGap = mockWithPadding.data[0].ygap / 3;
- var edgeXGap = mockWithPadding.data[0].xgap * 2 / 3;
- var edgeYGap = mockWithPadding.data[0].ygap * 2 / 3;
-
- argumentsWithPadding = getContextStub.fillRect.calls.allArgs().slice(getContextStub.fillRect.calls.allArgs().length - 9);
- expect(argumentsWithPadding).toEqual([
- [argumentsWithoutPadding[0][0],
- argumentsWithoutPadding[0][1] + edgeYGap,
- argumentsWithoutPadding[0][2] - edgeXGap,
- argumentsWithoutPadding[0][3] - edgeYGap],
- [argumentsWithoutPadding[1][0] + centerXGap,
- argumentsWithoutPadding[1][1] + edgeYGap,
- argumentsWithoutPadding[1][2] - edgeXGap,
- argumentsWithoutPadding[1][3] - edgeYGap],
- [argumentsWithoutPadding[2][0] + edgeXGap,
- argumentsWithoutPadding[2][1] + edgeYGap,
- argumentsWithoutPadding[2][2] - edgeXGap,
- argumentsWithoutPadding[2][3] - edgeYGap],
- [argumentsWithoutPadding[3][0],
- argumentsWithoutPadding[3][1] + centerYGap,
- argumentsWithoutPadding[3][2] - edgeXGap,
- argumentsWithoutPadding[3][3] - edgeYGap],
- [argumentsWithoutPadding[4][0] + centerXGap,
- argumentsWithoutPadding[4][1] + centerYGap,
- argumentsWithoutPadding[4][2] - edgeXGap,
- argumentsWithoutPadding[4][3] - edgeYGap],
- [argumentsWithoutPadding[5][0] + edgeXGap,
- argumentsWithoutPadding[5][1] + centerYGap,
- argumentsWithoutPadding[5][2] - edgeXGap,
- argumentsWithoutPadding[5][3] - edgeYGap],
- [argumentsWithoutPadding[6][0],
- argumentsWithoutPadding[6][1],
- argumentsWithoutPadding[6][2] - edgeXGap,
- argumentsWithoutPadding[6][3] - edgeYGap],
- [argumentsWithoutPadding[7][0] + centerXGap,
- argumentsWithoutPadding[7][1],
- argumentsWithoutPadding[7][2] - edgeXGap,
- argumentsWithoutPadding[7][3] - edgeYGap],
- [argumentsWithoutPadding[8][0] + edgeXGap,
- argumentsWithoutPadding[8][1],
- argumentsWithoutPadding[8][2] - edgeXGap,
- argumentsWithoutPadding[8][3] - edgeYGap
- ]]);
- done();
- });
- });
-});
+ mockWithoutPadding.data[0].xgap = 0;
+ mockWithoutPadding.data[0].ygap = 0;
-describe('heatmap hover', function() {
- 'use strict';
+ spyOn(document, "createElement").and.callFake(function(elementType) {
+ var element = originalCreateElement.call(document, elementType);
+ if (elementType === "canvas") {
+ spyOn(element, "getContext").and.returnValue(getContextStub);
+ }
+ return element;
+ });
- var gd;
+ var argumentsWithoutPadding = [], argumentsWithPadding = [];
+ Plotly.plot(gd, mockWithoutPadding.data, mockWithoutPadding.layout)
+ .then(function() {
+ argumentsWithoutPadding = getContextStub.fillRect.calls
+ .allArgs()
+ .slice(0);
+ return Plotly.plot(gd, mockWithPadding.data, mockWithPadding.layout);
+ })
+ .then(function() {
+ var centerXGap = mockWithPadding.data[0].xgap / 3;
+ var centerYGap = mockWithPadding.data[0].ygap / 3;
+ var edgeXGap = mockWithPadding.data[0].xgap * 2 / 3;
+ var edgeYGap = mockWithPadding.data[0].ygap * 2 / 3;
+
+ argumentsWithPadding = getContextStub.fillRect.calls
+ .allArgs()
+ .slice(getContextStub.fillRect.calls.allArgs().length - 9);
+ expect(argumentsWithPadding).toEqual([
+ [
+ argumentsWithoutPadding[0][0],
+ argumentsWithoutPadding[0][1] + edgeYGap,
+ argumentsWithoutPadding[0][2] - edgeXGap,
+ argumentsWithoutPadding[0][3] - edgeYGap
+ ],
+ [
+ argumentsWithoutPadding[1][0] + centerXGap,
+ argumentsWithoutPadding[1][1] + edgeYGap,
+ argumentsWithoutPadding[1][2] - edgeXGap,
+ argumentsWithoutPadding[1][3] - edgeYGap
+ ],
+ [
+ argumentsWithoutPadding[2][0] + edgeXGap,
+ argumentsWithoutPadding[2][1] + edgeYGap,
+ argumentsWithoutPadding[2][2] - edgeXGap,
+ argumentsWithoutPadding[2][3] - edgeYGap
+ ],
+ [
+ argumentsWithoutPadding[3][0],
+ argumentsWithoutPadding[3][1] + centerYGap,
+ argumentsWithoutPadding[3][2] - edgeXGap,
+ argumentsWithoutPadding[3][3] - edgeYGap
+ ],
+ [
+ argumentsWithoutPadding[4][0] + centerXGap,
+ argumentsWithoutPadding[4][1] + centerYGap,
+ argumentsWithoutPadding[4][2] - edgeXGap,
+ argumentsWithoutPadding[4][3] - edgeYGap
+ ],
+ [
+ argumentsWithoutPadding[5][0] + edgeXGap,
+ argumentsWithoutPadding[5][1] + centerYGap,
+ argumentsWithoutPadding[5][2] - edgeXGap,
+ argumentsWithoutPadding[5][3] - edgeYGap
+ ],
+ [
+ argumentsWithoutPadding[6][0],
+ argumentsWithoutPadding[6][1],
+ argumentsWithoutPadding[6][2] - edgeXGap,
+ argumentsWithoutPadding[6][3] - edgeYGap
+ ],
+ [
+ argumentsWithoutPadding[7][0] + centerXGap,
+ argumentsWithoutPadding[7][1],
+ argumentsWithoutPadding[7][2] - edgeXGap,
+ argumentsWithoutPadding[7][3] - edgeYGap
+ ],
+ [
+ argumentsWithoutPadding[8][0] + edgeXGap,
+ argumentsWithoutPadding[8][1],
+ argumentsWithoutPadding[8][2] - edgeXGap,
+ argumentsWithoutPadding[8][3] - edgeYGap
+ ]
+ ]);
+ done();
+ });
+ });
+});
- beforeAll(function(done) {
- jasmine.addMatchers(customMatchers);
+describe("heatmap hover", function() {
+ "use strict";
+ var gd;
- gd = createGraphDiv();
+ beforeAll(function(done) {
+ jasmine.addMatchers(customMatchers);
- var mock = require('@mocks/heatmap_multi-trace.json'),
- mockCopy = Lib.extendDeep({}, mock);
+ gd = createGraphDiv();
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
- });
+ var mock = require("@mocks/heatmap_multi-trace.json"),
+ mockCopy = Lib.extendDeep({}, mock);
- afterAll(destroyGraphDiv);
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- function _hover(gd, xval, yval) {
- var fullLayout = gd._fullLayout,
- calcData = gd.calcdata,
- hoverData = [];
+ afterAll(destroyGraphDiv);
- for(var i = 0; i < calcData.length; i++) {
- var pointData = {
- index: false,
- distance: 20,
- cd: calcData[i],
- trace: calcData[i][0].trace,
- xa: fullLayout.xaxis,
- ya: fullLayout.yaxis
- };
+ function _hover(gd, xval, yval) {
+ var fullLayout = gd._fullLayout, calcData = gd.calcdata, hoverData = [];
- var hoverPoint = Heatmap.hoverPoints(pointData, xval, yval);
- if(hoverPoint) hoverData.push(hoverPoint[0]);
- }
+ for (var i = 0; i < calcData.length; i++) {
+ var pointData = {
+ index: false,
+ distance: 20,
+ cd: calcData[i],
+ trace: calcData[i][0].trace,
+ xa: fullLayout.xaxis,
+ ya: fullLayout.yaxis
+ };
- return hoverData;
+ var hoverPoint = Heatmap.hoverPoints(pointData, xval, yval);
+ if (hoverPoint) hoverData.push(hoverPoint[0]);
}
- function assertLabels(hoverPoint, xLabel, yLabel, zLabel) {
- expect(hoverPoint.xLabelVal).toEqual(xLabel, 'have correct x label');
- expect(hoverPoint.yLabelVal).toEqual(yLabel, 'have correct y label');
- expect(hoverPoint.zLabelVal).toEqual(zLabel, 'have correct z label');
- }
+ return hoverData;
+ }
- it('should find closest point (case 1) and should', function() {
- var pt = _hover(gd, 0.5, 0.5)[0];
+ function assertLabels(hoverPoint, xLabel, yLabel, zLabel) {
+ expect(hoverPoint.xLabelVal).toEqual(xLabel, "have correct x label");
+ expect(hoverPoint.yLabelVal).toEqual(yLabel, "have correct y label");
+ expect(hoverPoint.zLabelVal).toEqual(zLabel, "have correct z label");
+ }
- expect(pt.index).toEqual([1, 0], 'have correct index');
- assertLabels(pt, 1, 1, 4);
- });
+ it("should find closest point (case 1) and should", function() {
+ var pt = _hover(gd, 0.5, 0.5)[0];
- it('should find closest point (case 2) and should', function() {
- var pt = _hover(gd, 1.5, 0.5)[0];
+ expect(pt.index).toEqual([1, 0], "have correct index");
+ assertLabels(pt, 1, 1, 4);
+ });
- expect(pt.index).toEqual([0, 0], 'have correct index');
- assertLabels(pt, 2, 0.2, 6);
- });
+ it("should find closest point (case 2) and should", function() {
+ var pt = _hover(gd, 1.5, 0.5)[0];
+ expect(pt.index).toEqual([0, 0], "have correct index");
+ assertLabels(pt, 2, 0.2, 6);
+ });
});
diff --git a/test/jasmine/tests/histogram2d_test.js b/test/jasmine/tests/histogram2d_test.js
index e6e421fad84..d99128128b5 100644
--- a/test/jasmine/tests/histogram2d_test.js
+++ b/test/jasmine/tests/histogram2d_test.js
@@ -1,135 +1,121 @@
-var Plots = require('@src/plots/plots');
-var Lib = require('@src/lib');
-
-var supplyDefaults = require('@src/traces/histogram2d/defaults');
-var calc = require('@src/traces/histogram2d/calc');
-
-
-describe('Test histogram2d', function() {
- 'use strict';
-
- describe('supplyDefaults', function() {
- var traceIn,
- traceOut;
-
- beforeEach(function() {
- traceOut = {};
- });
-
- it('should set zsmooth to false when zsmooth is empty', function() {
- traceIn = {};
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.zsmooth).toBe(false);
- });
-
- it('doesnt step on zsmooth when zsmooth is set', function() {
- traceIn = {
- zsmooth: 'fast'
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.zsmooth).toBe('fast');
- });
-
- it('should set xgap and ygap to 0 when xgap and ygap are empty', function() {
- traceIn = {};
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.xgap).toBe(0);
- expect(traceOut.ygap).toBe(0);
- });
-
- it('shouldnt step on xgap and ygap when xgap and ygap are set', function() {
- traceIn = {
- xgap: 10,
- ygap: 5
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.xgap).toBe(10);
- expect(traceOut.ygap).toBe(5);
- });
-
- it('shouldnt coerce gap when zsmooth is set', function() {
- traceIn = {
- xgap: 10,
- ygap: 5,
- zsmooth: 'best'
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.xgap).toBe(undefined);
- expect(traceOut.ygap).toBe(undefined);
- });
-
-
- it('should inherit layout.calendar', function() {
- traceIn = {
- x: [1, 2, 3],
- y: [1, 2, 3]
- };
- supplyDefaults(traceIn, traceOut, '', {calendar: 'islamic'});
-
- // we always fill calendar attributes, because it's hard to tell if
- // we're on a date axis at this point.
- expect(traceOut.xcalendar).toBe('islamic');
- expect(traceOut.ycalendar).toBe('islamic');
- });
-
- it('should take its own calendars', function() {
- traceIn = {
- x: [1, 2, 3],
- y: [1, 2, 3],
- xcalendar: 'coptic',
- ycalendar: 'ethiopian'
- };
- supplyDefaults(traceIn, traceOut, '', {calendar: 'islamic'});
-
- // we always fill calendar attributes, because it's hard to tell if
- // we're on a date axis at this point.
- expect(traceOut.xcalendar).toBe('coptic');
- expect(traceOut.ycalendar).toBe('ethiopian');
- });
+var Plots = require("@src/plots/plots");
+var Lib = require("@src/lib");
+
+var supplyDefaults = require("@src/traces/histogram2d/defaults");
+var calc = require("@src/traces/histogram2d/calc");
+
+describe("Test histogram2d", function() {
+ "use strict";
+ describe("supplyDefaults", function() {
+ var traceIn, traceOut;
+
+ beforeEach(function() {
+ traceOut = {};
+ });
+
+ it("should set zsmooth to false when zsmooth is empty", function() {
+ traceIn = {};
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.zsmooth).toBe(false);
+ });
+
+ it("doesnt step on zsmooth when zsmooth is set", function() {
+ traceIn = { zsmooth: "fast" };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.zsmooth).toBe("fast");
});
+ it(
+ "should set xgap and ygap to 0 when xgap and ygap are empty",
+ function() {
+ traceIn = {};
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.xgap).toBe(0);
+ expect(traceOut.ygap).toBe(0);
+ }
+ );
+
+ it("shouldnt step on xgap and ygap when xgap and ygap are set", function() {
+ traceIn = { xgap: 10, ygap: 5 };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.xgap).toBe(10);
+ expect(traceOut.ygap).toBe(5);
+ });
+
+ it("shouldnt coerce gap when zsmooth is set", function() {
+ traceIn = { xgap: 10, ygap: 5, zsmooth: "best" };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.xgap).toBe(undefined);
+ expect(traceOut.ygap).toBe(undefined);
+ });
+
+ it("should inherit layout.calendar", function() {
+ traceIn = { x: [1, 2, 3], y: [1, 2, 3] };
+ supplyDefaults(traceIn, traceOut, "", { calendar: "islamic" });
- describe('calc', function() {
- function _calc(opts) {
- var base = { type: 'histogram2d' },
- trace = Lib.extendFlat({}, base, opts),
- gd = { data: [trace] };
-
- Plots.supplyDefaults(gd);
- var fullTrace = gd._fullData[0];
-
- var out = calc(gd, fullTrace);
- delete out.trace;
- return out;
- }
-
- // remove tzJan/tzJuly when we move to UTC
- var oneDay = 24 * 3600000;
-
- it('should handle both uniform and nonuniform date bins', function() {
- var out = _calc({
- x: ['1970-01-01', '1970-01-01', '1970-01-02', '1970-01-04'],
- nbinsx: 4,
- y: ['1970-01-01', '1970-01-01', '1971-01-01', '1973-01-01'],
- nbinsy: 4
- });
-
- expect(out.x0).toBe('1970-01-01');
- expect(out.dx).toBe(oneDay);
-
- // TODO: even though the binning is done on non-uniform bins,
- // the display makes them linear (using only y0 and dy)
- // Can we also make it display the bins with nonuniform size?
- // see https://github.com/plotly/plotly.js/issues/360
- expect(out.y0).toBe('1970-01-01 03:00');
- expect(out.dy).toBe(365.25 * oneDay);
-
- expect(out.z).toEqual([
- [2, 0, 0, 0],
- [0, 1, 0, 0],
- [0, 0, 0, 0],
- [0, 0, 0, 1]
- ]);
- });
+ // we always fill calendar attributes, because it's hard to tell if
+ // we're on a date axis at this point.
+ expect(traceOut.xcalendar).toBe("islamic");
+ expect(traceOut.ycalendar).toBe("islamic");
+ });
+
+ it("should take its own calendars", function() {
+ traceIn = {
+ x: [1, 2, 3],
+ y: [1, 2, 3],
+ xcalendar: "coptic",
+ ycalendar: "ethiopian"
+ };
+ supplyDefaults(traceIn, traceOut, "", { calendar: "islamic" });
+
+ // we always fill calendar attributes, because it's hard to tell if
+ // we're on a date axis at this point.
+ expect(traceOut.xcalendar).toBe("coptic");
+ expect(traceOut.ycalendar).toBe("ethiopian");
+ });
+ });
+
+ describe("calc", function() {
+ function _calc(opts) {
+ var base = { type: "histogram2d" },
+ trace = Lib.extendFlat({}, base, opts),
+ gd = { data: [trace] };
+
+ Plots.supplyDefaults(gd);
+ var fullTrace = gd._fullData[0];
+
+ var out = calc(gd, fullTrace);
+ delete out.trace;
+ return out;
+ }
+
+ // remove tzJan/tzJuly when we move to UTC
+ var oneDay = 24 * 3600000;
+
+ it("should handle both uniform and nonuniform date bins", function() {
+ var out = _calc({
+ x: ["1970-01-01", "1970-01-01", "1970-01-02", "1970-01-04"],
+ nbinsx: 4,
+ y: ["1970-01-01", "1970-01-01", "1971-01-01", "1973-01-01"],
+ nbinsy: 4
+ });
+
+ expect(out.x0).toBe("1970-01-01");
+ expect(out.dx).toBe(oneDay);
+
+ // TODO: even though the binning is done on non-uniform bins,
+ // the display makes them linear (using only y0 and dy)
+ // Can we also make it display the bins with nonuniform size?
+ // see https://github.com/plotly/plotly.js/issues/360
+ expect(out.y0).toBe("1970-01-01 03:00");
+ expect(out.dy).toBe(365.25 * oneDay);
+
+ expect(out.z).toEqual([
+ [2, 0, 0, 0],
+ [0, 1, 0, 0],
+ [0, 0, 0, 0],
+ [0, 0, 0, 1]
+ ]);
});
+ });
});
diff --git a/test/jasmine/tests/histogram_test.js b/test/jasmine/tests/histogram_test.js
index a9fed476675..0a9ac56bef3 100644
--- a/test/jasmine/tests/histogram_test.js
+++ b/test/jasmine/tests/histogram_test.js
@@ -1,355 +1,331 @@
-var Plots = require('@src/plots/plots');
-var Lib = require('@src/lib');
-
-var supplyDefaults = require('@src/traces/histogram/defaults');
-var calc = require('@src/traces/histogram/calc');
-
-
-describe('Test histogram', function() {
- 'use strict';
-
- describe('supplyDefaults', function() {
- var traceIn,
- traceOut;
-
- beforeEach(function() {
- traceOut = {};
- });
-
- it('should set visible to false when x or y is empty', function() {
- traceIn = {
- x: []
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.visible).toBe(false);
-
- traceIn = {
- y: []
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.visible).toBe(false);
- });
-
- it('should set visible to false when type is histogram2d and x or y are empty', function() {
- traceIn = {
- type: 'histogram2d',
- x: [],
- y: [1, 2, 2]
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.visible).toBe(false);
-
- traceIn = {
- type: 'histogram2d',
- x: [1, 2, 2],
- y: []
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.visible).toBe(false);
-
- traceIn = {
- type: 'histogram2d',
- x: [],
- y: []
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.visible).toBe(false);
-
- traceIn = {
- type: 'histogram2dcontour',
- x: [],
- y: [1, 2, 2]
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.visible).toBe(false);
- });
-
- it('should set orientation to v by default', function() {
- traceIn = {
- x: [1, 2, 2]
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.orientation).toBe('v');
-
- traceIn = {
- x: [1, 2, 2],
- y: [1, 2, 2]
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.orientation).toBe('v');
- });
-
- it('should set orientation to h when only y is supplied', function() {
- traceIn = {
- y: [1, 2, 2]
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.orientation).toBe('h');
-
- });
-
- // coercing bin attributes got moved to calc because it needs
- // axis type - so here we just test that it's NOT happening
-
- it('should not coerce autobinx regardless of xbins', function() {
- traceIn = {
- x: [1, 2, 2],
- xbins: {
- start: 1,
- end: 3,
- size: 1
- }
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.autobinx).toBeUndefined();
-
- traceIn = {
- x: [1, 2, 2]
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.autobinx).toBeUndefined();
- });
-
- it('should not coerce autobiny regardless of ybins', function() {
- traceIn = {
- y: [1, 2, 2],
- ybins: {
- start: 1,
- end: 3,
- size: 1
- }
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.autobiny).toBeUndefined();
-
- traceIn = {
- y: [1, 2, 2]
- };
- supplyDefaults(traceIn, traceOut, '', {});
- expect(traceOut.autobiny).toBeUndefined();
- });
-
- it('should inherit layout.calendar', function() {
- traceIn = {
- x: [1, 2, 3]
- };
- supplyDefaults(traceIn, traceOut, '', {calendar: 'islamic'});
-
- // we always fill calendar attributes, because it's hard to tell if
- // we're on a date axis at this point.
- // size axis calendar is weird, but *might* be able to happen if
- // we're using histfunc=min or max (does this work?)
- expect(traceOut.xcalendar).toBe('islamic');
- expect(traceOut.ycalendar).toBe('islamic');
- });
-
- it('should take its own calendars', function() {
- traceIn = {
- x: [1, 2, 3],
- xcalendar: 'coptic',
- ycalendar: 'nepali'
- };
- supplyDefaults(traceIn, traceOut, '', {calendar: 'islamic'});
-
- expect(traceOut.xcalendar).toBe('coptic');
- expect(traceOut.ycalendar).toBe('nepali');
- });
+var Plots = require("@src/plots/plots");
+var Lib = require("@src/lib");
+
+var supplyDefaults = require("@src/traces/histogram/defaults");
+var calc = require("@src/traces/histogram/calc");
+
+describe("Test histogram", function() {
+ "use strict";
+ describe("supplyDefaults", function() {
+ var traceIn, traceOut;
+
+ beforeEach(function() {
+ traceOut = {};
});
+ it("should set visible to false when x or y is empty", function() {
+ traceIn = { x: [] };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.visible).toBe(false);
- describe('calc', function() {
- function _calc(opts) {
- var base = { type: 'histogram' },
- trace = Lib.extendFlat({}, base, opts),
- gd = { data: [trace] };
+ traceIn = { y: [] };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.visible).toBe(false);
+ });
- Plots.supplyDefaults(gd);
- var fullTrace = gd._fullData[0];
+ it(
+ "should set visible to false when type is histogram2d and x or y are empty",
+ function() {
+ traceIn = { type: "histogram2d", x: [], y: [1, 2, 2] };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.visible).toBe(false);
+
+ traceIn = { type: "histogram2d", x: [1, 2, 2], y: [] };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.visible).toBe(false);
+
+ traceIn = { type: "histogram2d", x: [], y: [] };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.visible).toBe(false);
+
+ traceIn = { type: "histogram2dcontour", x: [], y: [1, 2, 2] };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.visible).toBe(false);
+ }
+ );
+
+ it("should set orientation to v by default", function() {
+ traceIn = { x: [1, 2, 2] };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.orientation).toBe("v");
+
+ traceIn = { x: [1, 2, 2], y: [1, 2, 2] };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.orientation).toBe("v");
+ });
- var out = calc(gd, fullTrace);
- delete out[0].trace;
- return out;
- }
+ it("should set orientation to h when only y is supplied", function() {
+ traceIn = { y: [1, 2, 2] };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.orientation).toBe("h");
+ });
- var oneDay = 24 * 3600000;
+ // coercing bin attributes got moved to calc because it needs
+ // axis type - so here we just test that it's NOT happening
+ it("should not coerce autobinx regardless of xbins", function() {
+ traceIn = { x: [1, 2, 2], xbins: { start: 1, end: 3, size: 1 } };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.autobinx).toBeUndefined();
- it('should handle auto dates with nonuniform (month) bins', function() {
- // All data on exact years: shift so bin center is an
- // exact year, except on leap years
- var out = _calc({
- x: ['1970-01-01', '1970-01-01', '1971-01-01', '1973-01-01'],
- nbinsx: 4
- });
+ traceIn = { x: [1, 2, 2] };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.autobinx).toBeUndefined();
+ });
- // TODO: this gives half-day gaps between all but the first two
- // bars. Now that we have explicit per-bar positioning, perhaps
- // we should fill the space, rather than insisting on equal-width
- // bars?
- expect(out).toEqual([
- // full calcdata has x and y too (and t in the first one),
- // but those come later from setPositions.
- {b: 0, p: Date.UTC(1970, 0, 1), s: 2},
- {b: 0, p: Date.UTC(1971, 0, 1), s: 1},
- {b: 0, p: Date.UTC(1972, 0, 1, 12), s: 0},
- {b: 0, p: Date.UTC(1973, 0, 1), s: 1}
- ]);
-
- // All data on exact months: shift so bin center is on (31-day months)
- // or in (shorter months) that month
- out = _calc({
- x: ['1970-01-01', '1970-01-01', '1970-02-01', '1970-04-01'],
- nbinsx: 4
- });
+ it("should not coerce autobiny regardless of ybins", function() {
+ traceIn = { y: [1, 2, 2], ybins: { start: 1, end: 3, size: 1 } };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.autobiny).toBeUndefined();
- expect(out).toEqual([
- {b: 0, p: Date.UTC(1970, 0, 1), s: 2},
- {b: 0, p: Date.UTC(1970, 1, 1), s: 1},
- {b: 0, p: Date.UTC(1970, 2, 2, 12), s: 0},
- {b: 0, p: Date.UTC(1970, 3, 1), s: 1}
- ]);
-
- // data on exact days: shift so each bin goes from noon to noon
- // even though this gives kind of odd bin centers since the bins
- // are months... but the important thing is it's unambiguous which
- // bin any given day is in.
- out = _calc({
- x: ['1970-01-02', '1970-01-31', '1970-02-13', '1970-04-19'],
- nbinsx: 4
- });
+ traceIn = { y: [1, 2, 2] };
+ supplyDefaults(traceIn, traceOut, "", {});
+ expect(traceOut.autobiny).toBeUndefined();
+ });
- expect(out).toEqual([
- // dec 31 12:00 -> jan 31 12:00, middle is jan 16
- {b: 0, p: Date.UTC(1970, 0, 16), s: 2},
- // jan 31 12:00 -> feb 28 12:00, middle is feb 14 12:00
- {b: 0, p: Date.UTC(1970, 1, 14, 12), s: 1},
- {b: 0, p: Date.UTC(1970, 2, 16), s: 0},
- {b: 0, p: Date.UTC(1970, 3, 15, 12), s: 1}
- ]);
- });
-
- it('should handle auto dates with uniform (day) bins', function() {
- var out = _calc({
- x: ['1970-01-01', '1970-01-01', '1970-01-02', '1970-01-04'],
- nbinsx: 4
- });
+ it("should inherit layout.calendar", function() {
+ traceIn = { x: [1, 2, 3] };
+ supplyDefaults(traceIn, traceOut, "", { calendar: "islamic" });
- var x0 = 0,
- x1 = x0 + oneDay,
- x2 = x1 + oneDay,
- x3 = x2 + oneDay;
-
- expect(out).toEqual([
- {b: 0, p: x0, s: 2},
- {b: 0, p: x1, s: 1},
- {b: 0, p: x2, s: 0},
- {b: 0, p: x3, s: 1}
- ]);
- });
-
- describe('cumulative distribution functions', function() {
- var base = {
- x: [0, 5, 10, 15, 5, 10, 15, 10, 15, 15],
- y: [2, 2, 2, 14, 6, 6, 6, 10, 10, 2]
- };
-
- it('makes the right base histogram', function() {
- var baseOut = _calc(base);
- expect(baseOut).toEqual([
- {b: 0, p: 2, s: 1},
- {b: 0, p: 7, s: 2},
- {b: 0, p: 12, s: 3},
- {b: 0, p: 17, s: 4},
- ]);
- });
+ // we always fill calendar attributes, because it's hard to tell if
+ // we're on a date axis at this point.
+ // size axis calendar is weird, but *might* be able to happen if
+ // we're using histfunc=min or max (does this work?)
+ expect(traceOut.xcalendar).toBe("islamic");
+ expect(traceOut.ycalendar).toBe("islamic");
+ });
+
+ it("should take its own calendars", function() {
+ traceIn = { x: [1, 2, 3], xcalendar: "coptic", ycalendar: "nepali" };
+ supplyDefaults(traceIn, traceOut, "", { calendar: "islamic" });
+
+ expect(traceOut.xcalendar).toBe("coptic");
+ expect(traceOut.ycalendar).toBe("nepali");
+ });
+ });
+
+ describe("calc", function() {
+ function _calc(opts) {
+ var base = { type: "histogram" },
+ trace = Lib.extendFlat({}, base, opts),
+ gd = { data: [trace] };
+
+ Plots.supplyDefaults(gd);
+ var fullTrace = gd._fullData[0];
+
+ var out = calc(gd, fullTrace);
+ delete out[0].trace;
+ return out;
+ }
+
+ var oneDay = 24 * 3600000;
+
+ it("should handle auto dates with nonuniform (month) bins", function() {
+ // All data on exact years: shift so bin center is an
+ // exact year, except on leap years
+ var out = _calc({
+ x: ["1970-01-01", "1970-01-01", "1971-01-01", "1973-01-01"],
+ nbinsx: 4
+ });
+
+ // TODO: this gives half-day gaps between all but the first two
+ // bars. Now that we have explicit per-bar positioning, perhaps
+ // we should fill the space, rather than insisting on equal-width
+ // bars?
+ expect(out).toEqual([
+ // full calcdata has x and y too (and t in the first one),
+ // but those come later from setPositions.
+ { b: 0, p: Date.UTC(1970, 0, 1), s: 2 },
+ { b: 0, p: Date.UTC(1971, 0, 1), s: 1 },
+ { b: 0, p: Date.UTC(1972, 0, 1, 12), s: 0 },
+ { b: 0, p: Date.UTC(1973, 0, 1), s: 1 }
+ ]);
+
+ // All data on exact months: shift so bin center is on (31-day months)
+ // or in (shorter months) that month
+ out = _calc({
+ x: ["1970-01-01", "1970-01-01", "1970-02-01", "1970-04-01"],
+ nbinsx: 4
+ });
+
+ expect(out).toEqual([
+ { b: 0, p: Date.UTC(1970, 0, 1), s: 2 },
+ { b: 0, p: Date.UTC(1970, 1, 1), s: 1 },
+ { b: 0, p: Date.UTC(1970, 2, 2, 12), s: 0 },
+ { b: 0, p: Date.UTC(1970, 3, 1), s: 1 }
+ ]);
+
+ // data on exact days: shift so each bin goes from noon to noon
+ // even though this gives kind of odd bin centers since the bins
+ // are months... but the important thing is it's unambiguous which
+ // bin any given day is in.
+ out = _calc({
+ x: ["1970-01-02", "1970-01-31", "1970-02-13", "1970-04-19"],
+ nbinsx: 4
+ });
+
+ expect(out).toEqual([
+ // dec 31 12:00 -> jan 31 12:00, middle is jan 16
+ { b: 0, p: Date.UTC(1970, 0, 16), s: 2 },
+ // jan 31 12:00 -> feb 28 12:00, middle is feb 14 12:00
+ { b: 0, p: Date.UTC(1970, 1, 14, 12), s: 1 },
+ { b: 0, p: Date.UTC(1970, 2, 16), s: 0 },
+ { b: 0, p: Date.UTC(1970, 3, 15, 12), s: 1 }
+ ]);
+ });
- var CDFs = [
- {p: [2, 7, 12, 17], s: [1, 3, 6, 10]},
- {
- direction: 'decreasing',
- p: [2, 7, 12, 17], s: [10, 9, 7, 4]
- },
- {
- currentbin: 'exclude',
- p: [7, 12, 17, 22], s: [1, 3, 6, 10]
- },
- {
- direction: 'decreasing', currentbin: 'exclude',
- p: [-3, 2, 7, 12], s: [10, 9, 7, 4]
- },
- {
- currentbin: 'half',
- p: [2, 7, 12, 17, 22], s: [0.5, 2, 4.5, 8, 10]
- },
- {
- direction: 'decreasing', currentbin: 'half',
- p: [-3, 2, 7, 12, 17], s: [10, 9.5, 8, 5.5, 2]
- },
- {
- direction: 'decreasing', currentbin: 'half', histnorm: 'percent',
- p: [-3, 2, 7, 12, 17], s: [100, 95, 80, 55, 20]
- },
- {
- currentbin: 'exclude', histnorm: 'probability',
- p: [7, 12, 17, 22], s: [0.1, 0.3, 0.6, 1]
- },
- {
- // behaves the same as without *density*
- direction: 'decreasing', currentbin: 'half', histnorm: 'density',
- p: [-3, 2, 7, 12, 17], s: [10, 9.5, 8, 5.5, 2]
- },
- {
- // behaves the same as without *density*, only *probability*
- direction: 'decreasing', currentbin: 'half', histnorm: 'probability density',
- p: [-3, 2, 7, 12, 17], s: [1, 0.95, 0.8, 0.55, 0.2]
- },
- {
- currentbin: 'half', histfunc: 'sum',
- p: [2, 7, 12, 17, 22], s: [1, 6, 19, 44, 60]
- },
- {
- currentbin: 'half', histfunc: 'sum', histnorm: 'probability',
- p: [2, 7, 12, 17, 22], s: [0.5 / 30, 0.1, 9.5 / 30, 22 / 30, 1]
- },
- {
- direction: 'decreasing', currentbin: 'half', histfunc: 'max', histnorm: 'percent',
- p: [-3, 2, 7, 12, 17], s: [100, 3100 / 32, 2700 / 32, 1900 / 32, 700 / 32]
- },
- {
- direction: 'decreasing', currentbin: 'half', histfunc: 'min', histnorm: 'density',
- p: [-3, 2, 7, 12, 17], s: [8, 7, 5, 3, 1]
- },
- {
- currentbin: 'exclude', histfunc: 'avg', histnorm: 'probability density',
- p: [7, 12, 17, 22], s: [0.1, 0.3, 0.6, 1]
- }
- ];
-
- CDFs.forEach(function(CDF) {
- var p = CDF.p,
- s = CDF.s;
-
- it('handles direction=' + CDF.direction + ', currentbin=' + CDF.currentbin +
- ', histnorm=' + CDF.histnorm + ', histfunc=' + CDF.histfunc, function() {
- var traceIn = Lib.extendFlat({}, base, {
- cumulative: {
- enabled: true,
- direction: CDF.direction,
- currentbin: CDF.currentbin
- },
- histnorm: CDF.histnorm,
- histfunc: CDF.histfunc
- });
- var out = _calc(traceIn);
-
- expect(out.length).toBe(p.length);
- out.forEach(function(outi, i) {
- expect(outi.p).toBe(p[i]);
- expect(outi.s).toBeCloseTo(s[i], 6);
- expect(outi.b).toBe(0);
- });
- });
+ it("should handle auto dates with uniform (day) bins", function() {
+ var out = _calc({
+ x: ["1970-01-01", "1970-01-01", "1970-01-02", "1970-01-04"],
+ nbinsx: 4
+ });
+
+ var x0 = 0, x1 = x0 + oneDay, x2 = x1 + oneDay, x3 = x2 + oneDay;
+
+ expect(out).toEqual([
+ { b: 0, p: x0, s: 2 },
+ { b: 0, p: x1, s: 1 },
+ { b: 0, p: x2, s: 0 },
+ { b: 0, p: x3, s: 1 }
+ ]);
+ });
+
+ describe("cumulative distribution functions", function() {
+ var base = {
+ x: [0, 5, 10, 15, 5, 10, 15, 10, 15, 15],
+ y: [2, 2, 2, 14, 6, 6, 6, 10, 10, 2]
+ };
+
+ it("makes the right base histogram", function() {
+ var baseOut = _calc(base);
+ expect(baseOut).toEqual([
+ { b: 0, p: 2, s: 1 },
+ { b: 0, p: 7, s: 2 },
+ { b: 0, p: 12, s: 3 },
+ { b: 0, p: 17, s: 4 }
+ ]);
+ });
+
+ var CDFs = [
+ { p: [2, 7, 12, 17], s: [1, 3, 6, 10] },
+ { direction: "decreasing", p: [2, 7, 12, 17], s: [10, 9, 7, 4] },
+ { currentbin: "exclude", p: [7, 12, 17, 22], s: [1, 3, 6, 10] },
+ {
+ direction: "decreasing",
+ currentbin: "exclude",
+ p: [-3, 2, 7, 12],
+ s: [10, 9, 7, 4]
+ },
+ {
+ currentbin: "half",
+ p: [2, 7, 12, 17, 22],
+ s: [0.5, 2, 4.5, 8, 10]
+ },
+ {
+ direction: "decreasing",
+ currentbin: "half",
+ p: [-3, 2, 7, 12, 17],
+ s: [10, 9.5, 8, 5.5, 2]
+ },
+ {
+ direction: "decreasing",
+ currentbin: "half",
+ histnorm: "percent",
+ p: [-3, 2, 7, 12, 17],
+ s: [100, 95, 80, 55, 20]
+ },
+ {
+ currentbin: "exclude",
+ histnorm: "probability",
+ p: [7, 12, 17, 22],
+ s: [0.1, 0.3, 0.6, 1]
+ },
+ {
+ // behaves the same as without *density*
+ direction: "decreasing",
+ currentbin: "half",
+ histnorm: "density",
+ p: [-3, 2, 7, 12, 17],
+ s: [10, 9.5, 8, 5.5, 2]
+ },
+ {
+ // behaves the same as without *density*, only *probability*
+ direction: "decreasing",
+ currentbin: "half",
+ histnorm: "probability density",
+ p: [-3, 2, 7, 12, 17],
+ s: [1, 0.95, 0.8, 0.55, 0.2]
+ },
+ {
+ currentbin: "half",
+ histfunc: "sum",
+ p: [2, 7, 12, 17, 22],
+ s: [1, 6, 19, 44, 60]
+ },
+ {
+ currentbin: "half",
+ histfunc: "sum",
+ histnorm: "probability",
+ p: [2, 7, 12, 17, 22],
+ s: [0.5 / 30, 0.1, 9.5 / 30, 22 / 30, 1]
+ },
+ {
+ direction: "decreasing",
+ currentbin: "half",
+ histfunc: "max",
+ histnorm: "percent",
+ p: [-3, 2, 7, 12, 17],
+ s: [100, 3100 / 32, 2700 / 32, 1900 / 32, 700 / 32]
+ },
+ {
+ direction: "decreasing",
+ currentbin: "half",
+ histfunc: "min",
+ histnorm: "density",
+ p: [-3, 2, 7, 12, 17],
+ s: [8, 7, 5, 3, 1]
+ },
+ {
+ currentbin: "exclude",
+ histfunc: "avg",
+ histnorm: "probability density",
+ p: [7, 12, 17, 22],
+ s: [0.1, 0.3, 0.6, 1]
+ }
+ ];
+
+ CDFs.forEach(function(CDF) {
+ var p = CDF.p, s = CDF.s;
+
+ it(
+ "handles direction=" +
+ CDF.direction +
+ ", currentbin=" +
+ CDF.currentbin +
+ ", histnorm=" +
+ CDF.histnorm +
+ ", histfunc=" +
+ CDF.histfunc,
+ function() {
+ var traceIn = Lib.extendFlat({}, base, {
+ cumulative: {
+ enabled: true,
+ direction: CDF.direction,
+ currentbin: CDF.currentbin
+ },
+ histnorm: CDF.histnorm,
+ histfunc: CDF.histfunc
});
- });
+ var out = _calc(traceIn);
+ expect(out.length).toBe(p.length);
+ out.forEach(function(outi, i) {
+ expect(outi.p).toBe(p[i]);
+ expect(outi.s).toBeCloseTo(s[i], 6);
+ expect(outi.b).toBe(0);
+ });
+ }
+ );
+ });
});
+ });
});
diff --git a/test/jasmine/tests/hover_label_test.js b/test/jasmine/tests/hover_label_test.js
index 2e76a3ab0e5..6b61fc807de 100644
--- a/test/jasmine/tests/hover_label_test.js
+++ b/test/jasmine/tests/hover_label_test.js
@@ -1,813 +1,893 @@
-var d3 = require('d3');
+var d3 = require("d3");
-var Plotly = require('@lib/index');
-var Fx = require('@src/plots/cartesian/graph_interact');
-var constants = require('@src/plots/cartesian/constants');
-var Lib = require('@src/lib');
+var Plotly = require("@lib/index");
+var Fx = require("@src/plots/cartesian/graph_interact");
+var constants = require("@src/plots/cartesian/constants");
+var Lib = require("@src/lib");
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var mouseEvent = require('../assets/mouse_event');
-var click = require('../assets/click');
-var doubleClick = require('../assets/double_click');
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var mouseEvent = require("../assets/mouse_event");
+var click = require("../assets/click");
+var doubleClick = require("../assets/double_click");
-describe('hover info', function() {
- 'use strict';
+describe("hover info", function() {
+ "use strict";
+ var mock = require("@mocks/14.json"),
+ evt = { clientX: mock.layout.width / 2, clientY: mock.layout.height / 2 };
- var mock = require('@mocks/14.json'),
- evt = {
- clientX: mock.layout.width / 2,
- clientY: mock.layout.height / 2
- };
+ afterEach(destroyGraphDiv);
- afterEach(destroyGraphDiv);
+ describe("hover info", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- describe('hover info', function() {
- var mockCopy = Lib.extendDeep({}, mock);
-
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
-
- it('responds to hover', function() {
- var gd = document.getElementById('graph');
- Fx.hover('graph', evt, 'xy');
-
- var hoverTrace = gd._hoverdata[0];
-
- expect(hoverTrace.curveNumber).toEqual(0);
- expect(hoverTrace.pointNumber).toEqual(17);
- expect(hoverTrace.x).toEqual(0.388);
- expect(hoverTrace.y).toEqual(1);
-
- expect(d3.selectAll('g.axistext').size()).toEqual(1);
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
- expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388');
- expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('1');
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
});
- describe('hover info x', function() {
- var mockCopy = Lib.extendDeep({}, mock);
-
- mockCopy.data[0].hoverinfo = 'x';
+ it("responds to hover", function() {
+ var gd = document.getElementById("graph");
+ Fx.hover("graph", evt, "xy");
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
-
- it('responds to hover x', function() {
- var gd = document.getElementById('graph');
- Fx.hover('graph', evt, 'xy');
+ var hoverTrace = gd._hoverdata[0];
- var hoverTrace = gd._hoverdata[0];
+ expect(hoverTrace.curveNumber).toEqual(0);
+ expect(hoverTrace.pointNumber).toEqual(17);
+ expect(hoverTrace.x).toEqual(0.388);
+ expect(hoverTrace.y).toEqual(1);
- expect(hoverTrace.curveNumber).toEqual(0);
- expect(hoverTrace.pointNumber).toEqual(17);
- expect(hoverTrace.x).toEqual(0.388);
- expect(hoverTrace.y).toEqual(1);
-
- expect(d3.selectAll('g.axistext').size()).toEqual(1);
- expect(d3.selectAll('g.hovertext').size()).toEqual(0);
- expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388');
- });
+ expect(d3.selectAll("g.axistext").size()).toEqual(1);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
+ expect(d3.selectAll("g.axistext").select("text").html()).toEqual("0.388");
+ expect(d3.selectAll("g.hovertext").select("text").html()).toEqual("1");
});
+ });
- describe('hover info y', function() {
- var mockCopy = Lib.extendDeep({}, mock);
-
- mockCopy.data[0].hoverinfo = 'y';
-
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
-
- it('responds to hover y', function() {
- var gd = document.getElementById('graph');
- Fx.hover('graph', evt, 'xy');
+ describe("hover info x", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- var hoverTrace = gd._hoverdata[0];
+ mockCopy.data[0].hoverinfo = "x";
- expect(hoverTrace.curveNumber).toEqual(0);
- expect(hoverTrace.pointNumber).toEqual(17);
- expect(hoverTrace.x).toEqual(0.388);
- expect(hoverTrace.y).toEqual(1);
-
- expect(d3.selectAll('g.axistext').size()).toEqual(0);
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
- expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('1');
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
});
- describe('hover info text', function() {
- var mockCopy = Lib.extendDeep({}, mock);
-
- mockCopy.data[0].text = [];
- // we convert newlines to spaces
- // see https://github.com/plotly/plotly.js/issues/746
- mockCopy.data[0].text[17] = 'hover\ntext\n\rwith\r\nspaces\n\nnot\rnewlines';
- mockCopy.data[0].hoverinfo = 'text';
-
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
-
- it('responds to hover text', function() {
- var gd = document.getElementById('graph');
- Fx.hover('graph', evt, 'xy');
+ it("responds to hover x", function() {
+ var gd = document.getElementById("graph");
+ Fx.hover("graph", evt, "xy");
- var hoverTrace = gd._hoverdata[0];
+ var hoverTrace = gd._hoverdata[0];
- expect(hoverTrace.curveNumber).toEqual(0);
- expect(hoverTrace.pointNumber).toEqual(17);
- expect(hoverTrace.x).toEqual(0.388);
- expect(hoverTrace.y).toEqual(1);
+ expect(hoverTrace.curveNumber).toEqual(0);
+ expect(hoverTrace.pointNumber).toEqual(17);
+ expect(hoverTrace.x).toEqual(0.388);
+ expect(hoverTrace.y).toEqual(1);
- expect(d3.selectAll('g.axistext').size()).toEqual(0);
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
- expect(d3.selectAll('g.hovertext').select('text').html())
- .toEqual('hover text with spaces not newlines');
- });
+ expect(d3.selectAll("g.axistext").size()).toEqual(1);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(0);
+ expect(d3.selectAll("g.axistext").select("text").html()).toEqual("0.388");
});
+ });
- describe('hover info all', function() {
- var mockCopy = Lib.extendDeep({}, mock);
-
- mockCopy.data[0].text = [];
- mockCopy.data[0].text[17] = 'hover text';
- mockCopy.data[0].hoverinfo = 'all';
+ describe("hover info y", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
-
- it('responds to hover all', function() {
- var gd = document.getElementById('graph');
- Fx.hover('graph', evt, 'xy');
-
- var hoverTrace = gd._hoverdata[0];
-
- expect(hoverTrace.curveNumber).toEqual(0);
- expect(hoverTrace.pointNumber).toEqual(17);
- expect(hoverTrace.x).toEqual(0.388);
- expect(hoverTrace.y).toEqual(1);
+ mockCopy.data[0].hoverinfo = "y";
- expect(d3.selectAll('g.axistext').size()).toEqual(1);
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
- expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388');
- expect(d3.selectAll('g.hovertext').select('text').selectAll('tspan').size()).toEqual(2);
- expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][0].innerHTML).toEqual('1');
- expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][1].innerHTML).toEqual('hover text');
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
});
- describe('hover info with bad name', function() {
- var mockCopy = Lib.extendDeep({}, mock);
+ it("responds to hover y", function() {
+ var gd = document.getElementById("graph");
+ Fx.hover("graph", evt, "xy");
- mockCopy.data[0].text = [];
- mockCopy.data[0].text[17] = 'hover text';
- mockCopy.data[0].hoverinfo = 'all';
- mockCopy.data[0].name = '
';
- mockCopy.data.push({
- x: [0.002, 0.004],
- y: [12.5, 16.25],
- mode: 'lines+markers',
- name: 'another trace'
- });
+ var hoverTrace = gd._hoverdata[0];
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
+ expect(hoverTrace.curveNumber).toEqual(0);
+ expect(hoverTrace.pointNumber).toEqual(17);
+ expect(hoverTrace.x).toEqual(0.388);
+ expect(hoverTrace.y).toEqual(1);
- it('cleans the name', function() {
- var gd = document.getElementById('graph');
- Fx.hover('graph', evt, 'xy');
+ expect(d3.selectAll("g.axistext").size()).toEqual(0);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
+ expect(d3.selectAll("g.hovertext").select("text").html()).toEqual("1");
+ });
+ });
- var hoverTrace = gd._hoverdata[0];
+ describe("hover info text", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- expect(hoverTrace.curveNumber).toEqual(0);
- expect(hoverTrace.pointNumber).toEqual(17);
- expect(hoverTrace.x).toEqual(0.388);
- expect(hoverTrace.y).toEqual(1);
+ mockCopy.data[0].text = [];
+ // we convert newlines to spaces
+ // see https://github.com/plotly/plotly.js/issues/746
+ mockCopy.data[0].text[
+ 17
+ ] = "hover\ntext\n\rwith\r\nspaces\n\nnot\rnewlines";
+ mockCopy.data[0].hoverinfo = "text";
- expect(d3.selectAll('g.axistext').size()).toEqual(1);
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
- expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388');
- expect(d3.selectAll('g.hovertext').select('text.nums').selectAll('tspan').size()).toEqual(2);
- expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][0].innerHTML).toEqual('1');
- expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][1].innerHTML).toEqual('hover text');
- expect(d3.selectAll('g.hovertext').selectAll('text.name').node().innerHTML).toEqual('<img src=x o...');
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
});
- describe('hover info y+text', function() {
- var mockCopy = Lib.extendDeep({}, mock);
+ it("responds to hover text", function() {
+ var gd = document.getElementById("graph");
+ Fx.hover("graph", evt, "xy");
- mockCopy.data[0].text = [];
- mockCopy.data[0].text[17] = 'hover text';
- mockCopy.data[0].hoverinfo = 'y+text';
+ var hoverTrace = gd._hoverdata[0];
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
+ expect(hoverTrace.curveNumber).toEqual(0);
+ expect(hoverTrace.pointNumber).toEqual(17);
+ expect(hoverTrace.x).toEqual(0.388);
+ expect(hoverTrace.y).toEqual(1);
- it('responds to hover y+text', function() {
- var gd = document.getElementById('graph');
- Fx.hover('graph', evt, 'xy');
+ expect(d3.selectAll("g.axistext").size()).toEqual(0);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
+ expect(d3.selectAll("g.hovertext").select("text").html()).toEqual(
+ "hover text with spaces not newlines"
+ );
+ });
+ });
- var hoverTrace = gd._hoverdata[0];
+ describe("hover info all", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- expect(hoverTrace.curveNumber).toEqual(0);
- expect(hoverTrace.pointNumber).toEqual(17);
- expect(hoverTrace.x).toEqual(0.388);
- expect(hoverTrace.y).toEqual(1);
+ mockCopy.data[0].text = [];
+ mockCopy.data[0].text[17] = "hover text";
+ mockCopy.data[0].hoverinfo = "all";
- expect(d3.selectAll('g.axistext').size()).toEqual(0);
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
- expect(d3.selectAll('g.hovertext').selectAll('tspan').size()).toEqual(2);
- expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][0].innerHTML).toEqual('1');
- expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][1].innerHTML).toEqual('hover text');
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
});
- describe('hover info x+text', function() {
- var mockCopy = Lib.extendDeep({}, mock);
-
- mockCopy.data[0].text = [];
- mockCopy.data[0].text[17] = 'hover text';
- mockCopy.data[0].hoverinfo = 'x+text';
+ it("responds to hover all", function() {
+ var gd = document.getElementById("graph");
+ Fx.hover("graph", evt, "xy");
+
+ var hoverTrace = gd._hoverdata[0];
+
+ expect(hoverTrace.curveNumber).toEqual(0);
+ expect(hoverTrace.pointNumber).toEqual(17);
+ expect(hoverTrace.x).toEqual(0.388);
+ expect(hoverTrace.y).toEqual(1);
+
+ expect(d3.selectAll("g.axistext").size()).toEqual(1);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
+ expect(d3.selectAll("g.axistext").select("text").html()).toEqual("0.388");
+ expect(
+ d3.selectAll("g.hovertext").select("text").selectAll("tspan").size()
+ ).toEqual(2);
+ expect(
+ d3.selectAll("g.hovertext").selectAll("tspan")[0][0].innerHTML
+ ).toEqual("1");
+ expect(
+ d3.selectAll("g.hovertext").selectAll("tspan")[0][1].innerHTML
+ ).toEqual("hover text");
+ });
+ });
+
+ describe("hover info with bad name", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
+
+ mockCopy.data[0].text = [];
+ mockCopy.data[0].text[17] = "hover text";
+ mockCopy.data[0].hoverinfo = "all";
+ mockCopy.data[0].name = "
";
+ mockCopy.data.push({
+ x: [0.002, 0.004],
+ y: [12.5, 16.25],
+ mode: "lines+markers",
+ name: "another trace"
+ });
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
+ });
- it('responds to hover x+text', function() {
- var gd = document.getElementById('graph');
- Fx.hover('graph', evt, 'xy');
+ it("cleans the name", function() {
+ var gd = document.getElementById("graph");
+ Fx.hover("graph", evt, "xy");
+
+ var hoverTrace = gd._hoverdata[0];
+
+ expect(hoverTrace.curveNumber).toEqual(0);
+ expect(hoverTrace.pointNumber).toEqual(17);
+ expect(hoverTrace.x).toEqual(0.388);
+ expect(hoverTrace.y).toEqual(1);
+
+ expect(d3.selectAll("g.axistext").size()).toEqual(1);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
+ expect(d3.selectAll("g.axistext").select("text").html()).toEqual("0.388");
+ expect(
+ d3
+ .selectAll("g.hovertext")
+ .select("text.nums")
+ .selectAll("tspan")
+ .size()
+ ).toEqual(2);
+ expect(
+ d3.selectAll("g.hovertext").selectAll("tspan")[0][0].innerHTML
+ ).toEqual("1");
+ expect(
+ d3.selectAll("g.hovertext").selectAll("tspan")[0][1].innerHTML
+ ).toEqual("hover text");
+ expect(
+ d3.selectAll("g.hovertext").selectAll("text.name").node().innerHTML
+ ).toEqual("<img src=x o...");
+ });
+ });
- var hoverTrace = gd._hoverdata[0];
+ describe("hover info y+text", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- expect(hoverTrace.curveNumber).toEqual(0);
- expect(hoverTrace.pointNumber).toEqual(17);
- expect(hoverTrace.x).toEqual(0.388);
- expect(hoverTrace.y).toEqual(1);
+ mockCopy.data[0].text = [];
+ mockCopy.data[0].text[17] = "hover text";
+ mockCopy.data[0].hoverinfo = "y+text";
- expect(d3.selectAll('g.axistext').size()).toEqual(1);
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
- expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388');
- expect(d3.selectAll('g.hovertext').select('text').html()).toEqual('hover text');
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
});
- describe('hover error x text (log axis positive)', function() {
- var mockCopy = Lib.extendDeep({}, mock);
-
- mockCopy.data[0].error_x = { array: [] };
- mockCopy.data[0].error_x.array[17] = 1;
+ it("responds to hover y+text", function() {
+ var gd = document.getElementById("graph");
+ Fx.hover("graph", evt, "xy");
+
+ var hoverTrace = gd._hoverdata[0];
+
+ expect(hoverTrace.curveNumber).toEqual(0);
+ expect(hoverTrace.pointNumber).toEqual(17);
+ expect(hoverTrace.x).toEqual(0.388);
+ expect(hoverTrace.y).toEqual(1);
+
+ expect(d3.selectAll("g.axistext").size()).toEqual(0);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
+ expect(d3.selectAll("g.hovertext").selectAll("tspan").size()).toEqual(2);
+ expect(
+ d3.selectAll("g.hovertext").selectAll("tspan")[0][0].innerHTML
+ ).toEqual("1");
+ expect(
+ d3.selectAll("g.hovertext").selectAll("tspan")[0][1].innerHTML
+ ).toEqual("hover text");
+ });
+ });
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
+ describe("hover info x+text", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- it('responds to hover x+text', function() {
- Fx.hover('graph', evt, 'xy');
+ mockCopy.data[0].text = [];
+ mockCopy.data[0].text[17] = "hover text";
+ mockCopy.data[0].hoverinfo = "x+text";
- expect(d3.selectAll('g.axistext').size()).toEqual(1);
- expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388 ± 1');
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
});
- describe('hover error text (log axis 0)', function() {
- var mockCopy = Lib.extendDeep({}, mock);
-
- mockCopy.data[0].error_x = { array: [] };
- mockCopy.data[0].error_x.array[17] = 0;
+ it("responds to hover x+text", function() {
+ var gd = document.getElementById("graph");
+ Fx.hover("graph", evt, "xy");
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
+ var hoverTrace = gd._hoverdata[0];
- it('responds to hover x+text', function() {
- Fx.hover('graph', evt, 'xy');
+ expect(hoverTrace.curveNumber).toEqual(0);
+ expect(hoverTrace.pointNumber).toEqual(17);
+ expect(hoverTrace.x).toEqual(0.388);
+ expect(hoverTrace.y).toEqual(1);
- expect(d3.selectAll('g.axistext').size()).toEqual(1);
- expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388');
- });
+ expect(d3.selectAll("g.axistext").size()).toEqual(1);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
+ expect(d3.selectAll("g.axistext").select("text").html()).toEqual("0.388");
+ expect(d3.selectAll("g.hovertext").select("text").html()).toEqual(
+ "hover text"
+ );
});
+ });
- describe('hover error text (log axis negative)', function() {
- var mockCopy = Lib.extendDeep({}, mock);
-
- mockCopy.data[0].error_x = { array: [] };
- mockCopy.data[0].error_x.array[17] = -1;
-
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
+ describe("hover error x text (log axis positive)", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- it('responds to hover x+text', function() {
- Fx.hover('graph', evt, 'xy');
+ mockCopy.data[0].error_x = { array: [] };
+ mockCopy.data[0].error_x.array[17] = 1;
- expect(d3.selectAll('g.axistext').size()).toEqual(1);
- expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0.388');
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
});
- describe('hover info text with html', function() {
- var mockCopy = Lib.extendDeep({}, mock);
+ it("responds to hover x+text", function() {
+ Fx.hover("graph", evt, "xy");
- mockCopy.data[0].text = [];
- mockCopy.data[0].text[17] = 'hover
text';
- mockCopy.data[0].hoverinfo = 'text';
+ expect(d3.selectAll("g.axistext").size()).toEqual(1);
+ expect(d3.selectAll("g.axistext").select("text").html()).toEqual(
+ "0.388 \xB1 1"
+ );
+ });
+ });
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
+ describe("hover error text (log axis 0)", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- it('responds to hover text with html', function() {
- var gd = document.getElementById('graph');
- Fx.hover('graph', evt, 'xy');
+ mockCopy.data[0].error_x = { array: [] };
+ mockCopy.data[0].error_x.array[17] = 0;
- var hoverTrace = gd._hoverdata[0];
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
+ });
- expect(hoverTrace.curveNumber).toEqual(0);
- expect(hoverTrace.pointNumber).toEqual(17);
- expect(hoverTrace.x).toEqual(0.388);
- expect(hoverTrace.y).toEqual(1);
+ it("responds to hover x+text", function() {
+ Fx.hover("graph", evt, "xy");
- expect(d3.selectAll('g.axistext').size()).toEqual(0);
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
- expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][0].innerHTML).toEqual('hover');
- expect(d3.selectAll('g.hovertext').selectAll('tspan')[0][1].innerHTML).toEqual('text');
- expect(d3.selectAll('g.hovertext').select('text').selectAll('tspan').size()).toEqual(2);
- });
+ expect(d3.selectAll("g.axistext").size()).toEqual(1);
+ expect(d3.selectAll("g.axistext").select("text").html()).toEqual("0.388");
});
+ });
- describe('hover info skip', function() {
- var mockCopy = Lib.extendDeep({}, mock);
+ describe("hover error text (log axis negative)", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- mockCopy.data[0].hoverinfo = 'skip';
+ mockCopy.data[0].error_x = { array: [] };
+ mockCopy.data[0].error_x.array[17] = -1;
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
+ });
- it('does not hover if hover info is set to skip', function() {
- var gd = document.getElementById('graph');
- Fx.hover('graph', evt, 'xy');
+ it("responds to hover x+text", function() {
+ Fx.hover("graph", evt, "xy");
- expect(gd._hoverdata, undefined);
- });
+ expect(d3.selectAll("g.axistext").size()).toEqual(1);
+ expect(d3.selectAll("g.axistext").select("text").html()).toEqual("0.388");
});
+ });
- describe('hover info none', function() {
- var mockCopy = Lib.extendDeep({}, mock);
+ describe("hover info text with html", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- mockCopy.data[0].hoverinfo = 'none';
+ mockCopy.data[0].text = [];
+ mockCopy.data[0].text[17] = "hover
text";
+ mockCopy.data[0].hoverinfo = "text";
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
+ });
- it('does not render if hover is set to none', function() {
- var gd = document.getElementById('graph');
- Fx.hover('graph', evt, 'xy');
+ it("responds to hover text with html", function() {
+ var gd = document.getElementById("graph");
+ Fx.hover("graph", evt, "xy");
+
+ var hoverTrace = gd._hoverdata[0];
+
+ expect(hoverTrace.curveNumber).toEqual(0);
+ expect(hoverTrace.pointNumber).toEqual(17);
+ expect(hoverTrace.x).toEqual(0.388);
+ expect(hoverTrace.y).toEqual(1);
+
+ expect(d3.selectAll("g.axistext").size()).toEqual(0);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
+ expect(
+ d3.selectAll("g.hovertext").selectAll("tspan")[0][0].innerHTML
+ ).toEqual("hover");
+ expect(
+ d3.selectAll("g.hovertext").selectAll("tspan")[0][1].innerHTML
+ ).toEqual("text");
+ expect(
+ d3.selectAll("g.hovertext").select("text").selectAll("tspan").size()
+ ).toEqual(2);
+ });
+ });
- var hoverTrace = gd._hoverdata[0];
+ describe("hover info skip", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- expect(hoverTrace.curveNumber).toEqual(0);
- expect(hoverTrace.pointNumber).toEqual(17);
- expect(hoverTrace.x).toEqual(0.388);
- expect(hoverTrace.y).toEqual(1);
+ mockCopy.data[0].hoverinfo = "skip";
- expect(d3.selectAll('g.axistext').size()).toEqual(0);
- expect(d3.selectAll('g.hovertext').size()).toEqual(0);
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
});
- describe('\'closest\' hover info (superimposed case)', function() {
- var mockCopy = Lib.extendDeep({}, mock);
+ it("does not hover if hover info is set to skip", function() {
+ var gd = document.getElementById("graph");
+ Fx.hover("graph", evt, "xy");
- // superimposed traces
- mockCopy.data.push(Lib.extendDeep({}, mockCopy.data[0]));
- mockCopy.layout.hovermode = 'closest';
+ expect(gd._hoverdata, undefined);
+ });
+ });
- var gd;
+ describe("hover info none", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- beforeEach(function(done) {
- gd = createGraphDiv();
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
- });
+ mockCopy.data[0].hoverinfo = "none";
- it('render hover labels of the above trace', function() {
- Fx.hover('graph', evt, 'xy');
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mockCopy.data, mockCopy.layout).then(done);
+ });
- expect(gd._hoverdata.length).toEqual(1);
+ it("does not render if hover is set to none", function() {
+ var gd = document.getElementById("graph");
+ Fx.hover("graph", evt, "xy");
- var hoverTrace = gd._hoverdata[0];
+ var hoverTrace = gd._hoverdata[0];
- expect(hoverTrace.fullData.index).toEqual(1);
- expect(hoverTrace.curveNumber).toEqual(1);
- expect(hoverTrace.pointNumber).toEqual(16);
- expect(hoverTrace.x).toEqual(0.33);
- expect(hoverTrace.y).toEqual(1.25);
+ expect(hoverTrace.curveNumber).toEqual(0);
+ expect(hoverTrace.pointNumber).toEqual(17);
+ expect(hoverTrace.x).toEqual(0.388);
+ expect(hoverTrace.y).toEqual(1);
- expect(d3.selectAll('g.axistext').size()).toEqual(0);
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
+ expect(d3.selectAll("g.axistext").size()).toEqual(0);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(0);
+ });
+ });
- var expectations = ['PV learning ...', '(0.33, 1.25)'];
- d3.selectAll('g.hovertext').selectAll('text').each(function(_, i) {
- expect(d3.select(this).html()).toEqual(expectations[i]);
- });
- });
+ describe("'closest' hover info (superimposed case)", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- it('render only non-hoverinfo \'none\' hover labels', function(done) {
+ // superimposed traces
+ mockCopy.data.push(Lib.extendDeep({}, mockCopy.data[0]));
+ mockCopy.layout.hovermode = "closest";
- Plotly.restyle(gd, 'hoverinfo', ['none', 'name']).then(function() {
- Fx.hover('graph', evt, 'xy');
+ var gd;
- expect(gd._hoverdata.length).toEqual(1);
+ beforeEach(function(done) {
+ gd = createGraphDiv();
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- var hoverTrace = gd._hoverdata[0];
+ it("render hover labels of the above trace", function() {
+ Fx.hover("graph", evt, "xy");
- expect(hoverTrace.fullData.index).toEqual(1);
- expect(hoverTrace.curveNumber).toEqual(1);
- expect(hoverTrace.pointNumber).toEqual(16);
- expect(hoverTrace.x).toEqual(0.33);
- expect(hoverTrace.y).toEqual(1.25);
+ expect(gd._hoverdata.length).toEqual(1);
- expect(d3.selectAll('g.axistext').size()).toEqual(0);
- expect(d3.selectAll('g.hovertext').size()).toEqual(1);
+ var hoverTrace = gd._hoverdata[0];
- var text = d3.selectAll('g.hovertext').select('text');
- expect(text.size()).toEqual(1);
- expect(text.html()).toEqual('PV learning ...');
+ expect(hoverTrace.fullData.index).toEqual(1);
+ expect(hoverTrace.curveNumber).toEqual(1);
+ expect(hoverTrace.pointNumber).toEqual(16);
+ expect(hoverTrace.x).toEqual(0.33);
+ expect(hoverTrace.y).toEqual(1.25);
- done();
- });
+ expect(d3.selectAll("g.axistext").size()).toEqual(0);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
- });
+ var expectations = ["PV learning ...", "(0.33, 1.25)"];
+ d3.selectAll("g.hovertext").selectAll("text").each(function(_, i) {
+ expect(d3.select(this).html()).toEqual(expectations[i]);
+ });
});
- describe('hoverformat', function() {
+ it("render only non-hoverinfo 'none' hover labels", function(done) {
+ Plotly.restyle(gd, "hoverinfo", ["none", "name"]).then(function() {
+ Fx.hover("graph", evt, "xy");
- var data = [{
- x: [1, 2, 3],
- y: [0.12345, 0.23456, 0.34567]
- }],
- layout = {
- yaxis: { showticklabels: true, hoverformat: ',.2r' },
- width: 600,
- height: 400
- };
+ expect(gd._hoverdata.length).toEqual(1);
- beforeEach(function() {
- this.gd = createGraphDiv();
- });
-
- it('should display the correct format when ticklabels true', function() {
- Plotly.plot(this.gd, data, layout);
- mouseEvent('mousemove', 303, 213);
+ var hoverTrace = gd._hoverdata[0];
- var hovers = d3.selectAll('g.hovertext');
-
- expect(hovers.size()).toEqual(1);
- expect(hovers.select('text')[0][0].textContent).toEqual('0.23');
- });
+ expect(hoverTrace.fullData.index).toEqual(1);
+ expect(hoverTrace.curveNumber).toEqual(1);
+ expect(hoverTrace.pointNumber).toEqual(16);
+ expect(hoverTrace.x).toEqual(0.33);
+ expect(hoverTrace.y).toEqual(1.25);
- it('should display the correct format when ticklabels false', function() {
- layout.yaxis.showticklabels = false;
- Plotly.plot(this.gd, data, layout);
- mouseEvent('mousemove', 303, 213);
+ expect(d3.selectAll("g.axistext").size()).toEqual(0);
+ expect(d3.selectAll("g.hovertext").size()).toEqual(1);
- var hovers = d3.selectAll('g.hovertext');
+ var text = d3.selectAll("g.hovertext").select("text");
+ expect(text.size()).toEqual(1);
+ expect(text.html()).toEqual("PV learning ...");
- expect(hovers.size()).toEqual(1);
- expect(hovers.select('text')[0][0].textContent).toEqual('0.23');
- });
+ done();
+ });
+ });
+ });
+
+ describe("hoverformat", function() {
+ var data = [{ x: [1, 2, 3], y: [0.12345, 0.23456, 0.34567] }],
+ layout = {
+ yaxis: { showticklabels: true, hoverformat: ",.2r" },
+ width: 600,
+ height: 400
+ };
+
+ beforeEach(function() {
+ this.gd = createGraphDiv();
});
- describe('textmode', function() {
-
- var data = [{
- x: [1, 2, 3, 4],
- y: [2, 3, 4, 5],
- mode: 'text',
- hoverinfo: 'text',
- text: ['test', null, 42, undefined]
- }],
- layout = {
- width: 600,
- height: 400
- };
-
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), data, layout).then(done);
- });
-
- it('should show text labels', function() {
- mouseEvent('mousemove', 108, 303);
- var hovers = d3.selectAll('g.hovertext');
- expect(hovers.size()).toEqual(1);
- expect(hovers.select('text')[0][0].textContent).toEqual('test');
- });
-
- it('should show number labels', function() {
- mouseEvent('mousemove', 363, 173);
- var hovers = d3.selectAll('g.hovertext');
- expect(hovers.size()).toEqual(1);
- expect(hovers.select('text')[0][0].textContent).toEqual('42');
- });
+ it("should display the correct format when ticklabels true", function() {
+ Plotly.plot(this.gd, data, layout);
+ mouseEvent("mousemove", 303, 213);
- it('should not show null text labels', function() {
- mouseEvent('mousemove', 229, 239);
- var hovers = d3.selectAll('g.hovertext');
- expect(hovers.size()).toEqual(0);
- });
+ var hovers = d3.selectAll("g.hovertext");
- it('should not show undefined text labels', function() {
- mouseEvent('mousemove', 493, 108);
- var hovers = d3.selectAll('g.hovertext');
- expect(hovers.size()).toEqual(0);
- });
+ expect(hovers.size()).toEqual(1);
+ expect(hovers.select("text")[0][0].textContent).toEqual("0.23");
});
-});
-describe('hover info on stacked subplots', function() {
- 'use strict';
+ it("should display the correct format when ticklabels false", function() {
+ layout.yaxis.showticklabels = false;
+ Plotly.plot(this.gd, data, layout);
+ mouseEvent("mousemove", 303, 213);
- afterEach(destroyGraphDiv);
+ var hovers = d3.selectAll("g.hovertext");
- describe('hover info on stacked subplots with shared x-axis', function() {
- var mock = require('@mocks/stacked_coupled_subplots.json');
-
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mock.data, mock.layout).then(done);
- });
+ expect(hovers.size()).toEqual(1);
+ expect(hovers.select("text")[0][0].textContent).toEqual("0.23");
+ });
+ });
+
+ describe("textmode", function() {
+ var data = [
+ {
+ x: [1, 2, 3, 4],
+ y: [2, 3, 4, 5],
+ mode: "text",
+ hoverinfo: "text",
+ text: ["test", null, 42, undefined]
+ }
+ ],
+ layout = { width: 600, height: 400 };
+
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), data, layout).then(done);
+ });
- it('responds to hover', function() {
- var gd = document.getElementById('graph');
- Plotly.Fx.hover(gd, {xval: 3}, ['xy', 'xy2', 'xy3']);
-
- expect(gd._hoverdata.length).toEqual(2);
-
- expect(gd._hoverdata[0]).toEqual(jasmine.objectContaining(
- {
- curveNumber: 1,
- pointNumber: 1,
- x: 3,
- y: 110
- }));
-
- expect(gd._hoverdata[1]).toEqual(jasmine.objectContaining(
- {
- curveNumber: 2,
- pointNumber: 0,
- x: 3,
- y: 1000
- }));
-
- // There should be a single label on the x-axis with the shared x value, 3.
- expect(d3.selectAll('g.axistext').size()).toEqual(1);
- expect(d3.selectAll('g.axistext').select('text').html()).toEqual('3');
-
- // There should be two points being hovered over, in two different traces, one in each plot.
- expect(d3.selectAll('g.hovertext').size()).toEqual(2);
- var textNodes = d3.selectAll('g.hovertext').selectAll('text');
-
- expect(textNodes[0][0].innerHTML).toEqual('trace 1');
- expect(textNodes[0][1].innerHTML).toEqual('110');
- expect(textNodes[1][0].innerHTML).toEqual('trace 2');
- expect(textNodes[1][1].innerHTML).toEqual('1000');
- });
+ it("should show text labels", function() {
+ mouseEvent("mousemove", 108, 303);
+ var hovers = d3.selectAll("g.hovertext");
+ expect(hovers.size()).toEqual(1);
+ expect(hovers.select("text")[0][0].textContent).toEqual("test");
});
- describe('hover info on stacked subplots with shared y-axis', function() {
- var mock = require('@mocks/stacked_subplots_shared_yaxis.json');
+ it("should show number labels", function() {
+ mouseEvent("mousemove", 363, 173);
+ var hovers = d3.selectAll("g.hovertext");
+ expect(hovers.size()).toEqual(1);
+ expect(hovers.select("text")[0][0].textContent).toEqual("42");
+ });
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mock.data, mock.layout).then(done);
- });
+ it("should not show null text labels", function() {
+ mouseEvent("mousemove", 229, 239);
+ var hovers = d3.selectAll("g.hovertext");
+ expect(hovers.size()).toEqual(0);
+ });
- it('responds to hover', function() {
- var gd = document.getElementById('graph');
- Plotly.Fx.hover(gd, {yval: 0}, ['xy', 'x2y', 'x3y']);
-
- expect(gd._hoverdata.length).toEqual(3);
-
- expect(gd._hoverdata[0]).toEqual(jasmine.objectContaining(
- {
- curveNumber: 0,
- pointNumber: 0,
- x: 1,
- y: 0
- }));
-
- expect(gd._hoverdata[1]).toEqual(jasmine.objectContaining(
- {
- curveNumber: 1,
- pointNumber: 0,
- x: 2.1,
- y: 0
- }));
-
- expect(gd._hoverdata[2]).toEqual(jasmine.objectContaining(
- {
- curveNumber: 2,
- pointNumber: 0,
- x: 3,
- y: 0
- }));
-
- // There should be a single label on the y-axis with the shared y value, 0.
- expect(d3.selectAll('g.axistext').size()).toEqual(1);
- expect(d3.selectAll('g.axistext').select('text').html()).toEqual('0');
-
- // There should be three points being hovered over, in three different traces, one in each plot.
- expect(d3.selectAll('g.hovertext').size()).toEqual(3);
- var textNodes = d3.selectAll('g.hovertext').selectAll('text');
-
- expect(textNodes[0][0].innerHTML).toEqual('trace 0');
- expect(textNodes[0][1].innerHTML).toEqual('1');
- expect(textNodes[1][0].innerHTML).toEqual('trace 1');
- expect(textNodes[1][1].innerHTML).toEqual('2.1');
- expect(textNodes[2][0].innerHTML).toEqual('trace 2');
- expect(textNodes[2][1].innerHTML).toEqual('3');
- });
+ it("should not show undefined text labels", function() {
+ mouseEvent("mousemove", 493, 108);
+ var hovers = d3.selectAll("g.hovertext");
+ expect(hovers.size()).toEqual(0);
});
+ });
});
+describe("hover info on stacked subplots", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
-describe('hover info on overlaid subplots', function() {
- 'use strict';
+ describe("hover info on stacked subplots with shared x-axis", function() {
+ var mock = require("@mocks/stacked_coupled_subplots.json");
- afterEach(destroyGraphDiv);
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mock.data, mock.layout).then(done);
+ });
- it('should respond to hover', function(done) {
- var mock = require('@mocks/autorange-tozero-rangemode.json');
+ it("responds to hover", function() {
+ var gd = document.getElementById("graph");
+ Plotly.Fx.hover(gd, { xval: 3 }, ["xy", "xy2", "xy3"]);
- Plotly.plot(createGraphDiv(), mock.data, mock.layout).then(function() {
- mouseEvent('mousemove', 768, 345);
+ expect(gd._hoverdata.length).toEqual(2);
- var axisText = d3.selectAll('g.axistext'),
- hoverText = d3.selectAll('g.hovertext');
+ expect(gd._hoverdata[0]).toEqual(
+ jasmine.objectContaining({
+ curveNumber: 1,
+ pointNumber: 1,
+ x: 3,
+ y: 110
+ })
+ );
+
+ expect(gd._hoverdata[1]).toEqual(
+ jasmine.objectContaining({
+ curveNumber: 2,
+ pointNumber: 0,
+ x: 3,
+ y: 1000
+ })
+ );
- expect(axisText.size()).toEqual(1, 'with 1 label on axis');
- expect(hoverText.size()).toEqual(2, 'with 2 labels on the overlaid pts');
+ // There should be a single label on the x-axis with the shared x value, 3.
+ expect(d3.selectAll("g.axistext").size()).toEqual(1);
+ expect(d3.selectAll("g.axistext").select("text").html()).toEqual("3");
- expect(axisText.select('text').html()).toEqual('1', 'with correct axis label');
+ // There should be two points being hovered over, in two different traces, one in each plot.
+ expect(d3.selectAll("g.hovertext").size()).toEqual(2);
+ var textNodes = d3.selectAll("g.hovertext").selectAll("text");
- var textNodes = hoverText.selectAll('text');
+ expect(textNodes[0][0].innerHTML).toEqual("trace 1");
+ expect(textNodes[0][1].innerHTML).toEqual("110");
+ expect(textNodes[1][0].innerHTML).toEqual("trace 2");
+ expect(textNodes[1][1].innerHTML).toEqual("1000");
+ });
+ });
- expect(textNodes[0][0].innerHTML).toEqual('Take Rate', 'with correct hover labels');
- expect(textNodes[0][1].innerHTML).toEqual('0.35', 'with correct hover labels');
- expect(textNodes[1][0].innerHTML).toEqual('Revenue', 'with correct hover labels');
- expect(textNodes[1][1].innerHTML).toEqual('2,352.5', 'with correct hover labels');
+ describe("hover info on stacked subplots with shared y-axis", function() {
+ var mock = require("@mocks/stacked_subplots_shared_yaxis.json");
- }).then(done);
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mock.data, mock.layout).then(done);
});
-});
-describe('hover after resizing', function() {
- 'use strict';
+ it("responds to hover", function() {
+ var gd = document.getElementById("graph");
+ Plotly.Fx.hover(gd, { yval: 0 }, ["xy", "x2y", "x3y"]);
- afterEach(destroyGraphDiv);
+ expect(gd._hoverdata.length).toEqual(3);
- function _click(pos) {
- return new Promise(function(resolve) {
- click(pos[0], pos[1]);
-
- setTimeout(function() {
- resolve();
- }, constants.HOVERMINTIME);
- });
- }
+ expect(gd._hoverdata[0]).toEqual(
+ jasmine.objectContaining({ curveNumber: 0, pointNumber: 0, x: 1, y: 0 })
+ );
- function assertLabelCount(pos, cnt, msg) {
- return new Promise(function(resolve) {
- mouseEvent('mousemove', pos[0], pos[1]);
+ expect(gd._hoverdata[1]).toEqual(
+ jasmine.objectContaining({
+ curveNumber: 1,
+ pointNumber: 0,
+ x: 2.1,
+ y: 0
+ })
+ );
+
+ expect(gd._hoverdata[2]).toEqual(
+ jasmine.objectContaining({ curveNumber: 2, pointNumber: 0, x: 3, y: 0 })
+ );
+
+ // There should be a single label on the y-axis with the shared y value, 0.
+ expect(d3.selectAll("g.axistext").size()).toEqual(1);
+ expect(d3.selectAll("g.axistext").select("text").html()).toEqual("0");
+
+ // There should be three points being hovered over, in three different traces, one in each plot.
+ expect(d3.selectAll("g.hovertext").size()).toEqual(3);
+ var textNodes = d3.selectAll("g.hovertext").selectAll("text");
+
+ expect(textNodes[0][0].innerHTML).toEqual("trace 0");
+ expect(textNodes[0][1].innerHTML).toEqual("1");
+ expect(textNodes[1][0].innerHTML).toEqual("trace 1");
+ expect(textNodes[1][1].innerHTML).toEqual("2.1");
+ expect(textNodes[2][0].innerHTML).toEqual("trace 2");
+ expect(textNodes[2][1].innerHTML).toEqual("3");
+ });
+ });
+});
- setTimeout(function() {
- var hoverText = d3.selectAll('g.hovertext');
- expect(hoverText.size()).toEqual(cnt, msg);
+describe("hover info on overlaid subplots", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
+
+ it("should respond to hover", function(done) {
+ var mock = require("@mocks/autorange-tozero-rangemode.json");
+
+ Plotly.plot(createGraphDiv(), mock.data, mock.layout)
+ .then(function() {
+ mouseEvent("mousemove", 768, 345);
+
+ var axisText = d3.selectAll("g.axistext"),
+ hoverText = d3.selectAll("g.hovertext");
+
+ expect(axisText.size()).toEqual(1, "with 1 label on axis");
+ expect(hoverText.size()).toEqual(
+ 2,
+ "with 2 labels on the overlaid pts"
+ );
+
+ expect(axisText.select("text").html()).toEqual(
+ "1",
+ "with correct axis label"
+ );
+
+ var textNodes = hoverText.selectAll("text");
+
+ expect(textNodes[0][0].innerHTML).toEqual(
+ "Take Rate",
+ "with correct hover labels"
+ );
+ expect(textNodes[0][1].innerHTML).toEqual(
+ "0.35",
+ "with correct hover labels"
+ );
+ expect(textNodes[1][0].innerHTML).toEqual(
+ "Revenue",
+ "with correct hover labels"
+ );
+ expect(textNodes[1][1].innerHTML).toEqual(
+ "2,352.5",
+ "with correct hover labels"
+ );
+ })
+ .then(done);
+ });
+});
- resolve();
- }, constants.HOVERMINTIME);
- });
- }
+describe("hover after resizing", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
- it('should work', function(done) {
- var data = [{ y: [2, 1, 2] }],
- layout = { width: 600, height: 500 },
- gd = createGraphDiv();
+ function _click(pos) {
+ return new Promise(function(resolve) {
+ click(pos[0], pos[1]);
- var pos0 = [305, 403],
- pos1 = [401, 122];
+ setTimeout(
+ function() {
+ resolve();
+ },
+ constants.HOVERMINTIME
+ );
+ });
+ }
- Plotly.plot(gd, data, layout).then(function() {
+ function assertLabelCount(pos, cnt, msg) {
+ return new Promise(function(resolve) {
+ mouseEvent("mousemove", pos[0], pos[1]);
- // to test https://github.com/plotly/plotly.js/issues/1044
+ setTimeout(
+ function() {
+ var hoverText = d3.selectAll("g.hovertext");
+ expect(hoverText.size()).toEqual(cnt, msg);
- return _click(pos0);
- })
- .then(function() {
- return assertLabelCount(pos0, 1, 'before resize, showing pt label');
- })
- .then(function() {
- return assertLabelCount(pos1, 0, 'before resize, not showing blank spot');
- })
- .then(function() {
- return Plotly.relayout(gd, 'width', 500);
- })
- .then(function() {
- return assertLabelCount(pos0, 0, 'after resize, not showing blank spot');
- })
- .then(function() {
- return assertLabelCount(pos1, 1, 'after resize, showing pt label');
- })
- .then(function() {
- return Plotly.relayout(gd, 'width', 600);
- })
- .then(function() {
- return assertLabelCount(pos0, 1, 'back to initial, showing pt label');
- })
- .then(function() {
- return assertLabelCount(pos1, 0, 'back to initial, not showing blank spot');
- })
- .then(done);
+ resolve();
+ },
+ constants.HOVERMINTIME
+ );
});
+ }
+
+ it("should work", function(done) {
+ var data = [{ y: [2, 1, 2] }],
+ layout = { width: 600, height: 500 },
+ gd = createGraphDiv();
+
+ var pos0 = [305, 403], pos1 = [401, 122];
+
+ Plotly.plot(gd, data, layout)
+ .then(function() {
+ // to test https://github.com/plotly/plotly.js/issues/1044
+ return _click(pos0);
+ })
+ .then(function() {
+ return assertLabelCount(pos0, 1, "before resize, showing pt label");
+ })
+ .then(function() {
+ return assertLabelCount(
+ pos1,
+ 0,
+ "before resize, not showing blank spot"
+ );
+ })
+ .then(function() {
+ return Plotly.relayout(gd, "width", 500);
+ })
+ .then(function() {
+ return assertLabelCount(
+ pos0,
+ 0,
+ "after resize, not showing blank spot"
+ );
+ })
+ .then(function() {
+ return assertLabelCount(pos1, 1, "after resize, showing pt label");
+ })
+ .then(function() {
+ return Plotly.relayout(gd, "width", 600);
+ })
+ .then(function() {
+ return assertLabelCount(pos0, 1, "back to initial, showing pt label");
+ })
+ .then(function() {
+ return assertLabelCount(
+ pos1,
+ 0,
+ "back to initial, not showing blank spot"
+ );
+ })
+ .then(done);
+ });
});
-describe('hover on fill', function() {
- 'use strict';
-
- afterEach(destroyGraphDiv);
-
- function assertLabelsCorrect(mousePos, labelPos, labelText) {
- return new Promise(function(resolve) {
- mouseEvent('mousemove', mousePos[0], mousePos[1]);
-
- setTimeout(function() {
- var hoverText = d3.selectAll('g.hovertext');
- expect(hoverText.size()).toEqual(1);
- expect(hoverText.text()).toEqual(labelText);
-
- var transformParts = hoverText.attr('transform').split('(');
- expect(transformParts[0]).toEqual('translate');
- var transformCoords = transformParts[1].split(')')[0].split(',');
- expect(+transformCoords[0]).toBeCloseTo(labelPos[0], -1, labelText + ':x');
- expect(+transformCoords[1]).toBeCloseTo(labelPos[1], -1, labelText + ':y');
-
- resolve();
- }, constants.HOVERMINTIME);
- });
- }
-
- it('should always show one label in the right place', function(done) {
- var mock = Lib.extendDeep({}, require('@mocks/scatter_fill_self_next.json'));
- mock.data.forEach(function(trace) { trace.hoveron = 'fills'; });
-
- Plotly.plot(createGraphDiv(), mock.data, mock.layout).then(function() {
- return assertLabelsCorrect([242, 142], [252, 133.8], 'trace 2');
- }).then(function() {
- return assertLabelsCorrect([242, 292], [233, 210], 'trace 1');
- }).then(function() {
- return assertLabelsCorrect([147, 252], [158.925, 248.1], 'trace 0');
- }).then(done);
- });
-
- it('should work for scatterternary too', function(done) {
- var mock = Lib.extendDeep({}, require('@mocks/ternary_fill.json'));
- var gd = createGraphDiv();
-
- Plotly.plot(gd, mock.data, mock.layout).then(function() {
- // hover over a point when that's closest, even if you're over
- // a fill, because by default we have hoveron='points+fills'
- return assertLabelsCorrect([237, 150], [240.0, 144],
- 'trace 2Component A: 0.8Component B: 0.1Component C: 0.1');
- }).then(function() {
- // the rest are hovers over fills
- return assertLabelsCorrect([237, 170], [247.7, 166], 'trace 2');
- }).then(function() {
- return assertLabelsCorrect([237, 218], [266.75, 265], 'trace 1');
- }).then(function() {
- return assertLabelsCorrect([237, 240], [247.7, 254], 'trace 0');
- }).then(function() {
- // zoom in to test clipping of large out-of-viewport shapes
- return Plotly.relayout(gd, {
- 'ternary.aaxis.min': 0.5,
- 'ternary.baxis.min': 0.25
- });
- }).then(function() {
- // this particular one has a hover label disconnected from the shape itself
- // so if we ever fix this, the test will have to be fixed too.
- return assertLabelsCorrect([295, 218], [275.1, 166], 'trace 2');
- }).then(function() {
- // trigger an autoscale redraw, which goes through dragElement
- return doubleClick(237, 251);
- }).then(function() {
- // then make sure we can still select a *different* item afterward
- return assertLabelsCorrect([237, 218], [266.75, 265], 'trace 1');
- }).then(done);
+describe("hover on fill", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
+
+ function assertLabelsCorrect(mousePos, labelPos, labelText) {
+ return new Promise(function(resolve) {
+ mouseEvent("mousemove", mousePos[0], mousePos[1]);
+
+ setTimeout(
+ function() {
+ var hoverText = d3.selectAll("g.hovertext");
+ expect(hoverText.size()).toEqual(1);
+ expect(hoverText.text()).toEqual(labelText);
+
+ var transformParts = hoverText.attr("transform").split("(");
+ expect(transformParts[0]).toEqual("translate");
+ var transformCoords = transformParts[1].split(")")[0].split(",");
+ expect(+transformCoords[0]).toBeCloseTo(
+ labelPos[0],
+ -1,
+ labelText + ":x"
+ );
+ expect(+transformCoords[1]).toBeCloseTo(
+ labelPos[1],
+ -1,
+ labelText + ":y"
+ );
+
+ resolve();
+ },
+ constants.HOVERMINTIME
+ );
+ });
+ }
+
+ it("should always show one label in the right place", function(done) {
+ var mock = Lib.extendDeep(
+ {},
+ require("@mocks/scatter_fill_self_next.json")
+ );
+ mock.data.forEach(function(trace) {
+ trace.hoveron = "fills";
});
+
+ Plotly.plot(createGraphDiv(), mock.data, mock.layout)
+ .then(function() {
+ return assertLabelsCorrect([242, 142], [252, 133.8], "trace 2");
+ })
+ .then(function() {
+ return assertLabelsCorrect([242, 292], [233, 210], "trace 1");
+ })
+ .then(function() {
+ return assertLabelsCorrect([147, 252], [158.925, 248.1], "trace 0");
+ })
+ .then(done);
+ });
+
+ it("should work for scatterternary too", function(done) {
+ var mock = Lib.extendDeep({}, require("@mocks/ternary_fill.json"));
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, mock.data, mock.layout)
+ .then(function() {
+ // hover over a point when that's closest, even if you're over
+ // a fill, because by default we have hoveron='points+fills'
+ return assertLabelsCorrect(
+ [237, 150],
+ [240.0, 144],
+ "trace 2Component A: 0.8Component B: 0.1Component C: 0.1"
+ );
+ })
+ .then(function() {
+ // the rest are hovers over fills
+ return assertLabelsCorrect([237, 170], [247.7, 166], "trace 2");
+ })
+ .then(function() {
+ return assertLabelsCorrect([237, 218], [266.75, 265], "trace 1");
+ })
+ .then(function() {
+ return assertLabelsCorrect([237, 240], [247.7, 254], "trace 0");
+ })
+ .then(function() {
+ // zoom in to test clipping of large out-of-viewport shapes
+ return Plotly.relayout(gd, {
+ "ternary.aaxis.min": 0.5,
+ "ternary.baxis.min": 0.25
+ });
+ })
+ .then(function() {
+ // this particular one has a hover label disconnected from the shape itself
+ // so if we ever fix this, the test will have to be fixed too.
+ return assertLabelsCorrect([295, 218], [275.1, 166], "trace 2");
+ })
+ .then(function() {
+ // trigger an autoscale redraw, which goes through dragElement
+ return doubleClick(237, 251);
+ })
+ .then(function() {
+ // then make sure we can still select a *different* item afterward
+ return assertLabelsCorrect([237, 218], [266.75, 265], "trace 1");
+ })
+ .then(done);
+ });
});
diff --git a/test/jasmine/tests/hover_pie_test.js b/test/jasmine/tests/hover_pie_test.js
index 75610e36834..9d5fd8b2513 100644
--- a/test/jasmine/tests/hover_pie_test.js
+++ b/test/jasmine/tests/hover_pie_test.js
@@ -1,31 +1,29 @@
-var Plotly = require('@lib/index');
-var Lib = require('@src/lib');
+var Plotly = require("@lib/index");
+var Lib = require("@src/lib");
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var mouseEvent = require('../assets/mouse_event');
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var mouseEvent = require("../assets/mouse_event");
-describe('pie hovering', function() {
- var mock = require('@mocks/pie_simple.json');
+describe("pie hovering", function() {
+ var mock = require("@mocks/pie_simple.json");
- describe('event data', function() {
- var mockCopy = Lib.extendDeep({}, mock),
- width = mockCopy.layout.width,
- height = mockCopy.layout.height,
- gd;
+ describe("event data", function() {
+ var mockCopy = Lib.extendDeep({}, mock),
+ width = mockCopy.layout.width,
+ height = mockCopy.layout.height,
+ gd;
- beforeEach(function(done) {
- gd = createGraphDiv();
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- Plotly.plot(gd, mockCopy.data, mockCopy.layout)
- .then(done);
- });
-
- afterEach(destroyGraphDiv);
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- it('should contain the correct fields', function() {
+ afterEach(destroyGraphDiv);
- /*
+ it("should contain the correct fields", function() {
+ /*
* expected = [{
* v: 4,
* label: '3',
@@ -42,126 +40,141 @@ describe('pie hovering', function() {
* cyFinal: 160
* }];
*/
- var hoverData,
- unhoverData;
-
-
- gd.on('plotly_hover', function(data) {
- hoverData = data;
- });
-
- gd.on('plotly_unhover', function(data) {
- unhoverData = data;
- });
-
- mouseEvent('mouseover', width / 2 - 7, height / 2 - 7);
- mouseEvent('mouseout', width / 2 - 7, height / 2 - 7);
-
- expect(hoverData.points.length).toEqual(1);
- expect(unhoverData.points.length).toEqual(1);
-
- var fields = [
- 'v', 'label', 'color', 'i', 'hidden',
- 'text', 'px1', 'pxmid', 'midangle',
- 'px0', 'largeArc', 'cxFinal', 'cyFinal'
- ];
-
- expect(Object.keys(hoverData.points[0])).toEqual(fields);
- expect(hoverData.points[0].i).toEqual(3);
-
- expect(Object.keys(unhoverData.points[0])).toEqual(fields);
- expect(unhoverData.points[0].i).toEqual(3);
- });
-
- it('should fire hover event when moving from one slice to another', function(done) {
- var count = 0,
- hoverData = [];
-
- gd.on('plotly_hover', function(data) {
- count++;
- hoverData.push(data);
- });
-
- mouseEvent('mouseover', 173, 133);
- setTimeout(function() {
- mouseEvent('mouseover', 233, 193);
- expect(count).toEqual(2);
- expect(hoverData[0]).not.toEqual(hoverData[1]);
- done();
- }, 100);
- });
-
- it('should fire unhover event when the mouse moves off the graph', function(done) {
- var count = 0,
- unhoverData = [];
-
- gd.on('plotly_unhover', function(data) {
- count++;
- unhoverData.push(data);
- });
-
- mouseEvent('mouseover', 173, 133);
- mouseEvent('mouseout', 173, 133);
- setTimeout(function() {
- mouseEvent('mouseover', 233, 193);
- mouseEvent('mouseout', 233, 193);
- expect(count).toEqual(2);
- expect(unhoverData[0]).not.toEqual(unhoverData[1]);
- done();
- }, 100);
- });
+ var hoverData, unhoverData;
+
+ gd.on("plotly_hover", function(data) {
+ hoverData = data;
+ });
+
+ gd.on("plotly_unhover", function(data) {
+ unhoverData = data;
+ });
+
+ mouseEvent("mouseover", width / 2 - 7, height / 2 - 7);
+ mouseEvent("mouseout", width / 2 - 7, height / 2 - 7);
+
+ expect(hoverData.points.length).toEqual(1);
+ expect(unhoverData.points.length).toEqual(1);
+
+ var fields = [
+ "v",
+ "label",
+ "color",
+ "i",
+ "hidden",
+ "text",
+ "px1",
+ "pxmid",
+ "midangle",
+ "px0",
+ "largeArc",
+ "cxFinal",
+ "cyFinal"
+ ];
+
+ expect(Object.keys(hoverData.points[0])).toEqual(fields);
+ expect(hoverData.points[0].i).toEqual(3);
+
+ expect(Object.keys(unhoverData.points[0])).toEqual(fields);
+ expect(unhoverData.points[0].i).toEqual(3);
});
- describe('labels', function() {
-
- var gd,
- mockCopy;
+ it(
+ "should fire hover event when moving from one slice to another",
+ function(done) {
+ var count = 0, hoverData = [];
- beforeEach(function() {
- gd = createGraphDiv();
- mockCopy = Lib.extendDeep({}, mock);
+ gd.on("plotly_hover", function(data) {
+ count++;
+ hoverData.push(data);
});
- afterEach(destroyGraphDiv);
-
- it('should show the default selected values', function(done) {
+ mouseEvent("mouseover", 173, 133);
+ setTimeout(
+ function() {
+ mouseEvent("mouseover", 233, 193);
+ expect(count).toEqual(2);
+ expect(hoverData[0]).not.toEqual(hoverData[1]);
+ done();
+ },
+ 100
+ );
+ }
+ );
+
+ it("should fire unhover event when the mouse moves off the graph", function(
+ done
+ ) {
+ var count = 0, unhoverData = [];
+
+ gd.on("plotly_unhover", function(data) {
+ count++;
+ unhoverData.push(data);
+ });
+
+ mouseEvent("mouseover", 173, 133);
+ mouseEvent("mouseout", 173, 133);
+ setTimeout(
+ function() {
+ mouseEvent("mouseover", 233, 193);
+ mouseEvent("mouseout", 233, 193);
+ expect(count).toEqual(2);
+ expect(unhoverData[0]).not.toEqual(unhoverData[1]);
+ done();
+ },
+ 100
+ );
+ });
+ });
- var expected = ['4', '5', '33.3%'];
+ describe("labels", function() {
+ var gd, mockCopy;
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
+ beforeEach(function() {
+ gd = createGraphDiv();
+ mockCopy = Lib.extendDeep({}, mock);
+ });
- mouseEvent('mouseover', 223, 143);
+ afterEach(destroyGraphDiv);
- var labels = Plotly.d3.selectAll('.hovertext .nums .line');
+ it("should show the default selected values", function(done) {
+ var expected = ["4", "5", "33.3%"];
- expect(labels[0].length).toBe(3);
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout)
+ .then(function() {
+ mouseEvent("mouseover", 223, 143);
- labels.each(function(_, i) {
- expect(Plotly.d3.select(this).text()).toBe(expected[i]);
- });
- }).then(done);
- });
+ var labels = Plotly.d3.selectAll(".hovertext .nums .line");
- it('should show the correct separators for values', function(done) {
+ expect(labels[0].length).toBe(3);
- var expected = ['0', '12|345|678@91', '99@9%'];
+ labels.each(function(_, i) {
+ expect(Plotly.d3.select(this).text()).toBe(expected[i]);
+ });
+ })
+ .then(done);
+ });
- mockCopy.layout.separators = '@|';
- mockCopy.data[0].values[0] = 12345678.912;
- mockCopy.data[0].values[1] = 10000;
+ it("should show the correct separators for values", function(done) {
+ var expected = ["0", "12|345|678@91", "99@9%"];
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
+ mockCopy.layout.separators = "@|";
+ mockCopy.data[0].values[0] = 12345678.912;
+ mockCopy.data[0].values[1] = 10000;
- mouseEvent('mouseover', 223, 143);
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout)
+ .then(function() {
+ mouseEvent("mouseover", 223, 143);
- var labels = Plotly.d3.selectAll('.hovertext .nums .line');
+ var labels = Plotly.d3.selectAll(".hovertext .nums .line");
- expect(labels[0].length).toBe(3);
+ expect(labels[0].length).toBe(3);
- labels.each(function(_, i) {
- expect(Plotly.d3.select(this).text()).toBe(expected[i]);
- });
- }).then(done);
- });
+ labels.each(function(_, i) {
+ expect(Plotly.d3.select(this).text()).toBe(expected[i]);
+ });
+ })
+ .then(done);
});
+ });
});
diff --git a/test/jasmine/tests/is_array_test.js b/test/jasmine/tests/is_array_test.js
index bea361516db..1b7bc6612ed 100644
--- a/test/jasmine/tests/is_array_test.js
+++ b/test/jasmine/tests/is_array_test.js
@@ -1,47 +1,51 @@
-var Lib = require('@src/lib');
+var Lib = require("@src/lib");
-describe('isArray', function() {
- 'use strict';
+describe("isArray", function() {
+ "use strict";
+ var isArray = Lib.isArray;
- var isArray = Lib.isArray;
+ function A() {}
- function A() {}
+ var shouldPass = [
+ [],
+ new Array(10),
+ new Float32Array(1),
+ new Int32Array([1, 2, 3])
+ ];
- var shouldPass = [
- [],
- new Array(10),
- new Float32Array(1),
- new Int32Array([1, 2, 3])
- ];
+ var shouldFail = [
+ A,
+ new A(),
+ document,
+ window,
+ null,
+ undefined,
+ "string",
+ true,
+ false,
+ NaN,
+ Infinity,
+ /foo/,
+ "\n",
+ new Date(),
+ new RegExp("foo"),
+ new String("string")
+ ];
- var shouldFail = [
- A,
- new A(),
- document,
- window,
- null,
- undefined,
- 'string',
- true,
- false,
- NaN,
- Infinity,
- /foo/,
- '\n',
- new Date(),
- new RegExp('foo'),
- new String('string')
- ];
-
- shouldPass.forEach(function(obj) {
- it('treats ' + JSON.stringify(obj) + ' as an array', function() {
- expect(isArray(obj)).toBe(true);
- });
+ shouldPass.forEach(function(obj) {
+ it("treats " + JSON.stringify(obj) + " as an array", function() {
+ expect(isArray(obj)).toBe(true);
});
+ });
- shouldFail.forEach(function(obj) {
- it('treats ' + JSON.stringify(obj !== window ? obj : 'window') + ' as NOT an array', function() {
- expect(isArray(obj)).toBe(false);
- });
- });
+ shouldFail.forEach(function(obj) {
+ it(
+ "treats " +
+ JSON.stringify(obj !== window ? obj : "window") +
+ " as NOT an array",
+ function() {
+ expect(isArray(obj)).toBe(false);
+ }
+ );
+ });
});
diff --git a/test/jasmine/tests/is_plain_object_test.js b/test/jasmine/tests/is_plain_object_test.js
index cf2ba311f25..5f504c0bd22 100644
--- a/test/jasmine/tests/is_plain_object_test.js
+++ b/test/jasmine/tests/is_plain_object_test.js
@@ -1,48 +1,49 @@
-var Lib = require('@src/lib');
+var Lib = require("@src/lib");
-describe('isPlainObject', function() {
- 'use strict';
+describe("isPlainObject", function() {
+ "use strict";
+ var isPlainObject = Lib.isPlainObject;
- var isPlainObject = Lib.isPlainObject;
+ function A() {}
- function A() {}
+ var shouldPass = [{}, { a: "A", B: "b" }];
- var shouldPass = [
- {},
- {a: 'A', 'B': 'b'}
- ];
+ var shouldFail = [
+ A,
+ new A(),
+ document,
+ window,
+ null,
+ undefined,
+ [],
+ new Float32Array(1),
+ "string",
+ true,
+ false,
+ NaN,
+ Infinity,
+ /foo/,
+ "\n",
+ new Array(10),
+ new Date(),
+ new RegExp("foo"),
+ new String("string")
+ ];
- var shouldFail = [
- A,
- new A(),
- document,
- window,
- null,
- undefined,
- [],
- new Float32Array(1),
- 'string',
- true,
- false,
- NaN,
- Infinity,
- /foo/,
- '\n',
- new Array(10),
- new Date(),
- new RegExp('foo'),
- new String('string')
- ];
-
- shouldPass.forEach(function(obj) {
- it('treats ' + JSON.stringify(obj) + ' as a plain object', function() {
- expect(isPlainObject(obj)).toBe(true);
- });
+ shouldPass.forEach(function(obj) {
+ it("treats " + JSON.stringify(obj) + " as a plain object", function() {
+ expect(isPlainObject(obj)).toBe(true);
});
+ });
- shouldFail.forEach(function(obj) {
- it('treats ' + JSON.stringify(obj !== window ? obj : 'window') + ' as NOT a plain object', function() {
- expect(isPlainObject(obj)).toBe(false);
- });
- });
+ shouldFail.forEach(function(obj) {
+ it(
+ "treats " +
+ JSON.stringify(obj !== window ? obj : "window") +
+ " as NOT a plain object",
+ function() {
+ expect(isPlainObject(obj)).toBe(false);
+ }
+ );
+ });
});
diff --git a/test/jasmine/tests/layout_images_test.js b/test/jasmine/tests/layout_images_test.js
index 71d7c2c8692..24c80eb2770 100644
--- a/test/jasmine/tests/layout_images_test.js
+++ b/test/jasmine/tests/layout_images_test.js
@@ -1,382 +1,366 @@
-var Plotly = require('@lib/index');
-var Plots = require('@src/plots/plots');
-var Images = require('@src/components/images');
+var Plotly = require("@lib/index");
+var Plots = require("@src/plots/plots");
+var Images = require("@src/components/images");
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var mouseEvent = require('../assets/mouse_event');
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var mouseEvent = require("../assets/mouse_event");
-var jsLogo = 'https://images.plot.ly/language-icons/api-home/js-logo.png';
-var pythonLogo = 'https://images.plot.ly/language-icons/api-home/python-logo.png';
+var jsLogo = "https://images.plot.ly/language-icons/api-home/js-logo.png";
+var pythonLogo = "https://images.plot.ly/language-icons/api-home/python-logo.png";
-describe('Layout images', function() {
+describe("Layout images", function() {
+ describe("supplyLayoutDefaults", function() {
+ var layoutIn, layoutOut;
- describe('supplyLayoutDefaults', function() {
-
- var layoutIn,
- layoutOut;
-
- beforeEach(function() {
- layoutIn = { images: [] };
- layoutOut = { _has: Plots._hasPlotType };
- });
-
- it('should reject when there is no `source`', function() {
- layoutIn.images[0] = { opacity: 0.5, sizex: 0.2, sizey: 0.2 };
-
- Images.supplyLayoutDefaults(layoutIn, layoutOut);
-
- expect(layoutOut.images).toEqual([{
- visible: false,
- _index: 0,
- _input: layoutIn.images[0]
- }]);
- });
-
- it('should reject when not an array', function() {
- layoutIn.images = {
- source: jsLogo,
- opacity: 0.5,
- sizex: 0.2,
- sizey: 0.2
- };
-
- Images.supplyLayoutDefaults(layoutIn, layoutOut);
+ beforeEach(function() {
+ layoutIn = { images: [] };
+ layoutOut = { _has: Plots._hasPlotType };
+ });
- expect(layoutOut.images).toEqual([]);
- });
+ it("should reject when there is no `source`", function() {
+ layoutIn.images[0] = { opacity: 0.5, sizex: 0.2, sizey: 0.2 };
- it('should coerce the correct defaults', function() {
- var image = { source: jsLogo };
-
- layoutIn.images[0] = image;
-
- var expected = {
- source: jsLogo,
- visible: true,
- layer: 'above',
- x: 0,
- y: 0,
- xanchor: 'left',
- yanchor: 'top',
- sizex: 0,
- sizey: 0,
- sizing: 'contain',
- opacity: 1,
- xref: 'paper',
- yref: 'paper',
- _input: image,
- _index: 0
- };
-
- Images.supplyLayoutDefaults(layoutIn, layoutOut);
-
- expect(layoutOut.images[0]).toEqual(expected);
- });
+ Images.supplyLayoutDefaults(layoutIn, layoutOut);
+ expect(layoutOut.images).toEqual([
+ { visible: false, _index: 0, _input: layoutIn.images[0] }
+ ]);
});
- describe('drawing', function() {
+ it("should reject when not an array", function() {
+ layoutIn.images = {
+ source: jsLogo,
+ opacity: 0.5,
+ sizex: 0.2,
+ sizey: 0.2
+ };
- var gd,
- data = [{ x: [1, 2, 3], y: [1, 2, 3] }];
+ Images.supplyLayoutDefaults(layoutIn, layoutOut);
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(destroyGraphDiv);
+ expect(layoutOut.images).toEqual([]);
+ });
- it('should draw images on the right layers', function() {
+ it("should coerce the correct defaults", function() {
+ var image = { source: jsLogo };
+
+ layoutIn.images[0] = image;
+
+ var expected = {
+ source: jsLogo,
+ visible: true,
+ layer: "above",
+ x: 0,
+ y: 0,
+ xanchor: "left",
+ yanchor: "top",
+ sizex: 0,
+ sizey: 0,
+ sizing: "contain",
+ opacity: 1,
+ xref: "paper",
+ yref: "paper",
+ _input: image,
+ _index: 0
+ };
+
+ Images.supplyLayoutDefaults(layoutIn, layoutOut);
+
+ expect(layoutOut.images[0]).toEqual(expected);
+ });
+ });
- var layer;
+ describe("drawing", function() {
+ var gd, data = [{ x: [1, 2, 3], y: [1, 2, 3] }];
- Plotly.plot(gd, data, { images: [{
- source: 'imageabove',
- layer: 'above'
- }]});
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
- layer = gd._fullLayout._imageUpperLayer;
- expect(layer.length).toBe(1);
+ afterEach(destroyGraphDiv);
- destroyGraphDiv();
- gd = createGraphDiv();
- Plotly.plot(gd, data, { images: [{
- source: 'imagebelow',
- layer: 'below'
- }]});
+ it("should draw images on the right layers", function() {
+ var layer;
- layer = gd._fullLayout._imageLowerLayer;
- expect(layer.length).toBe(1);
+ Plotly.plot(gd, data, {
+ images: [{ source: "imageabove", layer: "above" }]
+ });
- destroyGraphDiv();
- gd = createGraphDiv();
- Plotly.plot(gd, data, { images: [{
- source: 'imagesubplot',
- layer: 'below',
- xref: 'x',
- yref: 'y'
- }]});
+ layer = gd._fullLayout._imageUpperLayer;
+ expect(layer.length).toBe(1);
- layer = gd._fullLayout._imageSubplotLayer;
- expect(layer.length).toBe(1);
- });
+ destroyGraphDiv();
+ gd = createGraphDiv();
+ Plotly.plot(gd, data, {
+ images: [{ source: "imagebelow", layer: "below" }]
+ });
- describe('with anchors and sizing', function() {
+ layer = gd._fullLayout._imageLowerLayer;
+ expect(layer.length).toBe(1);
- function testAspectRatio(xAnchor, yAnchor, sizing, expected) {
- var anchorName = xAnchor + yAnchor;
- Plotly.plot(gd, data, { images: [{
- source: anchorName,
- xanchor: xAnchor,
- yanchor: yAnchor,
- sizing: sizing
- }]});
+ destroyGraphDiv();
+ gd = createGraphDiv();
+ Plotly.plot(gd, data, {
+ images: [
+ { source: "imagesubplot", layer: "below", xref: "x", yref: "y" }
+ ]
+ });
- var image = Plotly.d3.select('image'),
- parValue = image.attr('preserveAspectRatio');
+ layer = gd._fullLayout._imageSubplotLayer;
+ expect(layer.length).toBe(1);
+ });
- expect(parValue).toBe(expected);
+ describe("with anchors and sizing", function() {
+ function testAspectRatio(xAnchor, yAnchor, sizing, expected) {
+ var anchorName = xAnchor + yAnchor;
+ Plotly.plot(gd, data, {
+ images: [
+ {
+ source: anchorName,
+ xanchor: xAnchor,
+ yanchor: yAnchor,
+ sizing: sizing
}
+ ]
+ });
- it('should work for center middle', function() {
- testAspectRatio('center', 'middle', undefined, 'xMidYMid');
- });
+ var image = Plotly.d3.select("image"),
+ parValue = image.attr("preserveAspectRatio");
- it('should work for left top', function() {
- testAspectRatio('left', 'top', undefined, 'xMinYMin');
- });
+ expect(parValue).toBe(expected);
+ }
- it('should work for right bottom', function() {
- testAspectRatio('right', 'bottom', undefined, 'xMaxYMax');
- });
+ it("should work for center middle", function() {
+ testAspectRatio("center", "middle", undefined, "xMidYMid");
+ });
- it('should work for stretch sizing', function() {
- testAspectRatio('middle', 'center', 'stretch', 'none');
- });
+ it("should work for left top", function() {
+ testAspectRatio("left", "top", undefined, "xMinYMin");
+ });
- it('should work for fill sizing', function() {
- testAspectRatio('invalid', 'invalid', 'fill', 'xMinYMin slice');
- });
+ it("should work for right bottom", function() {
+ testAspectRatio("right", "bottom", undefined, "xMaxYMax");
+ });
- });
+ it("should work for stretch sizing", function() {
+ testAspectRatio("middle", "center", "stretch", "none");
+ });
+ it("should work for fill sizing", function() {
+ testAspectRatio("invalid", "invalid", "fill", "xMinYMin slice");
+ });
});
+ });
- describe('when the plot is dragged', function() {
- var gd,
- data = [{ x: [1, 2, 3], y: [1, 2, 3] }];
-
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(destroyGraphDiv);
-
- it('should not move when referencing the paper', function(done) {
- var image = {
- source: jsLogo,
- xref: 'paper',
- yref: 'paper',
- x: 0,
- y: 0,
- sizex: 0.1,
- sizey: 0.1
- };
-
- Plotly.plot(gd, data, {
- images: [image],
- dragmode: 'pan',
- width: 600,
- height: 400
- }).then(function() {
- var img = Plotly.d3.select('image').node(),
- oldPos = img.getBoundingClientRect();
-
- mouseEvent('mousedown', 250, 200);
- mouseEvent('mousemove', 300, 250);
-
- var newPos = img.getBoundingClientRect();
-
- expect(newPos.left).toBe(oldPos.left);
- expect(newPos.top).toBe(oldPos.top);
-
- mouseEvent('mouseup', 300, 250);
- }).then(done);
- });
-
- it('should move when referencing axes', function(done) {
- var image = {
- source: jsLogo,
- xref: 'x',
- yref: 'y',
- x: 2,
- y: 2,
- sizex: 1,
- sizey: 1
- };
-
- Plotly.plot(gd, data, {
- images: [image],
- dragmode: 'pan',
- width: 600,
- height: 400
- }).then(function() {
- var img = Plotly.d3.select('image').node(),
- oldPos = img.getBoundingClientRect();
-
- mouseEvent('mousedown', 250, 200);
- mouseEvent('mousemove', 300, 250);
-
- var newPos = img.getBoundingClientRect();
-
- expect(newPos.left).toBe(oldPos.left + 50);
- expect(newPos.top).toBe(oldPos.top + 50);
-
- mouseEvent('mouseup', 300, 250);
- }).then(done);
- });
+ describe("when the plot is dragged", function() {
+ var gd, data = [{ x: [1, 2, 3], y: [1, 2, 3] }];
+ beforeEach(function() {
+ gd = createGraphDiv();
});
- describe('when relayout', function() {
-
- var gd,
- data = [{ x: [1, 2, 3], y: [1, 2, 3] }];
-
- beforeEach(function(done) {
- gd = createGraphDiv();
- Plotly.plot(gd, data, {
- images: [{
- source: jsLogo,
- x: 2,
- y: 2,
- sizex: 1,
- sizey: 1
- }],
- width: 500,
- height: 400
- }).then(done);
- });
-
- afterEach(destroyGraphDiv);
-
- it('should update the image if changed', function(done) {
- var img = Plotly.d3.select('image'),
- url = img.attr('xlink:href');
-
- Plotly.relayout(gd, 'images[0].source', pythonLogo).then(function() {
- var newImg = Plotly.d3.select('image'),
- newUrl = newImg.attr('xlink:href');
- expect(url).not.toBe(newUrl);
- }).then(done);
- });
-
- it('should update the image position if changed', function(done) {
- var update = {
- 'images[0].x': 0,
- 'images[0].y': 1
- };
-
- var img = Plotly.d3.select('image');
-
- expect([+img.attr('x'), +img.attr('y')]).toEqual([760, -120]);
+ afterEach(destroyGraphDiv);
+
+ it("should not move when referencing the paper", function(done) {
+ var image = {
+ source: jsLogo,
+ xref: "paper",
+ yref: "paper",
+ x: 0,
+ y: 0,
+ sizex: 0.1,
+ sizey: 0.1
+ };
+
+ Plotly.plot(gd, data, {
+ images: [image],
+ dragmode: "pan",
+ width: 600,
+ height: 400
+ })
+ .then(function() {
+ var img = Plotly.d3.select("image").node(),
+ oldPos = img.getBoundingClientRect();
+
+ mouseEvent("mousedown", 250, 200);
+ mouseEvent("mousemove", 300, 250);
+
+ var newPos = img.getBoundingClientRect();
+
+ expect(newPos.left).toBe(oldPos.left);
+ expect(newPos.top).toBe(oldPos.top);
+
+ mouseEvent("mouseup", 300, 250);
+ })
+ .then(done);
+ });
- Plotly.relayout(gd, update).then(function() {
- var newImg = Plotly.d3.select('image');
- expect([+newImg.attr('x'), +newImg.attr('y')]).toEqual([80, 100]);
- }).then(done);
- });
+ it("should move when referencing axes", function(done) {
+ var image = {
+ source: jsLogo,
+ xref: "x",
+ yref: "y",
+ x: 2,
+ y: 2,
+ sizex: 1,
+ sizey: 1
+ };
+
+ Plotly.plot(gd, data, {
+ images: [image],
+ dragmode: "pan",
+ width: 600,
+ height: 400
+ })
+ .then(function() {
+ var img = Plotly.d3.select("image").node(),
+ oldPos = img.getBoundingClientRect();
+
+ mouseEvent("mousedown", 250, 200);
+ mouseEvent("mousemove", 300, 250);
+
+ var newPos = img.getBoundingClientRect();
+
+ expect(newPos.left).toBe(oldPos.left + 50);
+ expect(newPos.top).toBe(oldPos.top + 50);
+
+ mouseEvent("mouseup", 300, 250);
+ })
+ .then(done);
+ });
+ });
+
+ describe("when relayout", function() {
+ var gd, data = [{ x: [1, 2, 3], y: [1, 2, 3] }];
+
+ beforeEach(function(done) {
+ gd = createGraphDiv();
+ Plotly.plot(gd, data, {
+ images: [{ source: jsLogo, x: 2, y: 2, sizex: 1, sizey: 1 }],
+ width: 500,
+ height: 400
+ }).then(done);
+ });
- it('should remove the image tag if an invalid source', function(done) {
+ afterEach(destroyGraphDiv);
- var selection = Plotly.d3.select('image');
- expect(selection.size()).toBe(1);
+ it("should update the image if changed", function(done) {
+ var img = Plotly.d3.select("image"), url = img.attr("xlink:href");
- Plotly.relayout(gd, 'images[0].source', 'invalidUrl').then(function() {
- var newSelection = Plotly.d3.select('image');
- expect(newSelection.size()).toBe(0);
- }).then(done);
- });
+ Plotly.relayout(gd, "images[0].source", pythonLogo)
+ .then(function() {
+ var newImg = Plotly.d3.select("image"),
+ newUrl = newImg.attr("xlink:href");
+ expect(url).not.toBe(newUrl);
+ })
+ .then(done);
});
- describe('when adding/removing images', function() {
+ it("should update the image position if changed", function(done) {
+ var update = { "images[0].x": 0, "images[0].y": 1 };
- afterEach(destroyGraphDiv);
+ var img = Plotly.d3.select("image");
- it('should properly add and removing image', function(done) {
- var gd = createGraphDiv(),
- data = [{ x: [1, 2, 3], y: [1, 2, 3] }],
- layout = { width: 500, height: 400 };
+ expect([+img.attr("x"), +img.attr("y")]).toEqual([760, -120]);
- function makeImage(source, x, y) {
- return {
- source: source,
- x: x,
- y: y,
- sizex: 1,
- sizey: 1
- };
- }
+ Plotly.relayout(gd, update)
+ .then(function() {
+ var newImg = Plotly.d3.select("image");
+ expect([+newImg.attr("x"), +newImg.attr("y")]).toEqual([80, 100]);
+ })
+ .then(done);
+ });
- function assertImages(cnt) {
- expect(d3.selectAll('image').size()).toEqual(cnt);
- }
+ it("should remove the image tag if an invalid source", function(done) {
+ var selection = Plotly.d3.select("image");
+ expect(selection.size()).toBe(1);
- Plotly.plot(gd, data, layout).then(function() {
- assertImages(0);
-
- return Plotly.relayout(gd, 'images[0]', makeImage(jsLogo, 0.1, 0.1));
- })
- .then(function() {
- assertImages(1);
-
- return Plotly.relayout(gd, 'images[1]', makeImage(pythonLogo, 0.9, 0.9));
- })
- .then(function() {
- assertImages(2);
-
- return Plotly.relayout(gd, 'images[2]', makeImage(pythonLogo, 0.2, 0.5));
- })
- .then(function() {
- assertImages(3);
- expect(gd.layout.images.length).toEqual(3);
-
- return Plotly.relayout(gd, 'images[1].visible', false);
- })
- .then(function() {
- assertImages(2);
- expect(gd.layout.images.length).toEqual(3);
-
- return Plotly.relayout(gd, 'images[1].visible', true);
- })
- .then(function() {
- assertImages(3);
- expect(gd.layout.images.length).toEqual(3);
-
- return Plotly.relayout(gd, 'images[2]', null);
- })
- .then(function() {
- assertImages(2);
- expect(gd.layout.images.length).toEqual(2);
-
- return Plotly.relayout(gd, 'images[1]', null);
- })
- .then(function() {
- assertImages(1);
- expect(gd.layout.images.length).toEqual(1);
-
- return Plotly.relayout(gd, 'images[0]', null);
- })
- .then(function() {
- assertImages(0);
- expect(gd.layout.images).toEqual([]);
-
- done();
- });
+ Plotly.relayout(gd, "images[0].source", "invalidUrl")
+ .then(function() {
+ var newSelection = Plotly.d3.select("image");
+ expect(newSelection.size()).toBe(0);
+ })
+ .then(done);
+ });
+ });
+
+ describe("when adding/removing images", function() {
+ afterEach(destroyGraphDiv);
+
+ it("should properly add and removing image", function(done) {
+ var gd = createGraphDiv(),
+ data = [{ x: [1, 2, 3], y: [1, 2, 3] }],
+ layout = { width: 500, height: 400 };
+
+ function makeImage(source, x, y) {
+ return { source: source, x: x, y: y, sizex: 1, sizey: 1 };
+ }
+
+ function assertImages(cnt) {
+ expect(d3.selectAll("image").size()).toEqual(cnt);
+ }
+
+ Plotly.plot(gd, data, layout)
+ .then(function() {
+ assertImages(0);
+
+ return Plotly.relayout(gd, "images[0]", makeImage(jsLogo, 0.1, 0.1));
+ })
+ .then(function() {
+ assertImages(1);
+
+ return Plotly.relayout(
+ gd,
+ "images[1]",
+ makeImage(pythonLogo, 0.9, 0.9)
+ );
+ })
+ .then(function() {
+ assertImages(2);
+
+ return Plotly.relayout(
+ gd,
+ "images[2]",
+ makeImage(pythonLogo, 0.2, 0.5)
+ );
+ })
+ .then(function() {
+ assertImages(3);
+ expect(gd.layout.images.length).toEqual(3);
+
+ return Plotly.relayout(gd, "images[1].visible", false);
+ })
+ .then(function() {
+ assertImages(2);
+ expect(gd.layout.images.length).toEqual(3);
+
+ return Plotly.relayout(gd, "images[1].visible", true);
+ })
+ .then(function() {
+ assertImages(3);
+ expect(gd.layout.images.length).toEqual(3);
+
+ return Plotly.relayout(gd, "images[2]", null);
+ })
+ .then(function() {
+ assertImages(2);
+ expect(gd.layout.images.length).toEqual(2);
+
+ return Plotly.relayout(gd, "images[1]", null);
+ })
+ .then(function() {
+ assertImages(1);
+ expect(gd.layout.images.length).toEqual(1);
+
+ return Plotly.relayout(gd, "images[0]", null);
+ })
+ .then(function() {
+ assertImages(0);
+ expect(gd.layout.images).toEqual([]);
+
+ done();
});
-
});
-
+ });
});
diff --git a/test/jasmine/tests/legend_scroll_test.js b/test/jasmine/tests/legend_scroll_test.js
index b93610ac5f7..1dcb7d0b528 100644
--- a/test/jasmine/tests/legend_scroll_test.js
+++ b/test/jasmine/tests/legend_scroll_test.js
@@ -1,258 +1,271 @@
-var Plotly = require('@lib/index');
-var Lib = require('@src/lib');
-var constants = require('@src/components/legend/constants');
-
-var d3 = require('d3');
-var createGraph = require('../assets/create_graph_div');
-var destroyGraph = require('../assets/destroy_graph_div');
-var getBBox = require('../assets/get_bbox');
-var mock = require('../../image/mocks/legend_scroll.json');
-
-
-describe('The legend', function() {
- 'use strict';
-
- function countLegendGroups(gd) {
- return gd._fullLayout._toppaper.selectAll('g.legend').size();
- }
-
- function countLegendClipPaths(gd) {
- var uid = gd._fullLayout._uid;
-
- return gd._fullLayout._topdefs.selectAll('#legend' + uid).size();
- }
-
- function getPlotHeight(gd) {
- return gd._fullLayout.height - gd._fullLayout.margin.t - gd._fullLayout.margin.b;
- }
-
- function getLegendHeight(gd) {
- var bg = d3.select('g.legend').select('.bg').node();
- return gd._fullLayout.legend.borderwidth + getBBox(bg).height;
- }
-
- function getLegend() {
- return d3.select('g.legend').node();
- }
-
- function getScrollBox() {
- return d3.select('g.legend').select('.scrollbox').node();
- }
-
- function getScrollBar() {
- return d3.select('g.legend').select('.scrollbar').node();
- }
-
- function getToggle() {
- return d3.select('g.legend').select('.legendtoggle').node();
- }
-
- describe('when plotted with many traces', function() {
- var gd;
-
- beforeEach(function(done) {
- gd = createGraph();
-
- var mockCopy = Lib.extendDeep({}, mock);
-
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
- done();
- });
- });
-
- afterEach(destroyGraph);
+var Plotly = require("@lib/index");
+var Lib = require("@src/lib");
+var constants = require("@src/components/legend/constants");
+
+var d3 = require("d3");
+var createGraph = require("../assets/create_graph_div");
+var destroyGraph = require("../assets/destroy_graph_div");
+var getBBox = require("../assets/get_bbox");
+var mock = require("../../image/mocks/legend_scroll.json");
+
+describe("The legend", function() {
+ "use strict";
+ function countLegendGroups(gd) {
+ return gd._fullLayout._toppaper.selectAll("g.legend").size();
+ }
+
+ function countLegendClipPaths(gd) {
+ var uid = gd._fullLayout._uid;
+
+ return gd._fullLayout._topdefs.selectAll("#legend" + uid).size();
+ }
+
+ function getPlotHeight(gd) {
+ return gd._fullLayout.height -
+ gd._fullLayout.margin.t -
+ gd._fullLayout.margin.b;
+ }
+
+ function getLegendHeight(gd) {
+ var bg = d3.select("g.legend").select(".bg").node();
+ return gd._fullLayout.legend.borderwidth + getBBox(bg).height;
+ }
+
+ function getLegend() {
+ return d3.select("g.legend").node();
+ }
+
+ function getScrollBox() {
+ return d3.select("g.legend").select(".scrollbox").node();
+ }
+
+ function getScrollBar() {
+ return d3.select("g.legend").select(".scrollbar").node();
+ }
+
+ function getToggle() {
+ return d3.select("g.legend").select(".legendtoggle").node();
+ }
+
+ describe("when plotted with many traces", function() {
+ var gd;
+
+ beforeEach(function(done) {
+ gd = createGraph();
+
+ var mockCopy = Lib.extendDeep({}, mock);
+
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
+ done();
+ });
+ });
- it('should not exceed plot height', function() {
- var legendHeight = getLegendHeight(gd);
+ afterEach(destroyGraph);
- expect(+legendHeight).toBe(getPlotHeight(gd));
- });
+ it("should not exceed plot height", function() {
+ var legendHeight = getLegendHeight(gd);
- it('should insert a scrollbar', function() {
- var scrollBar = getScrollBar();
-
- expect(scrollBar).toBeDefined();
- expect(scrollBar.getAttribute('x')).not.toBe(null);
- });
-
- it('should scroll when there\'s a wheel event', function() {
- var legend = getLegend(),
- scrollBox = getScrollBox(),
- legendHeight = getLegendHeight(gd),
- scrollBoxYMax = gd._fullLayout.legend.height - legendHeight,
- scrollBarYMax = legendHeight -
- constants.scrollBarHeight -
- 2 * constants.scrollBarMargin,
- initialDataScroll = scrollBox.getAttribute('data-scroll'),
- wheelDeltaY = 100,
- finalDataScroll = '' + Lib.constrain(initialDataScroll -
- wheelDeltaY / scrollBarYMax * scrollBoxYMax,
- -scrollBoxYMax, 0);
-
- legend.dispatchEvent(scrollTo(wheelDeltaY));
-
- expect(scrollBox.getAttribute('data-scroll')).toBe(finalDataScroll);
- expect(scrollBox.getAttribute('transform')).toBe(
- 'translate(0, ' + finalDataScroll + ')');
- });
+ expect(+legendHeight).toBe(getPlotHeight(gd));
+ });
- it('should keep the scrollbar position after a toggle event', function() {
- var legend = getLegend(),
- scrollBox = getScrollBox(),
- toggle = getToggle(),
- wheelDeltaY = 100;
+ it("should insert a scrollbar", function() {
+ var scrollBar = getScrollBar();
- legend.dispatchEvent(scrollTo(wheelDeltaY));
+ expect(scrollBar).toBeDefined();
+ expect(scrollBar.getAttribute("x")).not.toBe(null);
+ });
- var dataScroll = scrollBox.getAttribute('data-scroll');
- toggle.dispatchEvent(new MouseEvent('click'));
- expect(+toggle.parentNode.style.opacity).toBeLessThan(1);
- expect(scrollBox.getAttribute('data-scroll')).toBe(dataScroll);
- expect(scrollBox.getAttribute('transform')).toBe(
- 'translate(0, ' + dataScroll + ')');
- });
+ it("should scroll when there's a wheel event", function() {
+ var legend = getLegend(),
+ scrollBox = getScrollBox(),
+ legendHeight = getLegendHeight(gd),
+ scrollBoxYMax = gd._fullLayout.legend.height - legendHeight,
+ scrollBarYMax = legendHeight -
+ constants.scrollBarHeight -
+ 2 * constants.scrollBarMargin,
+ initialDataScroll = scrollBox.getAttribute("data-scroll"),
+ wheelDeltaY = 100,
+ finalDataScroll = "" +
+ Lib.constrain(
+ initialDataScroll - wheelDeltaY / scrollBarYMax * scrollBoxYMax,
+ -scrollBoxYMax,
+ 0
+ );
+
+ legend.dispatchEvent(scrollTo(wheelDeltaY));
+
+ expect(scrollBox.getAttribute("data-scroll")).toBe(finalDataScroll);
+ expect(scrollBox.getAttribute("transform")).toBe(
+ "translate(0, " + finalDataScroll + ")"
+ );
+ });
- it('should be restored and functional after relayout', function() {
- var wheelDeltaY = 100,
- legend = getLegend(),
- scrollBox,
- scrollBar,
- scrollBarX,
- scrollBarY,
- toggle;
-
- legend.dispatchEvent(scrollTo(wheelDeltaY));
- scrollBar = legend.getElementsByClassName('scrollbar')[0];
- scrollBarX = scrollBar.getAttribute('x'),
- scrollBarY = scrollBar.getAttribute('y');
-
- Plotly.relayout(gd, 'showlegend', false);
- Plotly.relayout(gd, 'showlegend', true);
-
- legend = getLegend();
- scrollBox = getScrollBox();
- scrollBar = getScrollBar();
- toggle = getToggle();
-
- legend.dispatchEvent(scrollTo(wheelDeltaY));
- expect(scrollBar.getAttribute('x')).toBe(scrollBarX);
- expect(scrollBar.getAttribute('y')).toBe(scrollBarY);
-
- var dataScroll = scrollBox.getAttribute('data-scroll');
- toggle.dispatchEvent(new MouseEvent('click'));
- expect(+toggle.parentNode.style.opacity).toBeLessThan(1);
- expect(scrollBox.getAttribute('data-scroll')).toBe(dataScroll);
- expect(scrollBox.getAttribute('transform')).toBe(
- 'translate(0, ' + dataScroll + ')');
- expect(scrollBar.getAttribute('width')).toBeGreaterThan(0);
- expect(scrollBar.getAttribute('height')).toBeGreaterThan(0);
- });
+ it("should keep the scrollbar position after a toggle event", function() {
+ var legend = getLegend(),
+ scrollBox = getScrollBox(),
+ toggle = getToggle(),
+ wheelDeltaY = 100;
+
+ legend.dispatchEvent(scrollTo(wheelDeltaY));
+
+ var dataScroll = scrollBox.getAttribute("data-scroll");
+ toggle.dispatchEvent(new MouseEvent("click"));
+ expect(+toggle.parentNode.style.opacity).toBeLessThan(1);
+ expect(scrollBox.getAttribute("data-scroll")).toBe(dataScroll);
+ expect(scrollBox.getAttribute("transform")).toBe(
+ "translate(0, " + dataScroll + ")"
+ );
+ });
- it('should constrain scrolling to the contents', function() {
- var legend = getLegend(),
- scrollBox = getScrollBox();
+ it("should be restored and functional after relayout", function() {
+ var wheelDeltaY = 100,
+ legend = getLegend(),
+ scrollBox,
+ scrollBar,
+ scrollBarX,
+ scrollBarY,
+ toggle;
+
+ legend.dispatchEvent(scrollTo(wheelDeltaY));
+ scrollBar = legend.getElementsByClassName("scrollbar")[0];
+ scrollBarX = scrollBar.getAttribute(
+ "x"
+ ), scrollBarY = scrollBar.getAttribute("y");
+
+ Plotly.relayout(gd, "showlegend", false);
+ Plotly.relayout(gd, "showlegend", true);
+
+ legend = getLegend();
+ scrollBox = getScrollBox();
+ scrollBar = getScrollBar();
+ toggle = getToggle();
+
+ legend.dispatchEvent(scrollTo(wheelDeltaY));
+ expect(scrollBar.getAttribute("x")).toBe(scrollBarX);
+ expect(scrollBar.getAttribute("y")).toBe(scrollBarY);
+
+ var dataScroll = scrollBox.getAttribute("data-scroll");
+ toggle.dispatchEvent(new MouseEvent("click"));
+ expect(+toggle.parentNode.style.opacity).toBeLessThan(1);
+ expect(scrollBox.getAttribute("data-scroll")).toBe(dataScroll);
+ expect(scrollBox.getAttribute("transform")).toBe(
+ "translate(0, " + dataScroll + ")"
+ );
+ expect(scrollBar.getAttribute("width")).toBeGreaterThan(0);
+ expect(scrollBar.getAttribute("height")).toBeGreaterThan(0);
+ });
- legend.dispatchEvent(scrollTo(-100));
- expect(scrollBox.getAttribute('transform')).toBe('translate(0, 0)');
+ it("should constrain scrolling to the contents", function() {
+ var legend = getLegend(), scrollBox = getScrollBox();
- legend.dispatchEvent(scrollTo(100000));
- expect(scrollBox.getAttribute('transform')).toBe('translate(0, -179)');
- });
+ legend.dispatchEvent(scrollTo(-100));
+ expect(scrollBox.getAttribute("transform")).toBe("translate(0, 0)");
- it('should scale the scrollbar movement from top to bottom', function() {
- var legend = getLegend(),
- scrollBar = getScrollBar(),
- legendHeight = getLegendHeight(gd);
+ legend.dispatchEvent(scrollTo(100000));
+ expect(scrollBox.getAttribute("transform")).toBe("translate(0, -179)");
+ });
- // The scrollbar is 20px tall and has 4px margins
+ it("should scale the scrollbar movement from top to bottom", function() {
+ var legend = getLegend(),
+ scrollBar = getScrollBar(),
+ legendHeight = getLegendHeight(gd);
- legend.dispatchEvent(scrollTo(-1000));
- expect(+scrollBar.getAttribute('y')).toBe(4);
+ // The scrollbar is 20px tall and has 4px margins
+ legend.dispatchEvent(scrollTo(-1000));
+ expect(+scrollBar.getAttribute("y")).toBe(4);
- legend.dispatchEvent(scrollTo(10000));
- expect(+scrollBar.getAttribute('y')).toBe(legendHeight - 4 - 20);
- });
+ legend.dispatchEvent(scrollTo(10000));
+ expect(+scrollBar.getAttribute("y")).toBe(legendHeight - 4 - 20);
+ });
- it('should be removed from DOM when \'showlegend\' is relayout\'ed to false', function(done) {
- expect(countLegendGroups(gd)).toBe(1);
- expect(countLegendClipPaths(gd)).toBe(1);
+ it(
+ "should be removed from DOM when 'showlegend' is relayout'ed to false",
+ function(done) {
+ expect(countLegendGroups(gd)).toBe(1);
+ expect(countLegendClipPaths(gd)).toBe(1);
- Plotly.relayout(gd, 'showlegend', false).then(function() {
- expect(countLegendGroups(gd)).toBe(0);
- expect(countLegendClipPaths(gd)).toBe(0);
+ Plotly.relayout(gd, "showlegend", false).then(function() {
+ expect(countLegendGroups(gd)).toBe(0);
+ expect(countLegendClipPaths(gd)).toBe(0);
- done();
- });
+ done();
});
+ }
+ );
- it('should resize when relayout\'ed with new height', function(done) {
- var origLegendHeight = getLegendHeight(gd);
+ it("should resize when relayout'ed with new height", function(done) {
+ var origLegendHeight = getLegendHeight(gd);
- Plotly.relayout(gd, 'height', gd._fullLayout.height / 2).then(function() {
- var legendHeight = getLegendHeight(gd);
+ Plotly.relayout(gd, "height", gd._fullLayout.height / 2).then(function() {
+ var legendHeight = getLegendHeight(gd);
- // legend still exists and not duplicated
- expect(countLegendGroups(gd)).toBe(1);
- expect(countLegendClipPaths(gd)).toBe(1);
+ // legend still exists and not duplicated
+ expect(countLegendGroups(gd)).toBe(1);
+ expect(countLegendClipPaths(gd)).toBe(1);
- // clippath resized to new height less than new plot height
- expect(+legendHeight).toBe(getPlotHeight(gd));
- expect(+legendHeight).toBeLessThan(+origLegendHeight);
+ // clippath resized to new height less than new plot height
+ expect(+legendHeight).toBe(getPlotHeight(gd));
+ expect(+legendHeight).toBeLessThan(+origLegendHeight);
- done();
- });
- });
+ done();
+ });
});
+ });
- describe('when plotted with few traces', function() {
- var gd;
+ describe("when plotted with few traces", function() {
+ var gd;
- beforeEach(function() {
- gd = createGraph();
+ beforeEach(function() {
+ gd = createGraph();
- var data = [{ x: [1, 2, 3], y: [2, 3, 4], name: 'Test' }];
- var layout = { showlegend: true };
+ var data = [{ x: [1, 2, 3], y: [2, 3, 4], name: "Test" }];
+ var layout = { showlegend: true };
- Plotly.plot(gd, data, layout);
- });
+ Plotly.plot(gd, data, layout);
+ });
- afterEach(destroyGraph);
+ afterEach(destroyGraph);
- it('should not display the scrollbar', function() {
- var scrollBar = document.getElementsByClassName('scrollbar')[0];
+ it("should not display the scrollbar", function() {
+ var scrollBar = document.getElementsByClassName("scrollbar")[0];
- expect(+scrollBar.getAttribute('width')).toBe(0);
- expect(+scrollBar.getAttribute('height')).toBe(0);
- });
+ expect(+scrollBar.getAttribute("width")).toBe(0);
+ expect(+scrollBar.getAttribute("height")).toBe(0);
+ });
- it('should be removed from DOM when \'showlegend\' is relayout\'ed to false', function(done) {
- expect(countLegendGroups(gd)).toBe(1);
- expect(countLegendClipPaths(gd)).toBe(1);
+ it(
+ "should be removed from DOM when 'showlegend' is relayout'ed to false",
+ function(done) {
+ expect(countLegendGroups(gd)).toBe(1);
+ expect(countLegendClipPaths(gd)).toBe(1);
- Plotly.relayout(gd, 'showlegend', false).then(function() {
- expect(countLegendGroups(gd)).toBe(0);
- expect(countLegendClipPaths(gd)).toBe(0);
+ Plotly.relayout(gd, "showlegend", false).then(function() {
+ expect(countLegendGroups(gd)).toBe(0);
+ expect(countLegendClipPaths(gd)).toBe(0);
- done();
- });
+ done();
});
+ }
+ );
- it('should resize when traces added', function(done) {
- var origLegendHeight = getLegendHeight(gd);
-
- Plotly.addTraces(gd, { x: [1, 2, 3], y: [4, 3, 2], name: 'Test2' }).then(function() {
- var legendHeight = getLegendHeight(gd);
+ it("should resize when traces added", function(done) {
+ var origLegendHeight = getLegendHeight(gd);
- expect(+legendHeight).toBeCloseTo(+origLegendHeight + 19, 0);
+ Plotly.addTraces(gd, {
+ x: [1, 2, 3],
+ y: [4, 3, 2],
+ name: "Test2"
+ }).then(function() {
+ var legendHeight = getLegendHeight(gd);
- done();
- });
+ expect(+legendHeight).toBeCloseTo(+origLegendHeight + 19, 0);
- });
+ done();
+ });
});
+ });
});
-
function scrollTo(delta) {
- return new WheelEvent('wheel', { deltaY: delta });
+ return new WheelEvent("wheel", { deltaY: delta });
}
diff --git a/test/jasmine/tests/legend_test.js b/test/jasmine/tests/legend_test.js
index c832da02dcd..8566a923379 100644
--- a/test/jasmine/tests/legend_test.js
+++ b/test/jasmine/tests/legend_test.js
@@ -1,630 +1,739 @@
-var Plotly = require('@lib/index');
-var Plots = require('@src/plots/plots');
-var Lib = require('@src/lib');
-
-var Legend = require('@src/components/legend');
-var getLegendData = require('@src/components/legend/get_legend_data');
-var helpers = require('@src/components/legend/helpers');
-var anchorUtils = require('@src/components/legend/anchor_utils');
-
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var customMatchers = require('../assets/custom_matchers');
-
-
-describe('legend defaults', function() {
- 'use strict';
-
- var supplyLayoutDefaults = Legend.supplyLayoutDefaults;
-
- var layoutIn, layoutOut, fullData;
+var Plotly = require("@lib/index");
+var Plots = require("@src/plots/plots");
+var Lib = require("@src/lib");
+
+var Legend = require("@src/components/legend");
+var getLegendData = require("@src/components/legend/get_legend_data");
+var helpers = require("@src/components/legend/helpers");
+var anchorUtils = require("@src/components/legend/anchor_utils");
+
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var customMatchers = require("../assets/custom_matchers");
+
+describe("legend defaults", function() {
+ "use strict";
+ var supplyLayoutDefaults = Legend.supplyLayoutDefaults;
+
+ var layoutIn, layoutOut, fullData;
+
+ beforeEach(function() {
+ layoutIn = { showlegend: true };
+ layoutOut = {
+ font: Plots.layoutAttributes.font,
+ bg_color: Plots.layoutAttributes.bg_color
+ };
+ });
+
+ it("should default traceorder to reversed for stack bar charts", function() {
+ fullData = [{ type: "bar" }, { type: "bar" }, { type: "scatter" }];
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.legend.traceorder).toEqual("normal");
+
+ layoutOut.barmode = "stack";
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.legend.traceorder).toEqual("reversed");
+ });
+
+ it(
+ "should default traceorder to reversed for filled tonext scatter charts",
+ function() {
+ fullData = [{ type: "scatter" }, { type: "scatter", fill: "tonexty" }];
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.legend.traceorder).toEqual("reversed");
+ }
+ );
+
+ it(
+ "should default traceorder to grouped when a group is present",
+ function() {
+ fullData = [
+ { type: "scatter", legendgroup: "group" },
+ { type: "scatter" }
+ ];
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.legend.traceorder).toEqual("grouped");
+
+ fullData[1].fill = "tonextx";
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.legend.traceorder).toEqual("grouped+reversed");
+ }
+ );
+
+ it("should default orientation to vertical", function() {
+ supplyLayoutDefaults(layoutIn, layoutOut, []);
+ expect(layoutOut.legend.orientation).toEqual("v");
+ });
+
+ describe("for horizontal legends", function() {
+ var layoutInForHorizontalLegends;
beforeEach(function() {
- layoutIn = {
- showlegend: true
- };
- layoutOut = {
- font: Plots.layoutAttributes.font,
- bg_color: Plots.layoutAttributes.bg_color
- };
- });
-
- it('should default traceorder to reversed for stack bar charts', function() {
- fullData = [
- { type: 'bar' },
- { type: 'bar' },
- { type: 'scatter' }
- ];
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.legend.traceorder).toEqual('normal');
-
- layoutOut.barmode = 'stack';
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.legend.traceorder).toEqual('reversed');
- });
-
- it('should default traceorder to reversed for filled tonext scatter charts', function() {
- fullData = [
- { type: 'scatter' },
- { type: 'scatter', fill: 'tonexty' }
- ];
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.legend.traceorder).toEqual('reversed');
- });
-
- it('should default traceorder to grouped when a group is present', function() {
- fullData = [
- { type: 'scatter', legendgroup: 'group' },
- { type: 'scatter'}
- ];
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.legend.traceorder).toEqual('grouped');
-
- fullData[1].fill = 'tonextx';
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.legend.traceorder).toEqual('grouped+reversed');
+ layoutInForHorizontalLegends = Lib.extendDeep(
+ {
+ legend: { orientation: "h" },
+ xaxis: { rangeslider: { visible: false } }
+ },
+ layoutIn
+ );
});
- it('should default orientation to vertical', function() {
- supplyLayoutDefaults(layoutIn, layoutOut, []);
- expect(layoutOut.legend.orientation).toEqual('v');
+ it("should default position to bottom left", function() {
+ supplyLayoutDefaults(layoutInForHorizontalLegends, layoutOut, []);
+ expect(layoutOut.legend.x).toEqual(0);
+ expect(layoutOut.legend.xanchor).toEqual("left");
+ expect(layoutOut.legend.y).toEqual(-0.1);
+ expect(layoutOut.legend.yanchor).toEqual("top");
});
- describe('for horizontal legends', function() {
- var layoutInForHorizontalLegends;
-
- beforeEach(function() {
- layoutInForHorizontalLegends = Lib.extendDeep({
- legend: {
- orientation: 'h'
- },
- xaxis: {
- rangeslider: {
- visible: false
- }
- }
- }, layoutIn);
- });
-
- it('should default position to bottom left', function() {
- supplyLayoutDefaults(layoutInForHorizontalLegends, layoutOut, []);
- expect(layoutOut.legend.x).toEqual(0);
- expect(layoutOut.legend.xanchor).toEqual('left');
- expect(layoutOut.legend.y).toEqual(-0.1);
- expect(layoutOut.legend.yanchor).toEqual('top');
- });
-
- it('should default position to top left if a range slider present', function() {
- var mockLayoutIn = Lib.extendDeep({}, layoutInForHorizontalLegends);
- mockLayoutIn.xaxis.rangeslider.visible = true;
-
- supplyLayoutDefaults(mockLayoutIn, layoutOut, []);
- expect(layoutOut.legend.x).toEqual(0);
- expect(layoutOut.legend.xanchor).toEqual('left');
- expect(layoutOut.legend.y).toEqual(1.1);
- expect(layoutOut.legend.yanchor).toEqual('bottom');
- });
- });
+ it(
+ "should default position to top left if a range slider present",
+ function() {
+ var mockLayoutIn = Lib.extendDeep({}, layoutInForHorizontalLegends);
+ mockLayoutIn.xaxis.rangeslider.visible = true;
+
+ supplyLayoutDefaults(mockLayoutIn, layoutOut, []);
+ expect(layoutOut.legend.x).toEqual(0);
+ expect(layoutOut.legend.xanchor).toEqual("left");
+ expect(layoutOut.legend.y).toEqual(1.1);
+ expect(layoutOut.legend.yanchor).toEqual("bottom");
+ }
+ );
+ });
});
-describe('legend getLegendData', function() {
- 'use strict';
-
- var calcdata, opts, legendData, expected;
-
- it('should group legendgroup traces', function() {
- calcdata = [
- [{trace: {
- type: 'scatter',
- visible: true,
- legendgroup: 'group',
- showlegend: true
-
- }}],
- [{trace: {
- type: 'bar',
- visible: 'legendonly',
- legendgroup: '',
- showlegend: true
- }}],
- [{trace: {
- type: 'scatter',
- visible: true,
- legendgroup: 'group',
- showlegend: true
- }}]
- ];
- opts = {
- traceorder: 'grouped'
- };
-
- legendData = getLegendData(calcdata, opts);
-
- expected = [
- [
- [{trace: {
- type: 'scatter',
- visible: true,
- legendgroup: 'group',
- showlegend: true
-
- }}],
- [{trace: {
- type: 'scatter',
- visible: true,
- legendgroup: 'group',
- showlegend: true
- }}]
- ],
- [
- [{trace: {
- type: 'bar',
- visible: 'legendonly',
- legendgroup: '',
- showlegend: true
- }}]
- ]
- ];
-
- expect(legendData).toEqual(expected);
- expect(opts._lgroupsLength).toEqual(2);
- });
-
- it('should collapse when data has only one group', function() {
- calcdata = [
- [{trace: {
- type: 'scatter',
- visible: true,
- legendgroup: '',
- showlegend: true
-
- }}],
- [{trace: {
- type: 'bar',
- visible: 'legendonly',
- legendgroup: '',
- showlegend: true
- }}],
- [{trace: {
- type: 'scatter',
- visible: true,
- legendgroup: '',
- showlegend: true
- }}]
- ];
- opts = {
- traceorder: 'grouped'
- };
-
- legendData = getLegendData(calcdata, opts);
-
- expected = [
- [
- [{trace: {
- type: 'scatter',
- visible: true,
- legendgroup: '',
- showlegend: true
-
- }}],
- [{trace: {
- type: 'bar',
- visible: 'legendonly',
- legendgroup: '',
- showlegend: true
- }}],
- [{trace: {
- type: 'scatter',
- visible: true,
- legendgroup: '',
- showlegend: true
- }}]
- ]
- ];
-
- expect(legendData).toEqual(expected);
- expect(opts._lgroupsLength).toEqual(1);
- });
-
- it('should return empty array when legend data has no traces', function() {
- calcdata = [
- [{trace: {
- type: 'histogram',
- visible: true,
- legendgroup: '',
- showlegend: false
-
- }}],
- [{trace: {
- type: 'box',
- visible: 'legendonly',
- legendgroup: '',
- showlegend: false
- }}],
- [{trace: {
- type: 'heatmap',
- visible: true,
- legendgroup: ''
- }}]
- ];
- opts = {
- traceorder: 'normal'
- };
-
- legendData = getLegendData(calcdata, opts);
- expect(legendData).toEqual([]);
- });
-
- it('should reverse the order when legend.traceorder is set', function() {
- calcdata = [
- [{trace: {
- type: 'scatter',
- visible: true,
- legendgroup: '',
- showlegend: true
-
- }}],
- [{trace: {
- type: 'bar',
- visible: 'legendonly',
- legendgroup: '',
- showlegend: true
- }}],
- [{trace: {
- type: 'box',
+describe("legend getLegendData", function() {
+ "use strict";
+ var calcdata, opts, legendData, expected;
+
+ it("should group legendgroup traces", function() {
+ calcdata = [
+ [
+ {
+ trace: {
+ type: "scatter",
+ visible: true,
+ legendgroup: "group",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "bar",
+ visible: "legendonly",
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "scatter",
+ visible: true,
+ legendgroup: "group",
+ showlegend: true
+ }
+ }
+ ]
+ ];
+ opts = { traceorder: "grouped" };
+
+ legendData = getLegendData(calcdata, opts);
+
+ expected = [
+ [
+ [
+ {
+ trace: {
+ type: "scatter",
+ visible: true,
+ legendgroup: "group",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "scatter",
+ visible: true,
+ legendgroup: "group",
+ showlegend: true
+ }
+ }
+ ]
+ ],
+ [
+ [
+ {
+ trace: {
+ type: "bar",
+ visible: "legendonly",
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ]
+ ]
+ ];
+
+ expect(legendData).toEqual(expected);
+ expect(opts._lgroupsLength).toEqual(2);
+ });
+
+ it("should collapse when data has only one group", function() {
+ calcdata = [
+ [
+ {
+ trace: {
+ type: "scatter",
+ visible: true,
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "bar",
+ visible: "legendonly",
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "scatter",
+ visible: true,
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ]
+ ];
+ opts = { traceorder: "grouped" };
+
+ legendData = getLegendData(calcdata, opts);
+
+ expected = [
+ [
+ [
+ {
+ trace: {
+ type: "scatter",
+ visible: true,
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "bar",
+ visible: "legendonly",
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "scatter",
+ visible: true,
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ]
+ ]
+ ];
+
+ expect(legendData).toEqual(expected);
+ expect(opts._lgroupsLength).toEqual(1);
+ });
+
+ it("should return empty array when legend data has no traces", function() {
+ calcdata = [
+ [
+ {
+ trace: {
+ type: "histogram",
+ visible: true,
+ legendgroup: "",
+ showlegend: false
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "box",
+ visible: "legendonly",
+ legendgroup: "",
+ showlegend: false
+ }
+ }
+ ],
+ [{ trace: { type: "heatmap", visible: true, legendgroup: "" } }]
+ ];
+ opts = { traceorder: "normal" };
+
+ legendData = getLegendData(calcdata, opts);
+ expect(legendData).toEqual([]);
+ });
+
+ it("should reverse the order when legend.traceorder is set", function() {
+ calcdata = [
+ [
+ {
+ trace: {
+ type: "scatter",
+ visible: true,
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "bar",
+ visible: "legendonly",
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "box",
+ visible: true,
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ]
+ ];
+ opts = { traceorder: "reversed" };
+
+ legendData = getLegendData(calcdata, opts);
+
+ expected = [
+ [
+ [
+ {
+ trace: {
+ type: "box",
+ visible: true,
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "bar",
+ visible: "legendonly",
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "scatter",
+ visible: true,
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ]
+ ]
+ ];
+
+ expect(legendData).toEqual(expected);
+ expect(opts._lgroupsLength).toEqual(1);
+ });
+
+ it(
+ "should reverse the trace order within groups when reversed+grouped",
+ function() {
+ calcdata = [
+ [
+ {
+ trace: {
+ type: "scatter",
+ visible: true,
+ legendgroup: "group",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "bar",
+ visible: "legendonly",
+ legendgroup: "",
+ showlegend: true
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "box",
+ visible: true,
+ legendgroup: "group",
+ showlegend: true
+ }
+ }
+ ]
+ ];
+ opts = { traceorder: "reversed+grouped" };
+
+ legendData = getLegendData(calcdata, opts);
+
+ expected = [
+ [
+ [
+ {
+ trace: {
+ type: "box",
visible: true,
- legendgroup: '',
+ legendgroup: "group",
showlegend: true
- }}]
- ];
- opts = {
- traceorder: 'reversed'
- };
-
- legendData = getLegendData(calcdata, opts);
-
- expected = [
- [
- [{trace: {
- type: 'box',
- visible: true,
- legendgroup: '',
- showlegend: true
-
- }}],
- [{trace: {
- type: 'bar',
- visible: 'legendonly',
- legendgroup: '',
- showlegend: true
- }}],
- [{trace: {
- type: 'scatter',
- visible: true,
- legendgroup: '',
- showlegend: true
- }}]
- ]
- ];
-
- expect(legendData).toEqual(expected);
- expect(opts._lgroupsLength).toEqual(1);
- });
-
- it('should reverse the trace order within groups when reversed+grouped', function() {
- calcdata = [
- [{trace: {
- type: 'scatter',
+ }
+ }
+ ],
+ [
+ {
+ trace: {
+ type: "scatter",
visible: true,
- legendgroup: 'group',
+ legendgroup: "group",
showlegend: true
-
- }}],
- [{trace: {
- type: 'bar',
- visible: 'legendonly',
- legendgroup: '',
+ }
+ }
+ ]
+ ],
+ [
+ [
+ {
+ trace: {
+ type: "bar",
+ visible: "legendonly",
+ legendgroup: "",
showlegend: true
- }}],
- [{trace: {
- type: 'box',
- visible: true,
- legendgroup: 'group',
- showlegend: true
- }}]
- ];
- opts = {
- traceorder: 'reversed+grouped'
- };
-
- legendData = getLegendData(calcdata, opts);
-
- expected = [
- [
- [{trace: {
- type: 'box',
- visible: true,
- legendgroup: 'group',
- showlegend: true
-
- }}],
- [{trace: {
- type: 'scatter',
- visible: true,
- legendgroup: 'group',
- showlegend: true
- }}]
- ],
- [
- [{trace: {
- type: 'bar',
- visible: 'legendonly',
- legendgroup: '',
- showlegend: true
- }}]
- ]
- ];
-
- expect(legendData).toEqual(expected);
- expect(opts._lgroupsLength).toEqual(2);
- });
+ }
+ }
+ ]
+ ]
+ ];
+
+ expect(legendData).toEqual(expected);
+ expect(opts._lgroupsLength).toEqual(2);
+ }
+ );
});
-describe('legend helpers:', function() {
- 'use strict';
-
- describe('legendGetsTraces', function() {
- var legendGetsTrace = helpers.legendGetsTrace;
-
- it('should return true when trace is visible and supports legend', function() {
- expect(legendGetsTrace({ visible: true, type: 'bar' })).toBe(true);
- expect(legendGetsTrace({ visible: false, type: 'bar' })).toBe(false);
- expect(legendGetsTrace({ visible: true, type: 'contour' })).toBe(false);
- expect(legendGetsTrace({ visible: false, type: 'contour' })).toBe(false);
- });
- });
-
- describe('isGrouped', function() {
- var isGrouped = helpers.isGrouped;
-
- it('should return true when trace is visible and supports legend', function() {
- expect(isGrouped({ traceorder: 'normal' })).toBe(false);
- expect(isGrouped({ traceorder: 'grouped' })).toBe(true);
- expect(isGrouped({ traceorder: 'reversed+grouped' })).toBe(true);
- expect(isGrouped({ traceorder: 'grouped+reversed' })).toBe(true);
- expect(isGrouped({ traceorder: 'reversed' })).toBe(false);
- });
- });
-
- describe('isReversed', function() {
- var isReversed = helpers.isReversed;
-
- it('should return true when trace is visible and supports legend', function() {
- expect(isReversed({ traceorder: 'normal' })).toBe(false);
- expect(isReversed({ traceorder: 'grouped' })).toBe(false);
- expect(isReversed({ traceorder: 'reversed+grouped' })).toBe(true);
- expect(isReversed({ traceorder: 'grouped+reversed' })).toBe(true);
- expect(isReversed({ traceorder: 'reversed' })).toBe(true);
- });
- });
+describe("legend helpers:", function() {
+ "use strict";
+ describe("legendGetsTraces", function() {
+ var legendGetsTrace = helpers.legendGetsTrace;
+
+ it(
+ "should return true when trace is visible and supports legend",
+ function() {
+ expect(legendGetsTrace({ visible: true, type: "bar" })).toBe(true);
+ expect(legendGetsTrace({ visible: false, type: "bar" })).toBe(false);
+ expect(legendGetsTrace({ visible: true, type: "contour" })).toBe(false);
+ expect(legendGetsTrace({ visible: false, type: "contour" })).toBe(
+ false
+ );
+ }
+ );
+ });
+
+ describe("isGrouped", function() {
+ var isGrouped = helpers.isGrouped;
+
+ it(
+ "should return true when trace is visible and supports legend",
+ function() {
+ expect(isGrouped({ traceorder: "normal" })).toBe(false);
+ expect(isGrouped({ traceorder: "grouped" })).toBe(true);
+ expect(isGrouped({ traceorder: "reversed+grouped" })).toBe(true);
+ expect(isGrouped({ traceorder: "grouped+reversed" })).toBe(true);
+ expect(isGrouped({ traceorder: "reversed" })).toBe(false);
+ }
+ );
+ });
+
+ describe("isReversed", function() {
+ var isReversed = helpers.isReversed;
+
+ it(
+ "should return true when trace is visible and supports legend",
+ function() {
+ expect(isReversed({ traceorder: "normal" })).toBe(false);
+ expect(isReversed({ traceorder: "grouped" })).toBe(false);
+ expect(isReversed({ traceorder: "reversed+grouped" })).toBe(true);
+ expect(isReversed({ traceorder: "grouped+reversed" })).toBe(true);
+ expect(isReversed({ traceorder: "reversed" })).toBe(true);
+ }
+ );
+ });
});
-describe('legend anchor utils:', function() {
- 'use strict';
-
- describe('isRightAnchor', function() {
- var isRightAnchor = anchorUtils.isRightAnchor;
- var threshold = 2 / 3;
+describe("legend anchor utils:", function() {
+ "use strict";
+ describe("isRightAnchor", function() {
+ var isRightAnchor = anchorUtils.isRightAnchor;
+ var threshold = 2 / 3;
- it('should return true when \'xanchor\' is set to \'right\'', function() {
- expect(isRightAnchor({ xanchor: 'left' })).toBe(false);
- expect(isRightAnchor({ xanchor: 'center' })).toBe(false);
- expect(isRightAnchor({ xanchor: 'right' })).toBe(true);
- });
-
- it('should return true when \'xanchor\' is set to \'auto\' and \'x\' >= 2/3', function() {
- var opts = { xanchor: 'auto' };
-
- [0, 0.4, 0.7, 1].forEach(function(v) {
- opts.x = v;
- expect(isRightAnchor(opts))
- .toBe(v > threshold, 'case ' + v);
- });
- });
+ it("should return true when 'xanchor' is set to 'right'", function() {
+ expect(isRightAnchor({ xanchor: "left" })).toBe(false);
+ expect(isRightAnchor({ xanchor: "center" })).toBe(false);
+ expect(isRightAnchor({ xanchor: "right" })).toBe(true);
});
- describe('isCenterAnchor', function() {
- var isCenterAnchor = anchorUtils.isCenterAnchor;
- var threshold0 = 1 / 3;
- var threshold1 = 2 / 3;
+ it(
+ "should return true when 'xanchor' is set to 'auto' and 'x' >= 2/3",
+ function() {
+ var opts = { xanchor: "auto" };
- it('should return true when \'xanchor\' is set to \'center\'', function() {
- expect(isCenterAnchor({ xanchor: 'left' })).toBe(false);
- expect(isCenterAnchor({ xanchor: 'center' })).toBe(true);
- expect(isCenterAnchor({ xanchor: 'right' })).toBe(false);
- });
-
- it('should return true when \'xanchor\' is set to \'auto\' and 1/3 < \'x\' < 2/3', function() {
- var opts = { xanchor: 'auto' };
-
- [0, 0.4, 0.7, 1].forEach(function(v) {
- opts.x = v;
- expect(isCenterAnchor(opts))
- .toBe(v > threshold0 && v < threshold1, 'case ' + v);
- });
+ [0, 0.4, 0.7, 1].forEach(function(v) {
+ opts.x = v;
+ expect(isRightAnchor(opts)).toBe(v > threshold, "case " + v);
});
+ }
+ );
+ });
+
+ describe("isCenterAnchor", function() {
+ var isCenterAnchor = anchorUtils.isCenterAnchor;
+ var threshold0 = 1 / 3;
+ var threshold1 = 2 / 3;
+
+ it("should return true when 'xanchor' is set to 'center'", function() {
+ expect(isCenterAnchor({ xanchor: "left" })).toBe(false);
+ expect(isCenterAnchor({ xanchor: "center" })).toBe(true);
+ expect(isCenterAnchor({ xanchor: "right" })).toBe(false);
});
- describe('isBottomAnchor', function() {
- var isBottomAnchor = anchorUtils.isBottomAnchor;
- var threshold = 1 / 3;
-
- it('should return true when \'yanchor\' is set to \'right\'', function() {
- expect(isBottomAnchor({ yanchor: 'top' })).toBe(false);
- expect(isBottomAnchor({ yanchor: 'middle' })).toBe(false);
- expect(isBottomAnchor({ yanchor: 'bottom' })).toBe(true);
- });
-
- it('should return true when \'yanchor\' is set to \'auto\' and \'y\' <= 1/3', function() {
- var opts = { yanchor: 'auto' };
-
- [0, 0.4, 0.7, 1].forEach(function(v) {
- opts.y = v;
- expect(isBottomAnchor(opts))
- .toBe(v < threshold, 'case ' + v);
- });
+ it(
+ "should return true when 'xanchor' is set to 'auto' and 1/3 < 'x' < 2/3",
+ function() {
+ var opts = { xanchor: "auto" };
+
+ [0, 0.4, 0.7, 1].forEach(function(v) {
+ opts.x = v;
+ expect(isCenterAnchor(opts)).toBe(
+ v > threshold0 && v < threshold1,
+ "case " + v
+ );
});
+ }
+ );
+ });
+
+ describe("isBottomAnchor", function() {
+ var isBottomAnchor = anchorUtils.isBottomAnchor;
+ var threshold = 1 / 3;
+
+ it("should return true when 'yanchor' is set to 'right'", function() {
+ expect(isBottomAnchor({ yanchor: "top" })).toBe(false);
+ expect(isBottomAnchor({ yanchor: "middle" })).toBe(false);
+ expect(isBottomAnchor({ yanchor: "bottom" })).toBe(true);
});
- describe('isMiddleAnchor', function() {
- var isMiddleAnchor = anchorUtils.isMiddleAnchor;
- var threshold0 = 1 / 3;
- var threshold1 = 2 / 3;
+ it(
+ "should return true when 'yanchor' is set to 'auto' and 'y' <= 1/3",
+ function() {
+ var opts = { yanchor: "auto" };
- it('should return true when \'yanchor\' is set to \'center\'', function() {
- expect(isMiddleAnchor({ yanchor: 'top' })).toBe(false);
- expect(isMiddleAnchor({ yanchor: 'middle' })).toBe(true);
- expect(isMiddleAnchor({ yanchor: 'bottom' })).toBe(false);
+ [0, 0.4, 0.7, 1].forEach(function(v) {
+ opts.y = v;
+ expect(isBottomAnchor(opts)).toBe(v < threshold, "case " + v);
});
+ }
+ );
+ });
+
+ describe("isMiddleAnchor", function() {
+ var isMiddleAnchor = anchorUtils.isMiddleAnchor;
+ var threshold0 = 1 / 3;
+ var threshold1 = 2 / 3;
+
+ it("should return true when 'yanchor' is set to 'center'", function() {
+ expect(isMiddleAnchor({ yanchor: "top" })).toBe(false);
+ expect(isMiddleAnchor({ yanchor: "middle" })).toBe(true);
+ expect(isMiddleAnchor({ yanchor: "bottom" })).toBe(false);
+ });
- it('should return true when \'yanchor\' is set to \'auto\' and 1/3 < \'y\' < 2/3', function() {
- var opts = { yanchor: 'auto' };
-
- [0, 0.4, 0.7, 1].forEach(function(v) {
- opts.y = v;
- expect(isMiddleAnchor(opts))
- .toBe(v > threshold0 && v < threshold1, 'case ' + v);
- });
+ it(
+ "should return true when 'yanchor' is set to 'auto' and 1/3 < 'y' < 2/3",
+ function() {
+ var opts = { yanchor: "auto" };
+
+ [0, 0.4, 0.7, 1].forEach(function(v) {
+ opts.y = v;
+ expect(isMiddleAnchor(opts)).toBe(
+ v > threshold0 && v < threshold1,
+ "case " + v
+ );
});
- });
+ }
+ );
+ });
});
-describe('legend relayout update', function() {
- 'use strict';
-
- afterEach(destroyGraphDiv);
+describe("legend relayout update", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
- it('should update border styling', function(done) {
- var mock = require('@mocks/0.json'),
- mockCopy = Lib.extendDeep({}, mock),
- gd = createGraphDiv();
+ it("should update border styling", function(done) {
+ var mock = require("@mocks/0.json"),
+ mockCopy = Lib.extendDeep({}, mock),
+ gd = createGraphDiv();
- function assertLegendStyle(bgColor, borderColor, borderWidth) {
- var node = d3.select('g.legend').select('rect');
-
- expect(node.style('fill')).toEqual(bgColor);
- expect(node.style('stroke')).toEqual(borderColor);
- expect(node.style('stroke-width')).toEqual(borderWidth + 'px');
- }
+ function assertLegendStyle(bgColor, borderColor, borderWidth) {
+ var node = d3.select("g.legend").select("rect");
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
- assertLegendStyle('rgb(255, 255, 255)', 'rgb(0, 0, 0)', 1);
+ expect(node.style("fill")).toEqual(bgColor);
+ expect(node.style("stroke")).toEqual(borderColor);
+ expect(node.style("stroke-width")).toEqual(borderWidth + "px");
+ }
- return Plotly.relayout(gd, {
- 'legend.bordercolor': 'red',
- 'legend.bgcolor': 'blue'
- });
- }).then(function() {
- assertLegendStyle('rgb(0, 0, 255)', 'rgb(255, 0, 0)', 1);
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout)
+ .then(function() {
+ assertLegendStyle("rgb(255, 255, 255)", "rgb(0, 0, 0)", 1);
- return Plotly.relayout(gd, 'legend.borderwidth', 10);
- }).then(function() {
- assertLegendStyle('rgb(0, 0, 255)', 'rgb(255, 0, 0)', 10);
-
- return Plotly.relayout(gd, 'legend.bgcolor', null);
- }).then(function() {
- assertLegendStyle('rgb(255, 255, 255)', 'rgb(255, 0, 0)', 10);
-
- return Plotly.relayout(gd, 'paper_bgcolor', 'blue');
- }).then(function() {
- assertLegendStyle('rgb(0, 0, 255)', 'rgb(255, 0, 0)', 10);
-
- done();
+ return Plotly.relayout(gd, {
+ "legend.bordercolor": "red",
+ "legend.bgcolor": "blue"
});
- });
+ })
+ .then(function() {
+ assertLegendStyle("rgb(0, 0, 255)", "rgb(255, 0, 0)", 1);
+
+ return Plotly.relayout(gd, "legend.borderwidth", 10);
+ })
+ .then(function() {
+ assertLegendStyle("rgb(0, 0, 255)", "rgb(255, 0, 0)", 10);
+
+ return Plotly.relayout(gd, "legend.bgcolor", null);
+ })
+ .then(function() {
+ assertLegendStyle("rgb(255, 255, 255)", "rgb(255, 0, 0)", 10);
+
+ return Plotly.relayout(gd, "paper_bgcolor", "blue");
+ })
+ .then(function() {
+ assertLegendStyle("rgb(0, 0, 255)", "rgb(255, 0, 0)", 10);
+
+ done();
+ });
+ });
});
-describe('legend orientation change:', function() {
- 'use strict';
-
- afterEach(destroyGraphDiv);
-
- it('should update plot background', function(done) {
- var mock = require('@mocks/legend_horizontal_autowrap.json'),
- gd = createGraphDiv(),
- initialLegendBGColor;
-
- Plotly.plot(gd, mock.data, mock.layout).then(function() {
- initialLegendBGColor = gd._fullLayout.legend.bgcolor;
- return Plotly.relayout(gd, 'legend.bgcolor', '#000000');
- }).then(function() {
- expect(gd._fullLayout.legend.bgcolor).toBe('#000000');
- return Plotly.relayout(gd, 'legend.bgcolor', initialLegendBGColor);
- }).then(function() {
- expect(gd._fullLayout.legend.bgcolor).toBe(initialLegendBGColor);
- done();
- });
- });
+describe("legend orientation change:", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
+
+ it("should update plot background", function(done) {
+ var mock = require("@mocks/legend_horizontal_autowrap.json"),
+ gd = createGraphDiv(),
+ initialLegendBGColor;
+
+ Plotly.plot(gd, mock.data, mock.layout)
+ .then(function() {
+ initialLegendBGColor = gd._fullLayout.legend.bgcolor;
+ return Plotly.relayout(gd, "legend.bgcolor", "#000000");
+ })
+ .then(function() {
+ expect(gd._fullLayout.legend.bgcolor).toBe("#000000");
+ return Plotly.relayout(gd, "legend.bgcolor", initialLegendBGColor);
+ })
+ .then(function() {
+ expect(gd._fullLayout.legend.bgcolor).toBe(initialLegendBGColor);
+ done();
+ });
+ });
});
-describe('legend restyle update', function() {
- 'use strict';
-
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
- });
-
- afterEach(destroyGraphDiv);
-
- it('should update trace toggle background rectangle', function(done) {
- var mock = require('@mocks/0.json'),
- mockCopy = Lib.extendDeep({}, mock),
- gd = createGraphDiv();
-
- mockCopy.data[0].visible = false;
- mockCopy.data[0].showlegend = false;
- mockCopy.data[1].visible = false;
- mockCopy.data[1].showlegend = false;
-
- function countLegendItems() {
- return d3.select(gd).selectAll('rect.legendtoggle').size();
- }
-
- function assertTraceToggleRect() {
- var nodes = d3.selectAll('rect.legendtoggle');
-
- nodes.each(function() {
- var node = d3.select(this);
-
- expect(node.attr('x')).toEqual('0');
- expect(node.attr('y')).toEqual('-9.5');
- expect(node.attr('height')).toEqual('19');
-
- var w = +node.attr('width');
- expect(Math.abs(w - 160)).toBeLessThan(10);
- });
- }
-
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
- expect(countLegendItems()).toEqual(1);
- assertTraceToggleRect();
-
- return Plotly.restyle(gd, 'visible', [true, false, false]);
- }).then(function() {
- expect(countLegendItems()).toEqual(0);
-
- return Plotly.restyle(gd, 'showlegend', [true, false, false]);
- }).then(function() {
- expect(countLegendItems()).toEqual(1);
- assertTraceToggleRect();
-
- done();
- });
- });
+describe("legend restyle update", function() {
+ "use strict";
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
+
+ afterEach(destroyGraphDiv);
+
+ it("should update trace toggle background rectangle", function(done) {
+ var mock = require("@mocks/0.json"),
+ mockCopy = Lib.extendDeep({}, mock),
+ gd = createGraphDiv();
+
+ mockCopy.data[0].visible = false;
+ mockCopy.data[0].showlegend = false;
+ mockCopy.data[1].visible = false;
+ mockCopy.data[1].showlegend = false;
+
+ function countLegendItems() {
+ return d3.select(gd).selectAll("rect.legendtoggle").size();
+ }
+
+ function assertTraceToggleRect() {
+ var nodes = d3.selectAll("rect.legendtoggle");
+
+ nodes.each(function() {
+ var node = d3.select(this);
+
+ expect(node.attr("x")).toEqual("0");
+ expect(node.attr("y")).toEqual("-9.5");
+ expect(node.attr("height")).toEqual("19");
+
+ var w = +node.attr("width");
+ expect(Math.abs(w - 160)).toBeLessThan(10);
+ });
+ }
+
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout)
+ .then(function() {
+ expect(countLegendItems()).toEqual(1);
+ assertTraceToggleRect();
+
+ return Plotly.restyle(gd, "visible", [true, false, false]);
+ })
+ .then(function() {
+ expect(countLegendItems()).toEqual(0);
+
+ return Plotly.restyle(gd, "showlegend", [true, false, false]);
+ })
+ .then(function() {
+ expect(countLegendItems()).toEqual(1);
+ assertTraceToggleRect();
+
+ done();
+ });
+ });
});
diff --git a/test/jasmine/tests/lib_date_test.js b/test/jasmine/tests/lib_date_test.js
index 2c5cd93e615..7b869970750 100644
--- a/test/jasmine/tests/lib_date_test.js
+++ b/test/jasmine/tests/lib_date_test.js
@@ -1,605 +1,749 @@
-var isNumeric = require('fast-isnumeric');
+var isNumeric = require("fast-isnumeric");
-var Lib = require('@src/lib');
-var calComponent = require('@src/components/calendars');
+var Lib = require("@src/lib");
+var calComponent = require("@src/components/calendars");
// use only the parts of world-calendars that we've imported for our tests
-var calendars = require('@src/components/calendars/calendars');
-
-describe('dates', function() {
- 'use strict';
-
- var d1c = new Date(2000, 0, 1, 1, 0, 0, 600);
- // first-century years must be set separately as Date constructor maps 2-digit years
- // to near the present, but we accept them as part of 4-digit years
- d1c.setFullYear(13);
-
- var thisYear = new Date().getFullYear(),
- thisYear_2 = thisYear % 100,
- nowMinus70 = thisYear - 70,
- nowMinus70_2 = nowMinus70 % 100,
- nowPlus29 = thisYear + 29,
- nowPlus29_2 = nowPlus29 % 100;
-
- describe('dateTime2ms', function() {
- it('should accept valid date strings', function() {
- var tzOffset;
-
- [
- ['2016', new Date(2016, 0, 1)],
- ['2016-05', new Date(2016, 4, 1)],
- // leap year, and whitespace
- ['\r\n\t 2016-02-29\r\n\t ', new Date(2016, 1, 29)],
- ['9814-08-23', new Date(9814, 7, 23)],
- ['1564-03-14 12', new Date(1564, 2, 14, 12)],
- ['0122-04-08 08:22', new Date(122, 3, 8, 8, 22)],
- ['-0098-11-19 23:59:59', new Date(-98, 10, 19, 23, 59, 59)],
- ['-9730-12-01 12:34:56.789', new Date(-9730, 11, 1, 12, 34, 56, 789)],
- // random whitespace before and after gets stripped
- ['\r\n\t -9730-12-01 12:34:56.789\r\n\t ', new Date(-9730, 11, 1, 12, 34, 56, 789)],
- // first century, also allow month, day, and hour to be 1-digit, and not all
- // three digits of milliseconds
- ['0013-1-1 1:00:00.6', d1c],
- // we support tenths of msec too, though Date objects don't. Smaller than that
- // and we hit the precision limit of js numbers unless we're close to the epoch.
- // It won't break though.
- ['0013-1-1 1:00:00.6001', +d1c + 0.1],
- ['0013-1-1 1:00:00.60011111111', +d1c + 0.11111111],
-
- // 2-digit years get mapped to now-70 -> now+29
- [thisYear_2 + '-05', new Date(thisYear, 4, 1)],
- [nowMinus70_2 + '-10-18', new Date(nowMinus70, 9, 18)],
- [nowPlus29_2 + '-02-12 14:29:32', new Date(nowPlus29, 1, 12, 14, 29, 32)],
-
- // including timezone info (that we discard)
- ['2014-03-04 08:15Z', new Date(2014, 2, 4, 8, 15)],
- ['2014-03-04 08:15:00.00z', new Date(2014, 2, 4, 8, 15)],
- ['2014-03-04 08:15:34+1200', new Date(2014, 2, 4, 8, 15, 34)],
- ['2014-03-04 08:15:34.567-05:45', new Date(2014, 2, 4, 8, 15, 34, 567)],
- ].forEach(function(v) {
- // just for sub-millisecond precision tests, use timezoneoffset
- // from the previous date object
- if(v[1].getTimezoneOffset) tzOffset = v[1].getTimezoneOffset();
-
- var expected = +v[1] - (tzOffset * 60000);
- expect(Lib.dateTime2ms(v[0])).toBe(expected, v[0]);
-
- // ISO-8601: all the same stuff with t or T as the separator
- expect(Lib.dateTime2ms(v[0].trim().replace(' ', 't'))).toBe(expected, v[0].trim().replace(' ', 't'));
- expect(Lib.dateTime2ms('\r\n\t ' + v[0].trim().replace(' ', 'T') + '\r\n\t ')).toBe(expected, v[0].trim().replace(' ', 'T'));
- });
- });
-
- it('should accept 4-digit and 2-digit numbers', function() {
- // not sure if we really *want* this behavior, but it's what we have.
- // especially since the number 0 is *not* allowed it seems pretty unlikely
- // to cause problems for people using milliseconds as dates, since the only
- // values to get mistaken are between 1 and 10 seconds before and after
- // the epoch, and between 10 and 99 milliseconds after the epoch
- // (note that millisecond numbers are not handled by dateTime2ms directly,
- // but in ax.d2c if dateTime2ms fails.)
- [
- 1000, 9999, -1000, -9999
- ].forEach(function(v) {
- expect(Lib.dateTime2ms(v)).toBe(Date.UTC(v, 0, 1), v);
- });
-
- [
- [10, 2010],
- [nowPlus29_2, nowPlus29],
- [nowMinus70_2, nowMinus70],
- [99, 1999]
- ].forEach(function(v) {
- expect(Lib.dateTime2ms(v[0])).toBe(Date.UTC(v[1], 0, 1), v[0]);
- });
- });
-
- it('should accept Date objects within year +/-9999', function() {
- [
- new Date(),
- new Date(-9999, 0, 1),
- new Date(9999, 11, 31, 23, 59, 59, 999),
- new Date(-1, 0, 1),
- new Date(323, 11, 30),
- new Date(-456, 1, 2),
- d1c,
- new Date(2015, 8, 7, 23, 34, 45, 567)
- ].forEach(function(v) {
- expect(Lib.dateTime2ms(v)).toBe(+v - v.getTimezoneOffset() * 60000);
- });
- });
-
- it('should not accept Date objects beyond our limits', function() {
- [
- new Date(10000, 0, 1),
- new Date(-10000, 11, 31, 23, 59, 59, 999)
- ].forEach(function(v) {
- expect(Lib.dateTime2ms(v)).toBeUndefined(v);
- });
- });
-
- it('should not accept invalid strings or other objects', function() {
- [
- '', 0, 1, 9, -1, -10, -99, 100, 999, -100, -999, 10000, -10000,
- 1.2, -1.2, 2015.1, -1023.4, NaN, null, undefined, Infinity, -Infinity,
- {}, {1: '2014-01-01'}, [], [2016], ['2015-11-23'],
- '123-01-01', '-756-01-01', // 3-digit year
- '10000-01-01', '-10000-01-01', // 5-digit year
- '2015-00-01', '2015-13-01', '2015-001-01', // bad month
- '2015-01-00', '2015-01-32', '2015-02-29', '2015-04-31', '2015-01-001', // bad day (incl non-leap year)
- '2015-01-01 24:00', '2015-01-01 -1:00', '2015-01-01 001:00', // bad hour
- '2015-01-01 12:60', '2015-01-01 12:-1', '2015-01-01 12:001', '2015-01-01 12:1', // bad minute
- '2015-01-01 12:00:60', '2015-01-01 12:00:-1', '2015-01-01 12:00:001', '2015-01-01 12:00:1', // bad second
- '2015-01-01T', '2015-01-01TT12:34', // bad ISO separators
- '2015-01-01Z', '2015-01-01T12Z', '2015-01-01T12:34Z05:00', '2015-01-01 12:34+500', '2015-01-01 12:34-5:00' // bad TZ info
- ].forEach(function(v) {
- expect(Lib.dateTime2ms(v)).toBeUndefined(v);
- });
- });
-
- var JULY1MS = 181 * 24 * 3600 * 1000;
-
- it('should use UTC with no timezone offset or daylight saving time', function() {
- expect(Lib.dateTime2ms('1970-01-01')).toBe(0);
-
- // 181 days (and no DST hours) between jan 1 and july 1 in a non-leap-year
- // 31 + 28 + 31 + 30 + 31 + 30
- expect(Lib.dateTime2ms('1970-07-01')).toBe(JULY1MS);
- });
-
- it('should interpret JS dates by local time, not by its getTime()', function() {
- // not really part of the test, just to make sure the test is meaningful
- // the test should NOT be run in a UTC environment
- var local0 = Number(new Date(1970, 0, 1)),
- localjuly1 = Number(new Date(1970, 6, 1));
- expect([local0, localjuly1]).not.toEqual([0, JULY1MS],
- 'test must not run in UTC');
- // verify that there *is* daylight saving time in the test environment
- expect(localjuly1 - local0).not.toEqual(JULY1MS - 0,
- 'test must run in a timezone with DST');
-
- // now repeat the previous test and show that we throw away
- // timezone info from js dates
- expect(Lib.dateTime2ms(new Date(1970, 0, 1))).toBe(0);
- expect(Lib.dateTime2ms(new Date(1970, 6, 1))).toBe(JULY1MS);
- });
+var calendars = require("@src/components/calendars/calendars");
+
+describe("dates", function() {
+ "use strict";
+ var d1c = new Date(2000, 0, 1, 1, 0, 0, 600);
+ // first-century years must be set separately as Date constructor maps 2-digit years
+ // to near the present, but we accept them as part of 4-digit years
+ d1c.setFullYear(13);
+
+ var thisYear = new Date().getFullYear(),
+ thisYear_2 = thisYear % 100,
+ nowMinus70 = thisYear - 70,
+ nowMinus70_2 = nowMinus70 % 100,
+ nowPlus29 = thisYear + 29,
+ nowPlus29_2 = nowPlus29 % 100;
+
+ describe("dateTime2ms", function() {
+ it("should accept valid date strings", function() {
+ var tzOffset;
+
+ [
+ ["2016", new Date(2016, 0, 1)],
+ ["2016-05", new Date(2016, 4, 1)],
+ // leap year, and whitespace
+ ["\r\n\t 2016-02-29\r\n\t ", new Date(2016, 1, 29)],
+ ["9814-08-23", new Date(9814, 7, 23)],
+ ["1564-03-14 12", new Date(1564, 2, 14, 12)],
+ ["0122-04-08 08:22", new Date(122, 3, 8, 8, 22)],
+ ["-0098-11-19 23:59:59", new Date(-98, 10, 19, 23, 59, 59)],
+ ["-9730-12-01 12:34:56.789", new Date(-9730, 11, 1, 12, 34, 56, 789)],
+ // random whitespace before and after gets stripped
+ [
+ "\r\n\t -9730-12-01 12:34:56.789\r\n\t ",
+ new Date(-9730, 11, 1, 12, 34, 56, 789)
+ ],
+ // first century, also allow month, day, and hour to be 1-digit, and not all
+ // three digits of milliseconds
+ ["0013-1-1 1:00:00.6", d1c],
+ // we support tenths of msec too, though Date objects don't. Smaller than that
+ // and we hit the precision limit of js numbers unless we're close to the epoch.
+ // It won't break though.
+ ["0013-1-1 1:00:00.6001", +d1c + 0.1],
+ ["0013-1-1 1:00:00.60011111111", +d1c + 0.11111111],
+ // 2-digit years get mapped to now-70 -> now+29
+ [thisYear_2 + "-05", new Date(thisYear, 4, 1)],
+ [nowMinus70_2 + "-10-18", new Date(nowMinus70, 9, 18)],
+ [
+ nowPlus29_2 + "-02-12 14:29:32",
+ new Date(nowPlus29, 1, 12, 14, 29, 32)
+ ],
+ // including timezone info (that we discard)
+ ["2014-03-04 08:15Z", new Date(2014, 2, 4, 8, 15)],
+ ["2014-03-04 08:15:00.00z", new Date(2014, 2, 4, 8, 15)],
+ ["2014-03-04 08:15:34+1200", new Date(2014, 2, 4, 8, 15, 34)],
+ ["2014-03-04 08:15:34.567-05:45", new Date(2014, 2, 4, 8, 15, 34, 567)]
+ ].forEach(function(v) {
+ // just for sub-millisecond precision tests, use timezoneoffset
+ // from the previous date object
+ if (v[1].getTimezoneOffset) tzOffset = v[1].getTimezoneOffset();
+
+ var expected = +v[1] - tzOffset * 60000;
+ expect(Lib.dateTime2ms(v[0])).toBe(expected, v[0]);
+
+ // ISO-8601: all the same stuff with t or T as the separator
+ expect(Lib.dateTime2ms(v[0].trim().replace(" ", "t"))).toBe(
+ expected,
+ v[0].trim().replace(" ", "t")
+ );
+ expect(
+ Lib.dateTime2ms("\r\n\t " + v[0].trim().replace(" ", "T") + "\r\n\t ")
+ ).toBe(expected, v[0].trim().replace(" ", "T"));
+ });
});
- describe('ms2DateTime', function() {
- it('should report the minimum fields with nonzero values, except minutes', function() {
- [
- '2016-01-01', // we'll never report less than this bcs month and day are never zero
- '2016-01-01 01:00', // we won't report hours without minutes
- '2016-01-01 01:01',
- '2016-01-01 01:01:01',
- '2016-01-01 01:01:01.1',
- '2016-01-01 01:01:01.01',
- '2016-01-01 01:01:01.001',
- '2016-01-01 01:01:01.0001'
- ].forEach(function(v) {
- expect(Lib.ms2DateTime(Lib.dateTime2ms(v))).toBe(v);
- });
- });
-
- it('should accept Date objects within year +/-9999', function() {
- [
- '-9999-01-01',
- '-9999-01-01 00:00:00.0001',
- '9999-12-31 23:59:59.9999',
- '0123-01-01',
- '0042-01-01',
- '-0016-01-01',
- '-0016-01-01 12:34:56.7891',
- '-0456-07-23 16:22'
- ].forEach(function(v) {
- expect(Lib.ms2DateTime(Lib.dateTime2ms(v))).toBe(v);
- });
- });
-
- it('should not accept Date objects beyond our limits or other objects', function() {
- [
- Date.UTC(10000, 0, 1),
- Date.UTC(-10000, 11, 31, 23, 59, 59, 999),
- '',
- '2016-01-01',
- '0',
- [], [0], {}, {1: 2}
- ].forEach(function(v) {
- expect(Lib.ms2DateTime(v)).toBeUndefined(v);
- });
- });
-
- it('should drop the right pieces if rounding is specified', function() {
- [
- ['2016-01-01 00:00:00.0001', 0, '2016-01-01 00:00:00.0001'],
- ['2016-01-01 00:00:00.0001', 299999, '2016-01-01 00:00:00.0001'],
- ['2016-01-01 00:00:00.0001', 300000, '2016-01-01'],
- ['2016-01-01 00:00:00.0001', 7776000000, '2016-01-01'],
- ['2016-01-01 12:34:56.7891', 0, '2016-01-01 12:34:56.7891'],
- ['2016-01-01 12:34:56.7891', 299999, '2016-01-01 12:34:56.7891'],
- ['2016-01-01 12:34:56.7891', 300000, '2016-01-01 12:34:56'],
- ['2016-01-01 12:34:56.7891', 10799999, '2016-01-01 12:34:56'],
- ['2016-01-01 12:34:56.7891', 10800000, '2016-01-01 12:34'],
- ['2016-01-01 12:34:56.7891', 7775999999, '2016-01-01 12:34'],
- ['2016-01-01 12:34:56.7891', 7776000000, '2016-01-01'],
- ['2016-01-01 12:34:56.7891', 1e300, '2016-01-01']
- ].forEach(function(v) {
- expect(Lib.ms2DateTime(Lib.dateTime2ms(v[0]), v[1])).toBe(v[2], v);
- });
- });
-
- it('should work right with inputs beyond our precision', function() {
- for(var i = -1; i <= 1; i += 0.001) {
- var tenths = Math.round(i * 10),
- base = i < -0.05 ? '1969-12-31 23:59:59.99' : '1970-01-01 00:00:00.00',
- expected = (base + String(tenths + 200).substr(1))
- .replace(/0+$/, '')
- .replace(/ 00:00:00[\.]$/, '');
- expect(Lib.ms2DateTime(i)).toBe(expected, i);
- }
- });
+ it("should accept 4-digit and 2-digit numbers", function() {
+ // not sure if we really *want* this behavior, but it's what we have.
+ // especially since the number 0 is *not* allowed it seems pretty unlikely
+ // to cause problems for people using milliseconds as dates, since the only
+ // values to get mistaken are between 1 and 10 seconds before and after
+ // the epoch, and between 10 and 99 milliseconds after the epoch
+ // (note that millisecond numbers are not handled by dateTime2ms directly,
+ // but in ax.d2c if dateTime2ms fails.)
+ [1000, 9999, -1000, -9999].forEach(function(v) {
+ expect(Lib.dateTime2ms(v)).toBe(Date.UTC(v, 0, 1), v);
+ });
+
+ [
+ [10, 2010],
+ [nowPlus29_2, nowPlus29],
+ [nowMinus70_2, nowMinus70],
+ [99, 1999]
+ ].forEach(function(v) {
+ expect(Lib.dateTime2ms(v[0])).toBe(Date.UTC(v[1], 0, 1), v[0]);
+ });
});
- describe('world calendar inputs', function() {
- it('should give the right values near epoch zero', function() {
- [
- [undefined, '1970-01-01'],
- ['gregorian', '1970-01-01'],
- ['chinese', '1969-11-24'],
- ['coptic', '1686-04-23'],
- ['discworld', '1798-12-27'],
- ['ethiopian', '1962-04-23'],
- ['hebrew', '5730-10-23'],
- ['islamic', '1389-10-22'],
- ['julian', '1969-12-19'],
- ['mayan', '5156-07-05'],
- ['nanakshahi', '0501-10-19'],
- ['nepali', '2026-09-17'],
- ['persian', '1348-10-11'],
- ['jalali', '1348-10-11'],
- ['taiwan', '0059-01-01'],
- ['thai', '2513-01-01'],
- ['ummalqura', '1389-10-23']
- ].forEach(function(v) {
- var calendar = v[0],
- dateStr = v[1];
- expect(Lib.ms2DateTime(0, 0, calendar)).toBe(dateStr, calendar);
- expect(Lib.dateTime2ms(dateStr, calendar)).toBe(0, calendar);
-
- var expected_p1ms = dateStr + ' 00:00:00.0001',
- expected_1s = dateStr + ' 00:00:01',
- expected_1m = dateStr + ' 00:01',
- expected_1h = dateStr + ' 01:00',
- expected_lastinstant = dateStr + ' 23:59:59.9999';
-
- var oneSec = 1000,
- oneMin = 60 * oneSec,
- oneHour = 60 * oneMin,
- lastInstant = 24 * oneHour - 0.1;
-
- expect(Lib.ms2DateTime(0.1, 0, calendar)).toBe(expected_p1ms, calendar);
- expect(Lib.ms2DateTime(oneSec, 0, calendar)).toBe(expected_1s, calendar);
- expect(Lib.ms2DateTime(oneMin, 0, calendar)).toBe(expected_1m, calendar);
- expect(Lib.ms2DateTime(oneHour, 0, calendar)).toBe(expected_1h, calendar);
- expect(Lib.ms2DateTime(lastInstant, 0, calendar)).toBe(expected_lastinstant, calendar);
-
- expect(Lib.dateTime2ms(expected_p1ms, calendar)).toBe(0.1, calendar);
- expect(Lib.dateTime2ms(expected_1s, calendar)).toBe(oneSec, calendar);
- expect(Lib.dateTime2ms(expected_1m, calendar)).toBe(oneMin, calendar);
- expect(Lib.dateTime2ms(expected_1h, calendar)).toBe(oneHour, calendar);
- expect(Lib.dateTime2ms(expected_lastinstant, calendar)).toBe(lastInstant, calendar);
- });
- });
+ it("should accept Date objects within year +/-9999", function() {
+ [
+ new Date(),
+ new Date(-9999, 0, 1),
+ new Date(9999, 11, 31, 23, 59, 59, 999),
+ new Date(-1, 0, 1),
+ new Date(323, 11, 30),
+ new Date(-456, 1, 2),
+ d1c,
+ new Date(2015, 8, 7, 23, 34, 45, 567)
+ ].forEach(function(v) {
+ expect(Lib.dateTime2ms(v)).toBe(+v - v.getTimezoneOffset() * 60000);
+ });
+ });
- it('should contain canonical ticks sundays, ranges for all calendars', function() {
- var calList = Object.keys(calendars.calendars).filter(function(v) {
- return v !== 'gregorian';
- });
-
- var canonicalTick = calComponent.CANONICAL_TICK,
- canonicalSunday = calComponent.CANONICAL_SUNDAY,
- dfltRange = calComponent.DFLTRANGE;
- expect(Object.keys(canonicalTick).length).toBe(calList.length);
- expect(Object.keys(canonicalSunday).length).toBe(calList.length);
- expect(Object.keys(dfltRange).length).toBe(calList.length);
-
- calList.forEach(function(calendar) {
- expect(Lib.dateTime2ms(canonicalTick[calendar], calendar)).toBeDefined(calendar);
- var sunday = Lib.dateTime2ms(canonicalSunday[calendar], calendar);
- // convert back implicitly with gregorian calendar
- expect(Lib.formatDate(sunday, '%A')).toBe('Sunday', calendar);
-
- expect(Lib.dateTime2ms(dfltRange[calendar][0], calendar)).toBeDefined(calendar);
- expect(Lib.dateTime2ms(dfltRange[calendar][1], calendar)).toBeDefined(calendar);
- });
- });
+ it("should not accept Date objects beyond our limits", function() {
+ [
+ new Date(10000, 0, 1),
+ new Date(-10000, 11, 31, 23, 59, 59, 999)
+ ].forEach(function(v) {
+ expect(Lib.dateTime2ms(v)).toBeUndefined(v);
+ });
+ });
- it('should handle Chinese intercalary months correctly', function() {
- var intercalaryDates = [
- '1995-08i-01',
- '1995-08i-29',
- '1984-10i-15',
- '2023-02i-29'
- ];
- intercalaryDates.forEach(function(v) {
- var ms = Lib.dateTime2ms(v, 'chinese');
- expect(Lib.ms2DateTime(ms, 0, 'chinese')).toBe(v);
-
- // should also work without leading zeros
- var vShort = v.replace(/-0/g, '-');
- expect(Lib.dateTime2ms(vShort, 'chinese')).toBe(ms, vShort);
- });
-
- var badIntercalaryDates = [
- '1995-07i-01',
- '1995-08i-30',
- '1995-09i-01'
- ];
- badIntercalaryDates.forEach(function(v) {
- expect(Lib.dateTime2ms(v, 'chinese')).toBeUndefined(v);
- });
- });
+ it("should not accept invalid strings or other objects", function() {
+ [
+ "",
+ 0,
+ 1,
+ 9,
+ -1,
+ -10,
+ -99,
+ 100,
+ 999,
+ -100,
+ -999,
+ 10000,
+ -10000,
+ 1.2,
+ -1.2,
+ 2015.1,
+ -1023.4,
+ NaN,
+ null,
+ undefined,
+ Infinity,
+ -Infinity,
+ {},
+ { 1: "2014-01-01" },
+ [],
+ [2016],
+ ["2015-11-23"],
+ "123-01-01",
+ "-756-01-01",
+ // 3-digit year
+ "10000-01-01",
+ "-10000-01-01",
+ // 5-digit year
+ "2015-00-01",
+ "2015-13-01",
+ "2015-001-01",
+ // bad month
+ "2015-01-00",
+ "2015-01-32",
+ "2015-02-29",
+ "2015-04-31",
+ "2015-01-001",
+ // bad day (incl non-leap year)
+ "2015-01-01 24:00",
+ "2015-01-01 -1:00",
+ "2015-01-01 001:00",
+ // bad hour
+ "2015-01-01 12:60",
+ "2015-01-01 12:-1",
+ "2015-01-01 12:001",
+ "2015-01-01 12:1",
+ // bad minute
+ "2015-01-01 12:00:60",
+ "2015-01-01 12:00:-1",
+ "2015-01-01 12:00:001",
+ "2015-01-01 12:00:1",
+ // bad second
+ "2015-01-01T",
+ "2015-01-01TT12:34",
+ // bad ISO separators
+ "2015-01-01Z",
+ "2015-01-01T12Z",
+ "2015-01-01T12:34Z05:00",
+ "2015-01-01 12:34+500",
+ // bad TZ info
+ "2015-01-01 12:34-5:00"
+ ].forEach(function(v) {
+ expect(Lib.dateTime2ms(v)).toBeUndefined(v);
+ });
});
- describe('cleanDate', function() {
- it('should convert numbers or js Dates to strings based on local TZ', function() {
- [
- new Date(0),
- new Date(2000),
- new Date(2000, 0, 1),
- new Date(),
- new Date(-9999, 0, 3), // we lose one day of range +/- tzoffset this way
- new Date(9999, 11, 29, 23, 59, 59, 999)
- ].forEach(function(v) {
- var expected = Lib.ms2DateTime(Lib.dateTime2ms(v));
- expect(typeof expected).toBe('string');
- expect(Lib.cleanDate(v)).toBe(expected);
- expect(Lib.cleanDate(+v)).toBe(expected);
- expect(Lib.cleanDate(v, '2000-01-01')).toBe(expected);
- });
+ var JULY1MS = 181 * 24 * 3600 * 1000;
+
+ it(
+ "should use UTC with no timezone offset or daylight saving time",
+ function() {
+ expect(Lib.dateTime2ms("1970-01-01")).toBe(0);
+
+ // 181 days (and no DST hours) between jan 1 and july 1 in a non-leap-year
+ // 31 + 28 + 31 + 30 + 31 + 30
+ expect(Lib.dateTime2ms("1970-07-01")).toBe(JULY1MS);
+ }
+ );
+
+ it(
+ "should interpret JS dates by local time, not by its getTime()",
+ function() {
+ // not really part of the test, just to make sure the test is meaningful
+ // the test should NOT be run in a UTC environment
+ var local0 = Number(new Date(1970, 0, 1)),
+ localjuly1 = Number(new Date(1970, 6, 1));
+ expect([local0, localjuly1]).not.toEqual(
+ [0, JULY1MS],
+ "test must not run in UTC"
+ );
+ // verify that there *is* daylight saving time in the test environment
+ expect(localjuly1 - local0).not.toEqual(
+ JULY1MS - 0,
+ "test must run in a timezone with DST"
+ );
+
+ // now repeat the previous test and show that we throw away
+ // timezone info from js dates
+ expect(Lib.dateTime2ms(new Date(1970, 0, 1))).toBe(0);
+ expect(Lib.dateTime2ms(new Date(1970, 6, 1))).toBe(JULY1MS);
+ }
+ );
+ });
+
+ describe("ms2DateTime", function() {
+ it(
+ "should report the minimum fields with nonzero values, except minutes",
+ function() {
+ [
+ "2016-01-01",
+ // we'll never report less than this bcs month and day are never zero
+ "2016-01-01 01:00",
+ // we won't report hours without minutes
+ "2016-01-01 01:01",
+ "2016-01-01 01:01:01",
+ "2016-01-01 01:01:01.1",
+ "2016-01-01 01:01:01.01",
+ "2016-01-01 01:01:01.001",
+ "2016-01-01 01:01:01.0001"
+ ].forEach(function(v) {
+ expect(Lib.ms2DateTime(Lib.dateTime2ms(v))).toBe(v);
});
+ }
+ );
+
+ it("should accept Date objects within year +/-9999", function() {
+ [
+ "-9999-01-01",
+ "-9999-01-01 00:00:00.0001",
+ "9999-12-31 23:59:59.9999",
+ "0123-01-01",
+ "0042-01-01",
+ "-0016-01-01",
+ "-0016-01-01 12:34:56.7891",
+ "-0456-07-23 16:22"
+ ].forEach(function(v) {
+ expect(Lib.ms2DateTime(Lib.dateTime2ms(v))).toBe(v);
+ });
+ });
- it('should fail numbers & js Dates out of range, and other bad objects', function() {
- [
- new Date(-20000, 0, 1),
- new Date(20000, 0, 1),
- new Date('fail'),
- undefined, null, NaN,
- [], {}, [0], {1: 2}, '',
- '2001-02-29' // not a leap year
- ].forEach(function(v) {
- expect(Lib.cleanDate(v)).toBeUndefined();
- if(!isNumeric(+v)) expect(Lib.cleanDate(+v)).toBeUndefined();
- expect(Lib.cleanDate(v, '2000-01-01')).toBe('2000-01-01');
- });
+ it(
+ "should not accept Date objects beyond our limits or other objects",
+ function() {
+ [
+ Date.UTC(10000, 0, 1),
+ Date.UTC(-10000, 11, 31, 23, 59, 59, 999),
+ "",
+ "2016-01-01",
+ "0",
+ [],
+ [0],
+ {},
+ { 1: 2 }
+ ].forEach(function(v) {
+ expect(Lib.ms2DateTime(v)).toBeUndefined(v);
});
+ }
+ );
+
+ it("should drop the right pieces if rounding is specified", function() {
+ [
+ ["2016-01-01 00:00:00.0001", 0, "2016-01-01 00:00:00.0001"],
+ ["2016-01-01 00:00:00.0001", 299999, "2016-01-01 00:00:00.0001"],
+ ["2016-01-01 00:00:00.0001", 300000, "2016-01-01"],
+ ["2016-01-01 00:00:00.0001", 7776000000, "2016-01-01"],
+ ["2016-01-01 12:34:56.7891", 0, "2016-01-01 12:34:56.7891"],
+ ["2016-01-01 12:34:56.7891", 299999, "2016-01-01 12:34:56.7891"],
+ ["2016-01-01 12:34:56.7891", 300000, "2016-01-01 12:34:56"],
+ ["2016-01-01 12:34:56.7891", 10799999, "2016-01-01 12:34:56"],
+ ["2016-01-01 12:34:56.7891", 10800000, "2016-01-01 12:34"],
+ ["2016-01-01 12:34:56.7891", 7775999999, "2016-01-01 12:34"],
+ ["2016-01-01 12:34:56.7891", 7776000000, "2016-01-01"],
+ ["2016-01-01 12:34:56.7891", 1e300, "2016-01-01"]
+ ].forEach(function(v) {
+ expect(Lib.ms2DateTime(Lib.dateTime2ms(v[0]), v[1])).toBe(v[2], v);
+ });
+ });
- it('should not alter valid date strings, even to truncate them', function() {
- [
- '2000',
- '2000-01',
- '2000-01-01',
- '2000-01-01 00',
- '2000-01-01 00:00',
- '2000-01-01 00:00:00',
- '2000-01-01 00:00:00.0',
- '2000-01-01 00:00:00.00',
- '2000-01-01 00:00:00.000',
- '2000-01-01 00:00:00.0000',
- '9999-12-31 23:59:59.9999',
- '-9999-01-01 00:00:00.0000',
- '99-01-01',
- '00-01-01'
- ].forEach(function(v) {
- expect(Lib.cleanDate(v)).toBe(v);
- });
- });
+ it("should work right with inputs beyond our precision", function() {
+ for (var i = -1; i <= 1; i += 0.001) {
+ var tenths = Math.round(i * 10),
+ base = i < -0.05
+ ? "1969-12-31 23:59:59.99"
+ : "1970-01-01 00:00:00.00",
+ expected = (base + String(tenths + 200).substr(1))
+ .replace(/0+$/, "")
+ .replace(/ 00:00:00[\.]$/, "");
+ expect(Lib.ms2DateTime(i)).toBe(expected, i);
+ }
+ });
+ });
+
+ describe("world calendar inputs", function() {
+ it("should give the right values near epoch zero", function() {
+ [
+ [undefined, "1970-01-01"],
+ ["gregorian", "1970-01-01"],
+ ["chinese", "1969-11-24"],
+ ["coptic", "1686-04-23"],
+ ["discworld", "1798-12-27"],
+ ["ethiopian", "1962-04-23"],
+ ["hebrew", "5730-10-23"],
+ ["islamic", "1389-10-22"],
+ ["julian", "1969-12-19"],
+ ["mayan", "5156-07-05"],
+ ["nanakshahi", "0501-10-19"],
+ ["nepali", "2026-09-17"],
+ ["persian", "1348-10-11"],
+ ["jalali", "1348-10-11"],
+ ["taiwan", "0059-01-01"],
+ ["thai", "2513-01-01"],
+ ["ummalqura", "1389-10-23"]
+ ].forEach(function(v) {
+ var calendar = v[0], dateStr = v[1];
+ expect(Lib.ms2DateTime(0, 0, calendar)).toBe(dateStr, calendar);
+ expect(Lib.dateTime2ms(dateStr, calendar)).toBe(0, calendar);
+
+ var expected_p1ms = dateStr + " 00:00:00.0001",
+ expected_1s = dateStr + " 00:00:01",
+ expected_1m = dateStr + " 00:01",
+ expected_1h = dateStr + " 01:00",
+ expected_lastinstant = dateStr + " 23:59:59.9999";
+
+ var oneSec = 1000,
+ oneMin = 60 * oneSec,
+ oneHour = 60 * oneMin,
+ lastInstant = 24 * oneHour - 0.1;
+
+ expect(Lib.ms2DateTime(0.1, 0, calendar)).toBe(expected_p1ms, calendar);
+ expect(Lib.ms2DateTime(oneSec, 0, calendar)).toBe(
+ expected_1s,
+ calendar
+ );
+ expect(Lib.ms2DateTime(oneMin, 0, calendar)).toBe(
+ expected_1m,
+ calendar
+ );
+ expect(Lib.ms2DateTime(oneHour, 0, calendar)).toBe(
+ expected_1h,
+ calendar
+ );
+ expect(Lib.ms2DateTime(lastInstant, 0, calendar)).toBe(
+ expected_lastinstant,
+ calendar
+ );
+
+ expect(Lib.dateTime2ms(expected_p1ms, calendar)).toBe(0.1, calendar);
+ expect(Lib.dateTime2ms(expected_1s, calendar)).toBe(oneSec, calendar);
+ expect(Lib.dateTime2ms(expected_1m, calendar)).toBe(oneMin, calendar);
+ expect(Lib.dateTime2ms(expected_1h, calendar)).toBe(oneHour, calendar);
+ expect(Lib.dateTime2ms(expected_lastinstant, calendar)).toBe(
+ lastInstant,
+ calendar
+ );
+ });
});
- describe('incrementMonth', function() {
- it('should include Chinese intercalary months', function() {
- var start = '1995-06-01';
- var expected = [
- '1995-07-01',
- '1995-08-01',
- '1995-08i-01',
- '1995-09-01',
- '1995-10-01',
- '1995-11-01',
- '1995-12-01',
- '1996-01-01'
- ];
- var tick = Lib.dateTime2ms(start, 'chinese');
- expected.forEach(function(v) {
- tick = Lib.incrementMonth(tick, 1, 'chinese');
- expect(tick).toBe(Lib.dateTime2ms(v, 'chinese'), v);
- });
+ it(
+ "should contain canonical ticks sundays, ranges for all calendars",
+ function() {
+ var calList = Object.keys(calendars.calendars).filter(function(v) {
+ return v !== "gregorian";
});
- it('should increment years even over leap years', function() {
- var start = '1995-06-01';
- var expected = [
- '1996-06-01',
- '1997-06-01',
- '1998-06-01',
- '1999-06-01',
- '2000-06-01',
- '2001-06-01',
- '2002-06-01',
- '2003-06-01',
- '2004-06-01',
- '2005-06-01',
- '2006-06-01',
- '2007-06-01',
- '2008-06-01'
- ];
- var tick = Lib.dateTime2ms(start, 'chinese');
- expected.forEach(function(v) {
- tick = Lib.incrementMonth(tick, 12, 'chinese');
- expect(tick).toBe(Lib.dateTime2ms(v, 'chinese'), v);
- });
+ var canonicalTick = calComponent.CANONICAL_TICK,
+ canonicalSunday = calComponent.CANONICAL_SUNDAY,
+ dfltRange = calComponent.DFLTRANGE;
+ expect(Object.keys(canonicalTick).length).toBe(calList.length);
+ expect(Object.keys(canonicalSunday).length).toBe(calList.length);
+ expect(Object.keys(dfltRange).length).toBe(calList.length);
+
+ calList.forEach(function(calendar) {
+ expect(
+ Lib.dateTime2ms(canonicalTick[calendar], calendar)
+ ).toBeDefined(calendar);
+ var sunday = Lib.dateTime2ms(canonicalSunday[calendar], calendar);
+ // convert back implicitly with gregorian calendar
+ expect(Lib.formatDate(sunday, "%A")).toBe("Sunday", calendar);
+
+ expect(Lib.dateTime2ms(dfltRange[calendar][0], calendar)).toBeDefined(
+ calendar
+ );
+ expect(Lib.dateTime2ms(dfltRange[calendar][1], calendar)).toBeDefined(
+ calendar
+ );
});
+ }
+ );
+
+ it("should handle Chinese intercalary months correctly", function() {
+ var intercalaryDates = [
+ "1995-08i-01",
+ "1995-08i-29",
+ "1984-10i-15",
+ "2023-02i-29"
+ ];
+ intercalaryDates.forEach(function(v) {
+ var ms = Lib.dateTime2ms(v, "chinese");
+ expect(Lib.ms2DateTime(ms, 0, "chinese")).toBe(v);
+
+ // should also work without leading zeros
+ var vShort = v.replace(/-0/g, "-");
+ expect(Lib.dateTime2ms(vShort, "chinese")).toBe(ms, vShort);
+ });
+
+ var badIntercalaryDates = ["1995-07i-01", "1995-08i-30", "1995-09i-01"];
+ badIntercalaryDates.forEach(function(v) {
+ expect(Lib.dateTime2ms(v, "chinese")).toBeUndefined(v);
+ });
});
-
- describe('isJSDate', function() {
- it('should return true for any Date object but not the equivalent numbers', function() {
- [
- new Date(),
- new Date(0),
- new Date(-9900, 1, 2, 3, 4, 5, 6),
- new Date(9900, 1, 2, 3, 4, 5, 6),
- new Date(-20000, 0, 1), new Date(20000, 0, 1), // outside our range, still true
- new Date('fail') // `Invalid Date` is still a Date
- ].forEach(function(v) {
- expect(Lib.isJSDate(v)).toBe(true);
- expect(Lib.isJSDate(+v)).toBe(false);
- });
+ });
+
+ describe("cleanDate", function() {
+ it(
+ "should convert numbers or js Dates to strings based on local TZ",
+ function() {
+ [
+ new Date(0),
+ new Date(2000),
+ new Date(2000, 0, 1),
+ new Date(),
+ new Date(-9999, 0, 3),
+ // we lose one day of range +/- tzoffset this way
+ new Date(9999, 11, 29, 23, 59, 59, 999)
+ ].forEach(function(v) {
+ var expected = Lib.ms2DateTime(Lib.dateTime2ms(v));
+ expect(typeof expected).toBe("string");
+ expect(Lib.cleanDate(v)).toBe(expected);
+ expect(Lib.cleanDate(+v)).toBe(expected);
+ expect(Lib.cleanDate(v, "2000-01-01")).toBe(expected);
});
-
- it('should return false for anything thats not explicitly a JS Date', function() {
- [
- 0, NaN, null, undefined, '', {}, [], [0], [2016, 0, 1],
- '2016-01-01', '2016-01-01 12:34:56', '2016-01-01 12:34:56.789',
- 'Thu Oct 20 2016 15:35:14 GMT-0400 (EDT)',
- // getting really close to a hack of our test... we look for getTime to be a function
- {getTime: 4}
- ].forEach(function(v) {
- expect(Lib.isJSDate(v)).toBe(false);
- });
+ }
+ );
+
+ it(
+ "should fail numbers & js Dates out of range, and other bad objects",
+ function() {
+ [
+ new Date(-20000, 0, 1),
+ new Date(20000, 0, 1),
+ new Date("fail"),
+ undefined,
+ null,
+ NaN,
+ [],
+ {},
+ [0],
+ { 1: 2 },
+ "",
+ // not a leap year
+ "2001-02-29"
+ ].forEach(function(v) {
+ expect(Lib.cleanDate(v)).toBeUndefined();
+ if (!isNumeric(+v)) expect(Lib.cleanDate(+v)).toBeUndefined();
+ expect(Lib.cleanDate(v, "2000-01-01")).toBe("2000-01-01");
});
- });
-
- describe('formatDate', function() {
- function assertFormatRounds(ms, calendar, results) {
- ['y', 'm', 'd', 'M', 'S', 1, 2, 3, 4].forEach(function(tr, i) {
- expect(Lib.formatDate(ms, '', tr, calendar))
- .toBe(results[i], calendar);
- });
- }
-
- it('should pick a format based on tickround if no format is provided', function() {
- var ms = Lib.dateTime2ms('2012-08-13 06:19:34.5678');
- assertFormatRounds(ms, 'gregorian', [
- '2012',
- 'Aug 2012',
- 'Aug 13\n2012',
- '06:19\nAug 13, 2012',
- '06:19:35\nAug 13, 2012',
- '06:19:34.6\nAug 13, 2012',
- '06:19:34.57\nAug 13, 2012',
- '06:19:34.568\nAug 13, 2012',
- '06:19:34.5678\nAug 13, 2012'
- ]);
-
- // and for world calendars - in coptic this is 1728-12-07 (month=Meso)
- assertFormatRounds(ms, 'coptic', [
- '1728',
- 'Meso 1728',
- 'Meso 7\n1728',
- '06:19\nMeso 7, 1728',
- '06:19:35\nMeso 7, 1728',
- '06:19:34.6\nMeso 7, 1728',
- '06:19:34.57\nMeso 7, 1728',
- '06:19:34.568\nMeso 7, 1728',
- '06:19:34.5678\nMeso 7, 1728'
- ]);
+ }
+ );
+
+ it(
+ "should not alter valid date strings, even to truncate them",
+ function() {
+ [
+ "2000",
+ "2000-01",
+ "2000-01-01",
+ "2000-01-01 00",
+ "2000-01-01 00:00",
+ "2000-01-01 00:00:00",
+ "2000-01-01 00:00:00.0",
+ "2000-01-01 00:00:00.00",
+ "2000-01-01 00:00:00.000",
+ "2000-01-01 00:00:00.0000",
+ "9999-12-31 23:59:59.9999",
+ "-9999-01-01 00:00:00.0000",
+ "99-01-01",
+ "00-01-01"
+ ].forEach(function(v) {
+ expect(Lib.cleanDate(v)).toBe(v);
});
+ }
+ );
+ });
+
+ describe("incrementMonth", function() {
+ it("should include Chinese intercalary months", function() {
+ var start = "1995-06-01";
+ var expected = [
+ "1995-07-01",
+ "1995-08-01",
+ "1995-08i-01",
+ "1995-09-01",
+ "1995-10-01",
+ "1995-11-01",
+ "1995-12-01",
+ "1996-01-01"
+ ];
+ var tick = Lib.dateTime2ms(start, "chinese");
+ expected.forEach(function(v) {
+ tick = Lib.incrementMonth(tick, 1, "chinese");
+ expect(tick).toBe(Lib.dateTime2ms(v, "chinese"), v);
+ });
+ });
- it('should accept custom formats using d3 specs even for world cals', function() {
- var ms = Lib.dateTime2ms('2012-08-13 06:19:34.5678');
- [
- // some common formats (plotly workspace options)
- ['%Y-%m-%d', '2012-08-13', '1728-12-07'],
- ['%H:%M:%S', '06:19:34', '06:19:34'],
- ['%Y-%m-%e %H:%M:%S', '2012-08-13 06:19:34', '1728-12-7 06:19:34'],
- ['%A, %b %e', 'Monday, Aug 13', 'Pesnau, Meso 7'],
-
- // test padding behavior
- // world doesn't support space-padded (yet?)
- ['%Y-%_m-%_d', '2012- 8-13', '1728-12-7'],
- ['%Y-%-m-%-d', '2012-8-13', '1728-12-7'],
-
- // and some strange ones to cover all fields
- ['%a%j!%-j', 'Mon226!226', 'Pes337!337'],
- [
- '%W or un or space padded-> %-W,%_W',
- '33 or un or space padded-> 33,33',
- '48 or un or space padded-> 48,48'
- ],
- [
- '%B \'%y WOY:%U DOW:%w',
- 'August \'12 WOY:32 DOW:1',
- 'Mesori \'28 WOY:## DOW:##' // world-cals doesn't support U or w
- ],
- [
- '%c && %x && .%2f .%f', // %
f is our addition
- 'Mon Aug 13 06:19:34 2012 && 08/13/2012 && .57 .5678',
- 'Pes Meso 7 06:19:34 1728 && 12/07/1728 && .57 .5678'
- ]
-
- ].forEach(function(v) {
- var fmt = v[0],
- expectedGregorian = v[1],
- expectedCoptic = v[2];
-
- // tickround is irrelevant here...
- expect(Lib.formatDate(ms, fmt, 'y'))
- .toBe(expectedGregorian, fmt);
- expect(Lib.formatDate(ms, fmt, 4, 'gregorian'))
- .toBe(expectedGregorian, fmt);
- expect(Lib.formatDate(ms, fmt, 'y', 'coptic'))
- .toBe(expectedCoptic, fmt);
- });
+ it("should increment years even over leap years", function() {
+ var start = "1995-06-01";
+ var expected = [
+ "1996-06-01",
+ "1997-06-01",
+ "1998-06-01",
+ "1999-06-01",
+ "2000-06-01",
+ "2001-06-01",
+ "2002-06-01",
+ "2003-06-01",
+ "2004-06-01",
+ "2005-06-01",
+ "2006-06-01",
+ "2007-06-01",
+ "2008-06-01"
+ ];
+ var tick = Lib.dateTime2ms(start, "chinese");
+ expected.forEach(function(v) {
+ tick = Lib.incrementMonth(tick, 12, "chinese");
+ expect(tick).toBe(Lib.dateTime2ms(v, "chinese"), v);
+ });
+ });
+ });
+
+ describe("isJSDate", function() {
+ it(
+ "should return true for any Date object but not the equivalent numbers",
+ function() {
+ [
+ new Date(),
+ new Date(0),
+ new Date(-9900, 1, 2, 3, 4, 5, 6),
+ new Date(9900, 1, 2, 3, 4, 5, 6),
+ new Date(-20000, 0, 1),
+ new Date(20000, 0, 1),
+ // outside our range, still true
+ // `Invalid Date` is still a Date
+ new Date("fail")
+ ].forEach(function(v) {
+ expect(Lib.isJSDate(v)).toBe(true);
+ expect(Lib.isJSDate(+v)).toBe(false);
});
-
- it('should not round up to 60 seconds', function() {
- // see note in dates.js -> formatTime about this rounding
- assertFormatRounds(-0.1, 'gregorian', [
- '1969',
- 'Dec 1969',
- 'Dec 31\n1969',
- '23:59\nDec 31, 1969',
- '23:59:59\nDec 31, 1969',
- '23:59:59.9\nDec 31, 1969',
- '23:59:59.99\nDec 31, 1969',
- '23:59:59.999\nDec 31, 1969',
- '23:59:59.9999\nDec 31, 1969'
- ]);
-
- // in coptic this is Koi 22, 1686
- assertFormatRounds(-0.1, 'coptic', [
- '1686',
- 'Koi 1686',
- 'Koi 22\n1686',
- '23:59\nKoi 22, 1686',
- '23:59:59\nKoi 22, 1686',
- '23:59:59.9\nKoi 22, 1686',
- '23:59:59.99\nKoi 22, 1686',
- '23:59:59.999\nKoi 22, 1686',
- '23:59:59.9999\nKoi 22, 1686'
- ]);
-
- // and using the custom format machinery
- expect(Lib.formatDate(-0.1, '%Y-%m-%d %H:%M:%S.%f'))
- .toBe('1969-12-31 23:59:59.9999');
- expect(Lib.formatDate(-0.1, '%Y-%m-%d %H:%M:%S.%f', null, 'coptic'))
- .toBe('1686-04-22 23:59:59.9999');
-
+ }
+ );
+
+ it(
+ "should return false for anything thats not explicitly a JS Date",
+ function() {
+ [
+ 0,
+ NaN,
+ null,
+ undefined,
+ "",
+ {},
+ [],
+ [0],
+ [2016, 0, 1],
+ "2016-01-01",
+ "2016-01-01 12:34:56",
+ "2016-01-01 12:34:56.789",
+ "Thu Oct 20 2016 15:35:14 GMT-0400 (EDT)",
+ // getting really close to a hack of our test... we look for getTime to be a function
+ { getTime: 4 }
+ ].forEach(function(v) {
+ expect(Lib.isJSDate(v)).toBe(false);
});
-
- it('should remove extra fractional second zeros', function() {
- expect(Lib.formatDate(0.1, '', 4)).toBe('00:00:00.0001\nJan 1, 1970');
- expect(Lib.formatDate(0.1, '', 3)).toBe('00:00:00\nJan 1, 1970');
- expect(Lib.formatDate(0.1, '', 0)).toBe('00:00:00\nJan 1, 1970');
- expect(Lib.formatDate(0.1, '', 'S')).toBe('00:00:00\nJan 1, 1970');
- expect(Lib.formatDate(0.1, '', 3, 'coptic'))
- .toBe('00:00:00\nKoi 23, 1686');
-
- // because the decimal point is explicitly part of the format
- // string here, we can't remove it OR the very first zero after it.
- expect(Lib.formatDate(0.1, '%S.%f')).toBe('00.0001');
- expect(Lib.formatDate(0.1, '%S.%3f')).toBe('00.0');
+ }
+ );
+ });
+
+ describe("formatDate", function() {
+ function assertFormatRounds(ms, calendar, results) {
+ ["y", "m", "d", "M", "S", 1, 2, 3, 4].forEach(function(tr, i) {
+ expect(Lib.formatDate(ms, "", tr, calendar)).toBe(results[i], calendar);
+ });
+ }
+
+ it(
+ "should pick a format based on tickround if no format is provided",
+ function() {
+ var ms = Lib.dateTime2ms("2012-08-13 06:19:34.5678");
+ assertFormatRounds(ms, "gregorian", [
+ "2012",
+ "Aug 2012",
+ "Aug 13\n2012",
+ "06:19\nAug 13, 2012",
+ "06:19:35\nAug 13, 2012",
+ "06:19:34.6\nAug 13, 2012",
+ "06:19:34.57\nAug 13, 2012",
+ "06:19:34.568\nAug 13, 2012",
+ "06:19:34.5678\nAug 13, 2012"
+ ]);
+
+ // and for world calendars - in coptic this is 1728-12-07 (month=Meso)
+ assertFormatRounds(ms, "coptic", [
+ "1728",
+ "Meso 1728",
+ "Meso 7\n1728",
+ "06:19\nMeso 7, 1728",
+ "06:19:35\nMeso 7, 1728",
+ "06:19:34.6\nMeso 7, 1728",
+ "06:19:34.57\nMeso 7, 1728",
+ "06:19:34.568\nMeso 7, 1728",
+ "06:19:34.5678\nMeso 7, 1728"
+ ]);
+ }
+ );
+
+ it(
+ "should accept custom formats using d3 specs even for world cals",
+ function() {
+ var ms = Lib.dateTime2ms("2012-08-13 06:19:34.5678");
+ [
+ // some common formats (plotly workspace options)
+ ["%Y-%m-%d", "2012-08-13", "1728-12-07"],
+ ["%H:%M:%S", "06:19:34", "06:19:34"],
+ ["%Y-%m-%e %H:%M:%S", "2012-08-13 06:19:34", "1728-12-7 06:19:34"],
+ ["%A, %b %e", "Monday, Aug 13", "Pesnau, Meso 7"],
+ // test padding behavior
+ // world doesn't support space-padded (yet?)
+ ["%Y-%_m-%_d", "2012- 8-13", "1728-12-7"],
+ ["%Y-%-m-%-d", "2012-8-13", "1728-12-7"],
+ // and some strange ones to cover all fields
+ ["%a%j!%-j", "Mon226!226", "Pes337!337"],
+ [
+ "%W or un or space padded-> %-W,%_W",
+ "33 or un or space padded-> 33,33",
+ "48 or un or space padded-> 48,48"
+ ],
+ [
+ "%B '%y WOY:%U DOW:%w",
+ "August '12 WOY:32 DOW:1",
+ // world-cals doesn't support U or w
+ "Mesori '28 WOY:## DOW:##"
+ ],
+ [
+ "%c && %x && .%2f .%f",
+ // %f is our addition
+ "Mon Aug 13 06:19:34 2012 && 08/13/2012 && .57 .5678",
+ "Pes Meso 7 06:19:34 1728 && 12/07/1728 && .57 .5678"
+ ]
+ ].forEach(function(v) {
+ var fmt = v[0], expectedGregorian = v[1], expectedCoptic = v[2];
+
+ // tickround is irrelevant here...
+ expect(Lib.formatDate(ms, fmt, "y")).toBe(expectedGregorian, fmt);
+ expect(Lib.formatDate(ms, fmt, 4, "gregorian")).toBe(
+ expectedGregorian,
+ fmt
+ );
+ expect(Lib.formatDate(ms, fmt, "y", "coptic")).toBe(
+ expectedCoptic,
+ fmt
+ );
});
+ }
+ );
+
+ it("should not round up to 60 seconds", function() {
+ // see note in dates.js -> formatTime about this rounding
+ assertFormatRounds(-0.1, "gregorian", [
+ "1969",
+ "Dec 1969",
+ "Dec 31\n1969",
+ "23:59\nDec 31, 1969",
+ "23:59:59\nDec 31, 1969",
+ "23:59:59.9\nDec 31, 1969",
+ "23:59:59.99\nDec 31, 1969",
+ "23:59:59.999\nDec 31, 1969",
+ "23:59:59.9999\nDec 31, 1969"
+ ]);
+
+ // in coptic this is Koi 22, 1686
+ assertFormatRounds(-0.1, "coptic", [
+ "1686",
+ "Koi 1686",
+ "Koi 22\n1686",
+ "23:59\nKoi 22, 1686",
+ "23:59:59\nKoi 22, 1686",
+ "23:59:59.9\nKoi 22, 1686",
+ "23:59:59.99\nKoi 22, 1686",
+ "23:59:59.999\nKoi 22, 1686",
+ "23:59:59.9999\nKoi 22, 1686"
+ ]);
+
+ // and using the custom format machinery
+ expect(Lib.formatDate(-0.1, "%Y-%m-%d %H:%M:%S.%f")).toBe(
+ "1969-12-31 23:59:59.9999"
+ );
+ expect(Lib.formatDate(-0.1, "%Y-%m-%d %H:%M:%S.%f", null, "coptic")).toBe(
+ "1686-04-22 23:59:59.9999"
+ );
+ });
+ it("should remove extra fractional second zeros", function() {
+ expect(Lib.formatDate(0.1, "", 4)).toBe("00:00:00.0001\nJan 1, 1970");
+ expect(Lib.formatDate(0.1, "", 3)).toBe("00:00:00\nJan 1, 1970");
+ expect(Lib.formatDate(0.1, "", 0)).toBe("00:00:00\nJan 1, 1970");
+ expect(Lib.formatDate(0.1, "", "S")).toBe("00:00:00\nJan 1, 1970");
+ expect(Lib.formatDate(0.1, "", 3, "coptic")).toBe(
+ "00:00:00\nKoi 23, 1686"
+ );
+
+ // because the decimal point is explicitly part of the format
+ // string here, we can't remove it OR the very first zero after it.
+ expect(Lib.formatDate(0.1, "%S.%f")).toBe("00.0001");
+ expect(Lib.formatDate(0.1, "%S.%3f")).toBe("00.0");
});
+ });
});
diff --git a/test/jasmine/tests/lib_test.js b/test/jasmine/tests/lib_test.js
index 7181510d4cc..ef45629d6c6 100644
--- a/test/jasmine/tests/lib_test.js
+++ b/test/jasmine/tests/lib_test.js
@@ -1,606 +1,602 @@
-var Lib = require('@src/lib');
-var setCursor = require('@src/lib/setcursor');
-var overrideCursor = require('@src/lib/override_cursor');
-var config = require('@src/plot_api/plot_config');
-
-var d3 = require('d3');
-var Plotly = require('@lib');
-var PlotlyInternal = require('@src/plotly');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
+var Lib = require("@src/lib");
+var setCursor = require("@src/lib/setcursor");
+var overrideCursor = require("@src/lib/override_cursor");
+var config = require("@src/plot_api/plot_config");
+
+var d3 = require("d3");
+var Plotly = require("@lib");
+var PlotlyInternal = require("@src/plotly");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
var Plots = PlotlyInternal.Plots;
-var customMatchers = require('../assets/custom_matchers');
-
-describe('Test lib.js:', function() {
- 'use strict';
-
- describe('interp() should', function() {
- it('return 1.75 as Q1 of [1, 2, 3, 4, 5]:', function() {
- var input = [1, 2, 3, 4, 5],
- res = Lib.interp(input, 0.25),
- res0 = 1.75;
- expect(res).toEqual(res0);
- });
- it('return 4.25 as Q3 of [1, 2, 3, 4, 5]:', function() {
- var input = [1, 2, 3, 4, 5],
- res = Lib.interp(input, 0.75),
- res0 = 4.25;
- expect(res).toEqual(res0);
- });
- it('error if second input argument is a string:', function() {
- var input = [1, 2, 3, 4, 5];
- expect(function() {
- Lib.interp(input, 'apple');
- }).toThrow('n should be a finite number');
- });
- it('error if second input argument is a date:', function() {
- var in1 = [1, 2, 3, 4, 5],
- in2 = new Date(2014, 11, 1);
- expect(function() {
- Lib.interp(in1, in2);
- }).toThrow('n should be a finite number');
- });
- it('return the right boundary on input [-Inf, Inf]:', function() {
- var input = [-Infinity, Infinity],
- res = Lib.interp(input, 1),
- res0 = Infinity;
- expect(res).toEqual(res0);
- });
+var customMatchers = require("../assets/custom_matchers");
+
+describe("Test lib.js:", function() {
+ "use strict";
+ describe("interp() should", function() {
+ it("return 1.75 as Q1 of [1, 2, 3, 4, 5]:", function() {
+ var input = [1, 2, 3, 4, 5], res = Lib.interp(input, 0.25), res0 = 1.75;
+ expect(res).toEqual(res0);
});
-
- describe('transposeRagged()', function() {
- it('should transpose and return a rectangular array', function() {
- var input = [
- [1],
- [2, 3, 4],
- [5, 6],
- [7]],
- output = [
- [1, 2, 5, 7],
- [undefined, 3, 6, undefined],
- [undefined, 4, undefined, undefined]
- ];
-
- expect(Lib.transposeRagged(input)).toEqual(output);
- });
+ it("return 4.25 as Q3 of [1, 2, 3, 4, 5]:", function() {
+ var input = [1, 2, 3, 4, 5], res = Lib.interp(input, 0.75), res0 = 4.25;
+ expect(res).toEqual(res0);
});
-
- describe('dot()', function() {
- var dot = Lib.dot;
-
- it('should return null for empty or unequal-length inputs', function() {
- expect(dot([], [])).toBeNull();
- expect(dot([1], [2, 3])).toBeNull();
- });
-
- it('should dot vectors to a scalar', function() {
- expect(dot([1, 2, 3], [4, 5, 6])).toEqual(32);
- });
-
- it('should dot a vector and a matrix to a vector', function() {
- expect(dot([1, 2], [[3, 4], [5, 6]])).toEqual([13, 16]);
- expect(dot([[3, 4], [5, 6]], [1, 2])).toEqual([11, 17]);
- });
-
- it('should dot two matrices to a matrix', function() {
- expect(dot([[1, 2], [3, 4]], [[5, 6], [7, 8]]))
- .toEqual([[19, 22], [43, 50]]);
- });
+ it("error if second input argument is a string:", function() {
+ var input = [1, 2, 3, 4, 5];
+ expect(function() {
+ Lib.interp(input, "apple");
+ }).toThrow("n should be a finite number");
});
+ it("error if second input argument is a date:", function() {
+ var in1 = [1, 2, 3, 4, 5], in2 = new Date(2014, 11, 1);
+ expect(function() {
+ Lib.interp(in1, in2);
+ }).toThrow("n should be a finite number");
+ });
+ it("return the right boundary on input [-Inf, Inf]:", function() {
+ var input = [-Infinity, Infinity],
+ res = Lib.interp(input, 1),
+ res0 = Infinity;
+ expect(res).toEqual(res0);
+ });
+ });
+
+ describe("transposeRagged()", function() {
+ it("should transpose and return a rectangular array", function() {
+ var input = [[1], [2, 3, 4], [5, 6], [7]],
+ output = [
+ [1, 2, 5, 7],
+ [undefined, 3, 6, undefined],
+ [undefined, 4, undefined, undefined]
+ ];
+
+ expect(Lib.transposeRagged(input)).toEqual(output);
+ });
+ });
- describe('aggNums()', function() {
- var aggNums = Lib.aggNums;
-
- function summation(a, b) { return a + b; }
-
- it('should work with 1D and 2D inputs and ignore non-numerics', function() {
- var in1D = [1, 2, 3, 4, 'goose!', 5, 6],
- in2D = [[1, 2, 3], ['', 4], [5, 'hi!', 6]];
-
- expect(aggNums(Math.min, null, in1D)).toEqual(1);
- expect(aggNums(Math.min, null, in2D)).toEqual(1);
-
- expect(aggNums(Math.max, null, in1D)).toEqual(6);
- expect(aggNums(Math.max, null, in2D)).toEqual(6);
+ describe("dot()", function() {
+ var dot = Lib.dot;
- expect(aggNums(summation, 0, in1D)).toEqual(21);
- expect(aggNums(summation, 0, in2D)).toEqual(21);
- });
+ it("should return null for empty or unequal-length inputs", function() {
+ expect(dot([], [])).toBeNull();
+ expect(dot([1], [2, 3])).toBeNull();
});
- describe('mean() should', function() {
- it('toss out non-numerics (strings):', function() {
- var input = [1, 2, 'apple', 'orange'],
- res = Lib.mean(input);
- expect(res).toEqual(1.5);
- });
- it('toss out non-numerics (NaN):', function() {
- var input = [1, 2, NaN],
- res = Lib.mean(input);
- expect(res).toEqual(1.5);
- });
- it('evaluate numbers which are passed around as text strings:', function() {
- var input = ['1', '2'],
- res = Lib.mean(input);
- expect(res).toEqual(1.5);
- });
+ it("should dot vectors to a scalar", function() {
+ expect(dot([1, 2, 3], [4, 5, 6])).toEqual(32);
});
- describe('variance() should', function() {
- it('return 0 on input [2, 2, 2, 2, 2]:', function() {
- var input = [2, 2, 2, 2],
- res = Lib.variance(input);
- expect(res).toEqual(0);
- });
- it('return 2/3 on input [-1, 0, 1]:', function() {
- var input = [-1, 0, 1],
- res = Lib.variance(input);
- expect(res).toEqual(2 / 3);
- });
- it('toss out non-numerics (strings):', function() {
- var input = [1, 2, 'apple', 'orange'],
- res = Lib.variance(input);
- expect(res).toEqual(0.25);
- });
- it('toss out non-numerics (NaN):', function() {
- var input = [1, 2, NaN],
- res = Lib.variance(input);
- expect(res).toEqual(0.25);
- });
+ it("should dot a vector and a matrix to a vector", function() {
+ expect(dot([1, 2], [[3, 4], [5, 6]])).toEqual([13, 16]);
+ expect(dot([[3, 4], [5, 6]], [1, 2])).toEqual([11, 17]);
});
- describe('stdev() should', function() {
- it('return 0 on input [2, 2, 2, 2, 2]:', function() {
- var input = [2, 2, 2, 2],
- res = Lib.stdev(input);
- expect(res).toEqual(0);
- });
- it('return sqrt(2/3) on input [-1, 0, 1]:', function() {
- var input = [-1, 0, 1],
- res = Lib.stdev(input);
- expect(res).toEqual(Math.sqrt(2 / 3));
- });
- it('toss out non-numerics (strings):', function() {
- var input = [1, 2, 'apple', 'orange'],
- res = Lib.stdev(input);
- expect(res).toEqual(0.5);
- });
- it('toss out non-numerics (NaN):', function() {
- var input = [1, 2, NaN],
- res = Lib.stdev(input);
- expect(res).toEqual(0.5);
- });
+ it("should dot two matrices to a matrix", function() {
+ expect(dot([[1, 2], [3, 4]], [[5, 6], [7, 8]])).toEqual([
+ [19, 22],
+ [43, 50]
+ ]);
});
+ });
- describe('smooth()', function() {
- it('should not alter the input for FWHM < 1.5', function() {
- var input = [1, 2, 1, 2, 1],
- output = Lib.smooth(input.slice(), 1.49);
+ describe("aggNums()", function() {
+ var aggNums = Lib.aggNums;
- expect(output).toEqual(input);
+ function summation(a, b) {
+ return a + b;
+ }
- output = Lib.smooth(input.slice(), 'like butter');
+ it("should work with 1D and 2D inputs and ignore non-numerics", function() {
+ var in1D = [1, 2, 3, 4, "goose!", 5, 6],
+ in2D = [[1, 2, 3], ["", 4], [5, "hi!", 6]];
- expect(output).toEqual(input);
- });
+ expect(aggNums(Math.min, null, in1D)).toEqual(1);
+ expect(aggNums(Math.min, null, in2D)).toEqual(1);
- it('should preserve the length and integral even with multiple bounces', function() {
- var input = [1, 2, 4, 8, 16, 8, 10, 12],
- output2 = Lib.smooth(input.slice(), 2),
- output30 = Lib.smooth(input.slice(), 30),
- sumIn = 0,
- sum2 = 0,
- sum30 = 0;
-
- for(var i = 0; i < input.length; i++) {
- sumIn += input[i];
- sum2 += output2[i];
- sum30 += output30[i];
- }
+ expect(aggNums(Math.max, null, in1D)).toEqual(6);
+ expect(aggNums(Math.max, null, in2D)).toEqual(6);
- expect(output2.length).toEqual(input.length);
- expect(output30.length).toEqual(input.length);
- expect(sum2).toBeCloseTo(sumIn, 6);
- expect(sum30).toBeCloseTo(sumIn, 6);
- });
-
- it('should use a hann window and bounce', function() {
- var input = [0, 0, 0, 7, 0, 0, 0],
- out4 = Lib.smooth(input, 4),
- out7 = Lib.smooth(input, 7),
- expected4 = [
- 0.2562815664617711, 0.875, 1.4937184335382292, 1.75,
- 1.493718433538229, 0.875, 0.25628156646177086
- ],
- expected7 = [1, 1, 1, 1, 1, 1, 1],
- i;
-
- for(i = 0; i < input.length; i++) {
- expect(out4[i]).toBeCloseTo(expected4[i], 6);
- expect(out7[i]).toBeCloseTo(expected7[i], 6);
- }
- });
+ expect(aggNums(summation, 0, in1D)).toEqual(21);
+ expect(aggNums(summation, 0, in2D)).toEqual(21);
});
+ });
- describe('nestedProperty', function() {
- var np = Lib.nestedProperty;
-
- it('should access simple objects', function() {
- var obj = {a: 'b', c: 'd'},
- propA = np(obj, 'a'),
- propB = np(obj, 'b');
-
- expect(propA.get()).toBe('b');
- // making and reading nestedProperties shouldn't change anything
- expect(obj).toEqual({a: 'b', c: 'd'});
- // only setting them should
- propA.set('cats');
- expect(obj).toEqual({a: 'cats', c: 'd'});
- expect(propA.get()).toBe('cats');
- propA.set('b');
-
- expect(propB.get()).toBe(undefined);
- expect(obj).toEqual({a: 'b', c: 'd'});
- propB.set({cats: true, dogs: false});
- expect(obj).toEqual({a: 'b', c: 'd', b: {cats: true, dogs: false}});
- });
-
- it('should access arrays', function() {
- var arr = [1, 2, 3],
- prop1 = np(arr, 1),
- prop5 = np(arr, '5');
-
- expect(prop1.get()).toBe(2);
- expect(arr).toEqual([1, 2, 3]);
-
- prop1.set('cats');
- expect(prop1.get()).toBe('cats');
-
- prop1.set(2);
- expect(prop5.get()).toBe(undefined);
- expect(arr).toEqual([1, 2, 3]);
-
- prop5.set(5);
- var localArr = [1, 2, 3];
- localArr[5] = 5;
- expect(arr).toEqual(localArr);
-
- prop5.set(null);
- expect(arr).toEqual([1, 2, 3]);
- expect(arr.length).toBe(3);
- });
-
- it('should not access whole array elements with index -1', function() {
- // for a lot of cases we could make this work,
- // but deleting the value is a mess, and anyway
- // we don't need this, it's better just to set the whole
- // array, ie np(obj, 'arr')
- var obj = {arr: [1, 2, 3]};
- expect(function() { np(obj, 'arr[-1]'); }).toThrow('bad property string');
- });
-
- it('should access properties of objects in an array with index -1', function() {
- var obj = {arr: [{a: 1}, {a: 2}, {b: 3}]},
- prop = np(obj, 'arr[-1].a');
+ describe("mean() should", function() {
+ it("toss out non-numerics (strings):", function() {
+ var input = [1, 2, "apple", "orange"], res = Lib.mean(input);
+ expect(res).toEqual(1.5);
+ });
+ it("toss out non-numerics (NaN):", function() {
+ var input = [1, 2, NaN], res = Lib.mean(input);
+ expect(res).toEqual(1.5);
+ });
+ it("evaluate numbers which are passed around as text strings:", function() {
+ var input = ["1", "2"], res = Lib.mean(input);
+ expect(res).toEqual(1.5);
+ });
+ });
- expect(prop.get()).toEqual([1, 2, undefined]);
- expect(obj).toEqual({arr: [{a: 1}, {a: 2}, {b: 3}]});
+ describe("variance() should", function() {
+ it("return 0 on input [2, 2, 2, 2, 2]:", function() {
+ var input = [2, 2, 2, 2], res = Lib.variance(input);
+ expect(res).toEqual(0);
+ });
+ it("return 2/3 on input [-1, 0, 1]:", function() {
+ var input = [-1, 0, 1], res = Lib.variance(input);
+ expect(res).toEqual(2 / 3);
+ });
+ it("toss out non-numerics (strings):", function() {
+ var input = [1, 2, "apple", "orange"], res = Lib.variance(input);
+ expect(res).toEqual(0.25);
+ });
+ it("toss out non-numerics (NaN):", function() {
+ var input = [1, 2, NaN], res = Lib.variance(input);
+ expect(res).toEqual(0.25);
+ });
+ });
- prop.set(5);
- expect(prop.get()).toBe(5);
- expect(obj).toEqual({arr: [{a: 5}, {a: 5}, {a: 5, b: 3}]});
+ describe("stdev() should", function() {
+ it("return 0 on input [2, 2, 2, 2, 2]:", function() {
+ var input = [2, 2, 2, 2], res = Lib.stdev(input);
+ expect(res).toEqual(0);
+ });
+ it("return sqrt(2/3) on input [-1, 0, 1]:", function() {
+ var input = [-1, 0, 1], res = Lib.stdev(input);
+ expect(res).toEqual(Math.sqrt(2 / 3));
+ });
+ it("toss out non-numerics (strings):", function() {
+ var input = [1, 2, "apple", "orange"], res = Lib.stdev(input);
+ expect(res).toEqual(0.5);
+ });
+ it("toss out non-numerics (NaN):", function() {
+ var input = [1, 2, NaN], res = Lib.stdev(input);
+ expect(res).toEqual(0.5);
+ });
+ });
- prop.set(null);
- expect(prop.get()).toBe(undefined);
- expect(obj).toEqual({arr: [undefined, undefined, {b: 3}]});
+ describe("smooth()", function() {
+ it("should not alter the input for FWHM < 1.5", function() {
+ var input = [1, 2, 1, 2, 1], output = Lib.smooth(input.slice(), 1.49);
- prop.set([2, 3, 4]);
- expect(prop.get()).toEqual([2, 3, 4]);
- expect(obj).toEqual({arr: [{a: 2}, {a: 3}, {a: 4, b: 3}]});
+ expect(output).toEqual(input);
- prop.set([6, 7, undefined]);
- expect(prop.get()).toEqual([6, 7, undefined]);
- expect(obj).toEqual({arr: [{a: 6}, {a: 7}, {b: 3}]});
+ output = Lib.smooth(input.slice(), "like butter");
- // too short an array: wrap around
- prop.set([9, 10]);
- expect(prop.get()).toEqual([9, 10, 9]);
- expect(obj).toEqual({arr: [{a: 9}, {a: 10}, {a: 9, b: 3}]});
+ expect(output).toEqual(input);
+ });
- // too long an array: ignore extras
- prop.set([11, 12, 13, 14]);
- expect(prop.get()).toEqual([11, 12, 13]);
- expect(obj).toEqual({arr: [{a: 11}, {a: 12}, {a: 13, b: 3}]});
- });
+ it(
+ "should preserve the length and integral even with multiple bounces",
+ function() {
+ var input = [1, 2, 4, 8, 16, 8, 10, 12],
+ output2 = Lib.smooth(input.slice(), 2),
+ output30 = Lib.smooth(input.slice(), 30),
+ sumIn = 0,
+ sum2 = 0,
+ sum30 = 0;
+
+ for (var i = 0; i < input.length; i++) {
+ sumIn += input[i];
+ sum2 += output2[i];
+ sum30 += output30[i];
+ }
- it('should remove a property only with undefined or null', function() {
- var obj = {a: 'b', c: 'd'},
- propA = np(obj, 'a'),
- propC = np(obj, 'c');
+ expect(output2.length).toEqual(input.length);
+ expect(output30.length).toEqual(input.length);
+ expect(sum2).toBeCloseTo(sumIn, 6);
+ expect(sum30).toBeCloseTo(sumIn, 6);
+ }
+ );
+
+ it("should use a hann window and bounce", function() {
+ var input = [0, 0, 0, 7, 0, 0, 0],
+ out4 = Lib.smooth(input, 4),
+ out7 = Lib.smooth(input, 7),
+ expected4 = [
+ 0.2562815664617711,
+ 0.875,
+ 1.4937184335382292,
+ 1.75,
+ 1.493718433538229,
+ 0.875,
+ 0.25628156646177086
+ ],
+ expected7 = [1, 1, 1, 1, 1, 1, 1],
+ i;
+
+ for (i = 0; i < input.length; i++) {
+ expect(out4[i]).toBeCloseTo(expected4[i], 6);
+ expect(out7[i]).toBeCloseTo(expected7[i], 6);
+ }
+ });
+ });
+
+ describe("nestedProperty", function() {
+ var np = Lib.nestedProperty;
+
+ it("should access simple objects", function() {
+ var obj = { a: "b", c: "d" }, propA = np(obj, "a"), propB = np(obj, "b");
+
+ expect(propA.get()).toBe("b");
+ // making and reading nestedProperties shouldn't change anything
+ expect(obj).toEqual({ a: "b", c: "d" });
+ // only setting them should
+ propA.set("cats");
+ expect(obj).toEqual({ a: "cats", c: "d" });
+ expect(propA.get()).toBe("cats");
+ propA.set("b");
+
+ expect(propB.get()).toBe(undefined);
+ expect(obj).toEqual({ a: "b", c: "d" });
+ propB.set({ cats: true, dogs: false });
+ expect(obj).toEqual({ a: "b", c: "d", b: { cats: true, dogs: false } });
+ });
- propA.set(null);
- propC.set(undefined);
- expect(obj).toEqual({});
+ it("should access arrays", function() {
+ var arr = [1, 2, 3], prop1 = np(arr, 1), prop5 = np(arr, "5");
- propA.set(false);
- np(obj, 'b').set('');
- propC.set(0);
- np(obj, 'd').set(NaN);
- expect(obj).toEqual({a: false, b: '', c: 0, d: NaN});
- });
+ expect(prop1.get()).toBe(2);
+ expect(arr).toEqual([1, 2, 3]);
- it('should remove containers but not data arrays', function() {
- var obj = {
- annotations: [{a: [1, 2, 3]}],
- c: [1, 2, 3],
- domain: [1, 2],
- range: [2, 3],
- shapes: ['elephant']
- },
- propA = np(obj, 'annotations[-1].a'),
- propC = np(obj, 'c'),
- propD0 = np(obj, 'domain[0]'),
- propD1 = np(obj, 'domain[1]'),
- propR = np(obj, 'range'),
- propS = np(obj, 'shapes[0]');
-
- propA.set([]);
- propC.set([]);
- propD0.set(undefined);
- propD1.set(undefined);
- propR.set([]);
- propS.set(null);
-
- expect(obj).toEqual({c: []});
- });
+ prop1.set("cats");
+ expect(prop1.get()).toBe("cats");
+ prop1.set(2);
+ expect(prop5.get()).toBe(undefined);
+ expect(arr).toEqual([1, 2, 3]);
- it('should have no empty object sub-containers but contain empty data arrays', function() {
- var obj = {},
- prop = np(obj, 'a[1].b.c'),
- expectedArr = [];
+ prop5.set(5);
+ var localArr = [1, 2, 3];
+ localArr[5] = 5;
+ expect(arr).toEqual(localArr);
- expectedArr[1] = {b: {c: 'pizza'}};
+ prop5.set(null);
+ expect(arr).toEqual([1, 2, 3]);
+ expect(arr.length).toBe(3);
+ });
- expect(prop.get()).toBe(undefined);
- expect(obj).toEqual({});
+ it("should not access whole array elements with index -1", function() {
+ // for a lot of cases we could make this work,
+ // but deleting the value is a mess, and anyway
+ // we don't need this, it's better just to set the whole
+ // array, ie np(obj, 'arr')
+ var obj = { arr: [1, 2, 3] };
+ expect(function() {
+ np(obj, "arr[-1]");
+ }).toThrow("bad property string");
+ });
- prop.set('pizza');
- expect(obj).toEqual({a: expectedArr});
- expect(prop.get()).toBe('pizza');
+ it(
+ "should access properties of objects in an array with index -1",
+ function() {
+ var obj = { arr: [{ a: 1 }, { a: 2 }, { b: 3 }] },
+ prop = np(obj, "arr[-1].a");
+
+ expect(prop.get()).toEqual([1, 2, undefined]);
+ expect(obj).toEqual({ arr: [{ a: 1 }, { a: 2 }, { b: 3 }] });
+
+ prop.set(5);
+ expect(prop.get()).toBe(5);
+ expect(obj).toEqual({ arr: [{ a: 5 }, { a: 5 }, { a: 5, b: 3 }] });
+
+ prop.set(null);
+ expect(prop.get()).toBe(undefined);
+ expect(obj).toEqual({ arr: [undefined, undefined, { b: 3 }] });
+
+ prop.set([2, 3, 4]);
+ expect(prop.get()).toEqual([2, 3, 4]);
+ expect(obj).toEqual({ arr: [{ a: 2 }, { a: 3 }, { a: 4, b: 3 }] });
+
+ prop.set([6, 7, undefined]);
+ expect(prop.get()).toEqual([6, 7, undefined]);
+ expect(obj).toEqual({ arr: [{ a: 6 }, { a: 7 }, { b: 3 }] });
+
+ // too short an array: wrap around
+ prop.set([9, 10]);
+ expect(prop.get()).toEqual([9, 10, 9]);
+ expect(obj).toEqual({ arr: [{ a: 9 }, { a: 10 }, { a: 9, b: 3 }] });
+
+ // too long an array: ignore extras
+ prop.set([11, 12, 13, 14]);
+ expect(prop.get()).toEqual([11, 12, 13]);
+ expect(obj).toEqual({ arr: [{ a: 11 }, { a: 12 }, { a: 13, b: 3 }] });
+ }
+ );
+
+ it("should remove a property only with undefined or null", function() {
+ var obj = { a: "b", c: "d" }, propA = np(obj, "a"), propC = np(obj, "c");
+
+ propA.set(null);
+ propC.set(undefined);
+ expect(obj).toEqual({});
+
+ propA.set(false);
+ np(obj, "b").set("");
+ propC.set(0);
+ np(obj, "d").set(NaN);
+ expect(obj).toEqual({ a: false, b: "", c: 0, d: NaN });
+ });
- prop.set(null);
- expect(prop.get()).toBe(undefined);
- expect(obj).toEqual({a: []});
- });
+ it("should remove containers but not data arrays", function() {
+ var obj = {
+ annotations: [{ a: [1, 2, 3] }],
+ c: [1, 2, 3],
+ domain: [1, 2],
+ range: [2, 3],
+ shapes: ["elephant"]
+ },
+ propA = np(obj, "annotations[-1].a"),
+ propC = np(obj, "c"),
+ propD0 = np(obj, "domain[0]"),
+ propD1 = np(obj, "domain[1]"),
+ propR = np(obj, "range"),
+ propS = np(obj, "shapes[0]");
+
+ propA.set([]);
+ propC.set([]);
+ propD0.set(undefined);
+ propD1.set(undefined);
+ propR.set([]);
+ propS.set(null);
+
+ expect(obj).toEqual({ c: [] });
+ });
- it('should get empty, and fail on set, with a bad input object', function() {
- var badProps = [
- np(5, 'a'),
- np(undefined, 'a'),
- np('cats', 'a'),
- np(true, 'a')
- ];
-
- function badSetter(i) {
- return function() {
- badProps[i].set('cats');
- };
- }
+ it(
+ "should have no empty object sub-containers but contain empty data arrays",
+ function() {
+ var obj = {}, prop = np(obj, "a[1].b.c"), expectedArr = [];
+
+ expectedArr[1] = { b: { c: "pizza" } };
+
+ expect(prop.get()).toBe(undefined);
+ expect(obj).toEqual({});
+
+ prop.set("pizza");
+ expect(obj).toEqual({ a: expectedArr });
+ expect(prop.get()).toBe("pizza");
+
+ prop.set(null);
+ expect(prop.get()).toBe(undefined);
+ expect(obj).toEqual({ a: [] });
+ }
+ );
+
+ it(
+ "should get empty, and fail on set, with a bad input object",
+ function() {
+ var badProps = [
+ np(5, "a"),
+ np(undefined, "a"),
+ np("cats", "a"),
+ np(true, "a")
+ ];
+
+ function badSetter(i) {
+ return function() {
+ badProps[i].set("cats");
+ };
+ }
- for(var i = 0; i < badProps.length; i++) {
- expect(badProps[i].get()).toBe(undefined);
- expect(badSetter(i)).toThrow('bad container');
- }
- });
+ for (var i = 0; i < badProps.length; i++) {
+ expect(badProps[i].get()).toBe(undefined);
+ expect(badSetter(i)).toThrow("bad container");
+ }
+ }
+ );
- it('should fail on a bad property string', function() {
- var badStr = [
- [], {}, false, undefined, null, NaN, Infinity
- ];
+ it("should fail on a bad property string", function() {
+ var badStr = [[], {}, false, undefined, null, NaN, Infinity];
- function badProp(i) {
- return function() {
- np({}, badStr[i]);
- };
- }
+ function badProp(i) {
+ return function() {
+ np({}, badStr[i]);
+ };
+ }
- for(var i = 0; i < badStr.length; i++) {
- expect(badProp(i)).toThrow('bad property string');
- }
- });
+ for (var i = 0; i < badStr.length; i++) {
+ expect(badProp(i)).toThrow("bad property string");
+ }
});
+ });
- describe('objectFromPath', function() {
+ describe("objectFromPath", function() {
+ it("should return an object", function() {
+ var obj = Lib.objectFromPath("test", "object");
- it('should return an object', function() {
- var obj = Lib.objectFromPath('test', 'object');
-
- expect(obj).toEqual({ test: 'object' });
- });
+ expect(obj).toEqual({ test: "object" });
+ });
- it('should work for deep objects', function() {
- var obj = Lib.objectFromPath('deep.nested.test', 'object');
+ it("should work for deep objects", function() {
+ var obj = Lib.objectFromPath("deep.nested.test", "object");
- expect(obj).toEqual({ deep: { nested: { test: 'object' }}});
- });
+ expect(obj).toEqual({ deep: { nested: { test: "object" } } });
+ });
- it('should work for arrays', function() {
- var obj = Lib.objectFromPath('nested[2].array', 'object');
+ it("should work for arrays", function() {
+ var obj = Lib.objectFromPath("nested[2].array", "object");
- expect(Object.keys(obj)).toEqual(['nested']);
- expect(Array.isArray(obj.nested)).toBe(true);
- expect(obj.nested[0]).toBe(undefined);
- expect(obj.nested[2]).toEqual({ array: 'object' });
- });
+ expect(Object.keys(obj)).toEqual(["nested"]);
+ expect(Array.isArray(obj.nested)).toBe(true);
+ expect(obj.nested[0]).toBe(undefined);
+ expect(obj.nested[2]).toEqual({ array: "object" });
+ });
- it('should work for any given value', function() {
- var obj = Lib.objectFromPath('test.type', { an: 'object' });
+ it("should work for any given value", function() {
+ var obj = Lib.objectFromPath("test.type", { an: "object" });
- expect(obj).toEqual({ test: { type: { an: 'object' }}});
+ expect(obj).toEqual({ test: { type: { an: "object" } } });
- obj = Lib.objectFromPath('test.type', [42]);
+ obj = Lib.objectFromPath("test.type", [42]);
- expect(obj).toEqual({ test: { type: [42] }});
- });
+ expect(obj).toEqual({ test: { type: [42] } });
});
+ });
- describe('expandObjectPaths', function() {
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
- });
-
- it('returns the original object', function() {
- var x = {};
- expect(Lib.expandObjectPaths(x)).toBe(x);
- });
+ describe("expandObjectPaths", function() {
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
- it('unpacks top-level paths', function() {
- var input = {'marker.color': 'red', 'marker.size': [1, 2, 3]};
- var expected = {marker: {color: 'red', size: [1, 2, 3]}};
- expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
- });
+ it("returns the original object", function() {
+ var x = {};
+ expect(Lib.expandObjectPaths(x)).toBe(x);
+ });
- it('unpacks recursively', function() {
- var input = {'marker.color': {'red.certainty': 'definitely'}};
- var expected = {marker: {color: {red: {certainty: 'definitely'}}}};
- expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
- });
+ it("unpacks top-level paths", function() {
+ var input = { "marker.color": "red", "marker.size": [1, 2, 3] };
+ var expected = { marker: { color: "red", size: [1, 2, 3] } };
+ expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
+ });
- it('unpacks deep paths', function() {
- var input = {'foo.bar.baz': 'red'};
- var expected = {foo: {bar: {baz: 'red'}}};
- expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
- });
+ it("unpacks recursively", function() {
+ var input = { "marker.color": { "red.certainty": "definitely" } };
+ var expected = {
+ marker: { color: { red: { certainty: "definitely" } } }
+ };
+ expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
+ });
- it('unpacks non-top-level deep paths', function() {
- var input = {color: {'foo.bar.baz': 'red'}};
- var expected = {color: {foo: {bar: {baz: 'red'}}}};
- expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
- });
+ it("unpacks deep paths", function() {
+ var input = { "foo.bar.baz": "red" };
+ var expected = { foo: { bar: { baz: "red" } } };
+ expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
+ });
- it('merges dotted properties into objects', function() {
- var input = {marker: {color: 'red'}, 'marker.size': 8};
- var expected = {marker: {color: 'red', size: 8}};
- expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
- });
+ it("unpacks non-top-level deep paths", function() {
+ var input = { color: { "foo.bar.baz": "red" } };
+ var expected = { color: { foo: { bar: { baz: "red" } } } };
+ expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
+ });
- it('merges objects into dotted properties', function() {
- var input = {'marker.size': 8, marker: {color: 'red'}};
- var expected = {marker: {color: 'red', size: 8}};
- expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
- });
+ it("merges dotted properties into objects", function() {
+ var input = { marker: { color: "red" }, "marker.size": 8 };
+ var expected = { marker: { color: "red", size: 8 } };
+ expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
+ });
- it('retains the identity of nested objects', function() {
- var input = {marker: {size: 8}};
- var origNested = input.marker;
- var expanded = Lib.expandObjectPaths(input);
- var newNested = expanded.marker;
+ it("merges objects into dotted properties", function() {
+ var input = { "marker.size": 8, marker: { color: "red" } };
+ var expected = { marker: { color: "red", size: 8 } };
+ expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
+ });
- expect(input).toBe(expanded);
- expect(origNested).toBe(newNested);
- });
+ it("retains the identity of nested objects", function() {
+ var input = { marker: { size: 8 } };
+ var origNested = input.marker;
+ var expanded = Lib.expandObjectPaths(input);
+ var newNested = expanded.marker;
- it('retains the identity of nested arrays', function() {
- var input = {'marker.size': [1, 2, 3]};
- var origArray = input['marker.size'];
- var expanded = Lib.expandObjectPaths(input);
- var newArray = expanded.marker.size;
+ expect(input).toBe(expanded);
+ expect(origNested).toBe(newNested);
+ });
- expect(input).toBe(expanded);
- expect(origArray).toBe(newArray);
- });
+ it("retains the identity of nested arrays", function() {
+ var input = { "marker.size": [1, 2, 3] };
+ var origArray = input["marker.size"];
+ var expanded = Lib.expandObjectPaths(input);
+ var newArray = expanded.marker.size;
- it('expands bracketed array notation', function() {
- var input = {'marker[1]': {color: 'red'}};
- var expected = {marker: [undefined, {color: 'red'}]};
- expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
- });
+ expect(input).toBe(expanded);
+ expect(origArray).toBe(newArray);
+ });
- it('expands nested arrays', function() {
- var input = {'marker[1].range[1]': 5};
- var expected = {marker: [undefined, {range: [undefined, 5]}]};
- var computed = Lib.expandObjectPaths(input);
- expect(computed).toLooseDeepEqual(expected);
- });
+ it("expands bracketed array notation", function() {
+ var input = { "marker[1]": { color: "red" } };
+ var expected = { marker: [undefined, { color: "red" }] };
+ expect(Lib.expandObjectPaths(input)).toLooseDeepEqual(expected);
+ });
- it('expands bracketed array with more nested attributes', function() {
- var input = {'marker[1]': {'color.alpha': 2}};
- var expected = {marker: [undefined, {color: {alpha: 2}}]};
- var computed = Lib.expandObjectPaths(input);
- expect(computed).toLooseDeepEqual(expected);
- });
+ it("expands nested arrays", function() {
+ var input = { "marker[1].range[1]": 5 };
+ var expected = { marker: [undefined, { range: [undefined, 5] }] };
+ var computed = Lib.expandObjectPaths(input);
+ expect(computed).toLooseDeepEqual(expected);
+ });
- it('expands bracketed array notation without further nesting', function() {
- var input = {'marker[1]': 8};
- var expected = {marker: [undefined, 8]};
- var computed = Lib.expandObjectPaths(input);
- expect(computed).toLooseDeepEqual(expected);
- });
+ it("expands bracketed array with more nested attributes", function() {
+ var input = { "marker[1]": { "color.alpha": 2 } };
+ var expected = { marker: [undefined, { color: { alpha: 2 } }] };
+ var computed = Lib.expandObjectPaths(input);
+ expect(computed).toLooseDeepEqual(expected);
+ });
- it('expands bracketed array notation with further nesting', function() {
- var input = {'marker[1].size': 8};
- var expected = {marker: [undefined, {size: 8}]};
- var computed = Lib.expandObjectPaths(input);
- expect(computed).toLooseDeepEqual(expected);
- });
+ it("expands bracketed array notation without further nesting", function() {
+ var input = { "marker[1]": 8 };
+ var expected = { marker: [undefined, 8] };
+ var computed = Lib.expandObjectPaths(input);
+ expect(computed).toLooseDeepEqual(expected);
+ });
- it('expands bracketed array notation with further nesting', function() {
- var input = {'marker[1].size.magnitude': 8};
- var expected = {marker: [undefined, {size: {magnitude: 8}}]};
- var computed = Lib.expandObjectPaths(input);
- expect(computed).toLooseDeepEqual(expected);
- });
+ it("expands bracketed array notation with further nesting", function() {
+ var input = { "marker[1].size": 8 };
+ var expected = { marker: [undefined, { size: 8 }] };
+ var computed = Lib.expandObjectPaths(input);
+ expect(computed).toLooseDeepEqual(expected);
+ });
- it('combines changes with single array nesting', function() {
- var input = {'marker[1].foo': 5, 'marker[0].foo': 4};
- var expected = {marker: [{foo: 4}, {foo: 5}]};
- var computed = Lib.expandObjectPaths(input);
- expect(computed).toLooseDeepEqual(expected);
- });
+ it("expands bracketed array notation with further nesting", function() {
+ var input = { "marker[1].size.magnitude": 8 };
+ var expected = { marker: [undefined, { size: { magnitude: 8 } }] };
+ var computed = Lib.expandObjectPaths(input);
+ expect(computed).toLooseDeepEqual(expected);
+ });
- it('does not skip over array container set to null values', function() {
- var input = {title: 'clear annotations', annotations: null};
- var expected = {title: 'clear annotations', annotations: null};
- var computed = Lib.expandObjectPaths(input);
- expect(computed).toLooseDeepEqual(expected);
- });
+ it("combines changes with single array nesting", function() {
+ var input = { "marker[1].foo": 5, "marker[0].foo": 4 };
+ var expected = { marker: [{ foo: 4 }, { foo: 5 }] };
+ var computed = Lib.expandObjectPaths(input);
+ expect(computed).toLooseDeepEqual(expected);
+ });
- it('expands array containers', function() {
- var input = {title: 'clear annotation 1', 'annotations[1]': { title: 'new' }};
- var expected = {title: 'clear annotation 1', annotations: [null, { title: 'new' }]};
- var computed = Lib.expandObjectPaths(input);
- expect(computed).toLooseDeepEqual(expected);
- });
+ it("does not skip over array container set to null values", function() {
+ var input = { title: "clear annotations", annotations: null };
+ var expected = { title: "clear annotations", annotations: null };
+ var computed = Lib.expandObjectPaths(input);
+ expect(computed).toLooseDeepEqual(expected);
+ });
- // TODO: This test is unimplemented since it's a currently-unused corner case.
- // Getting the test to pass requires some extension (pun?) to extendDeepNoArrays
- // that's intelligent enough to only selectively merge *some* arrays, in particular
- // not data arrays but yes on arrays that were previously expanded. This is a bit
- // tricky to get to work just right and currently doesn't have any known use since
- // container arrays are not multiply nested.
- //
- // Additional notes on what works or what doesn't work. This case does *not* work
- // because the two nested arrays that would result from the expansion need to be
- // deep merged.
- //
- // Lib.expandObjectPaths({'marker.range[0]': 5, 'marker.range[1]': 2})
- //
- // // => {marker: {range: [null, 2]}}
- //
- // This case *does* work becuase the array merging does not require a deep extend:
- //
- // Lib.expandObjectPaths({'range[0]': 5, 'range[1]': 2}
- //
- // // => {range: [5, 2]}
- //
- // Finally note that this case works fine becuase there's no merge necessary:
- //
- // Lib.expandObjectPaths({'marker.range[1]': 2})
- //
- // // => {marker: {range: [null, 2]}}
- //
- /*
+ it("expands array containers", function() {
+ var input = {
+ title: "clear annotation 1",
+ "annotations[1]": { title: "new" }
+ };
+ var expected = {
+ title: "clear annotation 1",
+ annotations: [null, { title: "new" }]
+ };
+ var computed = Lib.expandObjectPaths(input);
+ expect(computed).toLooseDeepEqual(expected);
+ });
+ // TODO: This test is unimplemented since it's a currently-unused corner case.
+ // Getting the test to pass requires some extension (pun?) to extendDeepNoArrays
+ // that's intelligent enough to only selectively merge *some* arrays, in particular
+ // not data arrays but yes on arrays that were previously expanded. This is a bit
+ // tricky to get to work just right and currently doesn't have any known use since
+ // container arrays are not multiply nested.
+ //
+ // Additional notes on what works or what doesn't work. This case does *not* work
+ // because the two nested arrays that would result from the expansion need to be
+ // deep merged.
+ //
+ // Lib.expandObjectPaths({'marker.range[0]': 5, 'marker.range[1]': 2})
+ //
+ // // => {marker: {range: [null, 2]}}
+ //
+ // This case *does* work becuase the array merging does not require a deep extend:
+ //
+ // Lib.expandObjectPaths({'range[0]': 5, 'range[1]': 2}
+ //
+ // // => {range: [5, 2]}
+ //
+ // Finally note that this case works fine becuase there's no merge necessary:
+ //
+ // Lib.expandObjectPaths({'marker.range[1]': 2})
+ //
+ // // => {marker: {range: [null, 2]}}
+ //
+ /*
it('combines changes', function() {
var input = {'marker[1].range[1]': 5, 'marker[1].range[0]': 4};
var expected = {marker: [undefined, {range: [4, 5]}]};
@@ -608,1064 +604,1112 @@ describe('Test lib.js:', function() {
expect(computed).toEqual(expected);
});
*/
+ });
+
+ describe("coerce", function() {
+ var coerce = Lib.coerce, out;
+
+ // TODO: I tested font and string because I changed them, but all the other types need tests still
+ it("should set a value and return the value it sets", function() {
+ var aVal = "aaaaah!",
+ cVal = { 1: 2, 3: 4 },
+ attrs = {
+ a: { valType: "any", dflt: aVal },
+ b: { c: { valType: "any" } }
+ },
+ obj = { b: { c: cVal } },
+ outObj = {},
+ aOut = coerce(obj, outObj, attrs, "a"),
+ cOut = coerce(obj, outObj, attrs, "b.c");
+
+ expect(aOut).toBe(aVal);
+ expect(aOut).toBe(outObj.a);
+ expect(cOut).toBe(cVal);
+ expect(cOut).toBe(outObj.b.c);
});
- describe('coerce', function() {
- var coerce = Lib.coerce,
- out;
-
- // TODO: I tested font and string because I changed them, but all the other types need tests still
-
- it('should set a value and return the value it sets', function() {
- var aVal = 'aaaaah!',
- cVal = {1: 2, 3: 4},
- attrs = {a: {valType: 'any', dflt: aVal}, b: {c: {valType: 'any'}}},
- obj = {b: {c: cVal}},
- outObj = {},
-
- aOut = coerce(obj, outObj, attrs, 'a'),
- cOut = coerce(obj, outObj, attrs, 'b.c');
-
- expect(aOut).toBe(aVal);
- expect(aOut).toBe(outObj.a);
- expect(cOut).toBe(cVal);
- expect(cOut).toBe(outObj.b.c);
- });
-
- describe('string valType', function() {
- var dflt = 'Jabberwock',
- stringAttrs = {
- s: {valType: 'string', dflt: dflt},
- noBlank: {valType: 'string', dflt: dflt, noBlank: true}
- };
-
- it('should insert the default if input is missing, or blank with noBlank', function() {
- out = coerce(undefined, {}, stringAttrs, 's');
- expect(out).toEqual(dflt);
-
- out = coerce({}, {}, stringAttrs, 's');
- expect(out).toEqual(dflt);
-
- out = coerce({s: ''}, {}, stringAttrs, 's');
- expect(out).toEqual('');
+ describe("string valType", function() {
+ var dflt = "Jabberwock",
+ stringAttrs = {
+ s: { valType: "string", dflt: dflt },
+ noBlank: { valType: "string", dflt: dflt, noBlank: true }
+ };
- out = coerce({noBlank: ''}, {}, stringAttrs, 'noBlank');
- expect(out).toEqual(dflt);
- });
+ it(
+ "should insert the default if input is missing, or blank with noBlank",
+ function() {
+ out = coerce(undefined, {}, stringAttrs, "s");
+ expect(out).toEqual(dflt);
- it('should always return a string for any input', function() {
- expect(coerce({s: 'a string!!'}, {}, stringAttrs, 's'))
- .toEqual('a string!!');
+ out = coerce({}, {}, stringAttrs, "s");
+ expect(out).toEqual(dflt);
- expect(coerce({s: 42}, {}, stringAttrs, 's'))
- .toEqual('42');
+ out = coerce({ s: "" }, {}, stringAttrs, "s");
+ expect(out).toEqual("");
- expect(coerce({s: [1, 2, 3]}, {}, stringAttrs, 's'))
- .toEqual(dflt);
+ out = coerce({ noBlank: "" }, {}, stringAttrs, "noBlank");
+ expect(out).toEqual(dflt);
+ }
+ );
- expect(coerce({s: true}, {}, stringAttrs, 's'))
- .toEqual(dflt);
+ it("should always return a string for any input", function() {
+ expect(coerce({ s: "a string!!" }, {}, stringAttrs, "s")).toEqual(
+ "a string!!"
+ );
- expect(coerce({s: {1: 2}}, {}, stringAttrs, 's'))
- .toEqual(dflt);
- });
- });
+ expect(coerce({ s: 42 }, {}, stringAttrs, "s")).toEqual("42");
- describe('coerce2', function() {
- var coerce2 = Lib.coerce2;
-
- it('should set a value and return the value it sets when user input is valid', function() {
- var colVal = 'red',
- sizeVal = 0, // 0 is valid but falsey
- attrs = {testMarker: {testColor: {valType: 'color', dflt: 'rgba(0, 0, 0, 0)'},
- testSize: {valType: 'number', dflt: 20}}},
- obj = {testMarker: {testColor: colVal, testSize: sizeVal}},
- outObj = {},
- colOut = coerce2(obj, outObj, attrs, 'testMarker.testColor'),
- sizeOut = coerce2(obj, outObj, attrs, 'testMarker.testSize');
-
- expect(colOut).toBe(colVal);
- expect(colOut).toBe(outObj.testMarker.testColor);
- expect(sizeOut).toBe(sizeVal);
- expect(sizeOut).toBe(outObj.testMarker.testSize);
- });
-
- it('should set and return the default if the user input is not valid', function() {
- var colVal = 'r',
- sizeVal = 'aaaaah!',
- attrs = {testMarker: {testColor: {valType: 'color', dflt: 'rgba(0, 0, 0, 0)'},
- testSize: {valType: 'number', dflt: 20}}},
- obj = {testMarker: {testColor: colVal, testSize: sizeVal}},
- outObj = {},
- colOut = coerce2(obj, outObj, attrs, 'testMarker.testColor'),
- sizeOut = coerce2(obj, outObj, attrs, 'testMarker.testSize');
-
- expect(colOut).toBe('rgba(0, 0, 0, 0)');
- expect(sizeOut).toBe(outObj.testMarker.testSize);
- expect(sizeOut).toBe(20);
- expect(sizeOut).toBe(outObj.testMarker.testSize);
- });
-
- it('should return false if there is no user input', function() {
- var colVal = null,
- sizeVal, // undefined
- attrs = {testMarker: {testColor: {valType: 'color', dflt: 'rgba(0, 0, 0, 0)'},
- testSize: {valType: 'number', dflt: 20}}},
- obj = {testMarker: {testColor: colVal, testSize: sizeVal}},
- outObj = {},
- colOut = coerce2(obj, outObj, attrs, 'testMarker.testColor'),
- sizeOut = coerce2(obj, outObj, attrs, 'testMarker.testSize');
-
- expect(colOut).toBe(false);
- expect(sizeOut).toBe(false);
- });
- });
+ expect(coerce({ s: [1, 2, 3] }, {}, stringAttrs, "s")).toEqual(dflt);
- describe('info_array valType', function() {
- var infoArrayAttrs = {
- range: {
- valType: 'info_array',
- items: [
- { valType: 'number' },
- { valType: 'number' }
- ]
- },
- domain: {
- valType: 'info_array',
- items: [
- { valType: 'number', min: 0, max: 1 },
- { valType: 'number', min: 0, max: 1 }
- ],
- dflt: [0, 1]
- }
- };
-
- it('should insert the default if input is missing', function() {
- expect(coerce(undefined, {}, infoArrayAttrs, 'domain'))
- .toEqual([0, 1]);
- expect(coerce(undefined, {}, infoArrayAttrs, 'domain', [0, 0.5]))
- .toEqual([0, 0.5]);
- });
-
- it('should dive into the items and coerce accordingly', function() {
- expect(coerce({range: ['-10', 100]}, {}, infoArrayAttrs, 'range'))
- .toEqual([-10, 100]);
-
- expect(coerce({domain: [0, 0.5]}, {}, infoArrayAttrs, 'domain'))
- .toEqual([0, 0.5]);
-
- expect(coerce({domain: [-5, 0.5]}, {}, infoArrayAttrs, 'domain'))
- .toEqual([0, 0.5]);
-
- expect(coerce({domain: [0.5, 4.5]}, {}, infoArrayAttrs, 'domain'))
- .toEqual([0.5, 1]);
- });
-
- it('should coerce unexpected input as best as it can', function() {
- expect(coerce({range: [12]}, {}, infoArrayAttrs, 'range'))
- .toEqual([12]);
-
- expect(coerce({range: [12]}, {}, infoArrayAttrs, 'range', [-1, 20]))
- .toEqual([12, 20]);
-
- expect(coerce({domain: [0.5]}, {}, infoArrayAttrs, 'domain'))
- .toEqual([0.5, 1]);
-
- expect(coerce({range: ['-10', 100, 12]}, {}, infoArrayAttrs, 'range'))
- .toEqual([-10, 100]);
-
- expect(coerce({domain: [0, 0.5, 1]}, {}, infoArrayAttrs, 'domain'))
- .toEqual([0, 0.5]);
- });
- });
+ expect(coerce({ s: true }, {}, stringAttrs, "s")).toEqual(dflt);
- describe('subplotid valtype', function() {
- var dflt = 'slice';
- var idAttrs = {
- pizza: {
- valType: 'subplotid',
- dflt: dflt
- }
- };
-
- var goodVals = ['slice', 'slice2', 'slice1492'];
-
- goodVals.forEach(function(goodVal) {
- it('should allow "' + goodVal + '"', function() {
- expect(coerce({pizza: goodVal}, {}, idAttrs, 'pizza'))
- .toEqual(goodVal);
- });
- });
-
- var badVals = [
- 'slice0',
- 'slice1',
- 'Slice2',
- '2slice',
- '2',
- 2,
- 'slice2 ',
- 'slice2.0',
- ' slice2',
- 'slice 2',
- 'slice01'
- ];
-
- badVals.forEach(function(badVal) {
- it('should not allow "' + badVal + '"', function() {
- expect(coerce({pizza: badVal}, {}, idAttrs, 'pizza'))
- .toEqual(dflt);
- });
- });
- });
+ expect(coerce({ s: { 1: 2 } }, {}, stringAttrs, "s")).toEqual(dflt);
+ });
});
- describe('coerceFont', function() {
- var fontAttrs = Plots.fontAttrs,
- extendFlat = Lib.extendFlat,
- coerceFont = Lib.coerceFont;
-
- var defaultFont = {
- family: '"Open sans", verdana, arial, sans-serif, DEFAULT',
- size: 314159,
- color: 'neon pink with sparkles'
- };
-
- var attributes = {
- fontWithDefault: {
- family: extendFlat({}, fontAttrs.family, {dflt: defaultFont.family}),
- size: extendFlat({}, fontAttrs.size, {dflt: defaultFont.size}),
- color: extendFlat({}, fontAttrs.color, {dflt: defaultFont.color})
+ describe("coerce2", function() {
+ var coerce2 = Lib.coerce2;
+
+ it(
+ "should set a value and return the value it sets when user input is valid",
+ function() {
+ var colVal = "red",
+ sizeVal = 0,
+ // 0 is valid but falsey
+ attrs = {
+ testMarker: {
+ testColor: { valType: "color", dflt: "rgba(0, 0, 0, 0)" },
+ testSize: { valType: "number", dflt: 20 }
+ }
},
- fontNoDefault: fontAttrs
- };
-
- var containerIn;
-
- function coerce(attr, dflt) {
- return Lib.coerce(containerIn, {}, attributes, attr, dflt);
+ obj = { testMarker: { testColor: colVal, testSize: sizeVal } },
+ outObj = {},
+ colOut = coerce2(obj, outObj, attrs, "testMarker.testColor"),
+ sizeOut = coerce2(obj, outObj, attrs, "testMarker.testSize");
+
+ expect(colOut).toBe(colVal);
+ expect(colOut).toBe(outObj.testMarker.testColor);
+ expect(sizeOut).toBe(sizeVal);
+ expect(sizeOut).toBe(outObj.testMarker.testSize);
}
-
- it('should insert the full default if no or empty input', function() {
- containerIn = undefined;
- expect(coerceFont(coerce, 'fontWithDefault'))
- .toEqual(defaultFont);
-
- containerIn = {};
- expect(coerceFont(coerce, 'fontNoDefault', defaultFont))
- .toEqual(defaultFont);
-
- containerIn = {fontWithDefault: {}};
- expect(coerceFont(coerce, 'fontWithDefault'))
- .toEqual(defaultFont);
- });
-
- it('should fill in defaults for bad inputs', function() {
- containerIn = {
- fontWithDefault: {family: '', size: 'a million', color: 42}
- };
- expect(coerceFont(coerce, 'fontWithDefault'))
- .toEqual(defaultFont);
- });
-
- it('should pass through individual valid pieces', function() {
- var goodFamily = 'A fish', // for now any non-blank string is OK
- badFamily = 42,
- goodSize = 123.456,
- badSize = 'ginormous',
- goodColor = 'red',
- badColor = 'a dark and stormy night';
-
- containerIn = {
- fontWithDefault: {family: goodFamily, size: badSize, color: badColor}
- };
- expect(coerceFont(coerce, 'fontWithDefault'))
- .toEqual({family: goodFamily, size: defaultFont.size, color: defaultFont.color});
-
- containerIn = {
- fontWithDefault: {family: badFamily, size: goodSize, color: badColor}
- };
- expect(coerceFont(coerce, 'fontWithDefault'))
- .toEqual({family: defaultFont.family, size: goodSize, color: defaultFont.color});
-
- containerIn = {
- fontWithDefault: {family: badFamily, size: badSize, color: goodColor}
- };
- expect(coerceFont(coerce, 'fontWithDefault'))
- .toEqual({family: defaultFont.family, size: defaultFont.size, color: goodColor});
- });
- });
-
- describe('init2dArray', function() {
- it('should initialize a 2d array with the correct dimenstions', function() {
- var array = Lib.init2dArray(4, 5);
- expect(array.length).toEqual(4);
- expect(array[0].length).toEqual(5);
- expect(array[3].length).toEqual(5);
- });
+ );
+
+ it(
+ "should set and return the default if the user input is not valid",
+ function() {
+ var colVal = "r",
+ sizeVal = "aaaaah!",
+ attrs = {
+ testMarker: {
+ testColor: { valType: "color", dflt: "rgba(0, 0, 0, 0)" },
+ testSize: { valType: "number", dflt: 20 }
+ }
+ },
+ obj = { testMarker: { testColor: colVal, testSize: sizeVal } },
+ outObj = {},
+ colOut = coerce2(obj, outObj, attrs, "testMarker.testColor"),
+ sizeOut = coerce2(obj, outObj, attrs, "testMarker.testSize");
+
+ expect(colOut).toBe("rgba(0, 0, 0, 0)");
+ expect(sizeOut).toBe(outObj.testMarker.testSize);
+ expect(sizeOut).toBe(20);
+ expect(sizeOut).toBe(outObj.testMarker.testSize);
+ }
+ );
+
+ it("should return false if there is no user input", function() {
+ var colVal = null,
+ sizeVal,
+ // undefined
+ attrs = {
+ testMarker: {
+ testColor: { valType: "color", dflt: "rgba(0, 0, 0, 0)" },
+ testSize: { valType: "number", dflt: 20 }
+ }
+ },
+ obj = { testMarker: { testColor: colVal, testSize: sizeVal } },
+ outObj = {},
+ colOut = coerce2(obj, outObj, attrs, "testMarker.testColor"),
+ sizeOut = coerce2(obj, outObj, attrs, "testMarker.testSize");
+
+ expect(colOut).toBe(false);
+ expect(sizeOut).toBe(false);
+ });
});
- describe('validate', function() {
-
- function assert(shouldPass, shouldFail, valObject) {
- shouldPass.forEach(function(v) {
- var res = Lib.validate(v, valObject);
- expect(res).toBe(true, JSON.stringify(v) + ' should pass');
- });
-
- shouldFail.forEach(function(v) {
- var res = Lib.validate(v, valObject);
- expect(res).toBe(false, JSON.stringify(v) + ' should fail');
- });
+ describe("info_array valType", function() {
+ var infoArrayAttrs = {
+ range: {
+ valType: "info_array",
+ items: [{ valType: "number" }, { valType: "number" }]
+ },
+ domain: {
+ valType: "info_array",
+ items: [
+ { valType: "number", min: 0, max: 1 },
+ { valType: "number", min: 0, max: 1 }
+ ],
+ dflt: [0, 1]
}
+ };
+
+ it("should insert the default if input is missing", function() {
+ expect(coerce(undefined, {}, infoArrayAttrs, "domain")).toEqual([0, 1]);
+ expect(
+ coerce(undefined, {}, infoArrayAttrs, "domain", [0, 0.5])
+ ).toEqual([0, 0.5]);
+ });
+
+ it("should dive into the items and coerce accordingly", function() {
+ expect(
+ coerce({ range: ["-10", 100] }, {}, infoArrayAttrs, "range")
+ ).toEqual([-10, 100]);
+
+ expect(
+ coerce({ domain: [0, 0.5] }, {}, infoArrayAttrs, "domain")
+ ).toEqual([0, 0.5]);
+
+ expect(
+ coerce({ domain: [-5, 0.5] }, {}, infoArrayAttrs, "domain")
+ ).toEqual([0, 0.5]);
+
+ expect(
+ coerce({ domain: [0.5, 4.5] }, {}, infoArrayAttrs, "domain")
+ ).toEqual([0.5, 1]);
+ });
+
+ it("should coerce unexpected input as best as it can", function() {
+ expect(coerce({ range: [12] }, {}, infoArrayAttrs, "range")).toEqual([
+ 12
+ ]);
+
+ expect(
+ coerce({ range: [12] }, {}, infoArrayAttrs, "range", [-1, 20])
+ ).toEqual([12, 20]);
+
+ expect(
+ coerce({ domain: [0.5] }, {}, infoArrayAttrs, "domain")
+ ).toEqual([0.5, 1]);
+
+ expect(
+ coerce({ range: ["-10", 100, 12] }, {}, infoArrayAttrs, "range")
+ ).toEqual([-10, 100]);
+
+ expect(
+ coerce({ domain: [0, 0.5, 1] }, {}, infoArrayAttrs, "domain")
+ ).toEqual([0, 0.5]);
+ });
+ });
- it('should work for valType \'data_array\' where', function() {
- var shouldPass = [[20], []],
- shouldFail = ['a', {}, 20, undefined, null];
-
- assert(shouldPass, shouldFail, {
- valType: 'data_array'
- });
-
- assert(shouldPass, shouldFail, {
- valType: 'data_array',
- dflt: [1, 2]
- });
- });
-
- it('should work for valType \'enumerated\' where', function() {
- assert(['a', 'b'], ['c', 1, null, undefined, ''], {
- valType: 'enumerated',
- values: ['a', 'b'],
- dflt: 'a'
- });
-
- assert([1, '1', 2, '2'], ['c', 3, null, undefined, ''], {
- valType: 'enumerated',
- values: [1, 2],
- coerceNumber: true,
- dflt: 1
- });
-
- assert(['a', 'b', [1, 2]], ['c', 1, null, undefined, ''], {
- valType: 'enumerated',
- values: ['a', 'b'],
- arrayOk: true,
- dflt: 'a'
- });
- });
-
- it('should work for valType \'boolean\' where', function() {
- var shouldPass = [true, false],
- shouldFail = ['a', 1, {}, [], null, undefined, ''];
-
- assert(shouldPass, shouldFail, {
- valType: 'boolean',
- dflt: true
- });
-
- assert(shouldPass, shouldFail, {
- valType: 'boolean',
- dflt: false
- });
- });
-
- it('should work for valType \'number\' where', function() {
- var shouldPass = [20, '20', 1e6],
- shouldFail = ['a', [], {}, null, undefined, ''];
-
- assert(shouldPass, shouldFail, {
- valType: 'number'
- });
-
- assert(shouldPass, shouldFail, {
- valType: 'number',
- dflt: null
- });
-
- assert([20, '20'], [-10, '-10', 25, '25'], {
- valType: 'number',
- dflt: 20,
- min: 0,
- max: 21
- });
-
- assert([20, '20', [1, 2]], ['a', {}], {
- valType: 'number',
- dflt: 20,
- arrayOk: true
- });
- });
-
- it('should work for valType \'integer\' where', function() {
- assert([1, 2, '3', '4'], ['a', 1.321321, {}, [], null, 2 / 3, undefined, null], {
- valType: 'integer',
- dflt: 1
- });
-
- assert([1, 2, '3', '4'], [-1, '-2', 2.121, null, undefined, [], {}], {
- valType: 'integer',
- min: 0,
- dflt: 1
- });
- });
-
- it('should work for valType \'string\' where', function() {
- var date = new Date(2016, 1, 1);
-
- assert(['3', '4', 'a', 3, 1.2113, ''], [undefined, {}, [], null, date, false], {
- valType: 'string',
- dflt: 'a'
- });
-
- assert(['3', '4', 'a', 3, 1.2113], ['', undefined, {}, [], null, date, true], {
- valType: 'string',
- dflt: 'a',
- noBlank: true
- });
-
- assert(['3', '4', ''], [undefined, 1, {}, [], null, date, true, false], {
- valType: 'string',
- dflt: 'a',
- strict: true
- });
-
- assert(['3', '4'], [undefined, 1, {}, [], null, date, '', true, false], {
- valType: 'string',
- dflt: 'a',
- strict: true,
- noBlank: true
- });
- });
-
- it('should work for valType \'color\' where', function() {
- var shouldPass = ['red', '#d3d3d3', 'rgba(0,255,255,0.1)'],
- shouldFail = [1, {}, [], 'rgq(233,122,332,1)', null, undefined];
-
- assert(shouldPass, shouldFail, {
- valType: 'color'
- });
- });
-
- it('should work for valType \'colorscale\' where', function() {
- var good = [ [0, 'red'], [1, 'blue'] ],
- bad = [ [0.1, 'red'], [1, 'blue'] ],
- bad2 = [ [0], [1] ],
- bad3 = [ ['red'], ['blue']],
- bad4 = ['red', 'blue'];
-
- var shouldPass = ['Viridis', 'Greens', good],
- shouldFail = ['red', 1, undefined, null, {}, [], bad, bad2, bad3, bad4];
+ describe("subplotid valtype", function() {
+ var dflt = "slice";
+ var idAttrs = { pizza: { valType: "subplotid", dflt: dflt } };
+
+ var goodVals = ["slice", "slice2", "slice1492"];
+
+ goodVals.forEach(function(goodVal) {
+ it('should allow "' + goodVal + '"', function() {
+ expect(coerce({ pizza: goodVal }, {}, idAttrs, "pizza")).toEqual(
+ goodVal
+ );
+ });
+ });
+
+ var badVals = [
+ "slice0",
+ "slice1",
+ "Slice2",
+ "2slice",
+ "2",
+ 2,
+ "slice2 ",
+ "slice2.0",
+ " slice2",
+ "slice 2",
+ "slice01"
+ ];
+
+ badVals.forEach(function(badVal) {
+ it('should not allow "' + badVal + '"', function() {
+ expect(coerce({ pizza: badVal }, {}, idAttrs, "pizza")).toEqual(dflt);
+ });
+ });
+ });
+ });
+
+ describe("coerceFont", function() {
+ var fontAttrs = Plots.fontAttrs,
+ extendFlat = Lib.extendFlat,
+ coerceFont = Lib.coerceFont;
+
+ var defaultFont = {
+ family: '"Open sans", verdana, arial, sans-serif, DEFAULT',
+ size: 314159,
+ color: "neon pink with sparkles"
+ };
+
+ var attributes = {
+ fontWithDefault: {
+ family: extendFlat({}, fontAttrs.family, { dflt: defaultFont.family }),
+ size: extendFlat({}, fontAttrs.size, { dflt: defaultFont.size }),
+ color: extendFlat({}, fontAttrs.color, { dflt: defaultFont.color })
+ },
+ fontNoDefault: fontAttrs
+ };
+
+ var containerIn;
+
+ function coerce(attr, dflt) {
+ return Lib.coerce(containerIn, {}, attributes, attr, dflt);
+ }
+
+ it("should insert the full default if no or empty input", function() {
+ containerIn = undefined;
+ expect(coerceFont(coerce, "fontWithDefault")).toEqual(defaultFont);
+
+ containerIn = {};
+ expect(coerceFont(coerce, "fontNoDefault", defaultFont)).toEqual(
+ defaultFont
+ );
+
+ containerIn = { fontWithDefault: {} };
+ expect(coerceFont(coerce, "fontWithDefault")).toEqual(defaultFont);
+ });
- assert(shouldPass, shouldFail, {
- valType: 'colorscale'
- });
- });
+ it("should fill in defaults for bad inputs", function() {
+ containerIn = {
+ fontWithDefault: { family: "", size: "a million", color: 42 }
+ };
+ expect(coerceFont(coerce, "fontWithDefault")).toEqual(defaultFont);
+ });
- it('should work for valType \'angle\' where', function() {
- var shouldPass = ['auto', '120', 270],
- shouldFail = [{}, [], 'red', null, undefined, ''];
+ it("should pass through individual valid pieces", function() {
+ var goodFamily = "A fish",
+ // for now any non-blank string is OK
+ badFamily = 42,
+ goodSize = 123.456,
+ badSize = "ginormous",
+ goodColor = "red",
+ badColor = "a dark and stormy night";
+
+ containerIn = {
+ fontWithDefault: { family: goodFamily, size: badSize, color: badColor }
+ };
+ expect(coerceFont(coerce, "fontWithDefault")).toEqual({
+ family: goodFamily,
+ size: defaultFont.size,
+ color: defaultFont.color
+ });
+
+ containerIn = {
+ fontWithDefault: { family: badFamily, size: goodSize, color: badColor }
+ };
+ expect(coerceFont(coerce, "fontWithDefault")).toEqual({
+ family: defaultFont.family,
+ size: goodSize,
+ color: defaultFont.color
+ });
+
+ containerIn = {
+ fontWithDefault: { family: badFamily, size: badSize, color: goodColor }
+ };
+ expect(coerceFont(coerce, "fontWithDefault")).toEqual({
+ family: defaultFont.family,
+ size: defaultFont.size,
+ color: goodColor
+ });
+ });
+ });
+
+ describe("init2dArray", function() {
+ it("should initialize a 2d array with the correct dimenstions", function() {
+ var array = Lib.init2dArray(4, 5);
+ expect(array.length).toEqual(4);
+ expect(array[0].length).toEqual(5);
+ expect(array[3].length).toEqual(5);
+ });
+ });
- assert(shouldPass, shouldFail, {
- valType: 'angle',
- dflt: 0
- });
- });
+ describe("validate", function() {
+ function assert(shouldPass, shouldFail, valObject) {
+ shouldPass.forEach(function(v) {
+ var res = Lib.validate(v, valObject);
+ expect(res).toBe(true, JSON.stringify(v) + " should pass");
+ });
- it('should work for valType \'subplotid\' where', function() {
- var shouldPass = ['sp', 'sp4', 'sp10'],
- shouldFail = [{}, [], 'sp1', 'sp0', 'spee1', null, undefined, true];
+ shouldFail.forEach(function(v) {
+ var res = Lib.validate(v, valObject);
+ expect(res).toBe(false, JSON.stringify(v) + " should fail");
+ });
+ }
- assert(shouldPass, shouldFail, {
- valType: 'subplotid',
- dflt: 'sp'
- });
- });
+ it("should work for valType 'data_array' where", function() {
+ var shouldPass = [[20], []], shouldFail = ["a", {}, 20, undefined, null];
- it('should work for valType \'flaglist\' where', function() {
- var shouldPass = ['a', 'b', 'a+b', 'b+a', 'c'],
- shouldFail = [{}, [], 'red', null, undefined, '', 'a + b'];
+ assert(shouldPass, shouldFail, { valType: "data_array" });
- assert(shouldPass, shouldFail, {
- valType: 'flaglist',
- flags: ['a', 'b'],
- extras: ['c']
- });
- });
+ assert(shouldPass, shouldFail, { valType: "data_array", dflt: [1, 2] });
+ });
- it('should work for valType \'any\' where', function() {
- var shouldPass = ['', '120', null, false, {}, []],
- shouldFail = [undefined];
+ it("should work for valType 'enumerated' where", function() {
+ assert(["a", "b"], ["c", 1, null, undefined, ""], {
+ valType: "enumerated",
+ values: ["a", "b"],
+ dflt: "a"
+ });
+
+ assert([1, "1", 2, "2"], ["c", 3, null, undefined, ""], {
+ valType: "enumerated",
+ values: [1, 2],
+ coerceNumber: true,
+ dflt: 1
+ });
+
+ assert(["a", "b", [1, 2]], ["c", 1, null, undefined, ""], {
+ valType: "enumerated",
+ values: ["a", "b"],
+ arrayOk: true,
+ dflt: "a"
+ });
+ });
- assert(shouldPass, shouldFail, {
- valType: 'any'
- });
- });
+ it("should work for valType 'boolean' where", function() {
+ var shouldPass = [true, false],
+ shouldFail = ["a", 1, {}, [], null, undefined, ""];
- it('should work for valType \'info_array\' where', function() {
- var shouldPass = [[1, 2], [-20, '20']],
- shouldFail = [
- {}, [], [10], [null, 10], ['aads', null],
- 'red', null, undefined, '',
- [1, 10, null]
- ];
-
- assert(shouldPass, shouldFail, {
- valType: 'info_array',
- items: [{
- valType: 'number', dflt: -20
- }, {
- valType: 'number', dflt: 20
- }]
- });
- });
+ assert(shouldPass, shouldFail, { valType: "boolean", dflt: true });
- it('should work for valType \'info_array\' (freeLength case)', function() {
- var shouldPass = [
- ['marker.color', 'red'],
- [{ 'marker.color': 'red' }, [1, 2]]
- ];
- var shouldFail = [
- ['marker.color', 'red', 'red'],
- [{ 'marker.color': 'red' }, [1, 2], 'blue']
- ];
-
- assert(shouldPass, shouldFail, {
- valType: 'info_array',
- freeLength: true,
- items: [{
- valType: 'any'
- }, {
- valType: 'any'
- }, {
- valType: 'number'
- }]
- });
- });
+ assert(shouldPass, shouldFail, { valType: "boolean", dflt: false });
});
- describe('setCursor', function() {
+ it("should work for valType 'number' where", function() {
+ var shouldPass = [20, "20", 1e6],
+ shouldFail = ["a", [], {}, null, undefined, ""];
- beforeEach(function() {
- this.el3 = d3.select(createGraphDiv());
- });
+ assert(shouldPass, shouldFail, { valType: "number" });
- afterEach(destroyGraphDiv);
+ assert(shouldPass, shouldFail, { valType: "number", dflt: null });
- it('should assign cursor- class', function() {
- setCursor(this.el3, 'one');
+ assert([20, "20"], [-10, "-10", 25, "25"], {
+ valType: "number",
+ dflt: 20,
+ min: 0,
+ max: 21
+ });
- expect(this.el3.attr('class')).toEqual('cursor-one');
- });
-
- it('should assign cursor- class while present non-cursor- classes', function() {
- this.el3.classed('one', true);
- this.el3.classed('two', true);
- this.el3.classed('three', true);
- setCursor(this.el3, 'one');
+ assert([20, "20", [1, 2]], ["a", {}], {
+ valType: "number",
+ dflt: 20,
+ arrayOk: true
+ });
+ });
- expect(this.el3.attr('class')).toEqual('one two three cursor-one');
- });
+ it("should work for valType 'integer' where", function() {
+ assert(
+ [1, 2, "3", "4"],
+ ["a", 1.321321, {}, [], null, 2 / 3, undefined, null],
+ { valType: "integer", dflt: 1 }
+ );
+
+ assert([1, 2, "3", "4"], [-1, "-2", 2.121, null, undefined, [], {}], {
+ valType: "integer",
+ min: 0,
+ dflt: 1
+ });
+ });
- it('should update class from one cursor- class to another', function() {
- this.el3.classed('cursor-one', true);
- setCursor(this.el3, 'two');
+ it("should work for valType 'string' where", function() {
+ var date = new Date(2016, 1, 1);
+
+ assert(
+ ["3", "4", "a", 3, 1.2113, ""],
+ [undefined, {}, [], null, date, false],
+ { valType: "string", dflt: "a" }
+ );
+
+ assert(
+ ["3", "4", "a", 3, 1.2113],
+ ["", undefined, {}, [], null, date, true],
+ { valType: "string", dflt: "a", noBlank: true }
+ );
+
+ assert(["3", "4", ""], [undefined, 1, {}, [], null, date, true, false], {
+ valType: "string",
+ dflt: "a",
+ strict: true
+ });
+
+ assert(["3", "4"], [undefined, 1, {}, [], null, date, "", true, false], {
+ valType: "string",
+ dflt: "a",
+ strict: true,
+ noBlank: true
+ });
+ });
- expect(this.el3.attr('class')).toEqual('cursor-two');
- });
+ it("should work for valType 'color' where", function() {
+ var shouldPass = ["red", "#d3d3d3", "rgba(0,255,255,0.1)"],
+ shouldFail = [1, {}, [], "rgq(233,122,332,1)", null, undefined];
- it('should update multiple cursor- classes', function() {
- this.el3.classed('cursor-one', true);
- this.el3.classed('cursor-two', true);
- this.el3.classed('cursor-three', true);
- setCursor(this.el3, 'four');
+ assert(shouldPass, shouldFail, { valType: "color" });
+ });
- expect(this.el3.attr('class')).toEqual('cursor-four');
- });
+ it("should work for valType 'colorscale' where", function() {
+ var good = [[0, "red"], [1, "blue"]],
+ bad = [[0.1, "red"], [1, "blue"]],
+ bad2 = [[0], [1]],
+ bad3 = [["red"], ["blue"]],
+ bad4 = ["red", "blue"];
- it('should remove cursor- if no new class is given', function() {
- this.el3.classed('cursor-one', true);
- this.el3.classed('cursor-two', true);
- this.el3.classed('cursor-three', true);
- setCursor(this.el3);
+ var shouldPass = ["Viridis", "Greens", good],
+ shouldFail = ["red", 1, undefined, null, {}, [], bad, bad2, bad3, bad4];
- expect(this.el3.attr('class')).toEqual('');
- });
+ assert(shouldPass, shouldFail, { valType: "colorscale" });
});
- describe('overrideCursor', function() {
+ it("should work for valType 'angle' where", function() {
+ var shouldPass = ["auto", "120", 270],
+ shouldFail = [{}, [], "red", null, undefined, ""];
- beforeEach(function() {
- this.el3 = d3.select(createGraphDiv());
- });
+ assert(shouldPass, shouldFail, { valType: "angle", dflt: 0 });
+ });
- afterEach(destroyGraphDiv);
+ it("should work for valType 'subplotid' where", function() {
+ var shouldPass = ["sp", "sp4", "sp10"],
+ shouldFail = [{}, [], "sp1", "sp0", "spee1", null, undefined, true];
- it('should apply the new cursor(s) and revert to the original when removed', function() {
- this.el3
- .classed('cursor-before', true)
- .classed('not-a-cursor', true)
- .classed('another', true);
+ assert(shouldPass, shouldFail, { valType: "subplotid", dflt: "sp" });
+ });
- overrideCursor(this.el3, 'after');
- expect(this.el3.attr('class')).toBe('not-a-cursor another cursor-after');
+ it("should work for valType 'flaglist' where", function() {
+ var shouldPass = ["a", "b", "a+b", "b+a", "c"],
+ shouldFail = [{}, [], "red", null, undefined, "", "a + b"];
- overrideCursor(this.el3, 'later');
- expect(this.el3.attr('class')).toBe('not-a-cursor another cursor-later');
+ assert(shouldPass, shouldFail, {
+ valType: "flaglist",
+ flags: ["a", "b"],
+ extras: ["c"]
+ });
+ });
- overrideCursor(this.el3);
- expect(this.el3.attr('class')).toBe('not-a-cursor another cursor-before');
- });
+ it("should work for valType 'any' where", function() {
+ var shouldPass = ["", "120", null, false, {}, []],
+ shouldFail = [undefined];
- it('should apply the new cursor(s) and revert to the none when removed', function() {
- this.el3
- .classed('not-a-cursor', true)
- .classed('another', true);
+ assert(shouldPass, shouldFail, { valType: "any" });
+ });
- overrideCursor(this.el3, 'after');
- expect(this.el3.attr('class')).toBe('not-a-cursor another cursor-after');
+ it("should work for valType 'info_array' where", function() {
+ var shouldPass = [[1, 2], [-20, "20"]],
+ shouldFail = [
+ {},
+ [],
+ [10],
+ [null, 10],
+ ["aads", null],
+ "red",
+ null,
+ undefined,
+ "",
+ [1, 10, null]
+ ];
+
+ assert(shouldPass, shouldFail, {
+ valType: "info_array",
+ items: [
+ { valType: "number", dflt: -20 },
+ { valType: "number", dflt: 20 }
+ ]
+ });
+ });
- overrideCursor(this.el3, 'later');
- expect(this.el3.attr('class')).toBe('not-a-cursor another cursor-later');
+ it("should work for valType 'info_array' (freeLength case)", function() {
+ var shouldPass = [
+ ["marker.color", "red"],
+ [{ "marker.color": "red" }, [1, 2]]
+ ];
+ var shouldFail = [
+ ["marker.color", "red", "red"],
+ [{ "marker.color": "red" }, [1, 2], "blue"]
+ ];
+
+ assert(shouldPass, shouldFail, {
+ valType: "info_array",
+ freeLength: true,
+ items: [{ valType: "any" }, { valType: "any" }, { valType: "number" }]
+ });
+ });
+ });
- overrideCursor(this.el3);
- expect(this.el3.attr('class')).toBe('not-a-cursor another');
- });
+ describe("setCursor", function() {
+ beforeEach(function() {
+ this.el3 = d3.select(createGraphDiv());
+ });
- it('should do nothing if no existing or new override is present', function() {
- this.el3
- .classed('cursor-before', true)
- .classed('not-a-cursor', true);
+ afterEach(destroyGraphDiv);
- overrideCursor(this.el3);
+ it("should assign cursor- class", function() {
+ setCursor(this.el3, "one");
- expect(this.el3.attr('class')).toBe('cursor-before not-a-cursor');
- });
+ expect(this.el3.attr("class")).toEqual("cursor-one");
});
- describe('pushUnique', function() {
+ it(
+ "should assign cursor- class while present non-cursor- classes",
+ function() {
+ this.el3.classed("one", true);
+ this.el3.classed("two", true);
+ this.el3.classed("three", true);
+ setCursor(this.el3, "one");
- beforeEach(function() {
- this.obj = { a: 'A' };
- this.array = ['a', 'b', 'c', this.obj];
- });
+ expect(this.el3.attr("class")).toEqual("one two three cursor-one");
+ }
+ );
- it('should fill new items in array', function() {
- var out = Lib.pushUnique(this.array, 'd');
+ it("should update class from one cursor- class to another", function() {
+ this.el3.classed("cursor-one", true);
+ setCursor(this.el3, "two");
- expect(this.array).toEqual(['a', 'b', 'c', { a: 'A' }, 'd']);
- expect(this.array).toBe(out);
- });
+ expect(this.el3.attr("class")).toEqual("cursor-two");
+ });
- it('should ignore falsy items', function() {
- Lib.pushUnique(this.array, false);
- expect(this.array).toEqual(['a', 'b', 'c', { a: 'A' }]);
+ it("should update multiple cursor- classes", function() {
+ this.el3.classed("cursor-one", true);
+ this.el3.classed("cursor-two", true);
+ this.el3.classed("cursor-three", true);
+ setCursor(this.el3, "four");
- Lib.pushUnique(this.array, undefined);
- expect(this.array).toEqual(['a', 'b', 'c', { a: 'A' }]);
+ expect(this.el3.attr("class")).toEqual("cursor-four");
+ });
- Lib.pushUnique(this.array, 0);
- expect(this.array).toEqual(['a', 'b', 'c', { a: 'A' }]);
+ it("should remove cursor- if no new class is given", function() {
+ this.el3.classed("cursor-one", true);
+ this.el3.classed("cursor-two", true);
+ this.el3.classed("cursor-three", true);
+ setCursor(this.el3);
- Lib.pushUnique(this.array, null);
- expect(this.array).toEqual(['a', 'b', 'c', { a: 'A' }]);
+ expect(this.el3.attr("class")).toEqual("");
+ });
+ });
- Lib.pushUnique(this.array, '');
- expect(this.array).toEqual(['a', 'b', 'c', { a: 'A' }]);
- });
+ describe("overrideCursor", function() {
+ beforeEach(function() {
+ this.el3 = d3.select(createGraphDiv());
+ });
- it('should ignore item already in array', function() {
- Lib.pushUnique(this.array, 'a');
- expect(this.array).toEqual(['a', 'b', 'c', { a: 'A' }]);
+ afterEach(destroyGraphDiv);
+
+ it(
+ "should apply the new cursor(s) and revert to the original when removed",
+ function() {
+ this.el3
+ .classed("cursor-before", true)
+ .classed("not-a-cursor", true)
+ .classed("another", true);
+
+ overrideCursor(this.el3, "after");
+ expect(this.el3.attr("class")).toBe(
+ "not-a-cursor another cursor-after"
+ );
+
+ overrideCursor(this.el3, "later");
+ expect(this.el3.attr("class")).toBe(
+ "not-a-cursor another cursor-later"
+ );
+
+ overrideCursor(this.el3);
+ expect(this.el3.attr("class")).toBe(
+ "not-a-cursor another cursor-before"
+ );
+ }
+ );
+
+ it(
+ "should apply the new cursor(s) and revert to the none when removed",
+ function() {
+ this.el3.classed("not-a-cursor", true).classed("another", true);
+
+ overrideCursor(this.el3, "after");
+ expect(this.el3.attr("class")).toBe(
+ "not-a-cursor another cursor-after"
+ );
+
+ overrideCursor(this.el3, "later");
+ expect(this.el3.attr("class")).toBe(
+ "not-a-cursor another cursor-later"
+ );
+
+ overrideCursor(this.el3);
+ expect(this.el3.attr("class")).toBe("not-a-cursor another");
+ }
+ );
+
+ it(
+ "should do nothing if no existing or new override is present",
+ function() {
+ this.el3.classed("cursor-before", true).classed("not-a-cursor", true);
+
+ overrideCursor(this.el3);
+
+ expect(this.el3.attr("class")).toBe("cursor-before not-a-cursor");
+ }
+ );
+ });
+
+ describe("pushUnique", function() {
+ beforeEach(function() {
+ this.obj = { a: "A" };
+ this.array = ["a", "b", "c", this.obj];
+ });
- Lib.pushUnique(this.array, this.obj);
- expect(this.array).toEqual(['a', 'b', 'c', { a: 'A' }]);
+ it("should fill new items in array", function() {
+ var out = Lib.pushUnique(this.array, "d");
- });
+ expect(this.array).toEqual(["a", "b", "c", { a: "A" }, "d"]);
+ expect(this.array).toBe(out);
});
- describe('filterUnique', function() {
+ it("should ignore falsy items", function() {
+ Lib.pushUnique(this.array, false);
+ expect(this.array).toEqual(["a", "b", "c", { a: "A" }]);
- it('should return array containing unique values', function() {
- expect(
- Lib.filterUnique(['a', 'a', 'b', 'b'])
- )
- .toEqual(['a', 'b']);
+ Lib.pushUnique(this.array, undefined);
+ expect(this.array).toEqual(["a", "b", "c", { a: "A" }]);
- expect(
- Lib.filterUnique(['1', ['1'], 1])
- )
- .toEqual(['1']);
+ Lib.pushUnique(this.array, 0);
+ expect(this.array).toEqual(["a", "b", "c", { a: "A" }]);
- expect(
- Lib.filterUnique([1, '1', [1]])
- )
- .toEqual([1]);
+ Lib.pushUnique(this.array, null);
+ expect(this.array).toEqual(["a", "b", "c", { a: "A" }]);
- expect(
- Lib.filterUnique([ { a: 1 }, { b: 2 }])
- )
- .toEqual([{ a: 1 }]);
+ Lib.pushUnique(this.array, "");
+ expect(this.array).toEqual(["a", "b", "c", { a: "A" }]);
+ });
- expect(
- Lib.filterUnique([null, undefined, null, null, undefined])
- )
- .toEqual([null, undefined]);
- });
+ it("should ignore item already in array", function() {
+ Lib.pushUnique(this.array, "a");
+ expect(this.array).toEqual(["a", "b", "c", { a: "A" }]);
+ Lib.pushUnique(this.array, this.obj);
+ expect(this.array).toEqual(["a", "b", "c", { a: "A" }]);
});
+ });
- describe('numSeparate', function() {
+ describe("filterUnique", function() {
+ it("should return array containing unique values", function() {
+ expect(Lib.filterUnique(["a", "a", "b", "b"])).toEqual(["a", "b"]);
- it('should work on numbers and strings', function() {
- expect(Lib.numSeparate(12345.67, '.,')).toBe('12,345.67');
- expect(Lib.numSeparate('12345.67', '.,')).toBe('12,345.67');
- });
+ expect(Lib.filterUnique(["1", ["1"], 1])).toEqual(["1"]);
- it('should ignore years', function() {
- expect(Lib.numSeparate(2016, '.,')).toBe('2016');
- });
+ expect(Lib.filterUnique([1, "1", [1]])).toEqual([1]);
- it('should work even for 4-digit integer if third argument is true', function() {
- expect(Lib.numSeparate(3000, '.,', true)).toBe('3,000');
- });
+ expect(Lib.filterUnique([{ a: 1 }, { b: 2 }])).toEqual([{ a: 1 }]);
- it('should work for multiple thousands', function() {
- expect(Lib.numSeparate(1000000000, '.,')).toBe('1,000,000,000');
- });
-
- it('should work when there\'s only one separator', function() {
- expect(Lib.numSeparate(12.34, '|')).toBe('12|34');
- expect(Lib.numSeparate(1234.56, '|')).toBe('1234|56');
- });
-
- it('should throw an error when no separator is provided', function() {
- expect(function() {
- Lib.numSeparate(1234);
- }).toThrowError('Separator string required for formatting!');
+ expect(
+ Lib.filterUnique([null, undefined, null, null, undefined])
+ ).toEqual([null, undefined]);
+ });
+ });
- expect(function() {
- Lib.numSeparate(1234, '');
- }).toThrowError('Separator string required for formatting!');
- });
+ describe("numSeparate", function() {
+ it("should work on numbers and strings", function() {
+ expect(Lib.numSeparate(12345.67, ".,")).toBe("12,345.67");
+ expect(Lib.numSeparate("12345.67", ".,")).toBe("12,345.67");
});
- describe('cleanNumber', function() {
- it('should return finite numbers untouched', function() {
- [
- 0, 1, 2, 1234.567,
- -1, -100, -999.999,
- Number.MAX_VALUE, Number.MIN_VALUE, Number.EPSILON,
- -Number.MAX_VALUE, -Number.MIN_VALUE, -Number.EPSILON
- ].forEach(function(v) {
- expect(Lib.cleanNumber(v)).toBe(v);
- });
- });
+ it("should ignore years", function() {
+ expect(Lib.numSeparate(2016, ".,")).toBe("2016");
+ });
- it('should accept number strings with arbitrary cruft on the outside', function() {
- [
- ['0', 0],
- ['1', 1],
- ['1.23', 1.23],
- ['-100.001', -100.001],
- [' $4.325 #%\t', 4.325],
- [' " #1" ', 1],
- [' \'\n \r -9.2e7 \t\' ', -9.2e7],
- ['1,690,000', 1690000],
- ['1 690 000', 1690000],
- ['2 2', 22],
- ['$5,162,000.00', 5162000],
- [' $1,410,000.00 ', 1410000],
- ].forEach(function(v) {
- expect(Lib.cleanNumber(v[0])).toBe(v[1], v[0]);
- });
- });
+ it(
+ "should work even for 4-digit integer if third argument is true",
+ function() {
+ expect(Lib.numSeparate(3000, ".,", true)).toBe("3,000");
+ }
+ );
- it('should not accept other objects or cruft in the middle', function() {
- [
- NaN, Infinity, -Infinity, null, undefined, new Date(), '',
- ' ', '\t', '2\t2', '2%2', '2$2', {1: 2}, [1], ['1'], {}, []
- ].forEach(function(v) {
- expect(Lib.cleanNumber(v)).toBeUndefined(v);
- });
- });
+ it("should work for multiple thousands", function() {
+ expect(Lib.numSeparate(1000000000, ".,")).toBe("1,000,000,000");
});
- describe('isPlotDiv', function() {
- it('should work on plain objects', function() {
- expect(Lib.isPlotDiv({})).toBe(false);
- });
+ it("should work when there's only one separator", function() {
+ expect(Lib.numSeparate(12.34, "|")).toBe("12|34");
+ expect(Lib.numSeparate(1234.56, "|")).toBe("1234|56");
});
- describe('isD3Selection', function() {
- var gd;
+ it("should throw an error when no separator is provided", function() {
+ expect(function() {
+ Lib.numSeparate(1234);
+ }).toThrowError("Separator string required for formatting!");
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(function() {
- destroyGraphDiv();
- Plotly.setPlotConfig({ queueLength: 0 });
- });
+ expect(function() {
+ Lib.numSeparate(1234, "");
+ }).toThrowError("Separator string required for formatting!");
+ });
+ });
+
+ describe("cleanNumber", function() {
+ it("should return finite numbers untouched", function() {
+ [
+ 0,
+ 1,
+ 2,
+ 1234.567,
+ -1,
+ -100,
+ -999.999,
+ Number.MAX_VALUE,
+ Number.MIN_VALUE,
+ Number.EPSILON,
+ -Number.MAX_VALUE,
+ -Number.MIN_VALUE,
+ -Number.EPSILON
+ ].forEach(function(v) {
+ expect(Lib.cleanNumber(v)).toBe(v);
+ });
+ });
- it('recognizes real and duck typed selections', function() {
- var yesSelections = [
- d3.select(gd),
- // this is what got us into trouble actually - d3 selections can
- // contain non-nodes - say for example d3 selections! then they
- // don't work correctly. But it makes a convenient test!
- d3.select(1),
- // just showing what we actually do in this function: duck type
- // using the `classed` method.
- {classed: function(v) { return !!v; }}
- ];
-
- yesSelections.forEach(function(v) {
- expect(Lib.isD3Selection(v)).toBe(true, v);
- });
- });
+ it(
+ "should accept number strings with arbitrary cruft on the outside",
+ function() {
+ [
+ ["0", 0],
+ ["1", 1],
+ ["1.23", 1.23],
+ ["-100.001", -100.001],
+ [" $4.325 #%\t", 4.325],
+ [' " #1" ', 1],
+ [" '\n \r -9.2e7 \t' ", -9.2e7],
+ ["1,690,000", 1690000],
+ ["1 690 000", 1690000],
+ ["2 2", 22],
+ ["$5,162,000.00", 5162000],
+ [" $1,410,000.00 ", 1410000]
+ ].forEach(function(v) {
+ expect(Lib.cleanNumber(v[0])).toBe(v[1], v[0]);
+ });
+ }
+ );
+
+ it("should not accept other objects or cruft in the middle", function() {
+ [
+ NaN,
+ Infinity,
+ -Infinity,
+ null,
+ undefined,
+ new Date(),
+ "",
+ " ",
+ "\t",
+ "2\t2",
+ "2%2",
+ "2$2",
+ { 1: 2 },
+ [1],
+ ["1"],
+ {},
+ []
+ ].forEach(function(v) {
+ expect(Lib.cleanNumber(v)).toBeUndefined(v);
+ });
+ });
+ });
- it('rejects non-selections', function() {
- var notSelections = [
- 1,
- 'path',
- [1, 2],
- [[1, 2]],
- {classed: 1},
- gd
- ];
-
- notSelections.forEach(function(v) {
- expect(Lib.isD3Selection(v)).toBe(false, v);
- });
- });
+ describe("isPlotDiv", function() {
+ it("should work on plain objects", function() {
+ expect(Lib.isPlotDiv({})).toBe(false);
});
+ });
- describe('loggers', function() {
- var stashConsole,
- stashLogLevel;
+ describe("isD3Selection", function() {
+ var gd;
- function consoleFn(name, hasApply, messages) {
- var out = function() {
- var args = [];
- for(var i = 0; i < arguments.length; i++) args.push(arguments[i]);
- messages.push([name, args]);
- };
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
- if(!hasApply) out.apply = undefined;
+ afterEach(function() {
+ destroyGraphDiv();
+ Plotly.setPlotConfig({ queueLength: 0 });
+ });
- return out;
+ it("recognizes real and duck typed selections", function() {
+ var yesSelections = [
+ d3.select(gd),
+ // this is what got us into trouble actually - d3 selections can
+ // contain non-nodes - say for example d3 selections! then they
+ // don't work correctly. But it makes a convenient test!
+ d3.select(1),
+ // just showing what we actually do in this function: duck type
+ // using the `classed` method.
+ {
+ classed: function(v) {
+ return !!v;
+ }
}
+ ];
- function mockConsole(hasApply, hasTrace) {
- var out = {
- MESSAGES: []
- };
- out.log = consoleFn('log', hasApply, out.MESSAGES);
- out.error = consoleFn('error', hasApply, out.MESSAGES);
+ yesSelections.forEach(function(v) {
+ expect(Lib.isD3Selection(v)).toBe(true, v);
+ });
+ });
- if(hasTrace) out.trace = consoleFn('trace', hasApply, out.MESSAGES);
+ it("rejects non-selections", function() {
+ var notSelections = [1, "path", [1, 2], [[1, 2]], { classed: 1 }, gd];
- return out;
- }
+ notSelections.forEach(function(v) {
+ expect(Lib.isD3Selection(v)).toBe(false, v);
+ });
+ });
+ });
- beforeEach(function() {
- stashConsole = window.console;
- stashLogLevel = config.logging;
- });
+ describe("loggers", function() {
+ var stashConsole, stashLogLevel;
- afterEach(function() {
- window.console = stashConsole;
- config.logging = stashLogLevel;
- });
+ function consoleFn(name, hasApply, messages) {
+ var out = function() {
+ var args = [];
+ for (var i = 0; i < arguments.length; i++) {
+ args.push(arguments[i]);
+ }
+ messages.push([name, args]);
+ };
- it('emits one console message if apply is available', function() {
- var c = window.console = mockConsole(true, true);
- config.logging = 2;
+ if (!hasApply) out.apply = undefined;
- Lib.log('tick', 'tock', 'tick', 'tock', 1);
- Lib.warn('I\'m', 'a', 'little', 'cuckoo', 'clock', [1, 2]);
- Lib.error('cuckoo!', 'cuckoo!!!', {a: 1, b: 2});
+ return out;
+ }
- expect(c.MESSAGES).toEqual([
- ['trace', ['LOG:', 'tick', 'tock', 'tick', 'tock', 1]],
- ['trace', ['WARN:', 'I\'m', 'a', 'little', 'cuckoo', 'clock', [1, 2]]],
- ['error', ['ERROR:', 'cuckoo!', 'cuckoo!!!', {a: 1, b: 2}]]
- ]);
- });
+ function mockConsole(hasApply, hasTrace) {
+ var out = { MESSAGES: [] };
+ out.log = consoleFn("log", hasApply, out.MESSAGES);
+ out.error = consoleFn("error", hasApply, out.MESSAGES);
- it('falls back on console.log if no trace', function() {
- var c = window.console = mockConsole(true, false);
- config.logging = 2;
+ if (hasTrace) out.trace = consoleFn("trace", hasApply, out.MESSAGES);
- Lib.log('Hi');
- Lib.warn(42);
+ return out;
+ }
- expect(c.MESSAGES).toEqual([
- ['log', ['LOG:', 'Hi']],
- ['log', ['WARN:', 42]]
- ]);
- });
+ beforeEach(function() {
+ stashConsole = window.console;
+ stashLogLevel = config.logging;
+ });
- it('falls back on separate calls if no apply', function() {
- var c = window.console = mockConsole(false, false);
- config.logging = 2;
-
- Lib.log('tick', 'tock', 'tick', 'tock', 1);
- Lib.warn('I\'m', 'a', 'little', 'cuckoo', 'clock', [1, 2]);
- Lib.error('cuckoo!', 'cuckoo!!!', {a: 1, b: 2});
-
- expect(c.MESSAGES).toEqual([
- ['log', ['LOG:']],
- ['log', ['tick']],
- ['log', ['tock']],
- ['log', ['tick']],
- ['log', ['tock']],
- ['log', [1]],
- ['log', ['WARN:']],
- ['log', ['I\'m']],
- ['log', ['a']],
- ['log', ['little']],
- ['log', ['cuckoo']],
- ['log', ['clock']],
- ['log', [[1, 2]]],
- ['error', ['ERROR:']],
- ['error', ['cuckoo!']],
- ['error', ['cuckoo!!!']],
- ['error', [{a: 1, b: 2}]]
- ]);
- });
+ afterEach(function() {
+ window.console = stashConsole;
+ config.logging = stashLogLevel;
+ });
- it('omits .log at log level 1', function() {
- var c = window.console = mockConsole(true, true);
- config.logging = 1;
+ it("emits one console message if apply is available", function() {
+ var c = window.console = mockConsole(true, true);
+ config.logging = 2;
- Lib.log(1);
- Lib.warn(2);
- Lib.error(3);
+ Lib.log("tick", "tock", "tick", "tock", 1);
+ Lib.warn("I'm", "a", "little", "cuckoo", "clock", [1, 2]);
+ Lib.error("cuckoo!", "cuckoo!!!", { a: 1, b: 2 });
- expect(c.MESSAGES).toEqual([
- ['trace', ['WARN:', 2]],
- ['error', ['ERROR:', 3]]
- ]);
- });
+ expect(c.MESSAGES).toEqual([
+ ["trace", ["LOG:", "tick", "tock", "tick", "tock", 1]],
+ ["trace", ["WARN:", "I'm", "a", "little", "cuckoo", "clock", [1, 2]]],
+ ["error", ["ERROR:", "cuckoo!", "cuckoo!!!", { a: 1, b: 2 }]]
+ ]);
+ });
- it('logs nothing at log level 0', function() {
- var c = window.console = mockConsole(true, true);
- config.logging = 0;
+ it("falls back on console.log if no trace", function() {
+ var c = window.console = mockConsole(true, false);
+ config.logging = 2;
- Lib.log(1);
- Lib.warn(2);
- Lib.error(3);
+ Lib.log("Hi");
+ Lib.warn(42);
- expect(c.MESSAGES).toEqual([]);
- });
+ expect(c.MESSAGES).toEqual([
+ ["log", ["LOG:", "Hi"]],
+ ["log", ["WARN:", 42]]
+ ]);
});
-});
-describe('Queue', function() {
- 'use strict';
+ it("falls back on separate calls if no apply", function() {
+ var c = window.console = mockConsole(false, false);
+ config.logging = 2;
+
+ Lib.log("tick", "tock", "tick", "tock", 1);
+ Lib.warn("I'm", "a", "little", "cuckoo", "clock", [1, 2]);
+ Lib.error("cuckoo!", "cuckoo!!!", { a: 1, b: 2 });
+
+ expect(c.MESSAGES).toEqual([
+ ["log", ["LOG:"]],
+ ["log", ["tick"]],
+ ["log", ["tock"]],
+ ["log", ["tick"]],
+ ["log", ["tock"]],
+ ["log", [1]],
+ ["log", ["WARN:"]],
+ ["log", ["I'm"]],
+ ["log", ["a"]],
+ ["log", ["little"]],
+ ["log", ["cuckoo"]],
+ ["log", ["clock"]],
+ ["log", [[1, 2]]],
+ ["error", ["ERROR:"]],
+ ["error", ["cuckoo!"]],
+ ["error", ["cuckoo!!!"]],
+ ["error", [{ a: 1, b: 2 }]]
+ ]);
+ });
- var gd;
+ it("omits .log at log level 1", function() {
+ var c = window.console = mockConsole(true, true);
+ config.logging = 1;
- beforeEach(function() {
- gd = createGraphDiv();
- });
+ Lib.log(1);
+ Lib.warn(2);
+ Lib.error(3);
- afterEach(function() {
- destroyGraphDiv();
- Plotly.setPlotConfig({ queueLength: 0 });
+ expect(c.MESSAGES).toEqual([
+ ["trace", ["WARN:", 2]],
+ ["error", ["ERROR:", 3]]
+ ]);
});
- it('should not fill in undoQueue by default', function(done) {
- Plotly.plot(gd, [{
- y: [2, 1, 2]
- }]).then(function() {
- expect(gd.undoQueue).toBeUndefined();
-
- return Plotly.restyle(gd, 'marker.color', 'red');
- }).then(function() {
- expect(gd.undoQueue.index).toEqual(0);
- expect(gd.undoQueue.queue).toEqual([]);
+ it("logs nothing at log level 0", function() {
+ var c = window.console = mockConsole(true, true);
+ config.logging = 0;
- return Plotly.relayout(gd, 'title', 'A title');
- }).then(function() {
- expect(gd.undoQueue.index).toEqual(0);
- expect(gd.undoQueue.queue).toEqual([]);
+ Lib.log(1);
+ Lib.warn(2);
+ Lib.error(3);
- done();
- });
+ expect(c.MESSAGES).toEqual([]);
});
+ });
+});
- it('should fill in undoQueue up to value found in *queueLength* config', function(done) {
- Plotly.setPlotConfig({ queueLength: 2 });
-
- Plotly.plot(gd, [{
- y: [2, 1, 2]
- }])
+describe("Queue", function() {
+ "use strict";
+ var gd;
+
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
+
+ afterEach(function() {
+ destroyGraphDiv();
+ Plotly.setPlotConfig({ queueLength: 0 });
+ });
+
+ it("should not fill in undoQueue by default", function(done) {
+ Plotly.plot(gd, [{ y: [2, 1, 2] }])
+ .then(function() {
+ expect(gd.undoQueue).toBeUndefined();
+
+ return Plotly.restyle(gd, "marker.color", "red");
+ })
+ .then(function() {
+ expect(gd.undoQueue.index).toEqual(0);
+ expect(gd.undoQueue.queue).toEqual([]);
+
+ return Plotly.relayout(gd, "title", "A title");
+ })
+ .then(function() {
+ expect(gd.undoQueue.index).toEqual(0);
+ expect(gd.undoQueue.queue).toEqual([]);
+
+ done();
+ });
+ });
+
+ it(
+ "should fill in undoQueue up to value found in *queueLength* config",
+ function(done) {
+ Plotly.setPlotConfig({ queueLength: 2 });
+
+ Plotly.plot(gd, [{ y: [2, 1, 2] }])
.then(function() {
- expect(gd.undoQueue).toBeUndefined();
+ expect(gd.undoQueue).toBeUndefined();
- return Plotly.restyle(gd, 'marker.color', 'red');
+ return Plotly.restyle(gd, "marker.color", "red");
})
.then(function() {
- expect(gd.undoQueue.index).toEqual(1);
- expect(gd.undoQueue.queue[0].undo.args[0][1]['marker.color']).toEqual([undefined]);
- expect(gd.undoQueue.queue[0].redo.args[0][1]['marker.color']).toEqual('red');
-
- return Plotly.relayout(gd, 'title', 'A title');
+ expect(gd.undoQueue.index).toEqual(1);
+ expect(
+ gd.undoQueue.queue[0].undo.args[0][1]["marker.color"]
+ ).toEqual([undefined]);
+ expect(gd.undoQueue.queue[0].redo.args[0][1]["marker.color"]).toEqual(
+ "red"
+ );
+
+ return Plotly.relayout(gd, "title", "A title");
})
.then(function() {
- expect(gd.undoQueue.index).toEqual(2);
- expect(gd.undoQueue.queue[1].undo.args[0][1].title).toEqual(undefined);
- expect(gd.undoQueue.queue[1].redo.args[0][1].title).toEqual('A title');
-
- return Plotly.restyle(gd, 'mode', 'markers');
+ expect(gd.undoQueue.index).toEqual(2);
+ expect(gd.undoQueue.queue[1].undo.args[0][1].title).toEqual(
+ undefined
+ );
+ expect(gd.undoQueue.queue[1].redo.args[0][1].title).toEqual(
+ "A title"
+ );
+
+ return Plotly.restyle(gd, "mode", "markers");
})
.then(function() {
- expect(gd.undoQueue.index).toEqual(2);
- expect(gd.undoQueue.queue[2]).toBeUndefined();
-
- expect(gd.undoQueue.queue[1].undo.args[0][1].mode).toEqual([undefined]);
- expect(gd.undoQueue.queue[1].redo.args[0][1].mode).toEqual('markers');
-
- expect(gd.undoQueue.queue[0].undo.args[0][1].title).toEqual(undefined);
- expect(gd.undoQueue.queue[0].redo.args[0][1].title).toEqual('A title');
-
- return Plotly.restyle(gd, 'transforms[0]', { type: 'filter' });
+ expect(gd.undoQueue.index).toEqual(2);
+ expect(gd.undoQueue.queue[2]).toBeUndefined();
+
+ expect(gd.undoQueue.queue[1].undo.args[0][1].mode).toEqual([
+ undefined
+ ]);
+ expect(gd.undoQueue.queue[1].redo.args[0][1].mode).toEqual("markers");
+
+ expect(gd.undoQueue.queue[0].undo.args[0][1].title).toEqual(
+ undefined
+ );
+ expect(gd.undoQueue.queue[0].redo.args[0][1].title).toEqual(
+ "A title"
+ );
+
+ return Plotly.restyle(gd, "transforms[0]", { type: "filter" });
})
.then(function() {
- expect(gd.undoQueue.queue[1].undo.args[0][1])
- .toEqual({ 'transforms[0]': null });
- expect(gd.undoQueue.queue[1].redo.args[0][1])
- .toEqual({ 'transforms[0]': { type: 'filter' } });
-
- return Plotly.relayout(gd, 'updatemenus[0]', { buttons: [] });
+ expect(gd.undoQueue.queue[1].undo.args[0][1]).toEqual({
+ "transforms[0]": null
+ });
+ expect(gd.undoQueue.queue[1].redo.args[0][1]).toEqual({
+ "transforms[0]": { type: "filter" }
+ });
+
+ return Plotly.relayout(gd, "updatemenus[0]", { buttons: [] });
})
.then(function() {
- expect(gd.undoQueue.queue[1].undo.args[0][1])
- .toEqual({ 'updatemenus[0]': null });
- expect(gd.undoQueue.queue[1].redo.args[0][1])
- .toEqual({ 'updatemenus[0]': { buttons: [] } });
-
- return Plotly.relayout(gd, 'updatemenus[0]', null);
+ expect(gd.undoQueue.queue[1].undo.args[0][1]).toEqual({
+ "updatemenus[0]": null
+ });
+ expect(gd.undoQueue.queue[1].redo.args[0][1]).toEqual({
+ "updatemenus[0]": { buttons: [] }
+ });
+
+ return Plotly.relayout(gd, "updatemenus[0]", null);
})
.then(function() {
- expect(gd.undoQueue.queue[1].undo.args[0][1])
- .toEqual({ 'updatemenus[0]': { buttons: []} });
- expect(gd.undoQueue.queue[1].redo.args[0][1])
- .toEqual({ 'updatemenus[0]': null });
-
- return Plotly.restyle(gd, 'transforms[0]', null);
+ expect(gd.undoQueue.queue[1].undo.args[0][1]).toEqual({
+ "updatemenus[0]": { buttons: [] }
+ });
+ expect(gd.undoQueue.queue[1].redo.args[0][1]).toEqual({
+ "updatemenus[0]": null
+ });
+
+ return Plotly.restyle(gd, "transforms[0]", null);
})
.then(function() {
- expect(gd.undoQueue.queue[1].undo.args[0][1])
- .toEqual({ 'transforms[0]': [ { type: 'filter' } ]});
- expect(gd.undoQueue.queue[1].redo.args[0][1])
- .toEqual({ 'transforms[0]': null });
+ expect(gd.undoQueue.queue[1].undo.args[0][1]).toEqual({
+ "transforms[0]": [{ type: "filter" }]
+ });
+ expect(gd.undoQueue.queue[1].redo.args[0][1]).toEqual({
+ "transforms[0]": null
+ });
- done();
+ done();
});
- });
+ }
+ );
});
diff --git a/test/jasmine/tests/mapbox_test.js b/test/jasmine/tests/mapbox_test.js
index b9146242e3c..5b947112c67 100644
--- a/test/jasmine/tests/mapbox_test.js
+++ b/test/jasmine/tests/mapbox_test.js
@@ -1,960 +1,1012 @@
-var Plotly = require('@lib');
-var Lib = require('@src/lib');
-
-var constants = require('@src/plots/mapbox/constants');
-var supplyLayoutDefaults = require('@src/plots/mapbox/layout_defaults');
-
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var hasWebGLSupport = require('../assets/has_webgl_support');
-var mouseEvent = require('../assets/mouse_event');
-var customMatchers = require('../assets/custom_matchers');
-
-var MAPBOX_ACCESS_TOKEN = require('@build/credentials.json').MAPBOX_ACCESS_TOKEN;
+var Plotly = require("@lib");
+var Lib = require("@src/lib");
+
+var constants = require("@src/plots/mapbox/constants");
+var supplyLayoutDefaults = require("@src/plots/mapbox/layout_defaults");
+
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var hasWebGLSupport = require("../assets/has_webgl_support");
+var mouseEvent = require("../assets/mouse_event");
+var customMatchers = require("../assets/custom_matchers");
+
+var MAPBOX_ACCESS_TOKEN = require(
+ "@build/credentials.json"
+).MAPBOX_ACCESS_TOKEN;
var TRANSITION_DELAY = 500;
var MOUSE_DELAY = 100;
var LONG_TIMEOUT_INTERVAL = 5 * jasmine.DEFAULT_TIMEOUT_INTERVAL;
var noop = function() {};
-Plotly.setPlotConfig({
- mapboxAccessToken: MAPBOX_ACCESS_TOKEN
-});
-
+Plotly.setPlotConfig({ mapboxAccessToken: MAPBOX_ACCESS_TOKEN });
-describe('mapbox defaults', function() {
- 'use strict';
+describe("mapbox defaults", function() {
+ "use strict";
+ var layoutIn, layoutOut, fullData;
- var layoutIn, layoutOut, fullData;
+ beforeEach(function() {
+ layoutOut = { font: { color: "red" } };
- beforeEach(function() {
- layoutOut = { font: { color: 'red' } };
-
- // needs a ternary-ref in a trace in order to be detected
- fullData = [{ type: 'scattermapbox', subplot: 'mapbox' }];
- });
-
- it('should fill empty containers', function() {
- layoutIn = {};
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutIn).toEqual({ mapbox: {} });
- });
-
- it('should copy ref to input container in full (for updating on map move)', function() {
- var mapbox = { style: 'light '};
-
- layoutIn = { mapbox: mapbox };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.mapbox._input).toBe(mapbox);
- });
-
- it('should accept both string and object style', function() {
- var mapboxStyleJSON = {
- id: 'cdsa213wqdsa',
- owner: 'johnny'
- };
-
- layoutIn = {
- mapbox: { style: 'light' },
- mapbox2: { style: mapboxStyleJSON }
- };
-
- fullData.push({ type: 'scattermapbox', subplot: 'mapbox2' });
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.mapbox.style).toEqual('light');
- expect(layoutOut.mapbox2.style).toBe(mapboxStyleJSON);
- });
+ // needs a ternary-ref in a trace in order to be detected
+ fullData = [{ type: "scattermapbox", subplot: "mapbox" }];
+ });
- it('should fill layer containers', function() {
- layoutIn = {
- mapbox: {
- layers: [{}, {}]
- }
- };
+ it("should fill empty containers", function() {
+ layoutIn = {};
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.mapbox.layers[0].sourcetype).toEqual('geojson');
- expect(layoutOut.mapbox.layers[1].sourcetype).toEqual('geojson');
- });
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutIn).toEqual({ mapbox: {} });
+ });
- it('should skip over non-object layer containers', function() {
- layoutIn = {
- mapbox: {
- layers: [{}, null, 'remove', {}]
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.mapbox.layers[0].sourcetype).toEqual('geojson');
- expect(layoutOut.mapbox.layers[0]._index).toEqual(0);
- expect(layoutOut.mapbox.layers[1].sourcetype).toEqual('geojson');
- expect(layoutOut.mapbox.layers[1]._index).toEqual(3);
- });
+ it(
+ "should copy ref to input container in full (for updating on map move)",
+ function() {
+ var mapbox = { style: "light " };
- it('should coerce \'sourcelayer\' only for *vector* \'sourcetype\'', function() {
- layoutIn = {
- mapbox: {
- layers: [{
- sourcetype: 'vector',
- sourcelayer: 'layer0'
- }, {
- sourcetype: 'geojson',
- sourcelayer: 'layer0'
- }]
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.mapbox.layers[0].sourcelayer).toEqual('layer0');
- expect(layoutOut.mapbox.layers[1].sourcelayer).toBeUndefined();
- });
+ layoutIn = { mapbox: mapbox };
- it('should only coerce relevant layer style attributes', function() {
- var base = {
- line: { width: 3 },
- fill: { outlinecolor: '#d3d3d3' },
- circle: { radius: 20 },
- symbol: { icon: 'monument' }
- };
-
- layoutIn = {
- mapbox: {
- layers: [
- Lib.extendFlat({}, base, {
- type: 'line',
- color: 'red'
- }),
- Lib.extendFlat({}, base, {
- type: 'fill',
- color: 'blue'
- }),
- Lib.extendFlat({}, base, {
- type: 'circle',
- color: 'green'
- }),
- Lib.extendFlat({}, base, {
- type: 'symbol',
- color: 'yellow'
- })
- ]
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
-
- expect(layoutOut.mapbox.layers[0].color).toEqual('red');
- expect(layoutOut.mapbox.layers[0].line.width).toEqual(3);
- expect(layoutOut.mapbox.layers[0].fill).toBeUndefined();
- expect(layoutOut.mapbox.layers[0].circle).toBeUndefined();
- expect(layoutOut.mapbox.layers[0].symbol).toBeUndefined();
-
- expect(layoutOut.mapbox.layers[1].color).toEqual('blue');
- expect(layoutOut.mapbox.layers[1].fill.outlinecolor).toEqual('#d3d3d3');
- expect(layoutOut.mapbox.layers[1].line).toBeUndefined();
- expect(layoutOut.mapbox.layers[1].circle).toBeUndefined();
- expect(layoutOut.mapbox.layers[1].symbol).toBeUndefined();
-
- expect(layoutOut.mapbox.layers[2].color).toEqual('green');
- expect(layoutOut.mapbox.layers[2].circle.radius).toEqual(20);
- expect(layoutOut.mapbox.layers[2].line).toBeUndefined();
- expect(layoutOut.mapbox.layers[2].fill).toBeUndefined();
- expect(layoutOut.mapbox.layers[2].symbol).toBeUndefined();
-
- expect(layoutOut.mapbox.layers[3].color).toEqual('yellow');
- expect(layoutOut.mapbox.layers[3].symbol.icon).toEqual('monument');
- expect(layoutOut.mapbox.layers[3].line).toBeUndefined();
- expect(layoutOut.mapbox.layers[3].fill).toBeUndefined();
- expect(layoutOut.mapbox.layers[3].circle).toBeUndefined();
- });
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.mapbox._input).toBe(mapbox);
+ }
+ );
+
+ it("should accept both string and object style", function() {
+ var mapboxStyleJSON = { id: "cdsa213wqdsa", owner: "johnny" };
+
+ layoutIn = {
+ mapbox: { style: "light" },
+ mapbox2: { style: mapboxStyleJSON }
+ };
+
+ fullData.push({ type: "scattermapbox", subplot: "mapbox2" });
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.mapbox.style).toEqual("light");
+ expect(layoutOut.mapbox2.style).toBe(mapboxStyleJSON);
+ });
+
+ it("should fill layer containers", function() {
+ layoutIn = { mapbox: { layers: [{}, {}] } };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.mapbox.layers[0].sourcetype).toEqual("geojson");
+ expect(layoutOut.mapbox.layers[1].sourcetype).toEqual("geojson");
+ });
+
+ it("should skip over non-object layer containers", function() {
+ layoutIn = { mapbox: { layers: [{}, null, "remove", {}] } };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.mapbox.layers[0].sourcetype).toEqual("geojson");
+ expect(layoutOut.mapbox.layers[0]._index).toEqual(0);
+ expect(layoutOut.mapbox.layers[1].sourcetype).toEqual("geojson");
+ expect(layoutOut.mapbox.layers[1]._index).toEqual(3);
+ });
+
+ it("should coerce 'sourcelayer' only for *vector* 'sourcetype'", function() {
+ layoutIn = {
+ mapbox: {
+ layers: [
+ { sourcetype: "vector", sourcelayer: "layer0" },
+ { sourcetype: "geojson", sourcelayer: "layer0" }
+ ]
+ }
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.mapbox.layers[0].sourcelayer).toEqual("layer0");
+ expect(layoutOut.mapbox.layers[1].sourcelayer).toBeUndefined();
+ });
+
+ it("should only coerce relevant layer style attributes", function() {
+ var base = {
+ line: { width: 3 },
+ fill: { outlinecolor: "#d3d3d3" },
+ circle: { radius: 20 },
+ symbol: { icon: "monument" }
+ };
+
+ layoutIn = {
+ mapbox: {
+ layers: [
+ Lib.extendFlat({}, base, { type: "line", color: "red" }),
+ Lib.extendFlat({}, base, { type: "fill", color: "blue" }),
+ Lib.extendFlat({}, base, { type: "circle", color: "green" }),
+ Lib.extendFlat({}, base, { type: "symbol", color: "yellow" })
+ ]
+ }
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+
+ expect(layoutOut.mapbox.layers[0].color).toEqual("red");
+ expect(layoutOut.mapbox.layers[0].line.width).toEqual(3);
+ expect(layoutOut.mapbox.layers[0].fill).toBeUndefined();
+ expect(layoutOut.mapbox.layers[0].circle).toBeUndefined();
+ expect(layoutOut.mapbox.layers[0].symbol).toBeUndefined();
+
+ expect(layoutOut.mapbox.layers[1].color).toEqual("blue");
+ expect(layoutOut.mapbox.layers[1].fill.outlinecolor).toEqual("#d3d3d3");
+ expect(layoutOut.mapbox.layers[1].line).toBeUndefined();
+ expect(layoutOut.mapbox.layers[1].circle).toBeUndefined();
+ expect(layoutOut.mapbox.layers[1].symbol).toBeUndefined();
+
+ expect(layoutOut.mapbox.layers[2].color).toEqual("green");
+ expect(layoutOut.mapbox.layers[2].circle.radius).toEqual(20);
+ expect(layoutOut.mapbox.layers[2].line).toBeUndefined();
+ expect(layoutOut.mapbox.layers[2].fill).toBeUndefined();
+ expect(layoutOut.mapbox.layers[2].symbol).toBeUndefined();
+
+ expect(layoutOut.mapbox.layers[3].color).toEqual("yellow");
+ expect(layoutOut.mapbox.layers[3].symbol.icon).toEqual("monument");
+ expect(layoutOut.mapbox.layers[3].line).toBeUndefined();
+ expect(layoutOut.mapbox.layers[3].fill).toBeUndefined();
+ expect(layoutOut.mapbox.layers[3].circle).toBeUndefined();
+ });
});
-describe('mapbox credentials', function() {
- 'use strict';
-
- if(!hasWebGLSupport('mapbox credentials')) return;
-
- var dummyToken = 'asfdsa124331wersdsa1321q3';
- var gd;
-
- beforeEach(function() {
- gd = createGraphDiv();
-
- Plotly.setPlotConfig({
- mapboxAccessToken: null
- });
- });
-
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
-
- Plotly.setPlotConfig({
- mapboxAccessToken: MAPBOX_ACCESS_TOKEN
- });
- });
-
- it('should throw error if token is not registered', function() {
- expect(function() {
- Plotly.plot(gd, [{
- type: 'scattermapbox',
- lon: [10, 20, 30],
- lat: [10, 20, 30]
- }]);
- }).toThrow(new Error(constants.noAccessTokenErrorMsg));
- }, LONG_TIMEOUT_INTERVAL);
-
- it('should throw error if token is invalid', function(done) {
- var cnt = 0;
-
- Plotly.plot(gd, [{
- type: 'scattermapbox',
- lon: [10, 20, 30],
- lat: [10, 20, 30]
- }], {}, {
- mapboxAccessToken: dummyToken
- })
+describe("mapbox credentials", function() {
+ "use strict";
+ if (!hasWebGLSupport("mapbox credentials")) return;
+
+ var dummyToken = "asfdsa124331wersdsa1321q3";
+ var gd;
+
+ beforeEach(function() {
+ gd = createGraphDiv();
+
+ Plotly.setPlotConfig({ mapboxAccessToken: null });
+ });
+
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+
+ Plotly.setPlotConfig({ mapboxAccessToken: MAPBOX_ACCESS_TOKEN });
+ });
+
+ it(
+ "should throw error if token is not registered",
+ function() {
+ expect(function() {
+ Plotly.plot(gd, [
+ { type: "scattermapbox", lon: [10, 20, 30], lat: [10, 20, 30] }
+ ]);
+ }).toThrow(new Error(constants.noAccessTokenErrorMsg));
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
+
+ it(
+ "should throw error if token is invalid",
+ function(done) {
+ var cnt = 0;
+
+ Plotly.plot(
+ gd,
+ [{ type: "scattermapbox", lon: [10, 20, 30], lat: [10, 20, 30] }],
+ {},
+ { mapboxAccessToken: dummyToken }
+ )
.catch(function(err) {
- cnt++;
- expect(err).toEqual(new Error(constants.mapOnErrorMsg));
+ cnt++;
+ expect(err).toEqual(new Error(constants.mapOnErrorMsg));
})
.then(function() {
- expect(cnt).toEqual(1);
- done();
+ expect(cnt).toEqual(1);
+ done();
});
- }, LONG_TIMEOUT_INTERVAL);
-
- it('should use access token in mapbox layout options if present', function(done) {
- var cnt = 0;
-
- Plotly.plot(gd, [{
- type: 'scattermapbox',
- lon: [10, 20, 30],
- lat: [10, 20, 30]
- }], {
- mapbox: {
- accesstoken: MAPBOX_ACCESS_TOKEN
- }
- }, {
- mapboxAccessToken: dummyToken
- }).catch(function() {
- cnt++;
- }).then(function() {
- expect(cnt).toEqual(0);
- expect(gd._fullLayout.mapbox.accesstoken).toEqual(MAPBOX_ACCESS_TOKEN);
- done();
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
+
+ it(
+ "should use access token in mapbox layout options if present",
+ function(done) {
+ var cnt = 0;
+
+ Plotly.plot(
+ gd,
+ [{ type: "scattermapbox", lon: [10, 20, 30], lat: [10, 20, 30] }],
+ { mapbox: { accesstoken: MAPBOX_ACCESS_TOKEN } },
+ { mapboxAccessToken: dummyToken }
+ )
+ .catch(function() {
+ cnt++;
+ })
+ .then(function() {
+ expect(cnt).toEqual(0);
+ expect(gd._fullLayout.mapbox.accesstoken).toEqual(
+ MAPBOX_ACCESS_TOKEN
+ );
+ done();
});
- }, LONG_TIMEOUT_INTERVAL);
-
- it('should bypass access token in mapbox layout options when config points to an Atlas server', function(done) {
- var cnt = 0;
- var msg = [
- 'An API access token is required to use Mapbox GL.',
- 'See https://www.mapbox.com/developers/api/#access-tokens'
- ].join(' ');
-
- Plotly.plot(gd, [{
- type: 'scattermapbox',
- lon: [10, 20, 30],
- lat: [10, 20, 30]
- }], {
- mapbox: {
- accesstoken: MAPBOX_ACCESS_TOKEN
- }
- }, {
- mapboxAccessToken: ''
- })
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
+
+ it(
+ "should bypass access token in mapbox layout options when config points to an Atlas server",
+ function(done) {
+ var cnt = 0;
+ var msg = [
+ "An API access token is required to use Mapbox GL.",
+ "See https://www.mapbox.com/developers/api/#access-tokens"
+ ].join(" ");
+
+ Plotly.plot(
+ gd,
+ [{ type: "scattermapbox", lon: [10, 20, 30], lat: [10, 20, 30] }],
+ { mapbox: { accesstoken: MAPBOX_ACCESS_TOKEN } },
+ { mapboxAccessToken: "" }
+ )
.catch(function(err) {
- cnt++;
- expect(err).toEqual(new Error(msg));
+ cnt++;
+ expect(err).toEqual(new Error(msg));
})
.then(function() {
- expect(cnt).toEqual(1);
- done();
+ expect(cnt).toEqual(1);
+ done();
});
- }, LONG_TIMEOUT_INTERVAL);
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
});
-describe('mapbox plots', function() {
- 'use strict';
+describe("mapbox plots", function() {
+ "use strict";
+ if (!hasWebGLSupport("mapbox plots")) return;
- if(!hasWebGLSupport('mapbox plots')) return;
+ var mock = require("@mocks/mapbox_0.json"), gd;
- var mock = require('@mocks/mapbox_0.json'),
- gd;
+ var pointPos = [579, 276], blankPos = [650, 120];
- var pointPos = [579, 276],
- blankPos = [650, 120];
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
- });
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- beforeEach(function(done) {
- gd = createGraphDiv();
+ var mockCopy = Lib.extendDeep({}, mock);
- var mockCopy = Lib.extendDeep({}, mock);
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
- });
-
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
- it('should be able to toggle trace visibility', function(done) {
- var modes = ['line', 'circle'];
+ it(
+ "should be able to toggle trace visibility",
+ function(done) {
+ var modes = ["line", "circle"];
- expect(countVisibleTraces(gd, modes)).toEqual(2);
+ expect(countVisibleTraces(gd, modes)).toEqual(2);
- Plotly.restyle(gd, 'visible', false).then(function() {
- expect(gd._fullLayout.mapbox).toBeUndefined();
+ Plotly.restyle(gd, "visible", false)
+ .then(function() {
+ expect(gd._fullLayout.mapbox).toBeUndefined();
- return Plotly.restyle(gd, 'visible', true);
+ return Plotly.restyle(gd, "visible", true);
})
.then(function() {
- expect(countVisibleTraces(gd, modes)).toEqual(2);
+ expect(countVisibleTraces(gd, modes)).toEqual(2);
- return Plotly.restyle(gd, 'visible', 'legendonly', [1]);
+ return Plotly.restyle(gd, "visible", "legendonly", [1]);
})
.then(function() {
- expect(countVisibleTraces(gd, modes)).toEqual(1);
+ expect(countVisibleTraces(gd, modes)).toEqual(1);
- return Plotly.restyle(gd, 'visible', true);
+ return Plotly.restyle(gd, "visible", true);
})
.then(function() {
- expect(countVisibleTraces(gd, modes)).toEqual(2);
+ expect(countVisibleTraces(gd, modes)).toEqual(2);
- var mockCopy = Lib.extendDeep({}, mock);
- mockCopy.data[0].visible = false;
+ var mockCopy = Lib.extendDeep({}, mock);
+ mockCopy.data[0].visible = false;
- return Plotly.newPlot(gd, mockCopy.data, mockCopy.layout);
+ return Plotly.newPlot(gd, mockCopy.data, mockCopy.layout);
})
.then(function() {
- expect(countVisibleTraces(gd, modes)).toEqual(1);
+ expect(countVisibleTraces(gd, modes)).toEqual(1);
- done();
+ done();
});
- }, LONG_TIMEOUT_INTERVAL);
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
- it('should be able to delete and add traces', function(done) {
- var modes = ['line', 'circle'];
+ it(
+ "should be able to delete and add traces",
+ function(done) {
+ var modes = ["line", "circle"];
- expect(countVisibleTraces(gd, modes)).toEqual(2);
+ expect(countVisibleTraces(gd, modes)).toEqual(2);
- Plotly.deleteTraces(gd, [0]).then(function() {
- expect(countVisibleTraces(gd, modes)).toEqual(1);
+ Plotly.deleteTraces(gd, [0])
+ .then(function() {
+ expect(countVisibleTraces(gd, modes)).toEqual(1);
- var trace = {
- type: 'scattermapbox',
- mode: 'markers+lines',
- lon: [-10, -20, -10],
- lat: [-10, 20, -10]
- };
+ var trace = {
+ type: "scattermapbox",
+ mode: "markers+lines",
+ lon: [-10, -20, -10],
+ lat: [-10, 20, -10]
+ };
- return Plotly.addTraces(gd, [trace]);
+ return Plotly.addTraces(gd, [trace]);
})
.then(function() {
- expect(countVisibleTraces(gd, modes)).toEqual(2);
+ expect(countVisibleTraces(gd, modes)).toEqual(2);
- var trace = {
- type: 'scattermapbox',
- mode: 'markers+lines',
- lon: [10, 20, 10],
- lat: [10, -20, 10]
- };
+ var trace = {
+ type: "scattermapbox",
+ mode: "markers+lines",
+ lon: [10, 20, 10],
+ lat: [10, -20, 10]
+ };
- return Plotly.addTraces(gd, [trace]);
+ return Plotly.addTraces(gd, [trace]);
})
.then(function() {
- expect(countVisibleTraces(gd, modes)).toEqual(3);
+ expect(countVisibleTraces(gd, modes)).toEqual(3);
- return Plotly.deleteTraces(gd, [0, 1, 2]);
+ return Plotly.deleteTraces(gd, [0, 1, 2]);
})
.then(function() {
- expect(gd._fullLayout.mapbox).toBeUndefined();
+ expect(gd._fullLayout.mapbox).toBeUndefined();
- done();
+ done();
});
- }, LONG_TIMEOUT_INTERVAL);
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
- it('should be able to restyle', function(done) {
- var restyleCnt = 0,
- relayoutCnt = 0;
+ it(
+ "should be able to restyle",
+ function(done) {
+ var restyleCnt = 0, relayoutCnt = 0;
- gd.on('plotly_restyle', function() {
- restyleCnt++;
- });
-
- gd.on('plotly_relayout', function() {
- relayoutCnt++;
- });
+ gd.on("plotly_restyle", function() {
+ restyleCnt++;
+ });
- function assertMarkerColor(expectations) {
- return new Promise(function(resolve) {
- setTimeout(function() {
- var colors = getStyle(gd, 'circle', 'circle-color');
+ gd.on("plotly_relayout", function() {
+ relayoutCnt++;
+ });
- expectations.forEach(function(expected, i) {
- expect(colors[i]).toBeCloseToArray(expected);
- });
-
- resolve();
- }, TRANSITION_DELAY);
- });
- }
+ function assertMarkerColor(expectations) {
+ return new Promise(function(resolve) {
+ setTimeout(
+ function() {
+ var colors = getStyle(gd, "circle", "circle-color");
+
+ expectations.forEach(function(expected, i) {
+ expect(colors[i]).toBeCloseToArray(expected);
+ });
+
+ resolve();
+ },
+ TRANSITION_DELAY
+ );
+ });
+ }
- assertMarkerColor([
- [0.121, 0.466, 0.705, 1],
- [1, 0.498, 0.0549, 1]
- ])
+ assertMarkerColor([[0.121, 0.466, 0.705, 1], [1, 0.498, 0.0549, 1]])
.then(function() {
- return Plotly.restyle(gd, 'marker.color', 'green');
+ return Plotly.restyle(gd, "marker.color", "green");
})
.then(function() {
- expect(restyleCnt).toEqual(1);
- expect(relayoutCnt).toEqual(0);
+ expect(restyleCnt).toEqual(1);
+ expect(relayoutCnt).toEqual(0);
- return assertMarkerColor([
- [0, 0.5019, 0, 1],
- [0, 0.5019, 0, 1]
- ]);
+ return assertMarkerColor([[0, 0.5019, 0, 1], [0, 0.5019, 0, 1]]);
})
.then(function() {
- return Plotly.restyle(gd, 'marker.color', 'red', [1]);
+ return Plotly.restyle(gd, "marker.color", "red", [1]);
})
.then(function() {
- expect(restyleCnt).toEqual(2);
- expect(relayoutCnt).toEqual(0);
+ expect(restyleCnt).toEqual(2);
+ expect(relayoutCnt).toEqual(0);
- return assertMarkerColor([
- [0, 0.5019, 0, 1],
- [1, 0, 0, 1]
- ]);
+ return assertMarkerColor([[0, 0.5019, 0, 1], [1, 0, 0, 1]]);
})
.then(done);
- }, LONG_TIMEOUT_INTERVAL);
-
- it('should be able to relayout', function(done) {
- var restyleCnt = 0,
- relayoutCnt = 0;
-
- gd.on('plotly_restyle', function() {
- restyleCnt++;
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
+
+ it(
+ "should be able to relayout",
+ function(done) {
+ var restyleCnt = 0, relayoutCnt = 0;
+
+ gd.on("plotly_restyle", function() {
+ restyleCnt++;
+ });
+
+ gd.on("plotly_relayout", function() {
+ relayoutCnt++;
+ });
+
+ function assertLayout(style, center, zoom, dims) {
+ var mapInfo = getMapInfo(gd);
+
+ expect(mapInfo.style.name).toEqual(style);
+ expect([mapInfo.center.lng, mapInfo.center.lat]).toBeCloseToArray(
+ center
+ );
+ expect(mapInfo.zoom).toBeCloseTo(zoom);
+
+ var divStyle = mapInfo.div.style;
+ ["left", "top", "width", "height"].forEach(function(p, i) {
+ expect(parseFloat(divStyle[p])).toBeWithin(dims[i], 8);
});
+ }
- gd.on('plotly_relayout', function() {
- relayoutCnt++;
- });
-
- function assertLayout(style, center, zoom, dims) {
- var mapInfo = getMapInfo(gd);
-
- expect(mapInfo.style.name).toEqual(style);
- expect([mapInfo.center.lng, mapInfo.center.lat])
- .toBeCloseToArray(center);
- expect(mapInfo.zoom).toBeCloseTo(zoom);
-
- var divStyle = mapInfo.div.style;
- ['left', 'top', 'width', 'height'].forEach(function(p, i) {
- expect(parseFloat(divStyle[p])).toBeWithin(dims[i], 8);
- });
- }
+ assertLayout("Mapbox Dark", [-4.710, 19.475], 1.234, [80, 100, 908, 270]);
- assertLayout('Mapbox Dark', [-4.710, 19.475], 1.234, [80, 100, 908, 270]);
-
- Plotly.relayout(gd, 'mapbox.center', { lon: 0, lat: 0 }).then(function() {
- expect(restyleCnt).toEqual(0);
- expect(relayoutCnt).toEqual(1);
+ Plotly.relayout(gd, "mapbox.center", { lon: 0, lat: 0 })
+ .then(function() {
+ expect(restyleCnt).toEqual(0);
+ expect(relayoutCnt).toEqual(1);
- assertLayout('Mapbox Dark', [0, 0], 1.234, [80, 100, 908, 270]);
+ assertLayout("Mapbox Dark", [0, 0], 1.234, [80, 100, 908, 270]);
- return Plotly.relayout(gd, 'mapbox.zoom', '6');
+ return Plotly.relayout(gd, "mapbox.zoom", "6");
})
.then(function() {
- expect(restyleCnt).toEqual(0);
- expect(relayoutCnt).toEqual(2);
+ expect(restyleCnt).toEqual(0);
+ expect(relayoutCnt).toEqual(2);
- assertLayout('Mapbox Dark', [0, 0], 6, [80, 100, 908, 270]);
+ assertLayout("Mapbox Dark", [0, 0], 6, [80, 100, 908, 270]);
- return Plotly.relayout(gd, 'mapbox.style', 'light');
+ return Plotly.relayout(gd, "mapbox.style", "light");
})
.then(function() {
- expect(restyleCnt).toEqual(0);
- expect(relayoutCnt).toEqual(3);
+ expect(restyleCnt).toEqual(0);
+ expect(relayoutCnt).toEqual(3);
- assertLayout('Mapbox Light', [0, 0], 6, [80, 100, 908, 270]);
+ assertLayout("Mapbox Light", [0, 0], 6, [80, 100, 908, 270]);
- return Plotly.relayout(gd, 'mapbox.domain.x', [0, 0.5]);
+ return Plotly.relayout(gd, "mapbox.domain.x", [0, 0.5]);
})
.then(function() {
- expect(restyleCnt).toEqual(0);
- expect(relayoutCnt).toEqual(4);
+ expect(restyleCnt).toEqual(0);
+ expect(relayoutCnt).toEqual(4);
- assertLayout('Mapbox Light', [0, 0], 6, [80, 100, 454, 270]);
+ assertLayout("Mapbox Light", [0, 0], 6, [80, 100, 454, 270]);
- return Plotly.relayout(gd, 'mapbox.domain.y[0]', 0.5);
+ return Plotly.relayout(gd, "mapbox.domain.y[0]", 0.5);
})
.then(function() {
- expect(restyleCnt).toEqual(0);
- expect(relayoutCnt).toEqual(5);
+ expect(restyleCnt).toEqual(0);
+ expect(relayoutCnt).toEqual(5);
- assertLayout('Mapbox Light', [0, 0], 6, [80, 100, 454, 135]);
+ assertLayout("Mapbox Light", [0, 0], 6, [80, 100, 454, 135]);
- done();
+ done();
});
- }, LONG_TIMEOUT_INTERVAL);
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
- it('should be able to add, update and remove layers', function(done) {
- var mockWithLayers = require('@mocks/mapbox_layers');
+ it(
+ "should be able to add, update and remove layers",
+ function(done) {
+ var mockWithLayers = require("@mocks/mapbox_layers");
- var layer0 = Lib.extendDeep({}, mockWithLayers.layout.mapbox.layers[0]),
- layer1 = Lib.extendDeep({}, mockWithLayers.layout.mapbox.layers[1]);
+ var layer0 = Lib.extendDeep({}, mockWithLayers.layout.mapbox.layers[0]),
+ layer1 = Lib.extendDeep({}, mockWithLayers.layout.mapbox.layers[1]);
- var mapUpdate = {
- 'mapbox.zoom': mockWithLayers.layout.mapbox.zoom,
- 'mapbox.center.lon': mockWithLayers.layout.mapbox.center.lon,
- 'mapbox.center.lat': mockWithLayers.layout.mapbox.center.lat
- };
+ var mapUpdate = {
+ "mapbox.zoom": mockWithLayers.layout.mapbox.zoom,
+ "mapbox.center.lon": mockWithLayers.layout.mapbox.center.lon,
+ "mapbox.center.lat": mockWithLayers.layout.mapbox.center.lat
+ };
- var styleUpdate0 = {
- 'mapbox.layers[0].color': 'red',
- 'mapbox.layers[0].fill.outlinecolor': 'blue',
- 'mapbox.layers[0].opacity': 0.3
- };
+ var styleUpdate0 = {
+ "mapbox.layers[0].color": "red",
+ "mapbox.layers[0].fill.outlinecolor": "blue",
+ "mapbox.layers[0].opacity": 0.3
+ };
- var styleUpdate1 = {
- 'mapbox.layers[1].color': 'blue',
- 'mapbox.layers[1].line.width': 3,
- 'mapbox.layers[1].opacity': 0.6
- };
+ var styleUpdate1 = {
+ "mapbox.layers[1].color": "blue",
+ "mapbox.layers[1].line.width": 3,
+ "mapbox.layers[1].opacity": 0.6
+ };
- function countVisibleLayers(gd) {
- var mapInfo = getMapInfo(gd);
+ function countVisibleLayers(gd) {
+ var mapInfo = getMapInfo(gd);
- var sourceLen = mapInfo.layoutSources.length,
- layerLen = mapInfo.layoutLayers.length;
+ var sourceLen = mapInfo.layoutSources.length,
+ layerLen = mapInfo.layoutLayers.length;
- if(sourceLen !== layerLen) return null;
+ if (sourceLen !== layerLen) return null;
- return layerLen;
- }
+ return layerLen;
+ }
- function assertLayerStyle(gd, expectations, index) {
- var mapInfo = getMapInfo(gd),
- layers = mapInfo.layers,
- layerNames = mapInfo.layoutLayers;
-
- var layer = layers[layerNames[index]];
-
- return new Promise(function(resolve) {
- setTimeout(function() {
- Object.keys(expectations).forEach(function(k) {
- expect(layer.paint[k]).toEqual(expectations[k]);
- });
- resolve();
- }, TRANSITION_DELAY);
- });
- }
+ function assertLayerStyle(gd, expectations, index) {
+ var mapInfo = getMapInfo(gd),
+ layers = mapInfo.layers,
+ layerNames = mapInfo.layoutLayers;
- expect(countVisibleLayers(gd)).toEqual(0);
+ var layer = layers[layerNames[index]];
- Plotly.relayout(gd, 'mapbox.layers[0]', layer0).then(function() {
- expect(gd.layout.mapbox.layers.length).toEqual(1);
- expect(countVisibleLayers(gd)).toEqual(1);
+ return new Promise(function(resolve) {
+ setTimeout(
+ function() {
+ Object.keys(expectations).forEach(function(k) {
+ expect(layer.paint[k]).toEqual(expectations[k]);
+ });
+ resolve();
+ },
+ TRANSITION_DELAY
+ );
+ });
+ }
- return Plotly.relayout(gd, 'mapbox.layers[1]', layer1);
- })
+ expect(countVisibleLayers(gd)).toEqual(0);
+
+ Plotly.relayout(gd, "mapbox.layers[0]", layer0)
.then(function() {
- expect(gd.layout.mapbox.layers.length).toEqual(2);
- expect(countVisibleLayers(gd)).toEqual(2);
+ expect(gd.layout.mapbox.layers.length).toEqual(1);
+ expect(countVisibleLayers(gd)).toEqual(1);
- return Plotly.relayout(gd, mapUpdate);
+ return Plotly.relayout(gd, "mapbox.layers[1]", layer1);
})
.then(function() {
- expect(gd.layout.mapbox.layers.length).toEqual(2);
- expect(countVisibleLayers(gd)).toEqual(2);
+ expect(gd.layout.mapbox.layers.length).toEqual(2);
+ expect(countVisibleLayers(gd)).toEqual(2);
- return Plotly.relayout(gd, styleUpdate0);
+ return Plotly.relayout(gd, mapUpdate);
})
.then(function() {
- expect(gd.layout.mapbox.layers.length).toEqual(2);
- expect(countVisibleLayers(gd)).toEqual(2);
+ expect(gd.layout.mapbox.layers.length).toEqual(2);
+ expect(countVisibleLayers(gd)).toEqual(2);
- return assertLayerStyle(gd, {
- 'fill-color': [1, 0, 0, 1],
- 'fill-outline-color': [0, 0, 1, 1],
- 'fill-opacity': 0.3
- }, 0);
+ return Plotly.relayout(gd, styleUpdate0);
})
.then(function() {
- expect(gd.layout.mapbox.layers.length).toEqual(2);
- expect(countVisibleLayers(gd)).toEqual(2);
+ expect(gd.layout.mapbox.layers.length).toEqual(2);
+ expect(countVisibleLayers(gd)).toEqual(2);
- return Plotly.relayout(gd, styleUpdate1);
+ return assertLayerStyle(
+ gd,
+ {
+ "fill-color": [1, 0, 0, 1],
+ "fill-outline-color": [0, 0, 1, 1],
+ "fill-opacity": 0.3
+ },
+ 0
+ );
})
.then(function() {
- expect(gd.layout.mapbox.layers.length).toEqual(2);
- expect(countVisibleLayers(gd)).toEqual(2);
+ expect(gd.layout.mapbox.layers.length).toEqual(2);
+ expect(countVisibleLayers(gd)).toEqual(2);
- return assertLayerStyle(gd, {
- 'line-width': 3,
- 'line-color': [0, 0, 1, 1],
- 'line-opacity': 0.6
- }, 1);
+ return Plotly.relayout(gd, styleUpdate1);
})
.then(function() {
- expect(gd.layout.mapbox.layers.length).toEqual(2);
- expect(countVisibleLayers(gd)).toEqual(2);
+ expect(gd.layout.mapbox.layers.length).toEqual(2);
+ expect(countVisibleLayers(gd)).toEqual(2);
- return Plotly.relayout(gd, 'mapbox.layers[1]', null);
+ return assertLayerStyle(
+ gd,
+ {
+ "line-width": 3,
+ "line-color": [0, 0, 1, 1],
+ "line-opacity": 0.6
+ },
+ 1
+ );
})
.then(function() {
- expect(gd.layout.mapbox.layers.length).toEqual(1);
- expect(countVisibleLayers(gd)).toEqual(1);
+ expect(gd.layout.mapbox.layers.length).toEqual(2);
+ expect(countVisibleLayers(gd)).toEqual(2);
- return Plotly.relayout(gd, 'mapbox.layers[0]', null);
+ return Plotly.relayout(gd, "mapbox.layers[1]", null);
})
.then(function() {
- expect(gd.layout.mapbox.layers.length).toEqual(0);
- expect(countVisibleLayers(gd)).toEqual(0);
+ expect(gd.layout.mapbox.layers.length).toEqual(1);
+ expect(countVisibleLayers(gd)).toEqual(1);
- return Plotly.relayout(gd, 'mapbox.layers[0]', {});
+ return Plotly.relayout(gd, "mapbox.layers[0]", null);
})
.then(function() {
- expect(gd.layout.mapbox.layers).toEqual([]);
- expect(countVisibleLayers(gd)).toEqual(0);
+ expect(gd.layout.mapbox.layers.length).toEqual(0);
+ expect(countVisibleLayers(gd)).toEqual(0);
- // layer with no source are not drawn
+ return Plotly.relayout(gd, "mapbox.layers[0]", {});
+ })
+ .then(function() {
+ expect(gd.layout.mapbox.layers).toEqual([]);
+ expect(countVisibleLayers(gd)).toEqual(0);
- return Plotly.relayout(gd, 'mapbox.layers[0].source', layer0.source);
+ // layer with no source are not drawn
+ return Plotly.relayout(gd, "mapbox.layers[0].source", layer0.source);
})
.then(function() {
- expect(gd.layout.mapbox.layers.length).toEqual(1);
- expect(countVisibleLayers(gd)).toEqual(1);
+ expect(gd.layout.mapbox.layers.length).toEqual(1);
+ expect(countVisibleLayers(gd)).toEqual(1);
- done();
- });
- }, LONG_TIMEOUT_INTERVAL);
-
- it('should be able to update the access token', function(done) {
- Plotly.relayout(gd, 'mapbox.accesstoken', 'wont-work').catch(function(err) {
- expect(gd._fullLayout.mapbox.accesstoken).toEqual('wont-work');
- expect(err).toEqual(new Error(constants.mapOnErrorMsg));
- expect(gd._promises.length).toEqual(1);
-
- return Plotly.relayout(gd, 'mapbox.accesstoken', MAPBOX_ACCESS_TOKEN);
- }).then(function() {
- expect(gd._fullLayout.mapbox.accesstoken).toEqual(MAPBOX_ACCESS_TOKEN);
- expect(gd._promises.length).toEqual(0);
- done();
+ done();
});
- }, LONG_TIMEOUT_INTERVAL);
-
- it('should be able to update traces', function(done) {
- function assertDataPts(lengths) {
- var lines = getGeoJsonData(gd, 'lines'),
- markers = getGeoJsonData(gd, 'markers');
-
- lines.forEach(function(obj, i) {
- expect(obj.coordinates[0].length).toEqual(lengths[i]);
- });
-
- markers.forEach(function(obj, i) {
- expect(obj.features.length).toEqual(lengths[i]);
- });
- }
-
- assertDataPts([3, 3]);
-
- var update = {
- lon: [[10, 20]],
- lat: [[-45, -20]]
- };
-
- Plotly.restyle(gd, update, [1]).then(function() {
- assertDataPts([3, 2]);
-
- var update = {
- lon: [ [10, 20], [30, 40, 20] ],
- lat: [ [-10, 20], [10, 20, 30] ]
- };
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
+
+ it(
+ "should be able to update the access token",
+ function(done) {
+ Plotly.relayout(gd, "mapbox.accesstoken", "wont-work")
+ .catch(function(err) {
+ expect(gd._fullLayout.mapbox.accesstoken).toEqual("wont-work");
+ expect(err).toEqual(new Error(constants.mapOnErrorMsg));
+ expect(gd._promises.length).toEqual(1);
- return Plotly.extendTraces(gd, update, [0, 1]);
+ return Plotly.relayout(gd, "mapbox.accesstoken", MAPBOX_ACCESS_TOKEN);
})
.then(function() {
- assertDataPts([5, 5]);
-
- done();
+ expect(gd._fullLayout.mapbox.accesstoken).toEqual(
+ MAPBOX_ACCESS_TOKEN
+ );
+ expect(gd._promises.length).toEqual(0);
+ done();
+ });
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
+
+ it(
+ "should be able to update traces",
+ function(done) {
+ function assertDataPts(lengths) {
+ var lines = getGeoJsonData(gd, "lines"),
+ markers = getGeoJsonData(gd, "markers");
+
+ lines.forEach(function(obj, i) {
+ expect(obj.coordinates[0].length).toEqual(lengths[i]);
});
- }, LONG_TIMEOUT_INTERVAL);
-
- it('should display to hover labels on mouse over', function(done) {
- function assertMouseMove(pos, len) {
- return _mouseEvent('mousemove', pos, function() {
- var hoverLabels = d3.select('.hoverlayer').selectAll('g');
-
- expect(hoverLabels.size()).toEqual(len);
- });
- }
- assertMouseMove(blankPos, 0).then(function() {
- return assertMouseMove(pointPos, 1);
- }).then(done);
- }, LONG_TIMEOUT_INTERVAL);
+ markers.forEach(function(obj, i) {
+ expect(obj.features.length).toEqual(lengths[i]);
+ });
+ }
- it('should respond to hover interactions by', function(done) {
- var hoverCnt = 0,
- unhoverCnt = 0;
+ assertDataPts([3, 3]);
- var hoverData, unhoverData;
+ var update = { lon: [[10, 20]], lat: [[-45, -20]] };
- gd.on('plotly_hover', function(eventData) {
- hoverCnt++;
- hoverData = eventData.points[0];
- });
+ Plotly.restyle(gd, update, [1])
+ .then(function() {
+ assertDataPts([3, 2]);
- gd.on('plotly_unhover', function(eventData) {
- unhoverCnt++;
- unhoverData = eventData.points[0];
- });
+ var update = {
+ lon: [[10, 20], [30, 40, 20]],
+ lat: [[-10, 20], [10, 20, 30]]
+ };
- _mouseEvent('mousemove', blankPos, function() {
- expect(hoverData).toBe(undefined, 'not firing on blank points');
- expect(unhoverData).toBe(undefined, 'not firing on blank points');
+ return Plotly.extendTraces(gd, update, [0, 1]);
})
.then(function() {
- return _mouseEvent('mousemove', pointPos, function() {
- expect(hoverData).not.toBe(undefined, 'firing on data points');
- expect(Object.keys(hoverData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber', 'lon', 'lat'
- ], 'returning the correct event data keys');
- expect(hoverData.curveNumber).toEqual(0, 'returning the correct curve number');
- expect(hoverData.pointNumber).toEqual(0, 'returning the correct point number');
- });
- })
- .then(function() {
- return _mouseEvent('mousemove', blankPos, function() {
- expect(unhoverData).not.toBe(undefined, 'firing on data points');
- expect(Object.keys(unhoverData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber', 'lon', 'lat'
- ], 'returning the correct event data keys');
- expect(unhoverData.curveNumber).toEqual(0, 'returning the correct curve number');
- expect(unhoverData.pointNumber).toEqual(0, 'returning the correct point number');
- });
- })
- .then(function() {
- expect(hoverCnt).toEqual(1);
- expect(unhoverCnt).toEqual(1);
+ assertDataPts([5, 5]);
- done();
+ done();
});
- }, LONG_TIMEOUT_INTERVAL);
-
- it('should respond drag / scroll interactions', function(done) {
- var relayoutCnt = 0,
- updateData;
-
- gd.on('plotly_relayout', function(eventData) {
- relayoutCnt++;
- updateData = eventData;
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
+
+ it(
+ "should display to hover labels on mouse over",
+ function(done) {
+ function assertMouseMove(pos, len) {
+ return _mouseEvent("mousemove", pos, function() {
+ var hoverLabels = d3.select(".hoverlayer").selectAll("g");
+
+ expect(hoverLabels.size()).toEqual(len);
});
+ }
- function _drag(p0, p1, cb) {
- var promise = _mouseEvent('mousemove', p0, noop).then(function() {
- return _mouseEvent('mousedown', p0, noop);
- }).then(function() {
- return _mouseEvent('mousemove', p1, noop);
- }).then(function() {
- // repeat mousemove to simulate long dragging motion
- return _mouseEvent('mousemove', p1, noop);
- }).then(function() {
- return _mouseEvent('mouseup', p1, noop);
- }).then(function() {
- return _mouseEvent('mouseup', p1, noop);
- }).then(cb);
-
- return promise;
- }
-
- function assertLayout(center, zoom, opts) {
- var mapInfo = getMapInfo(gd),
- layout = gd.layout.mapbox;
-
- expect([mapInfo.center.lng, mapInfo.center.lat]).toBeCloseToArray(center);
- expect(mapInfo.zoom).toBeCloseTo(zoom);
-
- expect([layout.center.lon, layout.center.lat]).toBeCloseToArray(center);
- expect(layout.zoom).toBeCloseTo(zoom);
-
- if(opts && opts.withUpdateData) {
- var mapboxUpdate = updateData.mapbox;
-
- expect([mapboxUpdate.center.lon, mapboxUpdate.center.lat]).toBeCloseToArray(center);
- expect(mapboxUpdate.zoom).toBeCloseTo(zoom);
- }
- }
-
- assertLayout([-4.710, 19.475], 1.234);
-
- var p1 = [pointPos[0] + 50, pointPos[1] - 20];
-
- _drag(pointPos, p1, function() {
- expect(relayoutCnt).toEqual(1);
- assertLayout([-19.651, 13.751], 1.234, { withUpdateData: true });
-
+ assertMouseMove(blankPos, 0)
+ .then(function() {
+ return assertMouseMove(pointPos, 1);
})
.then(done);
-
- // TODO test scroll
-
- }, LONG_TIMEOUT_INTERVAL);
-
- it('should respond to click interactions by', function(done) {
- var ptData;
-
- gd.on('plotly_click', function(eventData) {
- ptData = eventData.points[0];
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
+
+ it(
+ "should respond to hover interactions by",
+ function(done) {
+ var hoverCnt = 0, unhoverCnt = 0;
+
+ var hoverData, unhoverData;
+
+ gd.on("plotly_hover", function(eventData) {
+ hoverCnt++;
+ hoverData = eventData.points[0];
+ });
+
+ gd.on("plotly_unhover", function(eventData) {
+ unhoverCnt++;
+ unhoverData = eventData.points[0];
+ });
+
+ _mouseEvent("mousemove", blankPos, function() {
+ expect(hoverData).toBe(undefined, "not firing on blank points");
+ expect(unhoverData).toBe(undefined, "not firing on blank points");
+ })
+ .then(function() {
+ return _mouseEvent("mousemove", pointPos, function() {
+ expect(hoverData).not.toBe(undefined, "firing on data points");
+ expect(Object.keys(hoverData)).toEqual(
+ ["data", "fullData", "curveNumber", "pointNumber", "lon", "lat"],
+ "returning the correct event data keys"
+ );
+ expect(hoverData.curveNumber).toEqual(
+ 0,
+ "returning the correct curve number"
+ );
+ expect(hoverData.pointNumber).toEqual(
+ 0,
+ "returning the correct point number"
+ );
+ });
+ })
+ .then(function() {
+ return _mouseEvent("mousemove", blankPos, function() {
+ expect(unhoverData).not.toBe(undefined, "firing on data points");
+ expect(Object.keys(unhoverData)).toEqual(
+ ["data", "fullData", "curveNumber", "pointNumber", "lon", "lat"],
+ "returning the correct event data keys"
+ );
+ expect(unhoverData.curveNumber).toEqual(
+ 0,
+ "returning the correct curve number"
+ );
+ expect(unhoverData.pointNumber).toEqual(
+ 0,
+ "returning the correct point number"
+ );
+ });
+ })
+ .then(function() {
+ expect(hoverCnt).toEqual(1);
+ expect(unhoverCnt).toEqual(1);
+
+ done();
});
-
- function _click(pos, cb) {
- var promise = _mouseEvent('mousemove', pos, noop).then(function() {
- return _mouseEvent('mousedown', pos, noop);
- }).then(function() {
- return _mouseEvent('click', pos, cb);
- });
-
- return promise;
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
+
+ it(
+ "should respond drag / scroll interactions",
+ function(done) {
+ var relayoutCnt = 0, updateData;
+
+ gd.on("plotly_relayout", function(eventData) {
+ relayoutCnt++;
+ updateData = eventData;
+ });
+
+ function _drag(p0, p1, cb) {
+ var promise = _mouseEvent("mousemove", p0, noop)
+ .then(function() {
+ return _mouseEvent("mousedown", p0, noop);
+ })
+ .then(function() {
+ return _mouseEvent("mousemove", p1, noop);
+ })
+ .then(function() {
+ // repeat mousemove to simulate long dragging motion
+ return _mouseEvent("mousemove", p1, noop);
+ })
+ .then(function() {
+ return _mouseEvent("mouseup", p1, noop);
+ })
+ .then(function() {
+ return _mouseEvent("mouseup", p1, noop);
+ })
+ .then(cb);
+
+ return promise;
+ }
+
+ function assertLayout(center, zoom, opts) {
+ var mapInfo = getMapInfo(gd), layout = gd.layout.mapbox;
+
+ expect([mapInfo.center.lng, mapInfo.center.lat]).toBeCloseToArray(
+ center
+ );
+ expect(mapInfo.zoom).toBeCloseTo(zoom);
+
+ expect([layout.center.lon, layout.center.lat]).toBeCloseToArray(center);
+ expect(layout.zoom).toBeCloseTo(zoom);
+
+ if (opts && opts.withUpdateData) {
+ var mapboxUpdate = updateData.mapbox;
+
+ expect([
+ mapboxUpdate.center.lon,
+ mapboxUpdate.center.lat
+ ]).toBeCloseToArray(center);
+ expect(mapboxUpdate.zoom).toBeCloseTo(zoom);
}
-
- _click(blankPos, function() {
- expect(ptData).toBe(undefined, 'not firing on blank points');
- })
- .then(function() {
- return _click(pointPos, function() {
- expect(ptData).not.toBe(undefined, 'firing on data points');
- expect(Object.keys(ptData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber', 'lon', 'lat'
- ], 'returning the correct event data keys');
- expect(ptData.curveNumber).toEqual(0, 'returning the correct curve number');
- expect(ptData.pointNumber).toEqual(0, 'returning the correct point number');
- });
+ }
+
+ assertLayout([-4.710, 19.475], 1.234);
+
+ var p1 = [pointPos[0] + 50, pointPos[1] - 20];
+
+ _drag(pointPos, p1, function() {
+ expect(relayoutCnt).toEqual(1);
+ assertLayout([-19.651, 13.751], 1.234, { withUpdateData: true });
+ }).then(done);
+ // TODO test scroll
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
+
+ it(
+ "should respond to click interactions by",
+ function(done) {
+ var ptData;
+
+ gd.on("plotly_click", function(eventData) {
+ ptData = eventData.points[0];
+ });
+
+ function _click(pos, cb) {
+ var promise = _mouseEvent("mousemove", pos, noop)
+ .then(function() {
+ return _mouseEvent("mousedown", pos, noop);
+ })
+ .then(function() {
+ return _mouseEvent("click", pos, cb);
+ });
+
+ return promise;
+ }
+
+ _click(blankPos, function() {
+ expect(ptData).toBe(undefined, "not firing on blank points");
+ })
+ .then(function() {
+ return _click(pointPos, function() {
+ expect(ptData).not.toBe(undefined, "firing on data points");
+ expect(Object.keys(ptData)).toEqual(
+ ["data", "fullData", "curveNumber", "pointNumber", "lon", "lat"],
+ "returning the correct event data keys"
+ );
+ expect(ptData.curveNumber).toEqual(
+ 0,
+ "returning the correct curve number"
+ );
+ expect(ptData.pointNumber).toEqual(
+ 0,
+ "returning the correct point number"
+ );
+ });
})
.then(done);
- }, LONG_TIMEOUT_INTERVAL);
-
- function getMapInfo(gd) {
- var subplot = gd._fullLayout.mapbox._subplot,
- map = subplot.map;
-
- var sources = map.style.sources,
- layers = map.style._layers,
- uid = subplot.uid;
-
- var traceSources = Object.keys(sources).filter(function(k) {
- return k.indexOf('-source-') !== -1;
- });
+ },
+ LONG_TIMEOUT_INTERVAL
+ );
- var traceLayers = Object.keys(layers).filter(function(k) {
- return k.indexOf('-layer-') !== -1;
- });
+ function getMapInfo(gd) {
+ var subplot = gd._fullLayout.mapbox._subplot, map = subplot.map;
- var layoutSources = Object.keys(sources).filter(function(k) {
- return k.indexOf(uid) !== -1;
- });
-
- var layoutLayers = Object.keys(layers).filter(function(k) {
- return k.indexOf(uid) !== -1;
- });
+ var sources = map.style.sources,
+ layers = map.style._layers,
+ uid = subplot.uid;
- return {
- map: map,
- div: subplot.div,
- sources: sources,
- layers: layers,
- traceSources: traceSources,
- traceLayers: traceLayers,
- layoutSources: layoutSources,
- layoutLayers: layoutLayers,
- center: map.getCenter(),
- zoom: map.getZoom(),
- style: map.getStyle()
- };
- }
-
- function countVisibleTraces(gd, modes) {
- var mapInfo = getMapInfo(gd),
- cnts = [];
-
- // 'modes' are the ScatterMapbox layers names
- // e.g. 'fill', 'line', 'circle', 'symbol'
-
- modes.forEach(function(mode) {
- var cntPerMode = 0;
-
- mapInfo.traceLayers.forEach(function(l) {
- var info = mapInfo.layers[l];
+ var traceSources = Object.keys(sources).filter(function(k) {
+ return k.indexOf("-source-") !== -1;
+ });
- if(l.indexOf(mode) === -1) return;
- if(info.layout.visibility === 'visible') cntPerMode++;
- });
+ var traceLayers = Object.keys(layers).filter(function(k) {
+ return k.indexOf("-layer-") !== -1;
+ });
- cnts.push(cntPerMode);
- });
+ var layoutSources = Object.keys(sources).filter(function(k) {
+ return k.indexOf(uid) !== -1;
+ });
- var cnt = cnts.reduce(function(a, b) {
- return (a === b) ? a : null;
- });
+ var layoutLayers = Object.keys(layers).filter(function(k) {
+ return k.indexOf(uid) !== -1;
+ });
- // returns null if not all counter per mode are the same,
- // returns the counter if all are the same.
+ return {
+ map: map,
+ div: subplot.div,
+ sources: sources,
+ layers: layers,
+ traceSources: traceSources,
+ traceLayers: traceLayers,
+ layoutSources: layoutSources,
+ layoutLayers: layoutLayers,
+ center: map.getCenter(),
+ zoom: map.getZoom(),
+ style: map.getStyle()
+ };
+ }
+
+ function countVisibleTraces(gd, modes) {
+ var mapInfo = getMapInfo(gd), cnts = [];
+
+ // 'modes' are the ScatterMapbox layers names
+ // e.g. 'fill', 'line', 'circle', 'symbol'
+ modes.forEach(function(mode) {
+ var cntPerMode = 0;
+
+ mapInfo.traceLayers.forEach(function(l) {
+ var info = mapInfo.layers[l];
+
+ if (l.indexOf(mode) === -1) return;
+ if (info.layout.visibility === "visible") cntPerMode++;
+ });
+
+ cnts.push(cntPerMode);
+ });
- return cnt;
- }
+ var cnt = cnts.reduce(function(a, b) {
+ return a === b ? a : null;
+ });
- function getStyle(gd, mode, prop) {
- var mapInfo = getMapInfo(gd),
- values = [];
+ // returns null if not all counter per mode are the same,
+ // returns the counter if all are the same.
+ return cnt;
+ }
- mapInfo.traceLayers.forEach(function(l) {
- var info = mapInfo.layers[l];
+ function getStyle(gd, mode, prop) {
+ var mapInfo = getMapInfo(gd), values = [];
- if(l.indexOf(mode) === -1) return;
+ mapInfo.traceLayers.forEach(function(l) {
+ var info = mapInfo.layers[l];
- values.push(info.paint[prop]);
- });
+ if (l.indexOf(mode) === -1) return;
- return values;
- }
+ values.push(info.paint[prop]);
+ });
- function getGeoJsonData(gd, mode) {
- var mapInfo = getMapInfo(gd),
- out = [];
+ return values;
+ }
- mapInfo.traceSources.forEach(function(s) {
- var info = mapInfo.sources[s];
+ function getGeoJsonData(gd, mode) {
+ var mapInfo = getMapInfo(gd), out = [];
- if(s.indexOf(mode) === -1) return;
+ mapInfo.traceSources.forEach(function(s) {
+ var info = mapInfo.sources[s];
- out.push(info._data);
- });
+ if (s.indexOf(mode) === -1) return;
- return out;
- }
+ out.push(info._data);
+ });
- function _mouseEvent(type, pos, cb) {
- return new Promise(function(resolve) {
- mouseEvent(type, pos[0], pos[1]);
+ return out;
+ }
- setTimeout(function() {
- cb();
- resolve();
- }, MOUSE_DELAY);
- });
- }
+ function _mouseEvent(type, pos, cb) {
+ return new Promise(function(resolve) {
+ mouseEvent(type, pos[0], pos[1]);
+ setTimeout(
+ function() {
+ cb();
+ resolve();
+ },
+ MOUSE_DELAY
+ );
+ });
+ }
});
diff --git a/test/jasmine/tests/modebar_test.js b/test/jasmine/tests/modebar_test.js
index b3be9a51b43..e3723e9c851 100644
--- a/test/jasmine/tests/modebar_test.js
+++ b/test/jasmine/tests/modebar_test.js
@@ -1,850 +1,897 @@
-var d3 = require('d3');
-
-var createModeBar = require('@src/components/modebar/modebar');
-var manageModeBar = require('@src/components/modebar/manage');
-var customMatchers = require('../assets/custom_matchers');
-
-var Plotly = require('@lib/index');
-var Plots = require('@src/plots/plots');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var selectButton = require('../assets/modebar_button');
-
-
-describe('ModeBar', function() {
- 'use strict';
-
- function noop() {}
-
- function getMockContainerTree() {
- var root = document.createElement('div');
- root.className = 'plot-container';
- var parent = document.createElement('div');
- parent.className = 'svg-container';
- root.appendChild(parent);
+var d3 = require("d3");
+
+var createModeBar = require("@src/components/modebar/modebar");
+var manageModeBar = require("@src/components/modebar/manage");
+var customMatchers = require("../assets/custom_matchers");
+
+var Plotly = require("@lib/index");
+var Plots = require("@src/plots/plots");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var selectButton = require("../assets/modebar_button");
+
+describe("ModeBar", function() {
+ "use strict";
+ function noop() {}
+
+ function getMockContainerTree() {
+ var root = document.createElement("div");
+ root.className = "plot-container";
+ var parent = document.createElement("div");
+ parent.className = "svg-container";
+ root.appendChild(parent);
+
+ return parent;
+ }
+
+ function getMockGraphInfo() {
+ return {
+ _fullLayout: {
+ dragmode: "zoom",
+ _paperdiv: d3.select(getMockContainerTree()),
+ _has: Plots._hasPlotType
+ },
+ _fullData: [],
+ _context: {
+ displaylogo: true,
+ displayModeBar: true,
+ modeBarButtonsToRemove: [],
+ modeBarButtonsToAdd: []
+ }
+ };
+ }
+
+ function countGroups(modeBar) {
+ return d3.select(modeBar.element).selectAll("div.modebar-group")[0].length;
+ }
+
+ function countButtons(modeBar) {
+ return d3.select(modeBar.element).selectAll("a.modebar-btn")[0].length;
+ }
+
+ function countLogo(modeBar) {
+ return d3.select(modeBar.element).selectAll("a.plotlyjsicon")[0].length;
+ }
+
+ function checkBtnAttr(modeBar, index, attr) {
+ var buttons = d3.select(modeBar.element).selectAll("a.modebar-btn");
+ return d3.select(buttons[0][index]).attr(attr);
+ }
+
+ var buttons = [
+ [{ name: "button 1", click: noop }, { name: "button 2", click: noop }]
+ ];
+
+ var modeBar = createModeBar(getMockGraphInfo(), buttons);
+
+ describe("createModebar", function() {
+ it("creates a mode bar", function() {
+ expect(countGroups(modeBar)).toEqual(2);
+ expect(countButtons(modeBar)).toEqual(3);
+ expect(countLogo(modeBar)).toEqual(1);
+ });
- return parent;
- }
+ it("throws when button config does not have name", function() {
+ expect(function() {
+ createModeBar(getMockGraphInfo(), [
+ [
+ {
+ click: function() {
+ console.log("not gonna work");
+ }
+ }
+ ]
+ ]);
+ }).toThrowError();
+ });
- function getMockGraphInfo() {
- return {
- _fullLayout: {
- dragmode: 'zoom',
- _paperdiv: d3.select(getMockContainerTree()),
- _has: Plots._hasPlotType
+ it("throws when button name is not unique", function() {
+ expect(function() {
+ createModeBar(getMockGraphInfo(), [
+ [
+ {
+ name: "A",
+ click: function() {
+ console.log("not gonna");
+ }
},
- _fullData: [],
- _context: {
- displaylogo: true,
- displayModeBar: true,
- modeBarButtonsToRemove: [],
- modeBarButtonsToAdd: []
+ {
+ name: "A",
+ click: function() {
+ console.log("... work");
+ }
}
- };
- }
-
- function countGroups(modeBar) {
- return d3.select(modeBar.element).selectAll('div.modebar-group')[0].length;
- }
-
- function countButtons(modeBar) {
- return d3.select(modeBar.element).selectAll('a.modebar-btn')[0].length;
- }
-
- function countLogo(modeBar) {
- return d3.select(modeBar.element).selectAll('a.plotlyjsicon')[0].length;
- }
-
- function checkBtnAttr(modeBar, index, attr) {
- var buttons = d3.select(modeBar.element).selectAll('a.modebar-btn');
- return d3.select(buttons[0][index]).attr(attr);
- }
-
- var buttons = [[{
- name: 'button 1',
- click: noop
- }, {
- name: 'button 2',
- click: noop
- }]];
-
- var modeBar = createModeBar(getMockGraphInfo(), buttons);
-
- describe('createModebar', function() {
- it('creates a mode bar', function() {
- expect(countGroups(modeBar)).toEqual(2);
- expect(countButtons(modeBar)).toEqual(3);
- expect(countLogo(modeBar)).toEqual(1);
- });
-
- it('throws when button config does not have name', function() {
- expect(function() {
- createModeBar(getMockGraphInfo(), [[
- { click: function() { console.log('not gonna work'); } }
- ]]);
- }).toThrowError();
- });
-
- it('throws when button name is not unique', function() {
- expect(function() {
- createModeBar(getMockGraphInfo(), [[
- { name: 'A', click: function() { console.log('not gonna'); } },
- { name: 'A', click: function() { console.log('... work'); } }
- ]]);
- }).toThrowError();
- });
+ ]
+ ]);
+ }).toThrowError();
+ });
- it('throws when button config does not have a click handler', function() {
- expect(function() {
- createModeBar(getMockGraphInfo(), [[
- { name: 'not gonna work' }
- ]]);
- }).toThrowError();
- });
+ it("throws when button config does not have a click handler", function() {
+ expect(function() {
+ createModeBar(getMockGraphInfo(), [[{ name: "not gonna work" }]]);
+ }).toThrowError();
+ });
- it('defaults title to name when missing', function() {
- var modeBar = createModeBar(getMockGraphInfo(), [[
- { name: 'the title too', click: noop }
- ]]);
+ it("defaults title to name when missing", function() {
+ var modeBar = createModeBar(getMockGraphInfo(), [
+ [{ name: "the title too", click: noop }]
+ ]);
- expect(checkBtnAttr(modeBar, 0, 'data-title')).toEqual('the title too');
- });
+ expect(checkBtnAttr(modeBar, 0, "data-title")).toEqual("the title too");
+ });
- it('hides title to when title is falsy but not 0', function() {
- var modeBar;
+ it("hides title to when title is falsy but not 0", function() {
+ var modeBar;
- modeBar = createModeBar(getMockGraphInfo(), [[
- { name: 'button', title: null, click: noop }
- ]]);
- expect(checkBtnAttr(modeBar, 0, 'data-title')).toBe(null);
+ modeBar = createModeBar(getMockGraphInfo(), [
+ [{ name: "button", title: null, click: noop }]
+ ]);
+ expect(checkBtnAttr(modeBar, 0, "data-title")).toBe(null);
- modeBar = createModeBar(getMockGraphInfo(), [[
- { name: 'button', title: '', click: noop }
- ]]);
- expect(checkBtnAttr(modeBar, 0, 'data-title')).toBe(null);
+ modeBar = createModeBar(getMockGraphInfo(), [
+ [{ name: "button", title: "", click: noop }]
+ ]);
+ expect(checkBtnAttr(modeBar, 0, "data-title")).toBe(null);
- modeBar = createModeBar(getMockGraphInfo(), [[
- { name: 'button', title: false, click: noop }
- ]]);
- expect(checkBtnAttr(modeBar, 0, 'data-title')).toBe(null);
+ modeBar = createModeBar(getMockGraphInfo(), [
+ [{ name: "button", title: false, click: noop }]
+ ]);
+ expect(checkBtnAttr(modeBar, 0, "data-title")).toBe(null);
- modeBar = createModeBar(getMockGraphInfo(), [[
- { name: 'button', title: 0, click: noop }
- ]]);
- expect(checkBtnAttr(modeBar, 0, 'data-title')).toEqual('0');
- });
+ modeBar = createModeBar(getMockGraphInfo(), [
+ [{ name: "button", title: 0, click: noop }]
+ ]);
+ expect(checkBtnAttr(modeBar, 0, "data-title")).toEqual("0");
});
+ });
- describe('modeBar.removeAllButtons', function() {
- it('removes all mode bar buttons', function() {
- modeBar.removeAllButtons();
+ describe("modeBar.removeAllButtons", function() {
+ it("removes all mode bar buttons", function() {
+ modeBar.removeAllButtons();
- expect(modeBar.element.innerHTML).toEqual('');
- expect(modeBar.hasLogo).toBe(false);
- });
+ expect(modeBar.element.innerHTML).toEqual("");
+ expect(modeBar.hasLogo).toBe(false);
});
+ });
- describe('modeBar.destroy', function() {
- it('removes the mode bar entirely', function() {
- var modeBarParent = modeBar.element.parentNode;
+ describe("modeBar.destroy", function() {
+ it("removes the mode bar entirely", function() {
+ var modeBarParent = modeBar.element.parentNode;
- modeBar.destroy();
+ modeBar.destroy();
- expect(modeBarParent.querySelector('.modebar')).toBeNull();
- });
+ expect(modeBarParent.querySelector(".modebar")).toBeNull();
});
-
- describe('manageModeBar', function() {
-
- function getButtons(list) {
- for(var i = 0; i < list.length; i++) {
- for(var j = 0; j < list[i].length; j++) {
-
- // minimal button config object
- list[i][j] = { name: list[i][j], click: noop };
- }
- }
- return list;
+ });
+
+ describe("manageModeBar", function() {
+ function getButtons(list) {
+ for (var i = 0; i < list.length; i++) {
+ for (var j = 0; j < list[i].length; j++) {
+ // minimal button config object
+ list[i][j] = { name: list[i][j], click: noop };
}
+ }
+ return list;
+ }
- function checkButtons(modeBar, buttons, logos) {
- var expectedGroupCount = buttons.length + logos;
- var expectedButtonCount = logos;
- buttons.forEach(function(group) {
- expectedButtonCount += group.length;
- });
-
- expect(modeBar.hasButtons(buttons)).toBe(true);
- expect(countGroups(modeBar)).toEqual(expectedGroupCount);
- expect(countButtons(modeBar)).toEqual(expectedButtonCount);
- expect(countLogo(modeBar)).toEqual(1);
- }
+ function checkButtons(modeBar, buttons, logos) {
+ var expectedGroupCount = buttons.length + logos;
+ var expectedButtonCount = logos;
+ buttons.forEach(function(group) {
+ expectedButtonCount += group.length;
+ });
+
+ expect(modeBar.hasButtons(buttons)).toBe(true);
+ expect(countGroups(modeBar)).toEqual(expectedGroupCount);
+ expect(countButtons(modeBar)).toEqual(expectedButtonCount);
+ expect(countLogo(modeBar)).toEqual(1);
+ }
- it('creates mode bar (unselectable cartesian version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['zoom2d', 'pan2d'],
- ['zoomIn2d', 'zoomOut2d', 'autoScale2d', 'resetScale2d'],
- ['hoverClosestCartesian', 'hoverCompareCartesian']
- ]);
+ it("creates mode bar (unselectable cartesian version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["zoom2d", "pan2d"],
+ ["zoomIn2d", "zoomOut2d", "autoScale2d", "resetScale2d"],
+ ["hoverClosestCartesian", "hoverCompareCartesian"]
+ ]);
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'cartesian' }];
- gd._fullLayout.xaxis = {fixedrange: false};
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [{ name: "cartesian" }];
+ gd._fullLayout.xaxis = { fixedrange: false };
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- checkButtons(modeBar, buttons, 1);
- });
+ checkButtons(modeBar, buttons, 1);
+ });
- it('creates mode bar (selectable cartesian version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['zoom2d', 'pan2d', 'select2d', 'lasso2d'],
- ['zoomIn2d', 'zoomOut2d', 'autoScale2d', 'resetScale2d'],
- ['hoverClosestCartesian', 'hoverCompareCartesian']
- ]);
+ it("creates mode bar (selectable cartesian version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["zoom2d", "pan2d", "select2d", "lasso2d"],
+ ["zoomIn2d", "zoomOut2d", "autoScale2d", "resetScale2d"],
+ ["hoverClosestCartesian", "hoverCompareCartesian"]
+ ]);
+
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [{ name: "cartesian" }];
+ gd._fullLayout.xaxis = { fixedrange: false };
+ gd._fullData = [
+ {
+ type: "scatter",
+ visible: true,
+ mode: "markers",
+ _module: { selectPoints: true }
+ }
+ ];
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'cartesian' }];
- gd._fullLayout.xaxis = {fixedrange: false};
- gd._fullData = [{
- type: 'scatter',
- visible: true,
- mode: 'markers',
- _module: {selectPoints: true}
- }];
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ checkButtons(modeBar, buttons, 1);
+ });
- checkButtons(modeBar, buttons, 1);
- });
+ it("creates mode bar (cartesian fixed-axes version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["hoverClosestCartesian", "hoverCompareCartesian"]
+ ]);
- it('creates mode bar (cartesian fixed-axes version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['hoverClosestCartesian', 'hoverCompareCartesian']
- ]);
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [{ name: "cartesian" }];
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'cartesian' }];
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ checkButtons(modeBar, buttons, 1);
+ });
- checkButtons(modeBar, buttons, 1);
- });
+ it("creates mode bar (gl3d version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["zoom3d", "pan3d", "orbitRotation", "tableRotation"],
+ ["resetCameraDefault3d", "resetCameraLastSave3d"],
+ ["hoverClosest3d"]
+ ]);
- it('creates mode bar (gl3d version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['zoom3d', 'pan3d', 'orbitRotation', 'tableRotation'],
- ['resetCameraDefault3d', 'resetCameraLastSave3d'],
- ['hoverClosest3d']
- ]);
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [{ name: "gl3d" }];
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'gl3d' }];
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ checkButtons(modeBar, buttons, 1);
+ });
- checkButtons(modeBar, buttons, 1);
- });
+ it("creates mode bar (geo version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["zoomInGeo", "zoomOutGeo", "resetGeo"],
+ ["hoverClosestGeo"]
+ ]);
- it('creates mode bar (geo version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['zoomInGeo', 'zoomOutGeo', 'resetGeo'],
- ['hoverClosestGeo']
- ]);
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [{ name: "geo" }];
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'geo' }];
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ checkButtons(modeBar, buttons, 1);
+ });
- checkButtons(modeBar, buttons, 1);
- });
+ it("creates mode bar (gl2d version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["zoom2d", "pan2d"],
+ ["zoomIn2d", "zoomOut2d", "autoScale2d", "resetScale2d"],
+ ["hoverClosestGl2d"]
+ ]);
- it('creates mode bar (gl2d version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['zoom2d', 'pan2d'],
- ['zoomIn2d', 'zoomOut2d', 'autoScale2d', 'resetScale2d'],
- ['hoverClosestGl2d']
- ]);
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [{ name: "gl2d" }];
+ gd._fullLayout.xaxis = { fixedrange: false };
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'gl2d' }];
- gd._fullLayout.xaxis = {fixedrange: false};
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ checkButtons(modeBar, buttons, 1);
+ });
- checkButtons(modeBar, buttons, 1);
- });
+ it("creates mode bar (pie version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["hoverClosestPie"]
+ ]);
- it('creates mode bar (pie version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['hoverClosestPie']
- ]);
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [{ name: "pie" }];
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'pie' }];
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ checkButtons(modeBar, buttons, 1);
+ });
- checkButtons(modeBar, buttons, 1);
- });
+ it("creates mode bar (cartesian + gl3d version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["resetViews", "toggleHover"]
+ ]);
- it('creates mode bar (cartesian + gl3d version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['resetViews', 'toggleHover']
- ]);
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [
+ { name: "cartesian" },
+ { name: "gl3d" }
+ ];
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'cartesian' }, { name: 'gl3d' }];
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ checkButtons(modeBar, buttons, 1);
+ });
- checkButtons(modeBar, buttons, 1);
- });
+ it("creates mode bar (cartesian + geo version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["resetViews", "toggleHover"]
+ ]);
- it('creates mode bar (cartesian + geo version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['resetViews', 'toggleHover']
- ]);
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [
+ { name: "cartesian" },
+ { name: "geo" }
+ ];
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'cartesian' }, { name: 'geo' }];
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ checkButtons(modeBar, buttons, 1);
+ });
- checkButtons(modeBar, buttons, 1);
- });
+ it("creates mode bar (cartesian + pie version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["zoom2d", "pan2d", "select2d", "lasso2d"],
+ ["zoomIn2d", "zoomOut2d", "autoScale2d", "resetScale2d"],
+ ["toggleHover"]
+ ]);
+
+ var gd = getMockGraphInfo();
+ gd._fullData = [
+ {
+ type: "scatter",
+ visible: true,
+ mode: "markers",
+ _module: { selectPoints: true }
+ }
+ ];
+ gd._fullLayout.xaxis = { fixedrange: false };
+ gd._fullLayout._basePlotModules = [
+ { name: "cartesian" },
+ { name: "pie" }
+ ];
- it('creates mode bar (cartesian + pie version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['zoom2d', 'pan2d', 'select2d', 'lasso2d'],
- ['zoomIn2d', 'zoomOut2d', 'autoScale2d', 'resetScale2d'],
- ['toggleHover']
- ]);
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- var gd = getMockGraphInfo();
- gd._fullData = [{
- type: 'scatter',
- visible: true,
- mode: 'markers',
- _module: {selectPoints: true}
- }];
- gd._fullLayout.xaxis = {fixedrange: false};
- gd._fullLayout._basePlotModules = [{ name: 'cartesian' }, { name: 'pie' }];
+ checkButtons(modeBar, buttons, 1);
+ });
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ it("creates mode bar (gl3d + geo version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["resetViews", "toggleHover"]
+ ]);
- checkButtons(modeBar, buttons, 1);
- });
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [{ name: "geo" }, { name: "gl3d" }];
- it('creates mode bar (gl3d + geo version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['resetViews', 'toggleHover']
- ]);
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'geo' }, { name: 'gl3d' }];
+ checkButtons(modeBar, buttons, 1);
+ });
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ it("creates mode bar (un-selectable ternary version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["zoom2d", "pan2d"]
+ ]);
- checkButtons(modeBar, buttons, 1);
- });
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [{ name: "ternary" }];
- it('creates mode bar (un-selectable ternary version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['zoom2d', 'pan2d']
- ]);
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'ternary' }];
+ checkButtons(modeBar, buttons, 1);
+ });
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ it("creates mode bar (selectable ternary version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["zoom2d", "pan2d", "select2d", "lasso2d"]
+ ]);
+
+ var gd = getMockGraphInfo();
+ gd._fullData = [
+ {
+ type: "scatterternary",
+ visible: true,
+ mode: "markers",
+ _module: { selectPoints: true }
+ }
+ ];
+ gd._fullLayout._basePlotModules = [{ name: "ternary" }];
- checkButtons(modeBar, buttons, 1);
- });
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- it('creates mode bar (selectable ternary version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['zoom2d', 'pan2d', 'select2d', 'lasso2d']
- ]);
+ checkButtons(modeBar, buttons, 1);
+ });
- var gd = getMockGraphInfo();
- gd._fullData = [{
- type: 'scatterternary',
- visible: true,
- mode: 'markers',
- _module: {selectPoints: true}
- }];
- gd._fullLayout._basePlotModules = [{ name: 'ternary' }];
+ it("creates mode bar (ternary + cartesian version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["zoom2d", "pan2d"],
+ ["hoverClosestCartesian", "hoverCompareCartesian"]
+ ]);
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [
+ { name: "ternary" },
+ { name: "cartesian" }
+ ];
- checkButtons(modeBar, buttons, 1);
- });
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- it('creates mode bar (ternary + cartesian version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['zoom2d', 'pan2d'],
- ['hoverClosestCartesian', 'hoverCompareCartesian']
- ]);
+ checkButtons(modeBar, buttons, 1);
+ });
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'ternary' }, { name: 'cartesian' }];
+ it("creates mode bar (ternary + gl3d version)", function() {
+ var buttons = getButtons([
+ ["toImage", "sendDataToCloud"],
+ ["resetViews", "toggleHover"]
+ ]);
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [{ name: "ternary" }, { name: "gl3d" }];
- checkButtons(modeBar, buttons, 1);
- });
+ manageModeBar(gd);
+ var modeBar = gd._fullLayout._modeBar;
- it('creates mode bar (ternary + gl3d version)', function() {
- var buttons = getButtons([
- ['toImage', 'sendDataToCloud'],
- ['resetViews', 'toggleHover']
- ]);
+ checkButtons(modeBar, buttons, 1);
+ });
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'ternary' }, { name: 'gl3d' }];
+ it("throws an error if modeBarButtonsToRemove isn't an array", function() {
+ var gd = getMockGraphInfo();
+ gd._context.modeBarButtonsToRemove = "not gonna work";
- manageModeBar(gd);
- var modeBar = gd._fullLayout._modeBar;
+ expect(function() {
+ manageModeBar(gd);
+ }).toThrowError();
+ });
- checkButtons(modeBar, buttons, 1);
- });
+ it("throws an error if modeBarButtonsToAdd isn't an array", function() {
+ var gd = getMockGraphInfo();
+ gd._context.modeBarButtonsToAdd = "not gonna work";
- it('throws an error if modeBarButtonsToRemove isn\'t an array', function() {
- var gd = getMockGraphInfo();
- gd._context.modeBarButtonsToRemove = 'not gonna work';
+ expect(function() {
+ manageModeBar(gd);
+ }).toThrowError();
+ });
- expect(function() { manageModeBar(gd); }).toThrowError();
- });
+ it(
+ "displays or not mode bar according to displayModeBar config arg",
+ function() {
+ var gd = getMockGraphInfo();
+ gd._context.displayModeBar = false;
+
+ manageModeBar(gd);
+ expect(gd._fullLayout._modeBar).not.toBeDefined();
+ }
+ );
+
+ it("updates mode bar according to displayModeBar config arg", function() {
+ var gd = getMockGraphInfo();
+ manageModeBar(gd);
+ expect(gd._fullLayout._modeBar).toBeDefined();
+
+ gd._context.displayModeBar = false;
+ manageModeBar(gd);
+ expect(gd._fullLayout._modeBar).not.toBeDefined();
+ });
- it('throws an error if modeBarButtonsToAdd isn\'t an array', function() {
- var gd = getMockGraphInfo();
- gd._context.modeBarButtonsToAdd = 'not gonna work';
+ it("displays or not logo according to displaylogo config arg", function() {
+ var gd = getMockGraphInfo();
+ manageModeBar(gd);
+ expect(countLogo(gd._fullLayout._modeBar)).toEqual(1);
- expect(function() { manageModeBar(gd); }).toThrowError();
- });
+ gd._context.displaylogo = false;
+ manageModeBar(gd);
+ expect(countLogo(gd._fullLayout._modeBar)).toEqual(0);
+ });
- it('displays or not mode bar according to displayModeBar config arg', function() {
- var gd = getMockGraphInfo();
- gd._context.displayModeBar = false;
+ // gives 11 buttons in 5 groups by default
+ function setupGraphInfo() {
+ var gd = getMockGraphInfo();
+ gd._fullLayout._basePlotModules = [{ name: "cartesian" }];
+ gd._fullLayout.xaxis = { fixedrange: false };
+ return gd;
+ }
- manageModeBar(gd);
- expect(gd._fullLayout._modeBar).not.toBeDefined();
- });
+ it("updates mode bar buttons if plot type changes", function() {
+ var gd = setupGraphInfo();
+ manageModeBar(gd);
- it('updates mode bar according to displayModeBar config arg', function() {
- var gd = getMockGraphInfo();
- manageModeBar(gd);
- expect(gd._fullLayout._modeBar).toBeDefined();
+ gd._fullLayout._basePlotModules = [{ name: "gl3d" }];
+ manageModeBar(gd);
- gd._context.displayModeBar = false;
- manageModeBar(gd);
- expect(gd._fullLayout._modeBar).not.toBeDefined();
- });
+ expect(countButtons(gd._fullLayout._modeBar)).toEqual(10);
+ });
- it('displays or not logo according to displaylogo config arg', function() {
- var gd = getMockGraphInfo();
- manageModeBar(gd);
- expect(countLogo(gd._fullLayout._modeBar)).toEqual(1);
+ it(
+ "updates mode bar buttons if modeBarButtonsToRemove changes",
+ function() {
+ var gd = setupGraphInfo();
+ manageModeBar(gd);
+ var initialButtonCount = countButtons(gd._fullLayout._modeBar);
+
+ gd._context.modeBarButtonsToRemove = ["toImage", "sendDataToCloud"];
+ manageModeBar(gd);
+
+ expect(countButtons(gd._fullLayout._modeBar)).toEqual(
+ initialButtonCount - 2
+ );
+ }
+ );
+
+ it("updates mode bar buttons if modeBarButtonsToAdd changes", function() {
+ var gd = setupGraphInfo();
+ manageModeBar(gd);
+
+ var initialGroupCount = countGroups(gd._fullLayout._modeBar),
+ initialButtonCount = countButtons(gd._fullLayout._modeBar);
+
+ gd._context.modeBarButtonsToAdd = [{ name: "some button", click: noop }];
+ manageModeBar(gd);
+
+ expect(countGroups(gd._fullLayout._modeBar)).toEqual(
+ initialGroupCount + 1
+ );
+ expect(countButtons(gd._fullLayout._modeBar)).toEqual(
+ initialButtonCount + 1
+ );
+ });
- gd._context.displaylogo = false;
- manageModeBar(gd);
- expect(countLogo(gd._fullLayout._modeBar)).toEqual(0);
- });
+ it(
+ "sets up buttons with modeBarButtonsToAdd and modeBarButtonToRemove",
+ function() {
+ var gd = setupGraphInfo();
+ gd._context.modeBarButtonsToRemove = [
+ "toImage",
+ "pan2d",
+ "hoverCompareCartesian"
+ ];
+ gd._context.modeBarButtonsToAdd = [
+ { name: "some button", click: noop },
+ { name: "some other button", click: noop }
+ ];
+
+ manageModeBar(gd);
+
+ var modeBar = gd._fullLayout._modeBar;
+ expect(countGroups(modeBar)).toEqual(6);
+ expect(countButtons(modeBar)).toEqual(10);
+ }
+ );
+
+ it(
+ "sets up buttons with modeBarButtonsToAdd and modeBarButtonToRemove (2)",
+ function() {
+ var gd = setupGraphInfo();
+ gd._context.modeBarButtonsToRemove = [
+ "toImage",
+ "pan2d",
+ "hoverCompareCartesian"
+ ];
+ gd._context.modeBarButtonsToAdd = [
+ [
+ { name: "some button", click: noop },
+ { name: "some other button", click: noop }
+ ],
+ [
+ { name: "some button 2", click: noop },
+ { name: "some other button 2", click: noop }
+ ]
+ ];
+
+ manageModeBar(gd);
+
+ var modeBar = gd._fullLayout._modeBar;
+ expect(countGroups(modeBar)).toEqual(7);
+ expect(countButtons(modeBar)).toEqual(12);
+ }
+ );
+
+ it("sets up buttons with fully custom modeBarButtons", function() {
+ var gd = setupGraphInfo();
+ gd._context.modeBarButtons = [
+ [
+ { name: "some button", click: noop },
+ { name: "some other button", click: noop }
+ ],
+ [
+ { name: "some button in another group", click: noop },
+ { name: "some other button in another group", click: noop }
+ ]
+ ];
+
+ manageModeBar(gd);
+
+ var modeBar = gd._fullLayout._modeBar;
+ expect(countGroups(modeBar)).toEqual(3);
+ expect(countButtons(modeBar)).toEqual(5);
+ });
- // gives 11 buttons in 5 groups by default
- function setupGraphInfo() {
- var gd = getMockGraphInfo();
- gd._fullLayout._basePlotModules = [{ name: 'cartesian' }];
- gd._fullLayout.xaxis = {fixedrange: false};
- return gd;
- }
+ it("sets up buttons with custom modeBarButtons + default name", function() {
+ var gd = setupGraphInfo();
+ gd._context.modeBarButtons = [
+ [
+ { name: "some button", click: noop },
+ { name: "some other button", click: noop }
+ ],
+ ["toImage", "pan2d", "hoverCompareCartesian"]
+ ];
+
+ manageModeBar(gd);
+
+ var modeBar = gd._fullLayout._modeBar;
+ expect(countGroups(modeBar)).toEqual(3);
+ expect(countButtons(modeBar)).toEqual(6);
+ });
- it('updates mode bar buttons if plot type changes', function() {
- var gd = setupGraphInfo();
- manageModeBar(gd);
+ it("throw error when modeBarButtons contains invalid name", function() {
+ var gd = setupGraphInfo();
+ gd._context.modeBarButtons = [["toImage", "pan2d", "no gonna work"]];
- gd._fullLayout._basePlotModules = [{ name: 'gl3d' }];
- manageModeBar(gd);
+ expect(function() {
+ manageModeBar(gd);
+ }).toThrowError();
+ });
+ });
- expect(countButtons(gd._fullLayout._modeBar)).toEqual(10);
- });
+ describe("modebar on clicks", function() {
+ var gd, modeBar;
- it('updates mode bar buttons if modeBarButtonsToRemove changes', function() {
- var gd = setupGraphInfo();
- manageModeBar(gd);
- var initialButtonCount = countButtons(gd._fullLayout._modeBar);
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
- gd._context.modeBarButtonsToRemove = ['toImage', 'sendDataToCloud'];
- manageModeBar(gd);
+ afterEach(destroyGraphDiv);
- expect(countButtons(gd._fullLayout._modeBar))
- .toEqual(initialButtonCount - 2);
- });
+ function assertRange(axName, expected) {
+ var PRECISION = 2;
- it('updates mode bar buttons if modeBarButtonsToAdd changes', function() {
- var gd = setupGraphInfo();
- manageModeBar(gd);
+ var ax = gd._fullLayout[axName];
+ var actual = ax.range;
- var initialGroupCount = countGroups(gd._fullLayout._modeBar),
- initialButtonCount = countButtons(gd._fullLayout._modeBar);
+ if (ax.type === "date") {
+ var truncate = function(v) {
+ return v.substr(0, 10);
+ };
+ expect(actual.map(truncate)).toEqual(expected.map(truncate), axName);
+ } else {
+ expect(actual).toBeCloseToArray(expected, PRECISION, axName);
+ }
+ }
- gd._context.modeBarButtonsToAdd = [{
- name: 'some button',
- click: noop
- }];
- manageModeBar(gd);
+ function assertActive(buttons, activeButton) {
+ for (var i = 0; i < buttons.length; i++) {
+ expect(buttons[i].isActive()).toBe(buttons[i] === activeButton);
+ }
+ }
- expect(countGroups(gd._fullLayout._modeBar))
- .toEqual(initialGroupCount + 1);
- expect(countButtons(gd._fullLayout._modeBar))
- .toEqual(initialButtonCount + 1);
- });
+ describe("cartesian handlers", function() {
+ beforeEach(function(done) {
+ var mockData = [
+ {
+ type: "scatter",
+ x: ["2016-01-01", "2016-02-01", "2016-03-01"],
+ y: [10, 100, 1000]
+ },
+ {
+ type: "bar",
+ x: ["a", "b", "c"],
+ y: [2, 1, 2],
+ xaxis: "x2",
+ yaxis: "y2"
+ }
+ ];
+
+ var mockLayout = {
+ xaxis: {
+ anchor: "y",
+ domain: [0, 0.5],
+ range: ["2016-01-01", "2016-04-01"]
+ },
+ yaxis: { anchor: "x", type: "log", range: [1, 3] },
+ xaxis2: { anchor: "y2", domain: [0.5, 1], range: [-1, 4] },
+ yaxis2: { anchor: "x2", range: [0, 4] },
+ width: 600,
+ height: 500
+ };
- it('sets up buttons with modeBarButtonsToAdd and modeBarButtonToRemove', function() {
- var gd = setupGraphInfo();
- gd._context.modeBarButtonsToRemove = [
- 'toImage', 'pan2d', 'hoverCompareCartesian'
- ];
- gd._context.modeBarButtonsToAdd = [
- { name: 'some button', click: noop },
- { name: 'some other button', click: noop }
- ];
-
- manageModeBar(gd);
-
- var modeBar = gd._fullLayout._modeBar;
- expect(countGroups(modeBar)).toEqual(6);
- expect(countButtons(modeBar)).toEqual(10);
- });
+ gd = createGraphDiv();
+ Plotly.plot(gd, mockData, mockLayout).then(function() {
+ modeBar = gd._fullLayout._modeBar;
+ done();
+ });
+ });
+
+ describe(
+ "buttons zoomIn2d, zoomOut2d, autoScale2d and resetScale2d",
+ function() {
+ it("should update axis ranges", function() {
+ var buttonZoomIn = selectButton(modeBar, "zoomIn2d"),
+ buttonZoomOut = selectButton(modeBar, "zoomOut2d"),
+ buttonAutoScale = selectButton(modeBar, "autoScale2d"),
+ buttonResetScale = selectButton(modeBar, "resetScale2d");
+
+ assertRange("xaxis", ["2016-01-01", "2016-04-01"]);
+ assertRange("yaxis", [1, 3]);
+ assertRange("xaxis2", [-1, 4]);
+ assertRange("yaxis2", [0, 4]);
+
+ buttonZoomIn.click();
+ assertRange("xaxis", ["2016-01-23 17:45", "2016-03-09 05:15"]);
+ assertRange("yaxis", [1.5, 2.5]);
+ assertRange("xaxis2", [0.25, 2.75]);
+ assertRange("yaxis2", [1, 3]);
+
+ buttonZoomOut.click();
+ assertRange("xaxis", ["2016-01-01", "2016-04-01"]);
+ assertRange("yaxis", [1, 3]);
+ assertRange("xaxis2", [-1, 4]);
+ assertRange("yaxis2", [0, 4]);
+
+ buttonZoomIn.click();
+ buttonAutoScale.click();
+ assertRange("xaxis", [
+ "2015-12-27 06:36:39.6661",
+ "2016-03-05 17:23:20.3339"
+ ]);
+ assertRange("yaxis", [0.8591, 3.1408]);
+ assertRange("xaxis2", [-0.5, 2.5]);
+ assertRange("yaxis2", [0, 2.105263]);
+
+ buttonResetScale.click();
+ assertRange("xaxis", ["2016-01-01", "2016-04-01"]);
+ assertRange("yaxis", [1, 3]);
+ assertRange("xaxis2", [-1, 4]);
+ assertRange("yaxis2", [0, 4]);
+ });
+ }
+ );
+
+ describe("buttons zoom2d, pan2d, select2d and lasso2d", function() {
+ it("should update the layout dragmode", function() {
+ var zoom2d = selectButton(modeBar, "zoom2d"),
+ pan2d = selectButton(modeBar, "pan2d"),
+ select2d = selectButton(modeBar, "select2d"),
+ lasso2d = selectButton(modeBar, "lasso2d"),
+ buttons = [zoom2d, pan2d, select2d, lasso2d];
+
+ expect(gd._fullLayout.dragmode).toBe("zoom");
+ assertActive(buttons, zoom2d);
+
+ pan2d.click();
+ expect(gd._fullLayout.dragmode).toBe("pan");
+ assertActive(buttons, pan2d);
+
+ select2d.click();
+ expect(gd._fullLayout.dragmode).toBe("select");
+ assertActive(buttons, select2d);
+
+ lasso2d.click();
+ expect(gd._fullLayout.dragmode).toBe("lasso");
+ assertActive(buttons, lasso2d);
+
+ zoom2d.click();
+ expect(gd._fullLayout.dragmode).toBe("zoom");
+ assertActive(buttons, zoom2d);
+ });
+ });
+
+ describe(
+ "buttons hoverCompareCartesian and hoverClosestCartesian ",
+ function() {
+ it("should update layout hovermode", function() {
+ var buttonCompare = selectButton(modeBar, "hoverCompareCartesian"),
+ buttonClosest = selectButton(modeBar, "hoverClosestCartesian"),
+ buttons = [buttonCompare, buttonClosest];
+
+ expect(gd._fullLayout.hovermode).toBe("x");
+ assertActive(buttons, buttonCompare);
+
+ buttonClosest.click();
+ expect(gd._fullLayout.hovermode).toBe("closest");
+ assertActive(buttons, buttonClosest);
+
+ buttonCompare.click();
+ expect(gd._fullLayout.hovermode).toBe("x");
+ assertActive(buttons, buttonCompare);
+ });
+ }
+ );
+ });
- it('sets up buttons with modeBarButtonsToAdd and modeBarButtonToRemove (2)', function() {
- var gd = setupGraphInfo();
- gd._context.modeBarButtonsToRemove = [
- 'toImage', 'pan2d', 'hoverCompareCartesian'
- ];
- gd._context.modeBarButtonsToAdd = [[
- { name: 'some button', click: noop },
- { name: 'some other button', click: noop }
- ], [
- { name: 'some button 2', click: noop },
- { name: 'some other button 2', click: noop }
- ]];
-
- manageModeBar(gd);
-
- var modeBar = gd._fullLayout._modeBar;
- expect(countGroups(modeBar)).toEqual(7);
- expect(countButtons(modeBar)).toEqual(12);
- });
+ describe("pie handlers", function() {
+ beforeEach(function(done) {
+ var mockData = [
+ {
+ type: "pie",
+ labels: ["apples", "bananas", "grapes"],
+ values: [10, 20, 30]
+ }
+ ];
- it('sets up buttons with fully custom modeBarButtons', function() {
- var gd = setupGraphInfo();
- gd._context.modeBarButtons = [[
- { name: 'some button', click: noop },
- { name: 'some other button', click: noop }
- ], [
- { name: 'some button in another group', click: noop },
- { name: 'some other button in another group', click: noop }
- ]];
-
- manageModeBar(gd);
-
- var modeBar = gd._fullLayout._modeBar;
- expect(countGroups(modeBar)).toEqual(3);
- expect(countButtons(modeBar)).toEqual(5);
+ gd = createGraphDiv();
+ Plotly.plot(gd, mockData).then(function() {
+ modeBar = gd._fullLayout._modeBar;
+ done();
});
+ });
- it('sets up buttons with custom modeBarButtons + default name', function() {
- var gd = setupGraphInfo();
- gd._context.modeBarButtons = [[
- { name: 'some button', click: noop },
- { name: 'some other button', click: noop }
- ], [
- 'toImage', 'pan2d', 'hoverCompareCartesian'
- ]];
+ describe("buttons hoverClosestPie", function() {
+ it("should update layout hovermode", function() {
+ var button = selectButton(modeBar, "hoverClosestPie");
- manageModeBar(gd);
+ expect(gd._fullLayout.hovermode).toBe("closest");
+ expect(button.isActive()).toBe(true);
- var modeBar = gd._fullLayout._modeBar;
- expect(countGroups(modeBar)).toEqual(3);
- expect(countButtons(modeBar)).toEqual(6);
- });
+ button.click();
+ expect(gd._fullLayout.hovermode).toBe(false);
+ expect(button.isActive()).toBe(false);
- it('throw error when modeBarButtons contains invalid name', function() {
- var gd = setupGraphInfo();
- gd._context.modeBarButtons = [[
- 'toImage', 'pan2d', 'no gonna work'
- ]];
-
- expect(function() { manageModeBar(gd); }).toThrowError();
+ button.click();
+ expect(gd._fullLayout.hovermode).toBe("closest");
+ expect(button.isActive()).toBe(true);
});
-
+ });
});
- describe('modebar on clicks', function() {
- var gd, modeBar;
+ describe("geo handlers", function() {
+ beforeEach(function(done) {
+ var mockData = [
+ { type: "scattergeo", lon: [10, 20, 30], lat: [10, 20, 30] }
+ ];
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
+ gd = createGraphDiv();
+ Plotly.plot(gd, mockData).then(function() {
+ modeBar = gd._fullLayout._modeBar;
+ done();
});
+ });
- afterEach(destroyGraphDiv);
+ describe("buttons hoverClosestGeo", function() {
+ it("should update layout hovermode", function() {
+ var button = selectButton(modeBar, "hoverClosestGeo");
- function assertRange(axName, expected) {
- var PRECISION = 2;
+ expect(gd._fullLayout.hovermode).toBe("closest");
+ expect(button.isActive()).toBe(true);
- var ax = gd._fullLayout[axName];
- var actual = ax.range;
+ button.click();
+ expect(gd._fullLayout.hovermode).toBe(false);
+ expect(button.isActive()).toBe(false);
- if(ax.type === 'date') {
- var truncate = function(v) { return v.substr(0, 10); };
- expect(actual.map(truncate)).toEqual(expected.map(truncate), axName);
- }
- else {
- expect(actual).toBeCloseToArray(expected, PRECISION, axName);
- }
- }
-
- function assertActive(buttons, activeButton) {
- for(var i = 0; i < buttons.length; i++) {
- expect(buttons[i].isActive()).toBe(
- buttons[i] === activeButton
- );
- }
- }
-
- describe('cartesian handlers', function() {
-
- beforeEach(function(done) {
- var mockData = [{
- type: 'scatter',
- x: ['2016-01-01', '2016-02-01', '2016-03-01'],
- y: [10, 100, 1000],
- }, {
- type: 'bar',
- x: ['a', 'b', 'c'],
- y: [2, 1, 2],
- xaxis: 'x2',
- yaxis: 'y2'
- }];
-
- var mockLayout = {
- xaxis: {
- anchor: 'y',
- domain: [0, 0.5],
- range: ['2016-01-01', '2016-04-01']
- },
- yaxis: {
- anchor: 'x',
- type: 'log',
- range: [1, 3]
- },
- xaxis2: {
- anchor: 'y2',
- domain: [0.5, 1],
- range: [-1, 4]
- },
- yaxis2: {
- anchor: 'x2',
- range: [0, 4]
- },
- width: 600,
- height: 500
- };
-
- gd = createGraphDiv();
- Plotly.plot(gd, mockData, mockLayout).then(function() {
- modeBar = gd._fullLayout._modeBar;
- done();
- });
- });
-
- describe('buttons zoomIn2d, zoomOut2d, autoScale2d and resetScale2d', function() {
- it('should update axis ranges', function() {
- var buttonZoomIn = selectButton(modeBar, 'zoomIn2d'),
- buttonZoomOut = selectButton(modeBar, 'zoomOut2d'),
- buttonAutoScale = selectButton(modeBar, 'autoScale2d'),
- buttonResetScale = selectButton(modeBar, 'resetScale2d');
-
- assertRange('xaxis', ['2016-01-01', '2016-04-01']);
- assertRange('yaxis', [1, 3]);
- assertRange('xaxis2', [-1, 4]);
- assertRange('yaxis2', [0, 4]);
-
- buttonZoomIn.click();
- assertRange('xaxis', ['2016-01-23 17:45', '2016-03-09 05:15']);
- assertRange('yaxis', [1.5, 2.5]);
- assertRange('xaxis2', [0.25, 2.75]);
- assertRange('yaxis2', [1, 3]);
-
- buttonZoomOut.click();
- assertRange('xaxis', ['2016-01-01', '2016-04-01']);
- assertRange('yaxis', [1, 3]);
- assertRange('xaxis2', [-1, 4]);
- assertRange('yaxis2', [0, 4]);
-
- buttonZoomIn.click();
- buttonAutoScale.click();
- assertRange('xaxis', ['2015-12-27 06:36:39.6661', '2016-03-05 17:23:20.3339']);
- assertRange('yaxis', [0.8591, 3.1408]);
- assertRange('xaxis2', [-0.5, 2.5]);
- assertRange('yaxis2', [0, 2.105263]);
-
- buttonResetScale.click();
- assertRange('xaxis', ['2016-01-01', '2016-04-01']);
- assertRange('yaxis', [1, 3]);
- assertRange('xaxis2', [-1, 4]);
- assertRange('yaxis2', [0, 4]);
- });
- });
-
- describe('buttons zoom2d, pan2d, select2d and lasso2d', function() {
- it('should update the layout dragmode', function() {
- var zoom2d = selectButton(modeBar, 'zoom2d'),
- pan2d = selectButton(modeBar, 'pan2d'),
- select2d = selectButton(modeBar, 'select2d'),
- lasso2d = selectButton(modeBar, 'lasso2d'),
- buttons = [zoom2d, pan2d, select2d, lasso2d];
-
- expect(gd._fullLayout.dragmode).toBe('zoom');
- assertActive(buttons, zoom2d);
-
- pan2d.click();
- expect(gd._fullLayout.dragmode).toBe('pan');
- assertActive(buttons, pan2d);
-
- select2d.click();
- expect(gd._fullLayout.dragmode).toBe('select');
- assertActive(buttons, select2d);
-
- lasso2d.click();
- expect(gd._fullLayout.dragmode).toBe('lasso');
- assertActive(buttons, lasso2d);
-
- zoom2d.click();
- expect(gd._fullLayout.dragmode).toBe('zoom');
- assertActive(buttons, zoom2d);
- });
- });
-
- describe('buttons hoverCompareCartesian and hoverClosestCartesian ', function() {
- it('should update layout hovermode', function() {
- var buttonCompare = selectButton(modeBar, 'hoverCompareCartesian'),
- buttonClosest = selectButton(modeBar, 'hoverClosestCartesian'),
- buttons = [buttonCompare, buttonClosest];
-
- expect(gd._fullLayout.hovermode).toBe('x');
- assertActive(buttons, buttonCompare);
-
- buttonClosest.click();
- expect(gd._fullLayout.hovermode).toBe('closest');
- assertActive(buttons, buttonClosest);
-
- buttonCompare.click();
- expect(gd._fullLayout.hovermode).toBe('x');
- assertActive(buttons, buttonCompare);
- });
- });
+ button.click();
+ expect(gd._fullLayout.hovermode).toBe("closest");
+ expect(button.isActive()).toBe(true);
});
-
- describe('pie handlers', function() {
-
- beforeEach(function(done) {
- var mockData = [{
- type: 'pie',
- labels: ['apples', 'bananas', 'grapes'],
- values: [10, 20, 30]
- }];
-
- gd = createGraphDiv();
- Plotly.plot(gd, mockData).then(function() {
- modeBar = gd._fullLayout._modeBar;
- done();
- });
- });
-
- describe('buttons hoverClosestPie', function() {
- it('should update layout hovermode', function() {
- var button = selectButton(modeBar, 'hoverClosestPie');
-
- expect(gd._fullLayout.hovermode).toBe('closest');
- expect(button.isActive()).toBe(true);
-
- button.click();
- expect(gd._fullLayout.hovermode).toBe(false);
- expect(button.isActive()).toBe(false);
-
- button.click();
- expect(gd._fullLayout.hovermode).toBe('closest');
- expect(button.isActive()).toBe(true);
- });
- });
- });
-
- describe('geo handlers', function() {
-
- beforeEach(function(done) {
- var mockData = [{
- type: 'scattergeo',
- lon: [10, 20, 30],
- lat: [10, 20, 30]
- }];
-
- gd = createGraphDiv();
- Plotly.plot(gd, mockData).then(function() {
- modeBar = gd._fullLayout._modeBar;
- done();
- });
- });
-
- describe('buttons hoverClosestGeo', function() {
- it('should update layout hovermode', function() {
- var button = selectButton(modeBar, 'hoverClosestGeo');
-
- expect(gd._fullLayout.hovermode).toBe('closest');
- expect(button.isActive()).toBe(true);
-
- button.click();
- expect(gd._fullLayout.hovermode).toBe(false);
- expect(button.isActive()).toBe(false);
-
- button.click();
- expect(gd._fullLayout.hovermode).toBe('closest');
- expect(button.isActive()).toBe(true);
- });
- });
-
- });
-
+ });
});
+ });
});
diff --git a/test/jasmine/tests/plot_api_test.js b/test/jasmine/tests/plot_api_test.js
index e6deca855b0..084638b4823 100644
--- a/test/jasmine/tests/plot_api_test.js
+++ b/test/jasmine/tests/plot_api_test.js
@@ -1,1311 +1,1334 @@
-var Plotly = require('@lib/index');
-var PlotlyInternal = require('@src/plotly');
-var Plots = require('@src/plots/plots');
-var Lib = require('@src/lib');
-var Scatter = require('@src/traces/scatter');
-var Bar = require('@src/traces/bar');
-var Legend = require('@src/components/legend');
-var pkg = require('../../../package.json');
-var subroutines = require('@src/plot_api/subroutines');
-
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var fail = require('../assets/fail_test');
-
-
-describe('Test plot api', function() {
- 'use strict';
-
- describe('Plotly.version', function() {
- it('should be the same as in the package.json', function() {
- expect(Plotly.version).toEqual(pkg.version);
- });
+var Plotly = require("@lib/index");
+var PlotlyInternal = require("@src/plotly");
+var Plots = require("@src/plots/plots");
+var Lib = require("@src/lib");
+var Scatter = require("@src/traces/scatter");
+var Bar = require("@src/traces/bar");
+var Legend = require("@src/components/legend");
+var pkg = require("../../../package.json");
+var subroutines = require("@src/plot_api/subroutines");
+
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var fail = require("../assets/fail_test");
+
+describe("Test plot api", function() {
+ "use strict";
+ describe("Plotly.version", function() {
+ it("should be the same as in the package.json", function() {
+ expect(Plotly.version).toEqual(pkg.version);
});
+ });
- describe('Plotly.plot', function() {
- var gd;
-
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(destroyGraphDiv);
-
- it('accepts gd, data, layout, and config as args', function(done) {
- Plotly.plot(gd,
- [{x: [1, 2, 3], y: [1, 2, 3]}],
- {width: 500, height: 500},
- {editable: true}
- ).then(function() {
- expect(gd.layout.width).toEqual(500);
- expect(gd.layout.height).toEqual(500);
- expect(gd.data.length).toEqual(1);
- expect(gd._context.editable).toBe(true);
- }).catch(fail).then(done);
- });
-
- it('accepts gd and an object as args', function(done) {
- Plotly.plot(gd, {
- data: [{x: [1, 2, 3], y: [1, 2, 3]}],
- layout: {width: 500, height: 500},
- config: {editable: true},
- frames: [{y: [2, 1, 0], name: 'frame1'}]
- }).then(function() {
- expect(gd.layout.width).toEqual(500);
- expect(gd.layout.height).toEqual(500);
- expect(gd.data.length).toEqual(1);
- expect(gd._transitionData._frames.length).toEqual(1);
- expect(gd._context.editable).toBe(true);
- }).catch(fail).then(done);
- });
+ describe("Plotly.plot", function() {
+ var gd;
- it('allows adding more frames to the initial set', function(done) {
- Plotly.plot(gd, {
- data: [{x: [1, 2, 3], y: [1, 2, 3]}],
- layout: {width: 500, height: 500},
- config: {editable: true},
- frames: [{y: [7, 7, 7], name: 'frame1'}]
- }).then(function() {
- expect(gd.layout.width).toEqual(500);
- expect(gd.layout.height).toEqual(500);
- expect(gd.data.length).toEqual(1);
- expect(gd._transitionData._frames.length).toEqual(1);
- expect(gd._context.editable).toBe(true);
-
- return Plotly.addFrames(gd, [
- {y: [8, 8, 8], name: 'frame2'},
- {y: [9, 9, 9], name: 'frame3'}
- ]);
- }).then(function() {
- expect(gd._transitionData._frames.length).toEqual(3);
- expect(gd._transitionData._frames[0].name).toEqual('frame1');
- expect(gd._transitionData._frames[1].name).toEqual('frame2');
- expect(gd._transitionData._frames[2].name).toEqual('frame3');
- }).catch(fail).then(done);
- });
-
- it('should emit afterplot event after plotting is done', function(done) {
- var afterPlot = false;
-
- var promise = Plotly.plot(gd, [{ y: [2, 1, 2]}]);
-
- gd.on('plotly_afterplot', function() {
- afterPlot = true;
- });
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
- promise.then(function() {
- expect(afterPlot).toBe(true);
- })
- .then(done);
- });
+ afterEach(destroyGraphDiv);
+
+ it("accepts gd, data, layout, and config as args", function(done) {
+ Plotly.plot(
+ gd,
+ [{ x: [1, 2, 3], y: [1, 2, 3] }],
+ { width: 500, height: 500 },
+ { editable: true }
+ )
+ .then(function() {
+ expect(gd.layout.width).toEqual(500);
+ expect(gd.layout.height).toEqual(500);
+ expect(gd.data.length).toEqual(1);
+ expect(gd._context.editable).toBe(true);
+ })
+ .catch(fail)
+ .then(done);
});
- describe('Plotly.relayout', function() {
- var gd;
+ it("accepts gd and an object as args", function(done) {
+ Plotly.plot(gd, {
+ data: [{ x: [1, 2, 3], y: [1, 2, 3] }],
+ layout: { width: 500, height: 500 },
+ config: { editable: true },
+ frames: [{ y: [2, 1, 0], name: "frame1" }]
+ })
+ .then(function() {
+ expect(gd.layout.width).toEqual(500);
+ expect(gd.layout.height).toEqual(500);
+ expect(gd.data.length).toEqual(1);
+ expect(gd._transitionData._frames.length).toEqual(1);
+ expect(gd._context.editable).toBe(true);
+ })
+ .catch(fail)
+ .then(done);
+ });
- beforeEach(function() {
- gd = createGraphDiv();
- });
+ it("allows adding more frames to the initial set", function(done) {
+ Plotly.plot(gd, {
+ data: [{ x: [1, 2, 3], y: [1, 2, 3] }],
+ layout: { width: 500, height: 500 },
+ config: { editable: true },
+ frames: [{ y: [7, 7, 7], name: "frame1" }]
+ })
+ .then(function() {
+ expect(gd.layout.width).toEqual(500);
+ expect(gd.layout.height).toEqual(500);
+ expect(gd.data.length).toEqual(1);
+ expect(gd._transitionData._frames.length).toEqual(1);
+ expect(gd._context.editable).toBe(true);
+
+ return Plotly.addFrames(gd, [
+ { y: [8, 8, 8], name: "frame2" },
+ { y: [9, 9, 9], name: "frame3" }
+ ]);
+ })
+ .then(function() {
+ expect(gd._transitionData._frames.length).toEqual(3);
+ expect(gd._transitionData._frames[0].name).toEqual("frame1");
+ expect(gd._transitionData._frames[1].name).toEqual("frame2");
+ expect(gd._transitionData._frames[2].name).toEqual("frame3");
+ })
+ .catch(fail)
+ .then(done);
+ });
- afterEach(destroyGraphDiv);
+ it("should emit afterplot event after plotting is done", function(done) {
+ var afterPlot = false;
- it('should update the plot clipPath if the plot is resized', function(done) {
+ var promise = Plotly.plot(gd, [{ y: [2, 1, 2] }]);
- Plotly.plot(gd, [{ x: [1, 2, 3], y: [1, 2, 3] }], { width: 500, height: 500 })
- .then(function() {
- return Plotly.relayout(gd, { width: 400, height: 400 });
- })
- .then(function() {
- var uid = gd._fullLayout._uid;
+ gd.on("plotly_afterplot", function() {
+ afterPlot = true;
+ });
- var plotClip = document.getElementById('clip' + uid + 'xyplot'),
- clipRect = plotClip.children[0],
- clipWidth = +clipRect.getAttribute('width'),
- clipHeight = +clipRect.getAttribute('height');
+ promise
+ .then(function() {
+ expect(afterPlot).toBe(true);
+ })
+ .then(done);
+ });
+ });
- expect(clipWidth).toBe(240);
- expect(clipHeight).toBe(220);
- })
- .then(done);
- });
+ describe("Plotly.relayout", function() {
+ var gd;
- it('sets null values to their default', function(done) {
- var defaultWidth;
- Plotly.plot(gd, [{ x: [1, 2, 3], y: [1, 2, 3] }])
- .then(function() {
- defaultWidth = gd._fullLayout.width;
- return Plotly.relayout(gd, { width: defaultWidth - 25});
- })
- .then(function() {
- expect(gd._fullLayout.width).toBe(defaultWidth - 25);
- return Plotly.relayout(gd, { width: null });
- })
- .then(function() {
- expect(gd._fullLayout.width).toBe(defaultWidth);
- })
- .then(done);
- });
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
- it('ignores undefined values', function(done) {
- var defaultWidth;
- Plotly.plot(gd, [{ x: [1, 2, 3], y: [1, 2, 3] }])
- .then(function() {
- defaultWidth = gd._fullLayout.width;
- return Plotly.relayout(gd, { width: defaultWidth - 25});
- })
- .then(function() {
- expect(gd._fullLayout.width).toBe(defaultWidth - 25);
- return Plotly.relayout(gd, { width: undefined });
- })
- .then(function() {
- expect(gd._fullLayout.width).toBe(defaultWidth - 25);
- })
- .then(done);
- });
+ afterEach(destroyGraphDiv);
+
+ it("should update the plot clipPath if the plot is resized", function(
+ done
+ ) {
+ Plotly.plot(gd, [{ x: [1, 2, 3], y: [1, 2, 3] }], {
+ width: 500,
+ height: 500
+ })
+ .then(function() {
+ return Plotly.relayout(gd, { width: 400, height: 400 });
+ })
+ .then(function() {
+ var uid = gd._fullLayout._uid;
+
+ var plotClip = document.getElementById("clip" + uid + "xyplot"),
+ clipRect = plotClip.children[0],
+ clipWidth = +clipRect.getAttribute("width"),
+ clipHeight = +clipRect.getAttribute("height");
+
+ expect(clipWidth).toBe(240);
+ expect(clipHeight).toBe(220);
+ })
+ .then(done);
+ });
- it('can set items in array objects', function(done) {
- Plotly.plot(gd, [{ x: [1, 2, 3], y: [1, 2, 3] }])
- .then(function() {
- return Plotly.relayout(gd, {rando: [1, 2, 3]});
- })
- .then(function() {
- expect(gd.layout.rando).toEqual([1, 2, 3]);
- return Plotly.relayout(gd, {'rando[1]': 45});
- })
- .then(function() {
- expect(gd.layout.rando).toEqual([1, 45, 3]);
- })
- .then(done);
- });
+ it("sets null values to their default", function(done) {
+ var defaultWidth;
+ Plotly.plot(gd, [{ x: [1, 2, 3], y: [1, 2, 3] }])
+ .then(function() {
+ defaultWidth = gd._fullLayout.width;
+ return Plotly.relayout(gd, { width: defaultWidth - 25 });
+ })
+ .then(function() {
+ expect(gd._fullLayout.width).toBe(defaultWidth - 25);
+ return Plotly.relayout(gd, { width: null });
+ })
+ .then(function() {
+ expect(gd._fullLayout.width).toBe(defaultWidth);
+ })
+ .then(done);
+ });
- it('can set empty text nodes', function(done) {
- var data = [{
- x: [1, 2, 3],
- y: [0, 0, 0],
- text: ['', 'Text', ''],
- mode: 'lines+text'
- }];
- var scatter = null;
- var oldHeight = 0;
- Plotly.plot(gd, data)
- .then(function() {
- scatter = document.getElementsByClassName('scatter')[0];
- oldHeight = scatter.getBoundingClientRect().height;
- return Plotly.relayout(gd, 'yaxis.range', [0.5, 0.5, 0.5]);
- })
- .then(function() {
- var newHeight = scatter.getBoundingClientRect().height;
- expect(newHeight).toEqual(oldHeight);
- })
- .then(done);
- });
+ it("ignores undefined values", function(done) {
+ var defaultWidth;
+ Plotly.plot(gd, [{ x: [1, 2, 3], y: [1, 2, 3] }])
+ .then(function() {
+ defaultWidth = gd._fullLayout.width;
+ return Plotly.relayout(gd, { width: defaultWidth - 25 });
+ })
+ .then(function() {
+ expect(gd._fullLayout.width).toBe(defaultWidth - 25);
+ return Plotly.relayout(gd, { width: undefined });
+ })
+ .then(function() {
+ expect(gd._fullLayout.width).toBe(defaultWidth - 25);
+ })
+ .then(done);
});
- describe('Plotly.restyle', function() {
- beforeEach(function() {
- spyOn(PlotlyInternal, 'plot');
- spyOn(Plots, 'previousPromises');
- spyOn(Scatter, 'arraysToCalcdata');
- spyOn(Bar, 'arraysToCalcdata');
- spyOn(Plots, 'style');
- spyOn(Legend, 'draw');
- });
+ it("can set items in array objects", function(done) {
+ Plotly.plot(gd, [{ x: [1, 2, 3], y: [1, 2, 3] }])
+ .then(function() {
+ return Plotly.relayout(gd, { rando: [1, 2, 3] });
+ })
+ .then(function() {
+ expect(gd.layout.rando).toEqual([1, 2, 3]);
+ return Plotly.relayout(gd, { "rando[1]": 45 });
+ })
+ .then(function() {
+ expect(gd.layout.rando).toEqual([1, 45, 3]);
+ })
+ .then(done);
+ });
- function mockDefaultsAndCalc(gd) {
- Plots.supplyDefaults(gd);
- gd.calcdata = gd._fullData.map(function(trace) {
- return [{x: 1, y: 1, trace: trace}];
- });
+ it("can set empty text nodes", function(done) {
+ var data = [
+ {
+ x: [1, 2, 3],
+ y: [0, 0, 0],
+ text: ["", "Text", ""],
+ mode: "lines+text"
}
-
- it('calls Scatter.arraysToCalcdata and Plots.style on scatter styling', function() {
- var gd = {
- data: [{x: [1, 2, 3], y: [1, 2, 3]}],
- layout: {}
- };
- mockDefaultsAndCalc(gd);
- Plotly.restyle(gd, {'marker.color': 'red'});
- expect(Scatter.arraysToCalcdata).toHaveBeenCalled();
- expect(Bar.arraysToCalcdata).not.toHaveBeenCalled();
- expect(Plots.style).toHaveBeenCalled();
- expect(PlotlyInternal.plot).not.toHaveBeenCalled();
- // "docalc" deletes gd.calcdata - make sure this didn't happen
- expect(gd.calcdata).toBeDefined();
- });
-
- it('calls Bar.arraysToCalcdata and Plots.style on bar styling', function() {
- var gd = {
- data: [{x: [1, 2, 3], y: [1, 2, 3], type: 'bar'}],
- layout: {}
- };
- mockDefaultsAndCalc(gd);
- Plotly.restyle(gd, {'marker.color': 'red'});
- expect(Scatter.arraysToCalcdata).not.toHaveBeenCalled();
- expect(Bar.arraysToCalcdata).toHaveBeenCalled();
- expect(Plots.style).toHaveBeenCalled();
- expect(PlotlyInternal.plot).not.toHaveBeenCalled();
- expect(gd.calcdata).toBeDefined();
- });
-
- it('calls plot on xgap and ygap styling', function() {
- var gd = {
- data: [{z: [[1, 2, 3], [4, 5, 6], [7, 8, 9]], showscale: false, type: 'heatmap'}],
- layout: {}
- };
-
- mockDefaultsAndCalc(gd);
- Plotly.restyle(gd, {'xgap': 2});
- expect(PlotlyInternal.plot).toHaveBeenCalled();
-
- Plotly.restyle(gd, {'ygap': 2});
- expect(PlotlyInternal.plot.calls.count()).toEqual(2);
- });
-
- it('ignores undefined values', function() {
- var gd = {
- data: [{x: [1, 2, 3], y: [1, 2, 3], type: 'scatter'}],
- layout: {}
- };
-
- mockDefaultsAndCalc(gd);
-
- // Check to see that the color is updated:
- Plotly.restyle(gd, {'marker.color': 'blue'});
- expect(gd._fullData[0].marker.color).toBe('blue');
-
- // Check to see that the color is unaffected:
- Plotly.restyle(gd, {'marker.color': undefined});
- expect(gd._fullData[0].marker.color).toBe('blue');
- });
-
- it('restores null values to defaults', function() {
- var gd = {
- data: [{x: [1, 2, 3], y: [1, 2, 3], type: 'scatter'}],
- layout: {}
- };
-
- mockDefaultsAndCalc(gd);
- var colorDflt = gd._fullData[0].marker.color;
-
- // Check to see that the color is updated:
- Plotly.restyle(gd, {'marker.color': 'blue'});
- expect(gd._fullData[0].marker.color).toBe('blue');
-
- // Check to see that the color is restored to the original default:
- Plotly.restyle(gd, {'marker.color': null});
- expect(gd._fullData[0].marker.color).toBe(colorDflt);
- });
-
- it('can target specific traces by leaving properties undefined', function() {
- var gd = {
- data: [
- {x: [1, 2, 3], y: [1, 2, 3], type: 'scatter'},
- {x: [1, 2, 3], y: [3, 4, 5], type: 'scatter'}
- ],
- layout: {}
- };
-
- mockDefaultsAndCalc(gd);
- var colorDflt = [gd._fullData[0].marker.color, gd._fullData[1].marker.color];
-
- // Check only second trace's color has been changed:
- Plotly.restyle(gd, {'marker.color': [undefined, 'green']});
- expect(gd._fullData[0].marker.color).toBe(colorDflt[0]);
- expect(gd._fullData[1].marker.color).toBe('green');
-
- // Check both colors restored to the original default:
- Plotly.restyle(gd, {'marker.color': [null, null]});
- expect(gd._fullData[0].marker.color).toBe(colorDflt[0]);
- expect(gd._fullData[1].marker.color).toBe(colorDflt[1]);
- });
+ ];
+ var scatter = null;
+ var oldHeight = 0;
+ Plotly.plot(gd, data)
+ .then(function() {
+ scatter = document.getElementsByClassName("scatter")[0];
+ oldHeight = scatter.getBoundingClientRect().height;
+ return Plotly.relayout(gd, "yaxis.range", [0.5, 0.5, 0.5]);
+ })
+ .then(function() {
+ var newHeight = scatter.getBoundingClientRect().height;
+ expect(newHeight).toEqual(oldHeight);
+ })
+ .then(done);
});
-
- describe('Plotly.restyle unmocked', function() {
- var gd;
-
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(function() {
- destroyGraphDiv();
- });
-
- it('should redo auto z/contour when editing z array', function() {
- Plotly.plot(gd, [{type: 'contour', z: [[1, 2], [3, 4]]}]).then(function() {
- expect(gd.data[0].zauto).toBe(true, gd.data[0]);
- expect(gd.data[0].zmin).toBe(1);
- expect(gd.data[0].zmax).toBe(4);
-
- expect(gd.data[0].autocontour).toBe(true);
- expect(gd.data[0].contours).toEqual({start: 1.5, end: 3.5, size: 0.5});
-
- return Plotly.restyle(gd, {'z[0][0]': 10});
- }).then(function() {
- expect(gd.data[0].zmin).toBe(2);
- expect(gd.data[0].zmax).toBe(10);
-
- expect(gd.data[0].contours).toEqual({start: 3, end: 9, size: 1});
- });
- });
+ });
+
+ describe("Plotly.restyle", function() {
+ beforeEach(function() {
+ spyOn(PlotlyInternal, "plot");
+ spyOn(Plots, "previousPromises");
+ spyOn(Scatter, "arraysToCalcdata");
+ spyOn(Bar, "arraysToCalcdata");
+ spyOn(Plots, "style");
+ spyOn(Legend, "draw");
});
- describe('Plotly.deleteTraces', function() {
- var gd;
-
- beforeEach(function() {
- gd = {
- data: [
- {'name': 'a'},
- {'name': 'b'},
- {'name': 'c'},
- {'name': 'd'}
- ]
- };
- spyOn(PlotlyInternal, 'redraw');
- });
-
- it('should throw an error when indices are omitted', function() {
-
- expect(function() {
- Plotly.deleteTraces(gd);
- }).toThrow(new Error('indices must be an integer or array of integers.'));
-
- });
-
- it('should throw an error when indices are out of bounds', function() {
-
- expect(function() {
- Plotly.deleteTraces(gd, 10);
- }).toThrow(new Error('indices must be valid indices for gd.data.'));
-
- });
-
- it('should throw an error when indices are repeated', function() {
-
- expect(function() {
- Plotly.deleteTraces(gd, [0, 0]);
- }).toThrow(new Error('each index in indices must be unique.'));
-
- });
-
- it('should work when indices are negative', function() {
- var expectedData = [
- {'name': 'a'},
- {'name': 'b'},
- {'name': 'c'}
- ];
-
- Plotly.deleteTraces(gd, -1);
- expect(gd.data).toEqual(expectedData);
- expect(PlotlyInternal.redraw).toHaveBeenCalled();
-
- });
-
- it('should work when multiple traces are deleted', function() {
- var expectedData = [
- {'name': 'b'},
- {'name': 'c'}
- ];
-
- Plotly.deleteTraces(gd, [0, 3]);
- expect(gd.data).toEqual(expectedData);
- expect(PlotlyInternal.redraw).toHaveBeenCalled();
-
- });
-
- it('should work when indices are not sorted', function() {
- var expectedData = [
- {'name': 'b'},
- {'name': 'c'}
- ];
-
- Plotly.deleteTraces(gd, [3, 0]);
- expect(gd.data).toEqual(expectedData);
- expect(PlotlyInternal.redraw).toHaveBeenCalled();
-
- });
-
- it('should work with more than 10 indices', function() {
- gd.data = [];
-
- for(var i = 0; i < 20; i++) {
- gd.data.push({
- name: 'trace #' + i
- });
- }
-
- var expectedData = [
- {name: 'trace #12'},
- {name: 'trace #13'},
- {name: 'trace #14'},
- {name: 'trace #15'},
- {name: 'trace #16'},
- {name: 'trace #17'},
- {name: 'trace #18'},
- {name: 'trace #19'}
- ];
-
- Plotly.deleteTraces(gd, [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]);
- expect(gd.data).toEqual(expectedData);
- expect(PlotlyInternal.redraw).toHaveBeenCalled();
-
- });
-
+ function mockDefaultsAndCalc(gd) {
+ Plots.supplyDefaults(gd);
+ gd.calcdata = gd._fullData.map(function(trace) {
+ return [{ x: 1, y: 1, trace: trace }];
+ });
+ }
+
+ it(
+ "calls Scatter.arraysToCalcdata and Plots.style on scatter styling",
+ function() {
+ var gd = { data: [{ x: [1, 2, 3], y: [1, 2, 3] }], layout: {} };
+ mockDefaultsAndCalc(gd);
+ Plotly.restyle(gd, { "marker.color": "red" });
+ expect(Scatter.arraysToCalcdata).toHaveBeenCalled();
+ expect(Bar.arraysToCalcdata).not.toHaveBeenCalled();
+ expect(Plots.style).toHaveBeenCalled();
+ expect(PlotlyInternal.plot).not.toHaveBeenCalled();
+ // "docalc" deletes gd.calcdata - make sure this didn't happen
+ expect(gd.calcdata).toBeDefined();
+ }
+ );
+
+ it("calls Bar.arraysToCalcdata and Plots.style on bar styling", function() {
+ var gd = {
+ data: [{ x: [1, 2, 3], y: [1, 2, 3], type: "bar" }],
+ layout: {}
+ };
+ mockDefaultsAndCalc(gd);
+ Plotly.restyle(gd, { "marker.color": "red" });
+ expect(Scatter.arraysToCalcdata).not.toHaveBeenCalled();
+ expect(Bar.arraysToCalcdata).toHaveBeenCalled();
+ expect(Plots.style).toHaveBeenCalled();
+ expect(PlotlyInternal.plot).not.toHaveBeenCalled();
+ expect(gd.calcdata).toBeDefined();
});
- describe('Plotly.addTraces', function() {
- var gd;
-
- beforeEach(function() {
- gd = { data: [{'name': 'a'}, {'name': 'b'}] };
- spyOn(PlotlyInternal, 'redraw');
- spyOn(PlotlyInternal, 'moveTraces');
- });
-
- it('should throw an error when traces is not an object or an array of objects', function() {
- var expected = JSON.parse(JSON.stringify(gd));
- expect(function() {
- Plotly.addTraces(gd, 1, 2);
- }).toThrowError(Error, 'all values in traces array must be non-array objects');
-
- expect(function() {
- Plotly.addTraces(gd, [{}, 4], 2);
- }).toThrowError(Error, 'all values in traces array must be non-array objects');
-
- expect(function() {
- Plotly.addTraces(gd, [{}, []], 2);
- }).toThrowError(Error, 'all values in traces array must be non-array objects');
-
- // make sure we didn't muck with gd.data if things failed!
- expect(gd).toEqual(expected);
- });
-
- it('should throw an error when traces and newIndices arrays are unequal', function() {
-
- expect(function() {
- Plotly.addTraces(gd, [{}, {}], 2);
- }).toThrowError(Error, 'if indices is specified, traces.length must equal indices.length');
-
- });
-
- it('should throw an error when newIndices are out of bounds', function() {
- var expected = JSON.parse(JSON.stringify(gd));
-
- expect(function() {
- Plotly.addTraces(gd, [{}, {}], [0, 10]);
- }).toThrow(new Error('newIndices must be valid indices for gd.data.'));
-
- // make sure we didn't muck with gd.data if things failed!
- expect(gd).toEqual(expected);
- });
-
- it('should work when newIndices is undefined', function() {
- Plotly.addTraces(gd, [{'name': 'c'}, {'name': 'd'}]);
- expect(gd.data[2].name).toBeDefined();
- expect(gd.data[2].uid).toBeDefined();
- expect(gd.data[3].name).toBeDefined();
- expect(gd.data[3].uid).toBeDefined();
- expect(PlotlyInternal.redraw).toHaveBeenCalled();
- expect(PlotlyInternal.moveTraces).not.toHaveBeenCalled();
- });
-
- it('should work when newIndices is defined', function() {
- Plotly.addTraces(gd, [{'name': 'c'}, {'name': 'd'}], [1, 3]);
- expect(gd.data[2].name).toBeDefined();
- expect(gd.data[2].uid).toBeDefined();
- expect(gd.data[3].name).toBeDefined();
- expect(gd.data[3].uid).toBeDefined();
- expect(PlotlyInternal.redraw).not.toHaveBeenCalled();
- expect(PlotlyInternal.moveTraces).toHaveBeenCalledWith(gd, [-2, -1], [1, 3]);
- });
-
- it('should work when newIndices has negative indices', function() {
- Plotly.addTraces(gd, [{'name': 'c'}, {'name': 'd'}], [-3, -1]);
- expect(gd.data[2].name).toBeDefined();
- expect(gd.data[2].uid).toBeDefined();
- expect(gd.data[3].name).toBeDefined();
- expect(gd.data[3].uid).toBeDefined();
- expect(PlotlyInternal.redraw).not.toHaveBeenCalled();
- expect(PlotlyInternal.moveTraces).toHaveBeenCalledWith(gd, [-2, -1], [-3, -1]);
- });
-
- it('should work when newIndices is an integer', function() {
- Plotly.addTraces(gd, {'name': 'c'}, 0);
- expect(gd.data[2].name).toBeDefined();
- expect(gd.data[2].uid).toBeDefined();
- expect(PlotlyInternal.redraw).not.toHaveBeenCalled();
- expect(PlotlyInternal.moveTraces).toHaveBeenCalledWith(gd, [-1], [0]);
- });
-
- it('should work when adding an existing trace', function() {
- Plotly.addTraces(gd, gd.data[0]);
-
- expect(gd.data.length).toEqual(3);
- expect(gd.data[0]).not.toBe(gd.data[2]);
- });
-
- it('should work when duplicating the existing data', function() {
- Plotly.addTraces(gd, gd.data);
-
- expect(gd.data.length).toEqual(4);
- expect(gd.data[0]).not.toBe(gd.data[2]);
- expect(gd.data[1]).not.toBe(gd.data[3]);
- });
+ it("calls plot on xgap and ygap styling", function() {
+ var gd = {
+ data: [
+ {
+ z: [[1, 2, 3], [4, 5, 6], [7, 8, 9]],
+ showscale: false,
+ type: "heatmap"
+ }
+ ],
+ layout: {}
+ };
+
+ mockDefaultsAndCalc(gd);
+ Plotly.restyle(gd, { xgap: 2 });
+ expect(PlotlyInternal.plot).toHaveBeenCalled();
+
+ Plotly.restyle(gd, { ygap: 2 });
+ expect(PlotlyInternal.plot.calls.count()).toEqual(2);
});
- describe('Plotly.moveTraces should', function() {
- var gd;
- beforeEach(function() {
- gd = {
- data: [
- {'name': 'a'},
- {'name': 'b'},
- {'name': 'c'},
- {'name': 'd'}
- ]
- };
- spyOn(PlotlyInternal, 'redraw');
- });
-
- it('throw an error when index arrays are unequal', function() {
- expect(function() {
- Plotly.moveTraces(gd, [1], [2, 1]);
- }).toThrow(new Error('current and new indices must be of equal length.'));
- });
-
- it('throw an error when gd.data isn\'t an array.', function() {
- expect(function() {
- Plotly.moveTraces({}, [0], [0]);
- }).toThrow(new Error('gd.data must be an array.'));
- expect(function() {
- Plotly.moveTraces({data: 'meow'}, [0], [0]);
- }).toThrow(new Error('gd.data must be an array.'));
- });
-
- it('thow an error when a current index is out of bounds', function() {
- expect(function() {
- Plotly.moveTraces(gd, [-gd.data.length - 1], [0]);
- }).toThrow(new Error('currentIndices must be valid indices for gd.data.'));
- expect(function() {
- Plotly.moveTraces(gd, [gd.data.length], [0]);
- }).toThrow(new Error('currentIndices must be valid indices for gd.data.'));
- });
-
- it('thow an error when a new index is out of bounds', function() {
- expect(function() {
- Plotly.moveTraces(gd, [0], [-gd.data.length - 1]);
- }).toThrow(new Error('newIndices must be valid indices for gd.data.'));
- expect(function() {
- Plotly.moveTraces(gd, [0], [gd.data.length]);
- }).toThrow(new Error('newIndices must be valid indices for gd.data.'));
- });
-
- it('thow an error when current indices are repeated', function() {
- expect(function() {
- Plotly.moveTraces(gd, [0, 0], [0, 1]);
- }).toThrow(new Error('each index in currentIndices must be unique.'));
-
- // note that both positive and negative indices are accepted!
- expect(function() {
- Plotly.moveTraces(gd, [0, -gd.data.length], [0, 1]);
- }).toThrow(new Error('each index in currentIndices must be unique.'));
- });
-
- it('thow an error when new indices are repeated', function() {
- expect(function() {
- Plotly.moveTraces(gd, [0, 1], [0, 0]);
- }).toThrow(new Error('each index in newIndices must be unique.'));
-
- // note that both positive and negative indices are accepted!
- expect(function() {
- Plotly.moveTraces(gd, [0, 1], [-gd.data.length, 0]);
- }).toThrow(new Error('each index in newIndices must be unique.'));
- });
-
- it('accept integers in place of arrays', function() {
- var expectedData = [
- {'name': 'b'},
- {'name': 'a'},
- {'name': 'c'},
- {'name': 'd'}
- ];
-
- Plotly.moveTraces(gd, 0, 1);
- expect(gd.data).toEqual(expectedData);
- expect(PlotlyInternal.redraw).toHaveBeenCalled();
-
- });
-
- it('handle unsorted currentIndices', function() {
- var expectedData = [
- {'name': 'd'},
- {'name': 'a'},
- {'name': 'c'},
- {'name': 'b'}
- ];
+ it("ignores undefined values", function() {
+ var gd = {
+ data: [{ x: [1, 2, 3], y: [1, 2, 3], type: "scatter" }],
+ layout: {}
+ };
- Plotly.moveTraces(gd, [3, 1], [0, 3]);
- expect(gd.data).toEqual(expectedData);
- expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ mockDefaultsAndCalc(gd);
- });
+ // Check to see that the color is updated:
+ Plotly.restyle(gd, { "marker.color": "blue" });
+ expect(gd._fullData[0].marker.color).toBe("blue");
- it('work when newIndices are undefined.', function() {
- var expectedData = [
- {'name': 'b'},
- {'name': 'c'},
- {'name': 'd'},
- {'name': 'a'}
- ];
+ // Check to see that the color is unaffected:
+ Plotly.restyle(gd, { "marker.color": undefined });
+ expect(gd._fullData[0].marker.color).toBe("blue");
+ });
- Plotly.moveTraces(gd, [3, 0]);
- expect(gd.data).toEqual(expectedData);
- expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ it("restores null values to defaults", function() {
+ var gd = {
+ data: [{ x: [1, 2, 3], y: [1, 2, 3], type: "scatter" }],
+ layout: {}
+ };
- });
+ mockDefaultsAndCalc(gd);
+ var colorDflt = gd._fullData[0].marker.color;
- it('accept negative indices.', function() {
- var expectedData = [
- {'name': 'a'},
- {'name': 'c'},
- {'name': 'b'},
- {'name': 'd'}
- ];
+ // Check to see that the color is updated:
+ Plotly.restyle(gd, { "marker.color": "blue" });
+ expect(gd._fullData[0].marker.color).toBe("blue");
- Plotly.moveTraces(gd, 1, -2);
- expect(gd.data).toEqual(expectedData);
- expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ // Check to see that the color is restored to the original default:
+ Plotly.restyle(gd, { "marker.color": null });
+ expect(gd._fullData[0].marker.color).toBe(colorDflt);
+ });
- });
+ it(
+ "can target specific traces by leaving properties undefined",
+ function() {
+ var gd = {
+ data: [
+ { x: [1, 2, 3], y: [1, 2, 3], type: "scatter" },
+ { x: [1, 2, 3], y: [3, 4, 5], type: "scatter" }
+ ],
+ layout: {}
+ };
+
+ mockDefaultsAndCalc(gd);
+ var colorDflt = [
+ gd._fullData[0].marker.color,
+ gd._fullData[1].marker.color
+ ];
+
+ // Check only second trace's color has been changed:
+ Plotly.restyle(gd, { "marker.color": [undefined, "green"] });
+ expect(gd._fullData[0].marker.color).toBe(colorDflt[0]);
+ expect(gd._fullData[1].marker.color).toBe("green");
+
+ // Check both colors restored to the original default:
+ Plotly.restyle(gd, { "marker.color": [null, null] });
+ expect(gd._fullData[0].marker.color).toBe(colorDflt[0]);
+ expect(gd._fullData[1].marker.color).toBe(colorDflt[1]);
+ }
+ );
+ });
+
+ describe("Plotly.restyle unmocked", function() {
+ var gd;
+
+ beforeEach(function() {
+ gd = createGraphDiv();
});
+ afterEach(function() {
+ destroyGraphDiv();
+ });
- describe('Plotly.ExtendTraces', function() {
- var gd;
+ it("should redo auto z/contour when editing z array", function() {
+ Plotly.plot(gd, [{ type: "contour", z: [[1, 2], [3, 4]] }])
+ .then(function() {
+ expect(gd.data[0].zauto).toBe(true, gd.data[0]);
+ expect(gd.data[0].zmin).toBe(1);
+ expect(gd.data[0].zmax).toBe(4);
- beforeEach(function() {
- gd = {
- data: [
- {x: [0, 1, 2], marker: {size: [3, 2, 1]}},
- {x: [1, 2, 3], marker: {size: [2, 3, 4]}}
- ]
- };
+ expect(gd.data[0].autocontour).toBe(true);
+ expect(gd.data[0].contours).toEqual({
+ start: 1.5,
+ end: 3.5,
+ size: 0.5
+ });
- if(!Plotly.Queue) {
- Plotly.Queue = {
- add: function() {},
- startSequence: function() {},
- endSequence: function() {}
- };
- }
+ return Plotly.restyle(gd, { "z[0][0]": 10 });
+ })
+ .then(function() {
+ expect(gd.data[0].zmin).toBe(2);
+ expect(gd.data[0].zmax).toBe(10);
- spyOn(PlotlyInternal, 'redraw');
- spyOn(Plotly.Queue, 'add');
+ expect(gd.data[0].contours).toEqual({ start: 3, end: 9, size: 1 });
});
+ });
+ });
- it('should throw an error when gd.data isn\'t an array.', function() {
-
- expect(function() {
- Plotly.extendTraces({}, {x: [[1]]}, [0]);
- }).toThrow(new Error('gd.data must be an array'));
+ describe("Plotly.deleteTraces", function() {
+ var gd;
- expect(function() {
- Plotly.extendTraces({data: 'meow'}, {x: [[1]]}, [0]);
- }).toThrow(new Error('gd.data must be an array'));
+ beforeEach(function() {
+ gd = {
+ data: [{ name: "a" }, { name: "b" }, { name: "c" }, { name: "d" }]
+ };
+ spyOn(PlotlyInternal, "redraw");
+ });
- });
+ it("should throw an error when indices are omitted", function() {
+ expect(function() {
+ Plotly.deleteTraces(gd);
+ }).toThrow(new Error("indices must be an integer or array of integers."));
+ });
- it('should throw an error when update is not an object', function() {
+ it("should throw an error when indices are out of bounds", function() {
+ expect(function() {
+ Plotly.deleteTraces(gd, 10);
+ }).toThrow(new Error("indices must be valid indices for gd.data."));
+ });
- expect(function() {
- Plotly.extendTraces(gd, undefined, [0], 8);
- }).toThrow(new Error('update must be a key:value object'));
+ it("should throw an error when indices are repeated", function() {
+ expect(function() {
+ Plotly.deleteTraces(gd, [0, 0]);
+ }).toThrow(new Error("each index in indices must be unique."));
+ });
- expect(function() {
- Plotly.extendTraces(gd, null, [0]);
- }).toThrow(new Error('update must be a key:value object'));
+ it("should work when indices are negative", function() {
+ var expectedData = [{ name: "a" }, { name: "b" }, { name: "c" }];
- });
+ Plotly.deleteTraces(gd, -1);
+ expect(gd.data).toEqual(expectedData);
+ expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ });
+ it("should work when multiple traces are deleted", function() {
+ var expectedData = [{ name: "b" }, { name: "c" }];
- it('should throw an error when indices are omitted', function() {
+ Plotly.deleteTraces(gd, [0, 3]);
+ expect(gd.data).toEqual(expectedData);
+ expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ });
- expect(function() {
- Plotly.extendTraces(gd, {x: [[1]]});
- }).toThrow(new Error('indices must be an integer or array of integers'));
+ it("should work when indices are not sorted", function() {
+ var expectedData = [{ name: "b" }, { name: "c" }];
- });
+ Plotly.deleteTraces(gd, [3, 0]);
+ expect(gd.data).toEqual(expectedData);
+ expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ });
- it('should throw an error when a current index is out of bounds', function() {
+ it("should work with more than 10 indices", function() {
+ gd.data = [];
+
+ for (var i = 0; i < 20; i++) {
+ gd.data.push({ name: "trace #" + i });
+ }
+
+ var expectedData = [
+ { name: "trace #12" },
+ { name: "trace #13" },
+ { name: "trace #14" },
+ { name: "trace #15" },
+ { name: "trace #16" },
+ { name: "trace #17" },
+ { name: "trace #18" },
+ { name: "trace #19" }
+ ];
+
+ Plotly.deleteTraces(gd, [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]);
+ expect(gd.data).toEqual(expectedData);
+ expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ });
+ });
- expect(function() {
- Plotly.extendTraces(gd, {x: [[1]]}, [-gd.data.length - 1]);
- }).toThrow(new Error('indices must be valid indices for gd.data.'));
+ describe("Plotly.addTraces", function() {
+ var gd;
- });
+ beforeEach(function() {
+ gd = { data: [{ name: "a" }, { name: "b" }] };
+ spyOn(PlotlyInternal, "redraw");
+ spyOn(PlotlyInternal, "moveTraces");
+ });
- it('should not throw an error when negative index wraps to positive', function() {
+ it(
+ "should throw an error when traces is not an object or an array of objects",
+ function() {
+ var expected = JSON.parse(JSON.stringify(gd));
+ expect(function() {
+ Plotly.addTraces(gd, 1, 2);
+ }).toThrowError(
+ Error,
+ "all values in traces array must be non-array objects"
+ );
+
+ expect(function() {
+ Plotly.addTraces(gd, [{}, 4], 2);
+ }).toThrowError(
+ Error,
+ "all values in traces array must be non-array objects"
+ );
+
+ expect(function() {
+ Plotly.addTraces(gd, [{}, []], 2);
+ }).toThrowError(
+ Error,
+ "all values in traces array must be non-array objects"
+ );
+
+ // make sure we didn't muck with gd.data if things failed!
+ expect(gd).toEqual(expected);
+ }
+ );
+
+ it(
+ "should throw an error when traces and newIndices arrays are unequal",
+ function() {
+ expect(function() {
+ Plotly.addTraces(gd, [{}, {}], 2);
+ }).toThrowError(
+ Error,
+ "if indices is specified, traces.length must equal indices.length"
+ );
+ }
+ );
+
+ it("should throw an error when newIndices are out of bounds", function() {
+ var expected = JSON.parse(JSON.stringify(gd));
+
+ expect(function() {
+ Plotly.addTraces(gd, [{}, {}], [0, 10]);
+ }).toThrow(new Error("newIndices must be valid indices for gd.data."));
+
+ // make sure we didn't muck with gd.data if things failed!
+ expect(gd).toEqual(expected);
+ });
- expect(function() {
- Plotly.extendTraces(gd, {x: [[1]]}, [-1]);
- }).not.toThrow();
+ it("should work when newIndices is undefined", function() {
+ Plotly.addTraces(gd, [{ name: "c" }, { name: "d" }]);
+ expect(gd.data[2].name).toBeDefined();
+ expect(gd.data[2].uid).toBeDefined();
+ expect(gd.data[3].name).toBeDefined();
+ expect(gd.data[3].uid).toBeDefined();
+ expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ expect(PlotlyInternal.moveTraces).not.toHaveBeenCalled();
+ });
- });
+ it("should work when newIndices is defined", function() {
+ Plotly.addTraces(gd, [{ name: "c" }, { name: "d" }], [1, 3]);
+ expect(gd.data[2].name).toBeDefined();
+ expect(gd.data[2].uid).toBeDefined();
+ expect(gd.data[3].name).toBeDefined();
+ expect(gd.data[3].uid).toBeDefined();
+ expect(PlotlyInternal.redraw).not.toHaveBeenCalled();
+ expect(PlotlyInternal.moveTraces).toHaveBeenCalledWith(gd, [-2, -1], [
+ 1,
+ 3
+ ]);
+ });
- it('should throw an error when number of Indices does not match Update arrays', function() {
+ it("should work when newIndices has negative indices", function() {
+ Plotly.addTraces(gd, [{ name: "c" }, { name: "d" }], [-3, -1]);
+ expect(gd.data[2].name).toBeDefined();
+ expect(gd.data[2].uid).toBeDefined();
+ expect(gd.data[3].name).toBeDefined();
+ expect(gd.data[3].uid).toBeDefined();
+ expect(PlotlyInternal.redraw).not.toHaveBeenCalled();
+ expect(PlotlyInternal.moveTraces).toHaveBeenCalledWith(gd, [-2, -1], [
+ -3,
+ -1
+ ]);
+ });
- expect(function() {
- Plotly.extendTraces(gd, {x: [[1, 2], [2, 3]] }, [0]);
- }).toThrow(new Error('attribute x must be an array of length equal to indices array length'));
+ it("should work when newIndices is an integer", function() {
+ Plotly.addTraces(gd, { name: "c" }, 0);
+ expect(gd.data[2].name).toBeDefined();
+ expect(gd.data[2].uid).toBeDefined();
+ expect(PlotlyInternal.redraw).not.toHaveBeenCalled();
+ expect(PlotlyInternal.moveTraces).toHaveBeenCalledWith(gd, [-1], [0]);
+ });
- expect(function() {
- Plotly.extendTraces(gd, {x: [[1]]}, [0, 1]);
- }).toThrow(new Error('attribute x must be an array of length equal to indices array length'));
+ it("should work when adding an existing trace", function() {
+ Plotly.addTraces(gd, gd.data[0]);
- });
+ expect(gd.data.length).toEqual(3);
+ expect(gd.data[0]).not.toBe(gd.data[2]);
+ });
- it('should throw an error when maxPoints is an Object but does not match Update', function() {
+ it("should work when duplicating the existing data", function() {
+ Plotly.addTraces(gd, gd.data);
- expect(function() {
- Plotly.extendTraces(gd, {x: [[1]]}, [0], {y: [1]});
- }).toThrow(new Error('when maxPoints is set as a key:value object it must contain a 1:1 ' +
- 'corrispondence with the keys and number of traces in the update object'));
+ expect(gd.data.length).toEqual(4);
+ expect(gd.data[0]).not.toBe(gd.data[2]);
+ expect(gd.data[1]).not.toBe(gd.data[3]);
+ });
+ });
+
+ describe("Plotly.moveTraces should", function() {
+ var gd;
+ beforeEach(function() {
+ gd = {
+ data: [{ name: "a" }, { name: "b" }, { name: "c" }, { name: "d" }]
+ };
+ spyOn(PlotlyInternal, "redraw");
+ });
- expect(function() {
- Plotly.extendTraces(gd, {x: [[1]]}, [0], {x: [1, 2]});
- }).toThrow(new Error('when maxPoints is set as a key:value object it must contain a 1:1 ' +
- 'corrispondence with the keys and number of traces in the update object'));
+ it("throw an error when index arrays are unequal", function() {
+ expect(function() {
+ Plotly.moveTraces(gd, [1], [2, 1]);
+ }).toThrow(new Error("current and new indices must be of equal length."));
+ });
- });
+ it("throw an error when gd.data isn't an array.", function() {
+ expect(function() {
+ Plotly.moveTraces({}, [0], [0]);
+ }).toThrow(new Error("gd.data must be an array."));
+ expect(function() {
+ Plotly.moveTraces({ data: "meow" }, [0], [0]);
+ }).toThrow(new Error("gd.data must be an array."));
+ });
- it('should throw an error when update keys mismatch trace keys', function() {
+ it("thow an error when a current index is out of bounds", function() {
+ expect(function() {
+ Plotly.moveTraces(gd, [-gd.data.length - 1], [0]);
+ }).toThrow(new Error(
+ "currentIndices must be valid indices for gd.data."
+ ));
+ expect(function() {
+ Plotly.moveTraces(gd, [gd.data.length], [0]);
+ }).toThrow(new Error(
+ "currentIndices must be valid indices for gd.data."
+ ));
+ });
- // lets update y on both traces, but only 1 trace has "y"
- gd.data[1].y = [1, 2, 3];
+ it("thow an error when a new index is out of bounds", function() {
+ expect(function() {
+ Plotly.moveTraces(gd, [0], [-gd.data.length - 1]);
+ }).toThrow(new Error("newIndices must be valid indices for gd.data."));
+ expect(function() {
+ Plotly.moveTraces(gd, [0], [gd.data.length]);
+ }).toThrow(new Error("newIndices must be valid indices for gd.data."));
+ });
- expect(function() {
- Plotly.extendTraces(gd, {
- y: [[3, 4], [4, 5]], 'marker.size': [[0, -1], [5, 6]]
- }, [0, 1]);
- }).toThrow(new Error('cannot extend missing or non-array attribute: y'));
+ it("thow an error when current indices are repeated", function() {
+ expect(function() {
+ Plotly.moveTraces(gd, [0, 0], [0, 1]);
+ }).toThrow(new Error("each index in currentIndices must be unique."));
- });
+ // note that both positive and negative indices are accepted!
+ expect(function() {
+ Plotly.moveTraces(gd, [0, -gd.data.length], [0, 1]);
+ }).toThrow(new Error("each index in currentIndices must be unique."));
+ });
- it('should extend traces with update keys', function() {
+ it("thow an error when new indices are repeated", function() {
+ expect(function() {
+ Plotly.moveTraces(gd, [0, 1], [0, 0]);
+ }).toThrow(new Error("each index in newIndices must be unique."));
- Plotly.extendTraces(gd, {
- x: [[3, 4], [4, 5]], 'marker.size': [[0, -1], [5, 6]]
- }, [0, 1]);
+ // note that both positive and negative indices are accepted!
+ expect(function() {
+ Plotly.moveTraces(gd, [0, 1], [-gd.data.length, 0]);
+ }).toThrow(new Error("each index in newIndices must be unique."));
+ });
- expect(gd.data).toEqual([
- {x: [0, 1, 2, 3, 4], marker: {size: [3, 2, 1, 0, -1]}},
- {x: [1, 2, 3, 4, 5], marker: {size: [2, 3, 4, 5, 6]}}
- ]);
+ it("accept integers in place of arrays", function() {
+ var expectedData = [
+ { name: "b" },
+ { name: "a" },
+ { name: "c" },
+ { name: "d" }
+ ];
+
+ Plotly.moveTraces(gd, 0, 1);
+ expect(gd.data).toEqual(expectedData);
+ expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ });
- expect(PlotlyInternal.redraw).toHaveBeenCalled();
- });
+ it("handle unsorted currentIndices", function() {
+ var expectedData = [
+ { name: "d" },
+ { name: "a" },
+ { name: "c" },
+ { name: "b" }
+ ];
+
+ Plotly.moveTraces(gd, [3, 1], [0, 3]);
+ expect(gd.data).toEqual(expectedData);
+ expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ });
- it('should extend and window traces with update keys', function() {
- var maxPoints = 3;
+ it("work when newIndices are undefined.", function() {
+ var expectedData = [
+ { name: "b" },
+ { name: "c" },
+ { name: "d" },
+ { name: "a" }
+ ];
+
+ Plotly.moveTraces(gd, [3, 0]);
+ expect(gd.data).toEqual(expectedData);
+ expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ });
- Plotly.extendTraces(gd, {
- x: [[3, 4], [4, 5]], 'marker.size': [[0, -1], [5, 6]]
- }, [0, 1], maxPoints);
+ it("accept negative indices.", function() {
+ var expectedData = [
+ { name: "a" },
+ { name: "c" },
+ { name: "b" },
+ { name: "d" }
+ ];
+
+ Plotly.moveTraces(gd, 1, -2);
+ expect(gd.data).toEqual(expectedData);
+ expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ });
+ });
+
+ describe("Plotly.ExtendTraces", function() {
+ var gd;
+
+ beforeEach(function() {
+ gd = {
+ data: [
+ { x: [0, 1, 2], marker: { size: [3, 2, 1] } },
+ { x: [1, 2, 3], marker: { size: [2, 3, 4] } }
+ ]
+ };
+
+ if (!Plotly.Queue) {
+ Plotly.Queue = {
+ add: function() {},
+ startSequence: function() {},
+ endSequence: function() {}
+ };
+ }
+
+ spyOn(PlotlyInternal, "redraw");
+ spyOn(Plotly.Queue, "add");
+ });
- expect(gd.data).toEqual([
- {x: [2, 3, 4], marker: {size: [1, 0, -1]}},
- {x: [3, 4, 5], marker: {size: [4, 5, 6]}}
- ]);
- });
+ it("should throw an error when gd.data isn't an array.", function() {
+ expect(function() {
+ Plotly.extendTraces({}, { x: [[1]] }, [0]);
+ }).toThrow(new Error("gd.data must be an array"));
- it('should extend and window traces with update keys', function() {
- var maxPoints = 3;
+ expect(function() {
+ Plotly.extendTraces({ data: "meow" }, { x: [[1]] }, [0]);
+ }).toThrow(new Error("gd.data must be an array"));
+ });
- Plotly.extendTraces(gd, {
- x: [[3, 4], [4, 5]], 'marker.size': [[0, -1], [5, 6]]
- }, [0, 1], maxPoints);
+ it("should throw an error when update is not an object", function() {
+ expect(function() {
+ Plotly.extendTraces(gd, undefined, [0], 8);
+ }).toThrow(new Error("update must be a key:value object"));
- expect(gd.data).toEqual([
- {x: [2, 3, 4], marker: {size: [1, 0, -1]}},
- {x: [3, 4, 5], marker: {size: [4, 5, 6]}}
- ]);
- });
+ expect(function() {
+ Plotly.extendTraces(gd, null, [0]);
+ }).toThrow(new Error("update must be a key:value object"));
+ });
- it('should extend and window traces using full maxPoint object', function() {
- var maxPoints = {x: [2, 3], 'marker.size': [1, 2]};
+ it("should throw an error when indices are omitted", function() {
+ expect(function() {
+ Plotly.extendTraces(gd, { x: [[1]] });
+ }).toThrow(new Error("indices must be an integer or array of integers"));
+ });
- Plotly.extendTraces(gd, {
- x: [[3, 4], [4, 5]], 'marker.size': [[0, -1], [5, 6]]
- }, [0, 1], maxPoints);
+ it(
+ "should throw an error when a current index is out of bounds",
+ function() {
+ expect(function() {
+ Plotly.extendTraces(gd, { x: [[1]] }, [-gd.data.length - 1]);
+ }).toThrow(new Error("indices must be valid indices for gd.data."));
+ }
+ );
+
+ it(
+ "should not throw an error when negative index wraps to positive",
+ function() {
+ expect(function() {
+ Plotly.extendTraces(gd, { x: [[1]] }, [-1]);
+ }).not.toThrow();
+ }
+ );
+
+ it(
+ "should throw an error when number of Indices does not match Update arrays",
+ function() {
+ expect(function() {
+ Plotly.extendTraces(gd, { x: [[1, 2], [2, 3]] }, [0]);
+ }).toThrow(new Error(
+ "attribute x must be an array of length equal to indices array length"
+ ));
+
+ expect(function() {
+ Plotly.extendTraces(gd, { x: [[1]] }, [0, 1]);
+ }).toThrow(new Error(
+ "attribute x must be an array of length equal to indices array length"
+ ));
+ }
+ );
+
+ it(
+ "should throw an error when maxPoints is an Object but does not match Update",
+ function() {
+ expect(function() {
+ Plotly.extendTraces(gd, { x: [[1]] }, [0], { y: [1] });
+ }).toThrow(new Error(
+ "when maxPoints is set as a key:value object it must contain a 1:1 " +
+ "corrispondence with the keys and number of traces in the update object"
+ ));
+
+ expect(function() {
+ Plotly.extendTraces(gd, { x: [[1]] }, [0], { x: [1, 2] });
+ }).toThrow(new Error(
+ "when maxPoints is set as a key:value object it must contain a 1:1 " +
+ "corrispondence with the keys and number of traces in the update object"
+ ));
+ }
+ );
+
+ it(
+ "should throw an error when update keys mismatch trace keys",
+ function() {
+ // lets update y on both traces, but only 1 trace has "y"
+ gd.data[1].y = [1, 2, 3];
+
+ expect(function() {
+ Plotly.extendTraces(
+ gd,
+ {
+ y: [[3, 4], [4, 5]],
+ "marker.size": [[0, -1], [5, 6]]
+ },
+ [0, 1]
+ );
+ }).toThrow(new Error(
+ "cannot extend missing or non-array attribute: y"
+ ));
+ }
+ );
+
+ it("should extend traces with update keys", function() {
+ Plotly.extendTraces(
+ gd,
+ { x: [[3, 4], [4, 5]], "marker.size": [[0, -1], [5, 6]] },
+ [0, 1]
+ );
+
+ expect(gd.data).toEqual([
+ { x: [0, 1, 2, 3, 4], marker: { size: [3, 2, 1, 0, -1] } },
+ { x: [1, 2, 3, 4, 5], marker: { size: [2, 3, 4, 5, 6] } }
+ ]);
+
+ expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ });
- expect(gd.data).toEqual([
- {x: [3, 4], marker: {size: [-1]}},
- {x: [3, 4, 5], marker: {size: [5, 6]}}
- ]);
- });
+ it("should extend and window traces with update keys", function() {
+ var maxPoints = 3;
- it('should truncate arrays when maxPoints is zero', function() {
+ Plotly.extendTraces(
+ gd,
+ { x: [[3, 4], [4, 5]], "marker.size": [[0, -1], [5, 6]] },
+ [0, 1],
+ maxPoints
+ );
- Plotly.extendTraces(gd, {
- x: [[3, 4], [4, 5]], 'marker.size': [[0, -1], [5, 6]]
- }, [0, 1], 0);
+ expect(gd.data).toEqual([
+ { x: [2, 3, 4], marker: { size: [1, 0, -1] } },
+ { x: [3, 4, 5], marker: { size: [4, 5, 6] } }
+ ]);
+ });
- expect(gd.data).toEqual([
- {x: [], marker: {size: []}},
- {x: [], marker: {size: []}}
- ]);
+ it("should extend and window traces with update keys", function() {
+ var maxPoints = 3;
- expect(PlotlyInternal.redraw).toHaveBeenCalled();
- });
+ Plotly.extendTraces(
+ gd,
+ { x: [[3, 4], [4, 5]], "marker.size": [[0, -1], [5, 6]] },
+ [0, 1],
+ maxPoints
+ );
- it('prepend is the inverse of extend - no maxPoints', function() {
- var cachedData = Lib.extendDeep([], gd.data);
+ expect(gd.data).toEqual([
+ { x: [2, 3, 4], marker: { size: [1, 0, -1] } },
+ { x: [3, 4, 5], marker: { size: [4, 5, 6] } }
+ ]);
+ });
- Plotly.extendTraces(gd, {
- x: [[3, 4], [4, 5]], 'marker.size': [[0, -1], [5, 6]]
- }, [0, 1]);
+ it(
+ "should extend and window traces using full maxPoint object",
+ function() {
+ var maxPoints = { x: [2, 3], "marker.size": [1, 2] };
+
+ Plotly.extendTraces(
+ gd,
+ { x: [[3, 4], [4, 5]], "marker.size": [[0, -1], [5, 6]] },
+ [0, 1],
+ maxPoints
+ );
+
+ expect(gd.data).toEqual([
+ { x: [3, 4], marker: { size: [-1] } },
+ { x: [3, 4, 5], marker: { size: [5, 6] } }
+ ]);
+ }
+ );
+
+ it("should truncate arrays when maxPoints is zero", function() {
+ Plotly.extendTraces(
+ gd,
+ { x: [[3, 4], [4, 5]], "marker.size": [[0, -1], [5, 6]] },
+ [0, 1],
+ 0
+ );
+
+ expect(gd.data).toEqual([
+ { x: [], marker: { size: [] } },
+ { x: [], marker: { size: [] } }
+ ]);
+
+ expect(PlotlyInternal.redraw).toHaveBeenCalled();
+ });
- expect(gd.data).not.toEqual(cachedData);
- expect(Plotly.Queue.add).toHaveBeenCalled();
+ it("prepend is the inverse of extend - no maxPoints", function() {
+ var cachedData = Lib.extendDeep([], gd.data);
- var undoArgs = Plotly.Queue.add.calls.first().args[2];
+ Plotly.extendTraces(
+ gd,
+ { x: [[3, 4], [4, 5]], "marker.size": [[0, -1], [5, 6]] },
+ [0, 1]
+ );
- Plotly.prependTraces.apply(null, undoArgs);
+ expect(gd.data).not.toEqual(cachedData);
+ expect(Plotly.Queue.add).toHaveBeenCalled();
- expect(gd.data).toEqual(cachedData);
- });
+ var undoArgs = Plotly.Queue.add.calls.first().args[2];
+ Plotly.prependTraces.apply(null, undoArgs);
- it('extend is the inverse of prepend - no maxPoints', function() {
- var cachedData = Lib.extendDeep([], gd.data);
+ expect(gd.data).toEqual(cachedData);
+ });
- Plotly.prependTraces(gd, {
- x: [[3, 4], [4, 5]], 'marker.size': [[0, -1], [5, 6]]
- }, [0, 1]);
+ it("extend is the inverse of prepend - no maxPoints", function() {
+ var cachedData = Lib.extendDeep([], gd.data);
- expect(gd.data).not.toEqual(cachedData);
- expect(Plotly.Queue.add).toHaveBeenCalled();
+ Plotly.prependTraces(
+ gd,
+ { x: [[3, 4], [4, 5]], "marker.size": [[0, -1], [5, 6]] },
+ [0, 1]
+ );
- var undoArgs = Plotly.Queue.add.calls.first().args[2];
+ expect(gd.data).not.toEqual(cachedData);
+ expect(Plotly.Queue.add).toHaveBeenCalled();
- Plotly.extendTraces.apply(null, undoArgs);
+ var undoArgs = Plotly.Queue.add.calls.first().args[2];
- expect(gd.data).toEqual(cachedData);
- });
+ Plotly.extendTraces.apply(null, undoArgs);
+ expect(gd.data).toEqual(cachedData);
+ });
- it('prepend is the inverse of extend - with maxPoints', function() {
- var maxPoints = 3;
- var cachedData = Lib.extendDeep([], gd.data);
+ it("prepend is the inverse of extend - with maxPoints", function() {
+ var maxPoints = 3;
+ var cachedData = Lib.extendDeep([], gd.data);
- Plotly.extendTraces(gd, {
- x: [[3, 4], [4, 5]], 'marker.size': [[0, -1], [5, 6]]
- }, [0, 1], maxPoints);
+ Plotly.extendTraces(
+ gd,
+ { x: [[3, 4], [4, 5]], "marker.size": [[0, -1], [5, 6]] },
+ [0, 1],
+ maxPoints
+ );
- expect(gd.data).not.toEqual(cachedData);
- expect(Plotly.Queue.add).toHaveBeenCalled();
+ expect(gd.data).not.toEqual(cachedData);
+ expect(Plotly.Queue.add).toHaveBeenCalled();
- var undoArgs = Plotly.Queue.add.calls.first().args[2];
+ var undoArgs = Plotly.Queue.add.calls.first().args[2];
- Plotly.prependTraces.apply(null, undoArgs);
+ Plotly.prependTraces.apply(null, undoArgs);
- expect(gd.data).toEqual(cachedData);
- });
+ expect(gd.data).toEqual(cachedData);
});
+ });
- describe('Plotly.purge', function() {
-
- afterEach(destroyGraphDiv);
+ describe("Plotly.purge", function() {
+ afterEach(destroyGraphDiv);
- it('should return the graph div in its original state', function(done) {
- var gd = createGraphDiv();
- var initialKeys = Object.keys(gd);
- var intialHTML = gd.innerHTML;
- var mockData = [{ x: [1, 2, 3], y: [2, 3, 4] }];
+ it("should return the graph div in its original state", function(done) {
+ var gd = createGraphDiv();
+ var initialKeys = Object.keys(gd);
+ var intialHTML = gd.innerHTML;
+ var mockData = [{ x: [1, 2, 3], y: [2, 3, 4] }];
- Plotly.plot(gd, mockData).then(function() {
- Plotly.purge(gd);
+ Plotly.plot(gd, mockData).then(function() {
+ Plotly.purge(gd);
- expect(Object.keys(gd)).toEqual(initialKeys);
- expect(gd.innerHTML).toEqual(intialHTML);
+ expect(Object.keys(gd)).toEqual(initialKeys);
+ expect(gd.innerHTML).toEqual(intialHTML);
- done();
- });
- });
+ done();
+ });
});
-
- describe('Plotly.redraw', function() {
-
- afterEach(destroyGraphDiv);
-
- it('', function(done) {
- var gd = createGraphDiv(),
- initialData = [],
- layout = { title: 'Redraw' };
-
- Plotly.newPlot(gd, initialData, layout);
-
- var trace1 = {
- x: [1, 2, 3, 4],
- y: [4, 1, 5, 3],
- name: 'First Trace'
- };
- var trace2 = {
- x: [1, 2, 3, 4],
- y: [14, 11, 15, 13],
- name: 'Second Trace'
- };
- var trace3 = {
- x: [1, 2, 3, 4],
- y: [5, 3, 7, 1],
- name: 'Third Trace'
- };
-
- var newData = [trace1, trace2, trace3];
- gd.data = newData;
-
- Plotly.redraw(gd).then(function() {
- expect(d3.selectAll('g.trace.scatter').size()).toEqual(3);
- })
- .then(done);
- });
+ });
+
+ describe("Plotly.redraw", function() {
+ afterEach(destroyGraphDiv);
+
+ it("", function(done) {
+ var gd = createGraphDiv(), initialData = [], layout = { title: "Redraw" };
+
+ Plotly.newPlot(gd, initialData, layout);
+
+ var trace1 = {
+ x: [1, 2, 3, 4],
+ y: [4, 1, 5, 3],
+ name: "First Trace"
+ };
+ var trace2 = {
+ x: [1, 2, 3, 4],
+ y: [14, 11, 15, 13],
+ name: "Second Trace"
+ };
+ var trace3 = {
+ x: [1, 2, 3, 4],
+ y: [5, 3, 7, 1],
+ name: "Third Trace"
+ };
+
+ var newData = [trace1, trace2, trace3];
+ gd.data = newData;
+
+ Plotly.redraw(gd)
+ .then(function() {
+ expect(d3.selectAll("g.trace.scatter").size()).toEqual(3);
+ })
+ .then(done);
});
+ });
- describe('cleanData & cleanLayout', function() {
- var gd;
+ describe("cleanData & cleanLayout", function() {
+ var gd;
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(destroyGraphDiv);
-
- it('should rename \'YIGnBu\' colorscales YlGnBu (2dMap case)', function() {
- var data = [{
- type: 'heatmap',
- colorscale: 'YIGnBu'
- }];
-
- Plotly.plot(gd, data);
- expect(gd.data[0].colorscale).toBe('YlGnBu');
- });
-
- it('should rename \'YIGnBu\' colorscales YlGnBu (markerColorscale case)', function() {
- var data = [{
- type: 'scattergeo',
- marker: { colorscale: 'YIGnBu' }
- }];
-
- Plotly.plot(gd, data);
- expect(gd.data[0].marker.colorscale).toBe('YlGnBu');
- });
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
- it('should rename \'YIOrRd\' colorscales YlOrRd (2dMap case)', function() {
- var data = [{
- type: 'contour',
- colorscale: 'YIOrRd'
- }];
+ afterEach(destroyGraphDiv);
- Plotly.plot(gd, data);
- expect(gd.data[0].colorscale).toBe('YlOrRd');
- });
+ it("should rename 'YIGnBu' colorscales YlGnBu (2dMap case)", function() {
+ var data = [{ type: "heatmap", colorscale: "YIGnBu" }];
- it('should rename \'YIOrRd\' colorscales YlOrRd (markerColorscale case)', function() {
- var data = [{
- type: 'scattergeo',
- marker: { colorscale: 'YIOrRd' }
- }];
+ Plotly.plot(gd, data);
+ expect(gd.data[0].colorscale).toBe("YlGnBu");
+ });
- Plotly.plot(gd, data);
- expect(gd.data[0].marker.colorscale).toBe('YlOrRd');
- });
+ it(
+ "should rename 'YIGnBu' colorscales YlGnBu (markerColorscale case)",
+ function() {
+ var data = [{ type: "scattergeo", marker: { colorscale: "YIGnBu" } }];
- it('should rename \'highlightColor\' to \'highlightcolor\')', function() {
- var data = [{
- type: 'surface',
- contours: {
- x: { highlightColor: 'red' },
- y: { highlightcolor: 'blue' }
- }
- }, {
- type: 'surface'
- }, {
- type: 'surface',
- contours: false
- }, {
- type: 'surface',
- contours: {
- stuff: {},
- x: false,
- y: []
- }
- }];
-
- spyOn(Plots.subplotsRegistry.gl3d, 'plot');
-
- Plotly.plot(gd, data);
-
- expect(Plots.subplotsRegistry.gl3d.plot).toHaveBeenCalled();
-
- var contours = gd.data[0].contours;
-
- expect(contours.x.highlightColor).toBeUndefined();
- expect(contours.x.highlightcolor).toEqual('red');
- expect(contours.y.highlightcolor).toEqual('blue');
- expect(contours.z).toBeUndefined();
-
- expect(gd.data[1].contours).toBeUndefined();
- expect(gd.data[2].contours).toBe(false);
- expect(gd.data[3].contours).toEqual({ stuff: {}, x: false, y: [] });
- });
+ Plotly.plot(gd, data);
+ expect(gd.data[0].marker.colorscale).toBe("YlGnBu");
+ }
+ );
- it('should rename \'highlightWidth\' to \'highlightwidth\')', function() {
- var data = [{
- type: 'surface',
- contours: {
- z: { highlightwidth: 'red' },
- y: { highlightWidth: 'blue' }
- }
- }, {
- type: 'surface'
- }];
+ it("should rename 'YIOrRd' colorscales YlOrRd (2dMap case)", function() {
+ var data = [{ type: "contour", colorscale: "YIOrRd" }];
- spyOn(Plots.subplotsRegistry.gl3d, 'plot');
+ Plotly.plot(gd, data);
+ expect(gd.data[0].colorscale).toBe("YlOrRd");
+ });
- Plotly.plot(gd, data);
+ it(
+ "should rename 'YIOrRd' colorscales YlOrRd (markerColorscale case)",
+ function() {
+ var data = [{ type: "scattergeo", marker: { colorscale: "YIOrRd" } }];
+
+ Plotly.plot(gd, data);
+ expect(gd.data[0].marker.colorscale).toBe("YlOrRd");
+ }
+ );
+
+ it("should rename 'highlightColor' to 'highlightcolor')", function() {
+ var data = [
+ {
+ type: "surface",
+ contours: {
+ x: { highlightColor: "red" },
+ y: { highlightcolor: "blue" }
+ }
+ },
+ { type: "surface" },
+ { type: "surface", contours: false },
+ { type: "surface", contours: { stuff: {}, x: false, y: [] } }
+ ];
+
+ spyOn(Plots.subplotsRegistry.gl3d, "plot");
+
+ Plotly.plot(gd, data);
+
+ expect(Plots.subplotsRegistry.gl3d.plot).toHaveBeenCalled();
+
+ var contours = gd.data[0].contours;
+
+ expect(contours.x.highlightColor).toBeUndefined();
+ expect(contours.x.highlightcolor).toEqual("red");
+ expect(contours.y.highlightcolor).toEqual("blue");
+ expect(contours.z).toBeUndefined();
+
+ expect(gd.data[1].contours).toBeUndefined();
+ expect(gd.data[2].contours).toBe(false);
+ expect(gd.data[3].contours).toEqual({ stuff: {}, x: false, y: [] });
+ });
- expect(Plots.subplotsRegistry.gl3d.plot).toHaveBeenCalled();
+ it("should rename 'highlightWidth' to 'highlightwidth')", function() {
+ var data = [
+ {
+ type: "surface",
+ contours: {
+ z: { highlightwidth: "red" },
+ y: { highlightWidth: "blue" }
+ }
+ },
+ { type: "surface" }
+ ];
- var contours = gd.data[0].contours;
+ spyOn(Plots.subplotsRegistry.gl3d, "plot");
- expect(contours.x).toBeUndefined();
- expect(contours.y.highlightwidth).toEqual('blue');
- expect(contours.z.highlightWidth).toBeUndefined();
- expect(contours.z.highlightwidth).toEqual('red');
+ Plotly.plot(gd, data);
- expect(gd.data[1].contours).toBeUndefined();
- });
+ expect(Plots.subplotsRegistry.gl3d.plot).toHaveBeenCalled();
- it('should rename *filtersrc* to *target* in filter transforms', function() {
- var data = [{
- transforms: [{
- type: 'filter',
- filtersrc: 'y'
- }, {
- type: 'filter',
- operation: '<'
- }]
- }, {
- transforms: [{
- type: 'filter',
- target: 'y'
- }]
- }];
-
- Plotly.plot(gd, data);
-
- var trace0 = gd.data[0],
- trace1 = gd.data[1];
-
- expect(trace0.transforms.length).toEqual(2);
- expect(trace0.transforms[0].filtersrc).toBeUndefined();
- expect(trace0.transforms[0].target).toEqual('y');
-
- expect(trace1.transforms.length).toEqual(1);
- expect(trace1.transforms[0].target).toEqual('y');
- });
-
- it('should rename *calendar* to *valuecalendar* in filter transforms', function() {
- var data = [{
- transforms: [{
- type: 'filter',
- target: 'y',
- calendar: 'hebrew'
- }, {
- type: 'filter',
- operation: '<'
- }]
- }, {
- transforms: [{
- type: 'filter',
- valuecalendar: 'jalali'
- }]
- }];
-
- Plotly.plot(gd, data);
-
- var trace0 = gd.data[0],
- trace1 = gd.data[1];
-
- expect(trace0.transforms.length).toEqual(2);
- expect(trace0.transforms[0].calendar).toBeUndefined();
- expect(trace0.transforms[0].valuecalendar).toEqual('hebrew');
-
- expect(trace1.transforms.length).toEqual(1);
- expect(trace1.transforms[0].valuecalendar).toEqual('jalali');
- });
+ var contours = gd.data[0].contours;
- it('should cleanup annotations / shapes refs', function() {
- var data = [{}];
-
- var layout = {
- annotations: [
- { ref: 'paper' },
- null,
- { xref: 'x02', yref: 'y1' }
- ],
- shapes: [
- { xref: 'y', yref: 'x' },
- null,
- { xref: 'x03', yref: 'y1' }
- ]
- };
-
- Plotly.plot(gd, data, layout);
-
- expect(gd.layout.annotations[0]).toEqual({ xref: 'paper', yref: 'paper' });
- expect(gd.layout.annotations[1]).toEqual(null);
- expect(gd.layout.annotations[2]).toEqual({ xref: 'x2', yref: 'y' });
-
- expect(gd.layout.shapes[0].xref).toBeUndefined();
- expect(gd.layout.shapes[0].yref).toBeUndefined();
- expect(gd.layout.shapes[1]).toEqual(null);
- expect(gd.layout.shapes[2].xref).toEqual('x3');
- expect(gd.layout.shapes[2].yref).toEqual('y');
+ expect(contours.x).toBeUndefined();
+ expect(contours.y.highlightwidth).toEqual("blue");
+ expect(contours.z.highlightWidth).toBeUndefined();
+ expect(contours.z.highlightwidth).toEqual("red");
- });
+ expect(gd.data[1].contours).toBeUndefined();
});
- describe('Plotly.newPlot', function() {
- var gd;
+ it(
+ "should rename *filtersrc* to *target* in filter transforms",
+ function() {
+ var data = [
+ {
+ transforms: [
+ { type: "filter", filtersrc: "y" },
+ { type: "filter", operation: "<" }
+ ]
+ },
+ { transforms: [{ type: "filter", target: "y" }] }
+ ];
+
+ Plotly.plot(gd, data);
+
+ var trace0 = gd.data[0], trace1 = gd.data[1];
+
+ expect(trace0.transforms.length).toEqual(2);
+ expect(trace0.transforms[0].filtersrc).toBeUndefined();
+ expect(trace0.transforms[0].target).toEqual("y");
+
+ expect(trace1.transforms.length).toEqual(1);
+ expect(trace1.transforms[0].target).toEqual("y");
+ }
+ );
+
+ it(
+ "should rename *calendar* to *valuecalendar* in filter transforms",
+ function() {
+ var data = [
+ {
+ transforms: [
+ { type: "filter", target: "y", calendar: "hebrew" },
+ { type: "filter", operation: "<" }
+ ]
+ },
+ { transforms: [{ type: "filter", valuecalendar: "jalali" }] }
+ ];
+
+ Plotly.plot(gd, data);
+
+ var trace0 = gd.data[0], trace1 = gd.data[1];
+
+ expect(trace0.transforms.length).toEqual(2);
+ expect(trace0.transforms[0].calendar).toBeUndefined();
+ expect(trace0.transforms[0].valuecalendar).toEqual("hebrew");
+
+ expect(trace1.transforms.length).toEqual(1);
+ expect(trace1.transforms[0].valuecalendar).toEqual("jalali");
+ }
+ );
+
+ it("should cleanup annotations / shapes refs", function() {
+ var data = [{}];
+
+ var layout = {
+ annotations: [{ ref: "paper" }, null, { xref: "x02", yref: "y1" }],
+ shapes: [{ xref: "y", yref: "x" }, null, { xref: "x03", yref: "y1" }]
+ };
+
+ Plotly.plot(gd, data, layout);
+
+ expect(gd.layout.annotations[0]).toEqual({
+ xref: "paper",
+ yref: "paper"
+ });
+ expect(gd.layout.annotations[1]).toEqual(null);
+ expect(gd.layout.annotations[2]).toEqual({ xref: "x2", yref: "y" });
+
+ expect(gd.layout.shapes[0].xref).toBeUndefined();
+ expect(gd.layout.shapes[0].yref).toBeUndefined();
+ expect(gd.layout.shapes[1]).toEqual(null);
+ expect(gd.layout.shapes[2].xref).toEqual("x3");
+ expect(gd.layout.shapes[2].yref).toEqual("y");
+ });
+ });
- beforeEach(function() {
- gd = createGraphDiv();
- });
+ describe("Plotly.newPlot", function() {
+ var gd;
- afterEach(destroyGraphDiv);
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
- it('should respect layout.width and layout.height', function(done) {
+ afterEach(destroyGraphDiv);
- // See issue https://github.com/plotly/plotly.js/issues/537
- var data = [{
- x: [1, 2],
- y: [1, 2]
- }];
+ it("should respect layout.width and layout.height", function(done) {
+ // See issue https://github.com/plotly/plotly.js/issues/537
+ var data = [{ x: [1, 2], y: [1, 2] }];
- Plotly.plot(gd, data).then(function() {
- var height = 50;
+ Plotly.plot(gd, data).then(function() {
+ var height = 50;
- Plotly.newPlot(gd, data, { height: height }).then(function() {
- var fullLayout = gd._fullLayout,
- svg = document.getElementsByClassName('main-svg')[0];
+ Plotly.newPlot(gd, data, { height: height })
+ .then(function() {
+ var fullLayout = gd._fullLayout,
+ svg = document.getElementsByClassName("main-svg")[0];
- expect(fullLayout.height).toBe(height);
- expect(+svg.getAttribute('height')).toBe(height);
- }).then(done);
- });
- });
+ expect(fullLayout.height).toBe(height);
+ expect(+svg.getAttribute("height")).toBe(height);
+ })
+ .then(done);
+ });
});
+ });
- describe('Plotly.update should', function() {
- var gd, data, layout, calcdata;
+ describe("Plotly.update should", function() {
+ var gd, data, layout, calcdata;
- beforeAll(function() {
- Object.keys(subroutines).forEach(function(k) {
- spyOn(subroutines, k).and.callThrough();
- });
- });
+ beforeAll(function() {
+ Object.keys(subroutines).forEach(function(k) {
+ spyOn(subroutines, k).and.callThrough();
+ });
+ });
- beforeEach(function(done) {
- gd = createGraphDiv();
- Plotly.plot(gd, [{ y: [2, 1, 2] }]).then(function() {
- data = gd.data;
- layout = gd.layout;
- calcdata = gd.calcdata;
- done();
- });
- });
+ beforeEach(function(done) {
+ gd = createGraphDiv();
+ Plotly.plot(gd, [{ y: [2, 1, 2] }]).then(function() {
+ data = gd.data;
+ layout = gd.layout;
+ calcdata = gd.calcdata;
+ done();
+ });
+ });
- afterEach(destroyGraphDiv);
+ afterEach(destroyGraphDiv);
- it('call doTraceStyle on trace style updates', function(done) {
- expect(subroutines.doTraceStyle).not.toHaveBeenCalled();
+ it("call doTraceStyle on trace style updates", function(done) {
+ expect(subroutines.doTraceStyle).not.toHaveBeenCalled();
- Plotly.update(gd, { 'marker.color': 'blue' }).then(function() {
- expect(subroutines.doTraceStyle).toHaveBeenCalledTimes(1);
- expect(calcdata).toBe(gd.calcdata);
- done();
- });
- });
+ Plotly.update(gd, { "marker.color": "blue" }).then(function() {
+ expect(subroutines.doTraceStyle).toHaveBeenCalledTimes(1);
+ expect(calcdata).toBe(gd.calcdata);
+ done();
+ });
+ });
- it('clear calcdata on data updates', function(done) {
- Plotly.update(gd, { x: [[3, 1, 3]] }).then(function() {
- expect(data).toBe(gd.data);
- expect(layout).toBe(gd.layout);
- expect(calcdata).not.toBe(gd.calcdata);
- done();
- });
- });
+ it("clear calcdata on data updates", function(done) {
+ Plotly.update(gd, { x: [[3, 1, 3]] }).then(function() {
+ expect(data).toBe(gd.data);
+ expect(layout).toBe(gd.layout);
+ expect(calcdata).not.toBe(gd.calcdata);
+ done();
+ });
+ });
- it('clear calcdata on data + axis updates w/o extending current gd.data', function(done) {
- var traceUpdate = {
- x: [[3, 1, 3]]
- };
+ it(
+ "clear calcdata on data + axis updates w/o extending current gd.data",
+ function(done) {
+ var traceUpdate = { x: [[3, 1, 3]] };
- var layoutUpdate = {
- xaxis: {title: 'A', type: '-'}
- };
+ var layoutUpdate = { xaxis: { title: "A", type: "-" } };
- Plotly.update(gd, traceUpdate, layoutUpdate).then(function() {
- expect(data).toBe(gd.data);
- expect(layout).toBe(gd.layout);
- expect(calcdata).not.toBe(gd.calcdata);
+ Plotly.update(gd, traceUpdate, layoutUpdate).then(function() {
+ expect(data).toBe(gd.data);
+ expect(layout).toBe(gd.layout);
+ expect(calcdata).not.toBe(gd.calcdata);
- expect(gd.data.length).toEqual(1);
+ expect(gd.data.length).toEqual(1);
- done();
- });
+ done();
});
+ }
+ );
- it('call doLegend on legend updates', function(done) {
- expect(subroutines.doLegend).not.toHaveBeenCalled();
+ it("call doLegend on legend updates", function(done) {
+ expect(subroutines.doLegend).not.toHaveBeenCalled();
- Plotly.update(gd, {}, { 'showlegend': true }).then(function() {
- expect(subroutines.doLegend).toHaveBeenCalledTimes(1);
- expect(calcdata).toBe(gd.calcdata);
- done();
- });
- });
+ Plotly.update(gd, {}, { showlegend: true }).then(function() {
+ expect(subroutines.doLegend).toHaveBeenCalledTimes(1);
+ expect(calcdata).toBe(gd.calcdata);
+ done();
+ });
+ });
- it('call layoutReplot when adding update menu', function(done) {
- expect(subroutines.layoutReplot).not.toHaveBeenCalled();
-
- var layoutUpdate = {
- updatemenus: [{
- buttons: [{
- method: 'relayout',
- args: ['title', 'Hello World']
- }]
- }]
- };
-
- Plotly.update(gd, {}, layoutUpdate).then(function() {
- expect(subroutines.doLegend).toHaveBeenCalledTimes(1);
- expect(calcdata).toBe(gd.calcdata);
- done();
- });
- });
+ it("call layoutReplot when adding update menu", function(done) {
+ expect(subroutines.layoutReplot).not.toHaveBeenCalled();
+
+ var layoutUpdate = {
+ updatemenus: [
+ {
+ buttons: [{ method: "relayout", args: ["title", "Hello World"] }]
+ }
+ ]
+ };
+
+ Plotly.update(gd, {}, layoutUpdate).then(function() {
+ expect(subroutines.doLegend).toHaveBeenCalledTimes(1);
+ expect(calcdata).toBe(gd.calcdata);
+ done();
+ });
+ });
- it('call doModeBar when updating \'dragmode\'', function(done) {
- expect(subroutines.doModeBar).not.toHaveBeenCalled();
+ it("call doModeBar when updating 'dragmode'", function(done) {
+ expect(subroutines.doModeBar).not.toHaveBeenCalled();
- Plotly.update(gd, {}, { 'dragmode': 'pan' }).then(function() {
- expect(subroutines.doModeBar).toHaveBeenCalledTimes(1);
- expect(calcdata).toBe(gd.calcdata);
- done();
- });
- });
+ Plotly.update(gd, {}, { dragmode: "pan" }).then(function() {
+ expect(subroutines.doModeBar).toHaveBeenCalledTimes(1);
+ expect(calcdata).toBe(gd.calcdata);
+ done();
+ });
});
+ });
});
diff --git a/test/jasmine/tests/plot_interact_test.js b/test/jasmine/tests/plot_interact_test.js
index d6a0efda994..c7335b61adb 100644
--- a/test/jasmine/tests/plot_interact_test.js
+++ b/test/jasmine/tests/plot_interact_test.js
@@ -1,675 +1,721 @@
-var d3 = require('d3');
+var d3 = require("d3");
-var Plotly = require('@lib/index');
-var Lib = require('@src/lib');
+var Plotly = require("@lib/index");
+var Lib = require("@src/lib");
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var customMatchers = require('../assets/custom_matchers');
-var mouseEvent = require('../assets/mouse_event');
-var selectButton = require('../assets/modebar_button');
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var customMatchers = require("../assets/custom_matchers");
+var mouseEvent = require("../assets/mouse_event");
+var selectButton = require("../assets/modebar_button");
var MODEBAR_DELAY = 500;
-describe('Test plot structure', function() {
- 'use strict';
+describe("Test plot structure", function() {
+ "use strict";
+ function assertNamespaces(node) {
+ expect(node.getAttribute("xmlns")).toEqual("http://www.w3.org/2000/svg");
+ expect(node.getAttribute("xmlns:xlink")).toEqual(
+ "http://www.w3.org/1999/xlink"
+ );
+ }
- function assertNamespaces(node) {
- expect(node.getAttribute('xmlns'))
- .toEqual('http://www.w3.org/2000/svg');
- expect(node.getAttribute('xmlns:xlink'))
- .toEqual('http://www.w3.org/1999/xlink');
- }
-
- afterEach(destroyGraphDiv);
-
- describe('cartesian plots', function() {
-
- function countSubplots() {
- return d3.selectAll('g.subplot').size();
- }
+ afterEach(destroyGraphDiv);
- function countScatterTraces() {
- return d3.selectAll('g.trace.scatter').size();
- }
+ describe("cartesian plots", function() {
+ function countSubplots() {
+ return d3.selectAll("g.subplot").size();
+ }
- function countColorBars() {
- return d3.selectAll('rect.cbbg').size();
- }
+ function countScatterTraces() {
+ return d3.selectAll("g.trace.scatter").size();
+ }
- function countClipPaths() {
- return d3.selectAll('defs').selectAll('.axesclip,.plotclip').size();
- }
+ function countColorBars() {
+ return d3.selectAll("rect.cbbg").size();
+ }
- function countDraggers() {
- return d3.selectAll('g.draglayer').selectAll('g').size();
- }
+ function countClipPaths() {
+ return d3.selectAll("defs").selectAll(".axesclip,.plotclip").size();
+ }
- describe('scatter traces', function() {
- var mock = require('@mocks/14.json');
- var gd;
+ function countDraggers() {
+ return d3.selectAll("g.draglayer").selectAll("g").size();
+ }
- beforeEach(function(done) {
- gd = createGraphDiv();
+ describe("scatter traces", function() {
+ var mock = require("@mocks/14.json");
+ var gd;
- var mockData = Lib.extendDeep([], mock.data),
- mockLayout = Lib.extendDeep({}, mock.layout);
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- Plotly.plot(gd, mockData, mockLayout).then(done);
- });
+ var mockData = Lib.extendDeep([], mock.data),
+ mockLayout = Lib.extendDeep({}, mock.layout);
- it('has one *subplot xy* node', function() {
- expect(countSubplots()).toEqual(1);
- });
+ Plotly.plot(gd, mockData, mockLayout).then(done);
+ });
- it('has four clip paths', function() {
- expect(countClipPaths()).toEqual(4);
- });
+ it("has one *subplot xy* node", function() {
+ expect(countSubplots()).toEqual(1);
+ });
- it('has one dragger group', function() {
- expect(countDraggers()).toEqual(1);
- });
+ it("has four clip paths", function() {
+ expect(countClipPaths()).toEqual(4);
+ });
- it('has one *scatterlayer* node', function() {
- var nodes = d3.selectAll('g.scatterlayer');
- expect(nodes.size()).toEqual(1);
- });
+ it("has one dragger group", function() {
+ expect(countDraggers()).toEqual(1);
+ });
- it('has as many *trace scatter* nodes as there are traces', function() {
- expect(countScatterTraces()).toEqual(mock.data.length);
- });
+ it("has one *scatterlayer* node", function() {
+ var nodes = d3.selectAll("g.scatterlayer");
+ expect(nodes.size()).toEqual(1);
+ });
- it('has as many *point* nodes as there are traces', function() {
- var nodes = d3.selectAll('path.point');
+ it("has as many *trace scatter* nodes as there are traces", function() {
+ expect(countScatterTraces()).toEqual(mock.data.length);
+ });
- var Npts = 0;
- mock.data.forEach(function(trace) {
- Npts += trace.x.length;
- });
+ it("has as many *point* nodes as there are traces", function() {
+ var nodes = d3.selectAll("path.point");
- expect(nodes.size()).toEqual(Npts);
- });
-
- it('has the correct name spaces', function() {
- var mainSVGs = d3.selectAll('.main-svg');
-
- mainSVGs.each(function() {
- var node = this;
- assertNamespaces(node);
- });
- });
-
- it('should be able to get deleted', function(done) {
- expect(countScatterTraces()).toEqual(mock.data.length);
- expect(countSubplots()).toEqual(1);
-
- Plotly.deleteTraces(gd, [0]).then(function() {
- expect(countScatterTraces()).toEqual(0);
- expect(countSubplots()).toEqual(1);
- expect(countClipPaths()).toEqual(4);
- expect(countDraggers()).toEqual(1);
-
- return Plotly.relayout(gd, {xaxis: null, yaxis: null});
- }).then(function() {
- expect(countScatterTraces()).toEqual(0);
- expect(countSubplots()).toEqual(0);
- expect(countClipPaths()).toEqual(0);
- expect(countDraggers()).toEqual(0);
-
- done();
- });
- });
-
- it('should restore layout axes when they get deleted', function(done) {
- jasmine.addMatchers(customMatchers);
-
- expect(countScatterTraces()).toEqual(mock.data.length);
- expect(countSubplots()).toEqual(1);
-
- Plotly.relayout(gd, {xaxis: null, yaxis: null}).then(function() {
- expect(countScatterTraces()).toEqual(1);
- expect(countSubplots()).toEqual(1);
- expect(gd.layout.xaxis.range).toBeCloseToArray([-4.79980, 74.48580], 4);
- expect(gd.layout.yaxis.range).toBeCloseToArray([-1.2662, 17.67023], 4);
-
- return Plotly.relayout(gd, 'xaxis', null);
- }).then(function() {
- expect(countScatterTraces()).toEqual(1);
- expect(countSubplots()).toEqual(1);
- expect(gd.layout.xaxis.range).toBeCloseToArray([-4.79980, 74.48580], 4);
- expect(gd.layout.yaxis.range).toBeCloseToArray([-1.2662, 17.67023], 4);
-
- return Plotly.relayout(gd, 'xaxis', {});
- }).then(function() {
- expect(countScatterTraces()).toEqual(1);
- expect(countSubplots()).toEqual(1);
- expect(gd.layout.xaxis.range).toBeCloseToArray([-4.79980, 74.48580], 4);
- expect(gd.layout.yaxis.range).toBeCloseToArray([-1.2662, 17.67023], 4);
-
- return Plotly.relayout(gd, 'yaxis', null);
- }).then(function() {
- expect(countScatterTraces()).toEqual(1);
- expect(countSubplots()).toEqual(1);
- expect(gd.layout.xaxis.range).toBeCloseToArray([-4.79980, 74.48580], 4);
- expect(gd.layout.yaxis.range).toBeCloseToArray([-1.2662, 17.67023], 4);
-
- return Plotly.relayout(gd, 'yaxis', {});
- }).then(function() {
- expect(countScatterTraces()).toEqual(1);
- expect(countSubplots()).toEqual(1);
- expect(gd.layout.xaxis.range).toBeCloseToArray([-4.79980, 74.48580], 4);
- expect(gd.layout.yaxis.range).toBeCloseToArray([-1.2662, 17.67023], 4);
-
- done();
- });
- });
+ var Npts = 0;
+ mock.data.forEach(function(trace) {
+ Npts += trace.x.length;
});
- describe('scatter drag', function() {
-
- var mock = require('@mocks/10.json'),
- gd, modeBar, relayoutCallback;
-
- beforeEach(function(done) {
- gd = createGraphDiv();
-
- Plotly.plot(gd, mock.data, mock.layout).then(function() {
-
- modeBar = gd._fullLayout._modeBar;
- relayoutCallback = jasmine.createSpy('relayoutCallback');
-
- gd.on('plotly_relayout', relayoutCallback);
-
- done();
- });
- });
-
- it('scatter plot should respond to drag interactions', function(done) {
-
- jasmine.addMatchers(customMatchers);
-
- var precision = 5;
-
- var buttonPan = selectButton(modeBar, 'pan2d');
-
- var originalX = [-0.6225, 5.5];
- var originalY = [-1.6340975059013805, 7.166241526218911];
-
- var newX = [-2.0255729166666665, 4.096927083333333];
- var newY = [-0.3769062155984817, 8.42343281652181];
-
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
-
- // Switch to pan mode
- expect(buttonPan.isActive()).toBe(false); // initially, zoom is active
- buttonPan.click();
- expect(buttonPan.isActive()).toBe(true); // switched on dragmode
-
- // Switching mode must not change visible range
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
-
- setTimeout(function() {
-
- expect(relayoutCallback).toHaveBeenCalledTimes(1);
- relayoutCallback.calls.reset();
-
- // Drag scene along the X axis
-
- mouseEvent('mousedown', 110, 150);
- mouseEvent('mousemove', 220, 150);
- mouseEvent('mouseup', 220, 150);
-
- expect(gd.layout.xaxis.range).toBeCloseToArray(newX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+ expect(nodes.size()).toEqual(Npts);
+ });
- // Drag scene back along the X axis (not from the same starting point but same X delta)
+ it("has the correct name spaces", function() {
+ var mainSVGs = d3.selectAll(".main-svg");
- mouseEvent('mousedown', 280, 150);
- mouseEvent('mousemove', 170, 150);
- mouseEvent('mouseup', 170, 150);
+ mainSVGs.each(function() {
+ var node = this;
+ assertNamespaces(node);
+ });
+ });
+
+ it("should be able to get deleted", function(done) {
+ expect(countScatterTraces()).toEqual(mock.data.length);
+ expect(countSubplots()).toEqual(1);
+
+ Plotly.deleteTraces(gd, [0])
+ .then(function() {
+ expect(countScatterTraces()).toEqual(0);
+ expect(countSubplots()).toEqual(1);
+ expect(countClipPaths()).toEqual(4);
+ expect(countDraggers()).toEqual(1);
+
+ return Plotly.relayout(gd, { xaxis: null, yaxis: null });
+ })
+ .then(function() {
+ expect(countScatterTraces()).toEqual(0);
+ expect(countSubplots()).toEqual(0);
+ expect(countClipPaths()).toEqual(0);
+ expect(countDraggers()).toEqual(0);
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+ done();
+ });
+ });
+
+ it("should restore layout axes when they get deleted", function(done) {
+ jasmine.addMatchers(customMatchers);
+
+ expect(countScatterTraces()).toEqual(mock.data.length);
+ expect(countSubplots()).toEqual(1);
+
+ Plotly.relayout(gd, { xaxis: null, yaxis: null })
+ .then(function() {
+ expect(countScatterTraces()).toEqual(1);
+ expect(countSubplots()).toEqual(1);
+ expect(gd.layout.xaxis.range).toBeCloseToArray(
+ [-4.79980, 74.48580],
+ 4
+ );
+ expect(gd.layout.yaxis.range).toBeCloseToArray(
+ [-1.2662, 17.67023],
+ 4
+ );
+
+ return Plotly.relayout(gd, "xaxis", null);
+ })
+ .then(function() {
+ expect(countScatterTraces()).toEqual(1);
+ expect(countSubplots()).toEqual(1);
+ expect(gd.layout.xaxis.range).toBeCloseToArray(
+ [-4.79980, 74.48580],
+ 4
+ );
+ expect(gd.layout.yaxis.range).toBeCloseToArray(
+ [-1.2662, 17.67023],
+ 4
+ );
+
+ return Plotly.relayout(gd, "xaxis", {});
+ })
+ .then(function() {
+ expect(countScatterTraces()).toEqual(1);
+ expect(countSubplots()).toEqual(1);
+ expect(gd.layout.xaxis.range).toBeCloseToArray(
+ [-4.79980, 74.48580],
+ 4
+ );
+ expect(gd.layout.yaxis.range).toBeCloseToArray(
+ [-1.2662, 17.67023],
+ 4
+ );
+
+ return Plotly.relayout(gd, "yaxis", null);
+ })
+ .then(function() {
+ expect(countScatterTraces()).toEqual(1);
+ expect(countSubplots()).toEqual(1);
+ expect(gd.layout.xaxis.range).toBeCloseToArray(
+ [-4.79980, 74.48580],
+ 4
+ );
+ expect(gd.layout.yaxis.range).toBeCloseToArray(
+ [-1.2662, 17.67023],
+ 4
+ );
+
+ return Plotly.relayout(gd, "yaxis", {});
+ })
+ .then(function() {
+ expect(countScatterTraces()).toEqual(1);
+ expect(countSubplots()).toEqual(1);
+ expect(gd.layout.xaxis.range).toBeCloseToArray(
+ [-4.79980, 74.48580],
+ 4
+ );
+ expect(gd.layout.yaxis.range).toBeCloseToArray(
+ [-1.2662, 17.67023],
+ 4
+ );
- // Drag scene along the Y axis
+ done();
+ });
+ });
+ });
- mouseEvent('mousedown', 110, 150);
- mouseEvent('mousemove', 110, 190);
- mouseEvent('mouseup', 110, 190);
+ describe("scatter drag", function() {
+ var mock = require("@mocks/10.json"), gd, modeBar, relayoutCallback;
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(newY, precision);
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- // Drag scene back along the Y axis (not from the same starting point but same Y delta)
+ Plotly.plot(gd, mock.data, mock.layout).then(function() {
+ modeBar = gd._fullLayout._modeBar;
+ relayoutCallback = jasmine.createSpy("relayoutCallback");
- mouseEvent('mousedown', 280, 130);
- mouseEvent('mousemove', 280, 90);
- mouseEvent('mouseup', 280, 90);
+ gd.on("plotly_relayout", relayoutCallback);
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+ done();
+ });
+ });
+
+ it("scatter plot should respond to drag interactions", function(done) {
+ jasmine.addMatchers(customMatchers);
+
+ var precision = 5;
+
+ var buttonPan = selectButton(modeBar, "pan2d");
+
+ var originalX = [-0.6225, 5.5];
+ var originalY = [-1.6340975059013805, 7.166241526218911];
+
+ var newX = [-2.0255729166666665, 4.096927083333333];
+ var newY = [-0.3769062155984817, 8.42343281652181];
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+
+ // Switch to pan mode
+ expect(buttonPan.isActive()).toBe(false);
+ // initially, zoom is active
+ buttonPan.click();
+ expect(buttonPan.isActive()).toBe(true);
+
+ // switched on dragmode
+ // Switching mode must not change visible range
+ expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+
+ setTimeout(
+ function() {
+ expect(relayoutCallback).toHaveBeenCalledTimes(1);
+ relayoutCallback.calls.reset();
+
+ // Drag scene along the X axis
+ mouseEvent("mousedown", 110, 150);
+ mouseEvent("mousemove", 220, 150);
+ mouseEvent("mouseup", 220, 150);
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray(newX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(
+ originalY,
+ precision
+ );
+
+ // Drag scene back along the X axis (not from the same starting point but same X delta)
+ mouseEvent("mousedown", 280, 150);
+ mouseEvent("mousemove", 170, 150);
+ mouseEvent("mouseup", 170, 150);
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray(
+ originalX,
+ precision
+ );
+ expect(gd.layout.yaxis.range).toBeCloseToArray(
+ originalY,
+ precision
+ );
+
+ // Drag scene along the Y axis
+ mouseEvent("mousedown", 110, 150);
+ mouseEvent("mousemove", 110, 190);
+ mouseEvent("mouseup", 110, 190);
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray(
+ originalX,
+ precision
+ );
+ expect(gd.layout.yaxis.range).toBeCloseToArray(newY, precision);
+
+ // Drag scene back along the Y axis (not from the same starting point but same Y delta)
+ mouseEvent("mousedown", 280, 130);
+ mouseEvent("mousemove", 280, 90);
+ mouseEvent("mouseup", 280, 90);
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray(
+ originalX,
+ precision
+ );
+ expect(gd.layout.yaxis.range).toBeCloseToArray(
+ originalY,
+ precision
+ );
+
+ // Drag scene along both the X and Y axis
+ mouseEvent("mousedown", 110, 150);
+ mouseEvent("mousemove", 220, 190);
+ mouseEvent("mouseup", 220, 190);
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray(newX, precision);
+ expect(gd.layout.yaxis.range).toBeCloseToArray(newY, precision);
+
+ // Drag scene back along the X and Y axis (not from the same starting point but same delta vector)
+ mouseEvent("mousedown", 280, 130);
+ mouseEvent("mousemove", 170, 90);
+ mouseEvent("mouseup", 170, 90);
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray(
+ originalX,
+ precision
+ );
+ expect(gd.layout.yaxis.range).toBeCloseToArray(
+ originalY,
+ precision
+ );
+
+ setTimeout(
+ function() {
+ expect(relayoutCallback).toHaveBeenCalledTimes(6);
+
+ // X and back; Y and back; XY and back
+ done();
+ },
+ MODEBAR_DELAY
+ );
+ },
+ MODEBAR_DELAY
+ );
+ });
+ });
- // Drag scene along both the X and Y axis
+ describe("contour/heatmap traces", function() {
+ var mock = require("@mocks/connectgaps_2d.json");
+ var gd;
- mouseEvent('mousedown', 110, 150);
- mouseEvent('mousemove', 220, 190);
- mouseEvent('mouseup', 220, 190);
+ function extendMock() {
+ var mockData = Lib.extendDeep([], mock.data),
+ mockLayout = Lib.extendDeep({}, mock.layout);
- expect(gd.layout.xaxis.range).toBeCloseToArray(newX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(newY, precision);
+ // add a colorbar for testing
+ mockData[0].showscale = true;
- // Drag scene back along the X and Y axis (not from the same starting point but same delta vector)
+ return { data: mockData, layout: mockLayout };
+ }
- mouseEvent('mousedown', 280, 130);
- mouseEvent('mousemove', 170, 90);
- mouseEvent('mouseup', 170, 90);
+ function assertHeatmapNodes(expectedCnt) {
+ var hmNodes = d3.selectAll("g.hm");
+ expect(hmNodes.size()).toEqual(expectedCnt);
- expect(gd.layout.xaxis.range).toBeCloseToArray(originalX, precision);
- expect(gd.layout.yaxis.range).toBeCloseToArray(originalY, precision);
+ var imageNodes = d3.selectAll("image");
+ expect(imageNodes.size()).toEqual(expectedCnt);
+ }
- setTimeout(function() {
+ function assertContourNodes(expectedCnt) {
+ var nodes = d3.selectAll("g.contour");
+ expect(nodes.size()).toEqual(expectedCnt);
+ }
- expect(relayoutCallback).toHaveBeenCalledTimes(6); // X and back; Y and back; XY and back
+ describe("initial structure", function() {
+ beforeEach(function(done) {
+ var mockCopy = extendMock();
+ var gd = createGraphDiv();
- done();
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- }, MODEBAR_DELAY);
+ it("has four *subplot* nodes", function() {
+ expect(countSubplots()).toEqual(4);
+ expect(countClipPaths()).toEqual(12);
+ expect(countDraggers()).toEqual(4);
+ });
- }, MODEBAR_DELAY);
- });
+ it("has four heatmap image nodes", function() {
+ // N.B. the contour traces both have a heatmap fill
+ assertHeatmapNodes(4);
});
- describe('contour/heatmap traces', function() {
- var mock = require('@mocks/connectgaps_2d.json');
- var gd;
-
- function extendMock() {
- var mockData = Lib.extendDeep([], mock.data),
- mockLayout = Lib.extendDeep({}, mock.layout);
-
- // add a colorbar for testing
- mockData[0].showscale = true;
-
- return {
- data: mockData,
- layout: mockLayout
- };
- }
-
- function assertHeatmapNodes(expectedCnt) {
- var hmNodes = d3.selectAll('g.hm');
- expect(hmNodes.size()).toEqual(expectedCnt);
-
- var imageNodes = d3.selectAll('image');
- expect(imageNodes.size()).toEqual(expectedCnt);
- }
-
- function assertContourNodes(expectedCnt) {
- var nodes = d3.selectAll('g.contour');
- expect(nodes.size()).toEqual(expectedCnt);
- }
-
- describe('initial structure', function() {
- beforeEach(function(done) {
- var mockCopy = extendMock();
- var gd = createGraphDiv();
-
- Plotly.plot(gd, mockCopy.data, mockCopy.layout)
- .then(done);
- });
-
- it('has four *subplot* nodes', function() {
- expect(countSubplots()).toEqual(4);
- expect(countClipPaths()).toEqual(12);
- expect(countDraggers()).toEqual(4);
- });
-
- it('has four heatmap image nodes', function() {
- // N.B. the contour traces both have a heatmap fill
- assertHeatmapNodes(4);
- });
-
- it('has two contour nodes', function() {
- assertContourNodes(2);
- });
-
- it('has one colorbar nodes', function() {
- expect(countColorBars()).toEqual(1);
- });
- });
+ it("has two contour nodes", function() {
+ assertContourNodes(2);
+ });
- describe('structure after restyle', function() {
- beforeEach(function(done) {
- var mockCopy = extendMock();
- var gd = createGraphDiv();
+ it("has one colorbar nodes", function() {
+ expect(countColorBars()).toEqual(1);
+ });
+ });
- Plotly.plot(gd, mockCopy.data, mockCopy.layout);
+ describe("structure after restyle", function() {
+ beforeEach(function(done) {
+ var mockCopy = extendMock();
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout);
+
+ Plotly.restyle(
+ gd,
+ {
+ type: "scatter",
+ x: [[1, 2, 3]],
+ y: [[2, 1, 2]],
+ z: null
+ },
+ 0
+ );
- Plotly.restyle(gd, {
- type: 'scatter',
- x: [[1, 2, 3]],
- y: [[2, 1, 2]],
- z: null
- }, 0);
+ Plotly.restyle(gd, "type", "contour", 1);
- Plotly.restyle(gd, 'type', 'contour', 1);
+ Plotly.restyle(gd, "type", "heatmap", 2).then(done);
+ });
- Plotly.restyle(gd, 'type', 'heatmap', 2)
- .then(done);
- });
+ it("has four *subplot* nodes", function() {
+ expect(countSubplots()).toEqual(4);
+ expect(countClipPaths()).toEqual(12);
+ expect(countDraggers()).toEqual(4);
+ });
- it('has four *subplot* nodes', function() {
- expect(countSubplots()).toEqual(4);
- expect(countClipPaths()).toEqual(12);
- expect(countDraggers()).toEqual(4);
- });
+ it("has two heatmap image nodes", function() {
+ assertHeatmapNodes(2);
+ });
- it('has two heatmap image nodes', function() {
- assertHeatmapNodes(2);
- });
+ it("has two contour nodes", function() {
+ assertContourNodes(2);
+ });
- it('has two contour nodes', function() {
- assertContourNodes(2);
- });
+ it("has one scatter node", function() {
+ expect(countScatterTraces()).toEqual(1);
+ });
- it('has one scatter node', function() {
- expect(countScatterTraces()).toEqual(1);
- });
+ it("has no colorbar node", function() {
+ expect(countColorBars()).toEqual(0);
+ });
+ });
- it('has no colorbar node', function() {
- expect(countColorBars()).toEqual(0);
- });
- });
+ describe("structure after deleteTraces", function() {
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- describe('structure after deleteTraces', function() {
- beforeEach(function(done) {
- gd = createGraphDiv();
-
- var mockCopy = extendMock();
- Plotly.plot(gd, mockCopy.data, mockCopy.layout)
- .then(done);
- });
-
- it('should be removed of traces in sequence', function(done) {
- expect(countSubplots()).toEqual(4);
- assertHeatmapNodes(4);
- assertContourNodes(2);
- expect(countColorBars()).toEqual(1);
-
- Plotly.deleteTraces(gd, [0]).then(function() {
- expect(countSubplots()).toEqual(4);
- expect(countClipPaths()).toEqual(12);
- expect(countDraggers()).toEqual(4);
- assertHeatmapNodes(3);
- assertContourNodes(2);
- expect(countColorBars()).toEqual(0);
-
- return Plotly.deleteTraces(gd, [0]);
- }).then(function() {
- expect(countSubplots()).toEqual(4);
- expect(countClipPaths()).toEqual(12);
- expect(countDraggers()).toEqual(4);
- assertHeatmapNodes(2);
- assertContourNodes(2);
- expect(countColorBars()).toEqual(0);
-
- return Plotly.deleteTraces(gd, [0]);
- }).then(function() {
- expect(countSubplots()).toEqual(4);
- expect(countClipPaths()).toEqual(12);
- expect(countDraggers()).toEqual(4);
- assertHeatmapNodes(1);
- assertContourNodes(1);
- expect(countColorBars()).toEqual(0);
-
- return Plotly.deleteTraces(gd, [0]);
- }).then(function() {
- expect(countSubplots()).toEqual(3);
- expect(countClipPaths()).toEqual(11);
- expect(countDraggers()).toEqual(3);
- assertHeatmapNodes(0);
- assertContourNodes(0);
- expect(countColorBars()).toEqual(0);
-
- var update = {
- xaxis: null,
- yaxis: null,
- xaxis2: null,
- yaxis2: null
- };
-
- return Plotly.relayout(gd, update);
- }).then(function() {
- expect(countSubplots()).toEqual(0);
- expect(countClipPaths()).toEqual(0);
- expect(countDraggers()).toEqual(0);
- assertHeatmapNodes(0);
- assertContourNodes(0);
- expect(countColorBars()).toEqual(0);
-
- done();
- });
- });
+ var mockCopy = extendMock();
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
+ it("should be removed of traces in sequence", function(done) {
+ expect(countSubplots()).toEqual(4);
+ assertHeatmapNodes(4);
+ assertContourNodes(2);
+ expect(countColorBars()).toEqual(1);
+
+ Plotly.deleteTraces(gd, [0])
+ .then(function() {
+ expect(countSubplots()).toEqual(4);
+ expect(countClipPaths()).toEqual(12);
+ expect(countDraggers()).toEqual(4);
+ assertHeatmapNodes(3);
+ assertContourNodes(2);
+ expect(countColorBars()).toEqual(0);
+
+ return Plotly.deleteTraces(gd, [0]);
+ })
+ .then(function() {
+ expect(countSubplots()).toEqual(4);
+ expect(countClipPaths()).toEqual(12);
+ expect(countDraggers()).toEqual(4);
+ assertHeatmapNodes(2);
+ assertContourNodes(2);
+ expect(countColorBars()).toEqual(0);
+
+ return Plotly.deleteTraces(gd, [0]);
+ })
+ .then(function() {
+ expect(countSubplots()).toEqual(4);
+ expect(countClipPaths()).toEqual(12);
+ expect(countDraggers()).toEqual(4);
+ assertHeatmapNodes(1);
+ assertContourNodes(1);
+ expect(countColorBars()).toEqual(0);
+
+ return Plotly.deleteTraces(gd, [0]);
+ })
+ .then(function() {
+ expect(countSubplots()).toEqual(3);
+ expect(countClipPaths()).toEqual(11);
+ expect(countDraggers()).toEqual(3);
+ assertHeatmapNodes(0);
+ assertContourNodes(0);
+ expect(countColorBars()).toEqual(0);
+
+ var update = {
+ xaxis: null,
+ yaxis: null,
+ xaxis2: null,
+ yaxis2: null
+ };
+
+ return Plotly.relayout(gd, update);
+ })
+ .then(function() {
+ expect(countSubplots()).toEqual(0);
+ expect(countClipPaths()).toEqual(0);
+ expect(countDraggers()).toEqual(0);
+ assertHeatmapNodes(0);
+ assertContourNodes(0);
+ expect(countColorBars()).toEqual(0);
+
+ done();
});
-
});
+ });
+ });
- describe('pie traces', function() {
- var mock = require('@mocks/pie_simple.json');
- var gd;
-
- function countPieTraces() {
- return d3.select('g.pielayer').selectAll('g.trace').size();
- }
+ describe("pie traces", function() {
+ var mock = require("@mocks/pie_simple.json");
+ var gd;
- function countBarTraces() {
- return d3.selectAll('g.trace.bars').size();
- }
+ function countPieTraces() {
+ return d3.select("g.pielayer").selectAll("g.trace").size();
+ }
- beforeEach(function(done) {
- gd = createGraphDiv();
+ function countBarTraces() {
+ return d3.selectAll("g.trace.bars").size();
+ }
- var mockData = Lib.extendDeep([], mock.data),
- mockLayout = Lib.extendDeep({}, mock.layout);
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- Plotly.plot(gd, mockData, mockLayout).then(done);
- });
+ var mockData = Lib.extendDeep([], mock.data),
+ mockLayout = Lib.extendDeep({}, mock.layout);
- it('has as many *slice* nodes as there are pie items', function() {
- var nodes = d3.selectAll('g.slice');
+ Plotly.plot(gd, mockData, mockLayout).then(done);
+ });
- var Npts = 0;
- mock.data.forEach(function(trace) {
- Npts += trace.values.length;
- });
+ it("has as many *slice* nodes as there are pie items", function() {
+ var nodes = d3.selectAll("g.slice");
- expect(nodes.size()).toEqual(Npts);
- });
+ var Npts = 0;
+ mock.data.forEach(function(trace) {
+ Npts += trace.values.length;
+ });
- it('has the correct name spaces', function() {
- var mainSVGs = d3.selectAll('.main-svg');
+ expect(nodes.size()).toEqual(Npts);
+ });
- mainSVGs.each(function() {
- var node = this;
- assertNamespaces(node);
- });
+ it("has the correct name spaces", function() {
+ var mainSVGs = d3.selectAll(".main-svg");
- var testerSVG = d3.selectAll('#js-plotly-tester');
- assertNamespaces(testerSVG.node());
- });
+ mainSVGs.each(function() {
+ var node = this;
+ assertNamespaces(node);
+ });
- it('should be able to get deleted', function(done) {
- expect(countPieTraces()).toEqual(1);
- expect(countSubplots()).toEqual(0);
+ var testerSVG = d3.selectAll("#js-plotly-tester");
+ assertNamespaces(testerSVG.node());
+ });
- Plotly.deleteTraces(gd, [0]).then(function() {
- expect(countPieTraces()).toEqual(0);
- expect(countSubplots()).toEqual(0);
+ it("should be able to get deleted", function(done) {
+ expect(countPieTraces()).toEqual(1);
+ expect(countSubplots()).toEqual(0);
- done();
- });
- });
+ Plotly.deleteTraces(gd, [0]).then(function() {
+ expect(countPieTraces()).toEqual(0);
+ expect(countSubplots()).toEqual(0);
- it('should be able to be restyled to a bar chart and back', function(done) {
- expect(countPieTraces()).toEqual(1);
- expect(countBarTraces()).toEqual(0);
- expect(countSubplots()).toEqual(0);
-
- Plotly.restyle(gd, 'type', 'bar').then(function() {
- expect(countPieTraces()).toEqual(0);
- expect(countBarTraces()).toEqual(1);
- expect(countSubplots()).toEqual(1);
+ done();
+ });
+ });
+
+ it("should be able to be restyled to a bar chart and back", function(
+ done
+ ) {
+ expect(countPieTraces()).toEqual(1);
+ expect(countBarTraces()).toEqual(0);
+ expect(countSubplots()).toEqual(0);
+
+ Plotly.restyle(gd, "type", "bar")
+ .then(function() {
+ expect(countPieTraces()).toEqual(0);
+ expect(countBarTraces()).toEqual(1);
+ expect(countSubplots()).toEqual(1);
+
+ return Plotly.restyle(gd, "type", "pie");
+ })
+ .then(function() {
+ expect(countPieTraces()).toEqual(1);
+ expect(countBarTraces()).toEqual(0);
+ expect(countSubplots()).toEqual(0);
- return Plotly.restyle(gd, 'type', 'pie');
- }).then(function() {
- expect(countPieTraces()).toEqual(1);
- expect(countBarTraces()).toEqual(0);
- expect(countSubplots()).toEqual(0);
+ done();
+ });
+ });
+ });
+ });
- done();
- });
+ describe("geo plots", function() {
+ var mock = require("@mocks/geo_first.json");
- });
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mock.data, mock.layout).then(done);
});
- describe('geo plots', function() {
- var mock = require('@mocks/geo_first.json');
+ it(
+ "has as many *choroplethlocation* nodes as there are choropleth locations",
+ function() {
+ var nodes = d3.selectAll("path.choroplethlocation");
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mock.data, mock.layout).then(done);
+ var Npts = 0;
+ mock.data.forEach(function(trace) {
+ var items = trace.locations;
+ if (items) Npts += items.length;
});
- it('has as many *choroplethlocation* nodes as there are choropleth locations', function() {
- var nodes = d3.selectAll('path.choroplethlocation');
-
- var Npts = 0;
- mock.data.forEach(function(trace) {
- var items = trace.locations;
- if(items) Npts += items.length;
- });
-
- expect(nodes.size()).toEqual(Npts);
- });
+ expect(nodes.size()).toEqual(Npts);
+ }
+ );
- it('has as many *point* nodes as there are marker points', function() {
- var nodes = d3.selectAll('path.point');
+ it("has as many *point* nodes as there are marker points", function() {
+ var nodes = d3.selectAll("path.point");
- var Npts = 0;
- mock.data.forEach(function(trace) {
- var items = trace.lat;
- if(items) Npts += items.length;
- });
+ var Npts = 0;
+ mock.data.forEach(function(trace) {
+ var items = trace.lat;
+ if (items) Npts += items.length;
+ });
- expect(nodes.size()).toEqual(Npts);
- });
+ expect(nodes.size()).toEqual(Npts);
+ });
- it('has the correct name spaces', function() {
- var mainSVGs = d3.selectAll('.main-svg');
+ it("has the correct name spaces", function() {
+ var mainSVGs = d3.selectAll(".main-svg");
- mainSVGs.each(function() {
- var node = this;
- assertNamespaces(node);
- });
+ mainSVGs.each(function() {
+ var node = this;
+ assertNamespaces(node);
+ });
- var geoSVGs = d3.select('#geo').selectAll('svg');
+ var geoSVGs = d3.select("#geo").selectAll("svg");
- geoSVGs.each(function() {
- var node = this;
- assertNamespaces(node);
- });
- });
+ geoSVGs.each(function() {
+ var node = this;
+ assertNamespaces(node);
+ });
});
+ });
- describe('polar plots', function() {
- var mock = require('@mocks/polar_scatter.json');
+ describe("polar plots", function() {
+ var mock = require("@mocks/polar_scatter.json");
- beforeEach(function(done) {
- Plotly.plot(createGraphDiv(), mock.data, mock.layout).then(done);
- });
+ beforeEach(function(done) {
+ Plotly.plot(createGraphDiv(), mock.data, mock.layout).then(done);
+ });
- it('has as many *mark dot* nodes as there are points', function() {
- var nodes = d3.selectAll('path.mark.dot');
+ it("has as many *mark dot* nodes as there are points", function() {
+ var nodes = d3.selectAll("path.mark.dot");
- var Npts = 0;
- mock.data.forEach(function(trace) {
- Npts += trace.r.length;
- });
+ var Npts = 0;
+ mock.data.forEach(function(trace) {
+ Npts += trace.r.length;
+ });
- expect(nodes.size()).toEqual(Npts);
- });
+ expect(nodes.size()).toEqual(Npts);
});
+ });
});
-describe('plot svg clip paths', function() {
-
- // plot with all features that rely on clip paths
- function plot() {
- return Plotly.plot(createGraphDiv(), [{
- type: 'contour',
- z: [[1, 2, 3], [2, 3, 1]]
- }, {
- type: 'scatter',
- y: [2, 1, 2]
- }], {
- showlegend: true,
- xaxis: {
- rangeslider: {}
- },
- shapes: [{
- xref: 'x',
- yref: 'y',
- x0: 0,
- y0: 0,
- x1: 3,
- y1: 3
- }]
- });
- }
-
- afterEach(destroyGraphDiv);
-
- it('should set clip path url to ids (base case)', function(done) {
- plot().then(function() {
-
- d3.selectAll('[clip-path]').each(function() {
- var cp = d3.select(this).attr('clip-path');
-
- expect(cp.substring(0, 5)).toEqual('url(#');
- expect(cp.substring(cp.length - 1)).toEqual(')');
- });
-
- done();
- });
+describe("plot svg clip paths", function() {
+ // plot with all features that rely on clip paths
+ function plot() {
+ return Plotly.plot(
+ createGraphDiv(),
+ [
+ { type: "contour", z: [[1, 2, 3], [2, 3, 1]] },
+ { type: "scatter", y: [2, 1, 2] }
+ ],
+ {
+ showlegend: true,
+ xaxis: { rangeslider: {} },
+ shapes: [{ xref: "x", yref: "y", x0: 0, y0: 0, x1: 3, y1: 3 }]
+ }
+ );
+ }
+
+ afterEach(destroyGraphDiv);
+
+ it("should set clip path url to ids (base case)", function(done) {
+ plot().then(function() {
+ d3.selectAll("[clip-path]").each(function() {
+ var cp = d3.select(this).attr("clip-path");
+
+ expect(cp.substring(0, 5)).toEqual("url(#");
+ expect(cp.substring(cp.length - 1)).toEqual(")");
+ });
+
+ done();
});
+ });
- it('should set clip path url to ids appended to window url', function(done) {
-
- // this case occurs in some past versions of AngularJS
- // https://github.com/angular/angular.js/issues/8934
+ it("should set clip path url to ids appended to window url", function(done) {
+ // this case occurs in some past versions of AngularJS
+ // https://github.com/angular/angular.js/issues/8934
+ // append with href
+ var base = d3.select("body").append("base").attr("href", "https://plot.ly");
- // append with href
- var base = d3.select('body')
- .append('base')
- .attr('href', 'https://plot.ly');
+ // grab window URL
+ var href = window.location.href.split("#")[0];
- // grab window URL
- var href = window.location.href.split('#')[0];
+ plot().then(function() {
+ d3.selectAll("[clip-path]").each(function() {
+ var cp = d3.select(this).attr("clip-path");
- plot().then(function() {
+ expect(cp.substring(0, 5 + href.length)).toEqual("url(" + href + "#");
+ expect(cp.substring(cp.length - 1)).toEqual(")");
+ });
- d3.selectAll('[clip-path]').each(function() {
- var cp = d3.select(this).attr('clip-path');
-
- expect(cp.substring(0, 5 + href.length)).toEqual('url(' + href + '#');
- expect(cp.substring(cp.length - 1)).toEqual(')');
- });
-
- base.remove();
- done();
- });
+ base.remove();
+ done();
});
+ });
});
diff --git a/test/jasmine/tests/plot_promise_test.js b/test/jasmine/tests/plot_promise_test.js
index 5fc8285e350..e918873f091 100644
--- a/test/jasmine/tests/plot_promise_test.js
+++ b/test/jasmine/tests/plot_promise_test.js
@@ -1,480 +1,470 @@
-var Plotly = require('@lib/index');
-var Events = require('@src/lib/events');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
+var Plotly = require("@lib/index");
+var Events = require("@src/lib/events");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+describe("Plotly.___ methods", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
-describe('Plotly.___ methods', function() {
- 'use strict';
+ describe("Plotly.plot promise", function() {
+ var promise, promiseGd;
- afterEach(destroyGraphDiv);
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }];
- describe('Plotly.plot promise', function() {
- var promise,
- promiseGd;
+ promise = Plotly.plot(createGraphDiv(), data, {});
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }];
-
- promise = Plotly.plot(createGraphDiv(), data, {});
-
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
-
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.plot promise', function() {
- var gd,
- promise,
- promiseRejected = false;
-
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }];
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- gd = createGraphDiv();
+ describe("Plotly.plot promise", function() {
+ var gd, promise, promiseRejected = false;
- Events.init(gd);
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }];
- gd.on('plotly_beforeplot', function() {
- return false;
- });
+ gd = createGraphDiv();
- promise = Plotly.plot(gd, data, {});
+ Events.init(gd);
- promise.then(null, function() {
- promiseRejected = true;
- done();
- });
- });
+ gd.on("plotly_beforeplot", function() {
+ return false;
+ });
+ promise = Plotly.plot(gd, data, {});
- it('should be rejected when plotly_beforeplot event handlers return false', function() {
- expect(promiseRejected).toBe(true);
- });
+ promise.then(null, function() {
+ promiseRejected = true;
+ done();
+ });
});
- describe('Plotly.plot promise', function() {
- var gd,
- promise,
- promiseRejected = false;
-
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }];
+ it(
+ "should be rejected when plotly_beforeplot event handlers return false",
+ function() {
+ expect(promiseRejected).toBe(true);
+ }
+ );
+ });
- gd = createGraphDiv();
+ describe("Plotly.plot promise", function() {
+ var gd, promise, promiseRejected = false;
- gd._dragging = true;
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }];
- promise = Plotly.plot(gd, data, {});
+ gd = createGraphDiv();
- promise.then(null, function() {
- promiseRejected = true;
- done();
- });
- });
+ gd._dragging = true;
+ promise = Plotly.plot(gd, data, {});
- it('should reject the promise when graph is being dragged', function() {
- expect(promiseRejected).toBe(true);
- });
+ promise.then(null, function() {
+ promiseRejected = true;
+ done();
+ });
});
- describe('Plotly.redraw promise', function() {
- var promise,
- promiseGd;
+ it("should reject the promise when graph is being dragged", function() {
+ expect(promiseRejected).toBe(true);
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- initialDiv = createGraphDiv();
+ describe("Plotly.redraw promise", function() {
+ var promise, promiseGd;
- Plotly.plot(initialDiv, data, {});
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ initialDiv = createGraphDiv();
- promise = Plotly.redraw(initialDiv);
+ Plotly.plot(initialDiv, data, {});
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ promise = Plotly.redraw(initialDiv);
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.newPlot promise', function() {
- var promise,
- promiseGd;
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }];
+ describe("Plotly.newPlot promise", function() {
+ var promise, promiseGd;
- promise = Plotly.newPlot(createGraphDiv(), data, {});
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }];
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ promise = Plotly.newPlot(createGraphDiv(), data, {});
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.extendTraces promise', function() {
- var promise,
- promiseGd;
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- initialDiv = createGraphDiv();
+ describe("Plotly.extendTraces promise", function() {
+ var promise, promiseGd;
- Plotly.plot(initialDiv, data, {});
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ initialDiv = createGraphDiv();
- promise = Plotly.extendTraces(initialDiv, { y: [[2]] }, [0], 3);
+ Plotly.plot(initialDiv, data, {});
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ promise = Plotly.extendTraces(initialDiv, { y: [[2]] }, [0], 3);
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.prependTraces promise', function() {
- var promise,
- promiseGd;
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- initialDiv = createGraphDiv();
+ describe("Plotly.prependTraces promise", function() {
+ var promise, promiseGd;
- Plotly.plot(initialDiv, data, {});
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ initialDiv = createGraphDiv();
- promise = Plotly.prependTraces(initialDiv, { y: [[2]] }, [0], 3);
+ Plotly.plot(initialDiv, data, {});
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ promise = Plotly.prependTraces(initialDiv, { y: [[2]] }, [0], 3);
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.addTraces promise', function() {
- var promise,
- promiseGd;
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- initialDiv = createGraphDiv();
+ describe("Plotly.addTraces promise", function() {
+ var promise, promiseGd;
- Plotly.plot(initialDiv, data, {});
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ initialDiv = createGraphDiv();
- promise = Plotly.addTraces(initialDiv, [{ x: [1, 2, 3], y: [1, 2, 3] }], [1]);
+ Plotly.plot(initialDiv, data, {});
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ promise = Plotly.addTraces(initialDiv, [{ x: [1, 2, 3], y: [1, 2, 3] }], [
+ 1
+ ]);
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.deleteTraces promise', function() {
- var promise,
- promiseGd;
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- initialDiv = createGraphDiv();
+ describe("Plotly.deleteTraces promise", function() {
+ var promise, promiseGd;
- Plotly.plot(initialDiv, data, {});
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ initialDiv = createGraphDiv();
- promise = Plotly.deleteTraces(initialDiv, [0]);
+ Plotly.plot(initialDiv, data, {});
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ promise = Plotly.deleteTraces(initialDiv, [0]);
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.deleteTraces promise', function() {
- var promise,
- promiseGd;
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- initialDiv = createGraphDiv();
+ describe("Plotly.deleteTraces promise", function() {
+ var promise, promiseGd;
- Plotly.plot(initialDiv, data, {});
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ initialDiv = createGraphDiv();
- promise = Plotly.deleteTraces(initialDiv, [0]);
+ Plotly.plot(initialDiv, data, {});
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ promise = Plotly.deleteTraces(initialDiv, [0]);
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.moveTraces promise', function() {
- var promise,
- promiseGd;
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- beforeEach(function(done) {
- var data = [
- { x: [1, 2, 3], y: [4, 5, 6] },
- { x: [1, 2, 3], y: [6, 5, 4] }
- ],
- initialDiv = createGraphDiv();
+ describe("Plotly.moveTraces promise", function() {
+ var promise, promiseGd;
- Plotly.plot(initialDiv, data, {});
+ beforeEach(function(done) {
+ var data = [
+ { x: [1, 2, 3], y: [4, 5, 6] },
+ { x: [1, 2, 3], y: [6, 5, 4] }
+ ],
+ initialDiv = createGraphDiv();
- promise = Plotly.moveTraces(initialDiv, 0, 1);
+ Plotly.plot(initialDiv, data, {});
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ promise = Plotly.moveTraces(initialDiv, 0, 1);
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.restyle promise', function() {
- var promise,
- promiseGd;
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- initialDiv = createGraphDiv();
+ describe("Plotly.restyle promise", function() {
+ var promise, promiseGd;
- Plotly.plot(initialDiv, data, {});
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ initialDiv = createGraphDiv();
- promise = Plotly.restyle(initialDiv, 'marker.color', 'rgb(255,0,0)');
+ Plotly.plot(initialDiv, data, {});
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ promise = Plotly.restyle(initialDiv, "marker.color", "rgb(255,0,0)");
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.restyle promise', function() {
- var promise,
- promiseRejected = false;
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- initialDiv = createGraphDiv();
+ describe("Plotly.restyle promise", function() {
+ var promise, promiseRejected = false;
- Plotly.plot(initialDiv, data, {});
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ initialDiv = createGraphDiv();
- promise = Plotly.restyle(initialDiv, undefined, '');
+ Plotly.plot(initialDiv, data, {});
- promise.then(null, function() {
- promiseRejected = true;
- done();
- });
- });
+ promise = Plotly.restyle(initialDiv, undefined, "");
- it('should be rejected when the attribute is missing', function() {
- expect(promiseRejected).toBe(true);
- });
+ promise.then(null, function() {
+ promiseRejected = true;
+ done();
+ });
});
- describe('Plotly.relayout promise', function() {
- var promise,
- promiseGd;
+ it("should be rejected when the attribute is missing", function() {
+ expect(promiseRejected).toBe(true);
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- layout = {hovermode: 'closest'},
- initialDiv = createGraphDiv();
+ describe("Plotly.relayout promise", function() {
+ var promise, promiseGd;
- Plotly.plot(initialDiv, data, layout);
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ layout = { hovermode: "closest" },
+ initialDiv = createGraphDiv();
- promise = Plotly.relayout(initialDiv, 'hovermode', false);
+ Plotly.plot(initialDiv, data, layout);
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ promise = Plotly.relayout(initialDiv, "hovermode", false);
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.relayout promise', function() {
- var promise,
- promiseGd;
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- layout = {hovermode: 'closest'},
- initialDiv = createGraphDiv();
+ describe("Plotly.relayout promise", function() {
+ var promise, promiseGd;
- Plotly.plot(initialDiv, data, layout);
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ layout = { hovermode: "closest" },
+ initialDiv = createGraphDiv();
- promise = Plotly.relayout(initialDiv, 'hovermode', false);
+ Plotly.plot(initialDiv, data, layout);
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ promise = Plotly.relayout(initialDiv, "hovermode", false);
- it('should be returned with the graph div as an argument', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.data).toBeDefined();
- expect(promiseGd.layout).toBeDefined();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.relayout promise', function() {
- var promise,
- promiseGd;
+ it("should be returned with the graph div as an argument", function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.data).toBeDefined();
+ expect(promiseGd.layout).toBeDefined();
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- layout = {hovermode: 'closest'},
- initialDiv = createGraphDiv();
+ describe("Plotly.relayout promise", function() {
+ var promise, promiseGd;
- Plotly.plot(initialDiv, data, layout);
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ layout = { hovermode: "closest" },
+ initialDiv = createGraphDiv();
- initialDiv.framework = { isPolar: true };
- promise = Plotly.relayout(initialDiv, 'hovermode', false);
+ Plotly.plot(initialDiv, data, layout);
- promise.then(function(gd) {
- promiseGd = gd;
- done();
- });
- });
+ initialDiv.framework = { isPolar: true };
+ promise = Plotly.relayout(initialDiv, "hovermode", false);
- it('should be returned with the graph div unchanged when the framework is polar', function() {
- expect(promiseGd).toBeDefined();
- expect(typeof promiseGd).toBe('object');
- expect(promiseGd.changed).toBeFalsy();
- });
+ promise.then(function(gd) {
+ promiseGd = gd;
+ done();
+ });
});
- describe('Plotly.relayout promise', function() {
- var promise,
- promiseRejected = false;
+ it(
+ "should be returned with the graph div unchanged when the framework is polar",
+ function() {
+ expect(promiseGd).toBeDefined();
+ expect(typeof promiseGd).toBe("object");
+ expect(promiseGd.changed).toBeFalsy();
+ }
+ );
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
- layout = {hovermode: 'closest'},
- initialDiv = createGraphDiv();
+ describe("Plotly.relayout promise", function() {
+ var promise, promiseRejected = false;
- Plotly.plot(initialDiv, data, layout);
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }],
+ layout = { hovermode: "closest" },
+ initialDiv = createGraphDiv();
- promise = Plotly.relayout(initialDiv, undefined, false);
+ Plotly.plot(initialDiv, data, layout);
- promise.then(null, function() {
- promiseRejected = true;
- done();
- });
- });
+ promise = Plotly.relayout(initialDiv, undefined, false);
- it('should be rejected when the attribute is missing', function() {
- expect(promiseRejected).toBe(true);
- });
+ promise.then(null, function() {
+ promiseRejected = true;
+ done();
+ });
});
- describe('Plotly.Plots.resize promise', function() {
- var initialDiv;
+ it("should be rejected when the attribute is missing", function() {
+ expect(promiseRejected).toBe(true);
+ });
+ });
- beforeEach(function(done) {
- var data = [{ x: [1, 2, 3], y: [4, 5, 6] }];
+ describe("Plotly.Plots.resize promise", function() {
+ var initialDiv;
- initialDiv = createGraphDiv();
+ beforeEach(function(done) {
+ var data = [{ x: [1, 2, 3], y: [4, 5, 6] }];
- Plotly.plot(initialDiv, data, {}).then(done);
- });
+ initialDiv = createGraphDiv();
- it('should return a resolved promise of the gd', function(done) {
- Plotly.Plots.resize(initialDiv).then(function(gd) {
- expect(gd).toBeDefined();
- expect(typeof gd).toBe('object');
- expect(gd.layout).toBeDefined();
- }).then(done);
- });
+ Plotly.plot(initialDiv, data, {}).then(done);
+ });
- it('should return a rejected promise with no argument', function(done) {
- Plotly.Plots.resize().then(null, function(err) {
- expect(err).toBeDefined();
- expect(err.message).toBe('Resize must be passed a plot div element.');
- }).then(done);
- });
+ it("should return a resolved promise of the gd", function(done) {
+ Plotly.Plots
+ .resize(initialDiv)
+ .then(function(gd) {
+ expect(gd).toBeDefined();
+ expect(typeof gd).toBe("object");
+ expect(gd.layout).toBeDefined();
+ })
+ .then(done);
});
+ it("should return a rejected promise with no argument", function(done) {
+ Plotly.Plots
+ .resize()
+ .then(null, function(err) {
+ expect(err).toBeDefined();
+ expect(err.message).toBe("Resize must be passed a plot div element.");
+ })
+ .then(done);
+ });
+ });
});
diff --git a/test/jasmine/tests/plots_test.js b/test/jasmine/tests/plots_test.js
index 0e702ec5b89..b5b1d906b21 100644
--- a/test/jasmine/tests/plots_test.js
+++ b/test/jasmine/tests/plots_test.js
@@ -1,715 +1,648 @@
-var Plotly = require('@lib/index');
-var Plots = require('@src/plots/plots');
+var Plotly = require("@lib/index");
+var Plots = require("@src/plots/plots");
+
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+
+describe("Test Plots", function() {
+ "use strict";
+ describe("Plots.supplyDefaults", function() {
+ it("should not throw an error when gd is a plain object", function() {
+ var height = 100, gd = { layout: { height: height } };
+
+ Plots.supplyDefaults(gd);
+ expect(gd.layout.height).toBe(height);
+ expect(gd._fullLayout).toBeDefined();
+ expect(gd._fullLayout.height).toBe(height);
+ expect(gd._fullLayout.width).toBe(Plots.layoutAttributes.width.dflt);
+ expect(gd._fullData).toBeDefined();
+ });
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
+ it("should relink private keys", function() {
+ var oldFullData = [
+ { type: "scatter3d", z: [1, 2, 3] },
+ { type: "contour", _empties: [1, 2, 3] }
+ ];
+
+ var oldFullLayout = {
+ _plots: { xy: { plot: {} } },
+ xaxis: {
+ c2p: function() {}
+ },
+ yaxis: { _m: 20 },
+ scene: { _scene: {} },
+ annotations: [{ _min: 10 }, { _max: 20 }],
+ someFunc: function() {}
+ };
+
+ var newData = [
+ { type: "scatter3d", z: [1, 2, 3, 4] },
+ { type: "contour", z: [[1, 2, 3], [2, 3, 4]] }
+ ];
+
+ var newLayout = { annotations: [{}, {}, {}] };
+
+ var gd = {
+ _fullData: oldFullData,
+ _fullLayout: oldFullLayout,
+ data: newData,
+ layout: newLayout
+ };
+
+ Plots.supplyDefaults(gd);
+
+ expect(gd._fullData[0].z).toBe(newData[0].z);
+ expect(gd._fullData[1].z).toBe(newData[1].z);
+ expect(gd._fullData[1]._empties).toBe(oldFullData[1]._empties);
+ expect(gd._fullLayout.scene._scene).toBe(oldFullLayout.scene._scene);
+ expect(gd._fullLayout._plots.plot).toBe(oldFullLayout._plots.plot);
+ expect(gd._fullLayout.annotations[0]._min).toBe(
+ oldFullLayout.annotations[0]._min
+ );
+ expect(gd._fullLayout.annotations[1]._max).toBe(
+ oldFullLayout.annotations[1]._max
+ );
+ expect(gd._fullLayout.someFunc).toBe(oldFullLayout.someFunc);
+
+ expect(gd._fullLayout.xaxis.c2p).not.toBe(
+ oldFullLayout.xaxis.c2p,
+ "(set during ax.setScale"
+ );
+ expect(gd._fullLayout.yaxis._m).not.toBe(
+ oldFullLayout.yaxis._m,
+ "(set during ax.setScale"
+ );
+ });
+ it("should include the correct reference to user data", function() {
+ var trace0 = { y: [1, 2, 3] };
+ var trace1 = { y: [5, 2, 3] };
-describe('Test Plots', function() {
- 'use strict';
+ var data = [trace0, trace1];
+ var gd = { data: data };
- describe('Plots.supplyDefaults', function() {
+ Plots.supplyDefaults(gd);
- it('should not throw an error when gd is a plain object', function() {
- var height = 100,
- gd = {
- layout: {
- height: height
- }
- };
+ expect(gd.data).toBe(data);
- Plots.supplyDefaults(gd);
- expect(gd.layout.height).toBe(height);
- expect(gd._fullLayout).toBeDefined();
- expect(gd._fullLayout.height).toBe(height);
- expect(gd._fullLayout.width).toBe(Plots.layoutAttributes.width.dflt);
- expect(gd._fullData).toBeDefined();
- });
+ expect(gd._fullData[0].index).toEqual(0);
+ expect(gd._fullData[1].index).toEqual(1);
- it('should relink private keys', function() {
- var oldFullData = [{
- type: 'scatter3d',
- z: [1, 2, 3]
- }, {
- type: 'contour',
- _empties: [1, 2, 3]
- }];
-
- var oldFullLayout = {
- _plots: { xy: { plot: {} } },
- xaxis: { c2p: function() {} },
- yaxis: { _m: 20 },
- scene: { _scene: {} },
- annotations: [{ _min: 10, }, { _max: 20 }],
- someFunc: function() {}
- };
-
- var newData = [{
- type: 'scatter3d',
- z: [1, 2, 3, 4]
- }, {
- type: 'contour',
- z: [[1, 2, 3], [2, 3, 4]]
- }];
-
- var newLayout = {
- annotations: [{}, {}, {}]
- };
-
- var gd = {
- _fullData: oldFullData,
- _fullLayout: oldFullLayout,
- data: newData,
- layout: newLayout
- };
-
- Plots.supplyDefaults(gd);
-
- expect(gd._fullData[0].z).toBe(newData[0].z);
- expect(gd._fullData[1].z).toBe(newData[1].z);
- expect(gd._fullData[1]._empties).toBe(oldFullData[1]._empties);
- expect(gd._fullLayout.scene._scene).toBe(oldFullLayout.scene._scene);
- expect(gd._fullLayout._plots.plot).toBe(oldFullLayout._plots.plot);
- expect(gd._fullLayout.annotations[0]._min).toBe(oldFullLayout.annotations[0]._min);
- expect(gd._fullLayout.annotations[1]._max).toBe(oldFullLayout.annotations[1]._max);
- expect(gd._fullLayout.someFunc).toBe(oldFullLayout.someFunc);
-
- expect(gd._fullLayout.xaxis.c2p)
- .not.toBe(oldFullLayout.xaxis.c2p, '(set during ax.setScale');
- expect(gd._fullLayout.yaxis._m)
- .not.toBe(oldFullLayout.yaxis._m, '(set during ax.setScale');
- });
+ expect(gd._fullData[0]._expandedIndex).toEqual(0);
+ expect(gd._fullData[1]._expandedIndex).toEqual(1);
- it('should include the correct reference to user data', function() {
- var trace0 = { y: [1, 2, 3] };
- var trace1 = { y: [5, 2, 3] };
+ expect(gd._fullData[0]._input).toBe(trace0);
+ expect(gd._fullData[1]._input).toBe(trace1);
- var data = [trace0, trace1];
- var gd = { data: data };
+ expect(gd._fullData[0]._fullInput).toBe(gd._fullData[0]);
+ expect(gd._fullData[1]._fullInput).toBe(gd._fullData[1]);
- Plots.supplyDefaults(gd);
-
- expect(gd.data).toBe(data);
+ expect(gd._fullData[0]._expandedInput).toBe(gd._fullData[0]);
+ expect(gd._fullData[1]._expandedInput).toBe(gd._fullData[1]);
+ });
- expect(gd._fullData[0].index).toEqual(0);
- expect(gd._fullData[1].index).toEqual(1);
+ function testSanitizeMarginsHasBeenCalledOnlyOnce(gd) {
+ spyOn(Plots, "sanitizeMargins").and.callThrough();
+ Plots.supplyDefaults(gd);
+ expect(Plots.sanitizeMargins).toHaveBeenCalledTimes(1);
+ }
- expect(gd._fullData[0]._expandedIndex).toEqual(0);
- expect(gd._fullData[1]._expandedIndex).toEqual(1);
+ it(
+ "should call sanitizeMargins only once when both width and height are defined",
+ function() {
+ var gd = { layout: { width: 100, height: 100 } };
- expect(gd._fullData[0]._input).toBe(trace0);
- expect(gd._fullData[1]._input).toBe(trace1);
+ testSanitizeMarginsHasBeenCalledOnlyOnce(gd);
+ }
+ );
- expect(gd._fullData[0]._fullInput).toBe(gd._fullData[0]);
- expect(gd._fullData[1]._fullInput).toBe(gd._fullData[1]);
+ it(
+ "should call sanitizeMargins only once when autosize is false",
+ function() {
+ var gd = { layout: { autosize: false, height: 100 } };
- expect(gd._fullData[0]._expandedInput).toBe(gd._fullData[0]);
- expect(gd._fullData[1]._expandedInput).toBe(gd._fullData[1]);
- });
+ testSanitizeMarginsHasBeenCalledOnlyOnce(gd);
+ }
+ );
- function testSanitizeMarginsHasBeenCalledOnlyOnce(gd) {
- spyOn(Plots, 'sanitizeMargins').and.callThrough();
- Plots.supplyDefaults(gd);
- expect(Plots.sanitizeMargins).toHaveBeenCalledTimes(1);
- }
-
- it('should call sanitizeMargins only once when both width and height are defined', function() {
- var gd = {
- layout: {
- width: 100,
- height: 100
- }
- };
-
- testSanitizeMarginsHasBeenCalledOnlyOnce(gd);
- });
+ it(
+ "should call sanitizeMargins only once when autosize is true",
+ function() {
+ var gd = { layout: { autosize: true, height: 100 } };
- it('should call sanitizeMargins only once when autosize is false', function() {
- var gd = {
- layout: {
- autosize: false,
- height: 100
- }
- };
+ testSanitizeMarginsHasBeenCalledOnlyOnce(gd);
+ }
+ );
+ });
- testSanitizeMarginsHasBeenCalledOnlyOnce(gd);
- });
+ describe("Plots.supplyLayoutGlobalDefaults should", function() {
+ var layoutIn, layoutOut, expected;
- it('should call sanitizeMargins only once when autosize is true', function() {
- var gd = {
- layout: {
- autosize: true,
- height: 100
- }
- };
+ var supplyLayoutDefaults = Plots.supplyLayoutGlobalDefaults;
- testSanitizeMarginsHasBeenCalledOnlyOnce(gd);
- });
+ beforeEach(function() {
+ layoutOut = {};
});
- describe('Plots.supplyLayoutGlobalDefaults should', function() {
- var layoutIn,
- layoutOut,
- expected;
-
- var supplyLayoutDefaults = Plots.supplyLayoutGlobalDefaults;
-
- beforeEach(function() {
- layoutOut = {};
- });
-
- it('should sanitize margins when they are wider than the plot', function() {
- layoutIn = {
- width: 500,
- height: 500,
- margin: {
- l: 400,
- r: 200
- }
- };
- expected = {
- l: 332,
- r: 166,
- t: 100,
- b: 80,
- pad: 0,
- autoexpand: true
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut);
- expect(layoutOut.margin).toEqual(expected);
- });
-
- it('should sanitize margins when they are taller than the plot', function() {
- layoutIn = {
- width: 500,
- height: 500,
- margin: {
- l: 400,
- r: 200,
- t: 300,
- b: 500
- }
- };
- expected = {
- l: 332,
- r: 166,
- t: 187,
- b: 311,
- pad: 0,
- autoexpand: true
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut);
- expect(layoutOut.margin).toEqual(expected);
- });
+ it("should sanitize margins when they are wider than the plot", function() {
+ layoutIn = { width: 500, height: 500, margin: { l: 400, r: 200 } };
+ expected = { l: 332, r: 166, t: 100, b: 80, pad: 0, autoexpand: true };
+ supplyLayoutDefaults(layoutIn, layoutOut);
+ expect(layoutOut.margin).toEqual(expected);
});
- describe('Plots.supplyTraceDefaults', function() {
- var supplyTraceDefaults = Plots.supplyTraceDefaults,
- layout = {};
+ it(
+ "should sanitize margins when they are taller than the plot",
+ function() {
+ layoutIn = {
+ width: 500,
+ height: 500,
+ margin: { l: 400, r: 200, t: 300, b: 500 }
+ };
+ expected = { l: 332, r: 166, t: 187, b: 311, pad: 0, autoexpand: true };
+
+ supplyLayoutDefaults(layoutIn, layoutOut);
+ expect(layoutOut.margin).toEqual(expected);
+ }
+ );
+ });
+
+ describe("Plots.supplyTraceDefaults", function() {
+ var supplyTraceDefaults = Plots.supplyTraceDefaults, layout = {};
+
+ var traceIn, traceOut;
+
+ describe("should coerce hoverinfo", function() {
+ it("without *name* for single-trace graphs by default", function() {
+ layout._dataLength = 1;
+
+ traceIn = {};
+ traceOut = supplyTraceDefaults(traceIn, 0, layout);
+ expect(traceOut.hoverinfo).toEqual("x+y+z+text");
+
+ traceIn = { hoverinfo: "name" };
+ traceOut = supplyTraceDefaults(traceIn, 0, layout);
+ expect(traceOut.hoverinfo).toEqual("name");
+ });
+
+ it("without *name* for single-trace graphs by default", function() {
+ layout._dataLength = 2;
+
+ traceIn = {};
+ traceOut = supplyTraceDefaults(traceIn, 0, layout);
+ expect(traceOut.hoverinfo).toEqual("all");
+
+ traceIn = { hoverinfo: "name" };
+ traceOut = supplyTraceDefaults(traceIn, 0, layout);
+ expect(traceOut.hoverinfo).toEqual("name");
+ });
+ });
+ });
- var traceIn, traceOut;
+ describe("Plots.getSubplotIds", function() {
+ var getSubplotIds = Plots.getSubplotIds;
- describe('should coerce hoverinfo', function() {
- it('without *name* for single-trace graphs by default', function() {
- layout._dataLength = 1;
+ it("returns scene ids in order", function() {
+ var layout = { scene2: {}, scene: {}, scene3: {} };
- traceIn = {};
- traceOut = supplyTraceDefaults(traceIn, 0, layout);
- expect(traceOut.hoverinfo).toEqual('x+y+z+text');
+ expect(getSubplotIds(layout, "gl3d")).toEqual([
+ "scene",
+ "scene2",
+ "scene3"
+ ]);
- traceIn = { hoverinfo: 'name' };
- traceOut = supplyTraceDefaults(traceIn, 0, layout);
- expect(traceOut.hoverinfo).toEqual('name');
- });
+ expect(getSubplotIds(layout, "cartesian")).toEqual([]);
+ expect(getSubplotIds(layout, "geo")).toEqual([]);
+ expect(getSubplotIds(layout, "no-valid-subplot-type")).toEqual([]);
+ });
- it('without *name* for single-trace graphs by default', function() {
- layout._dataLength = 2;
+ it("returns geo ids in order", function() {
+ var layout = { geo2: {}, geo: {}, geo3: {} };
- traceIn = {};
- traceOut = supplyTraceDefaults(traceIn, 0, layout);
- expect(traceOut.hoverinfo).toEqual('all');
+ expect(getSubplotIds(layout, "geo")).toEqual(["geo", "geo2", "geo3"]);
- traceIn = { hoverinfo: 'name' };
- traceOut = supplyTraceDefaults(traceIn, 0, layout);
- expect(traceOut.hoverinfo).toEqual('name');
- });
- });
+ expect(getSubplotIds(layout, "cartesian")).toEqual([]);
+ expect(getSubplotIds(layout, "gl3d")).toEqual([]);
+ expect(getSubplotIds(layout, "no-valid-subplot-type")).toEqual([]);
});
- describe('Plots.getSubplotIds', function() {
- var getSubplotIds = Plots.getSubplotIds;
-
- it('returns scene ids in order', function() {
- var layout = {
- scene2: {},
- scene: {},
- scene3: {}
- };
-
- expect(getSubplotIds(layout, 'gl3d'))
- .toEqual(['scene', 'scene2', 'scene3']);
-
- expect(getSubplotIds(layout, 'cartesian'))
- .toEqual([]);
- expect(getSubplotIds(layout, 'geo'))
- .toEqual([]);
- expect(getSubplotIds(layout, 'no-valid-subplot-type'))
- .toEqual([]);
- });
+ it("returns cartesian ids", function() {
+ var layout = { _has: Plots._hasPlotType, _plots: { xy: {}, x2y2: {} } };
- it('returns geo ids in order', function() {
- var layout = {
- geo2: {},
- geo: {},
- geo3: {}
- };
-
- expect(getSubplotIds(layout, 'geo'))
- .toEqual(['geo', 'geo2', 'geo3']);
-
- expect(getSubplotIds(layout, 'cartesian'))
- .toEqual([]);
- expect(getSubplotIds(layout, 'gl3d'))
- .toEqual([]);
- expect(getSubplotIds(layout, 'no-valid-subplot-type'))
- .toEqual([]);
- });
+ expect(getSubplotIds(layout, "cartesian")).toEqual([]);
- it('returns cartesian ids', function() {
- var layout = {
- _has: Plots._hasPlotType,
- _plots: { xy: {}, x2y2: {} }
- };
+ layout._basePlotModules = [{ name: "cartesian" }];
+ expect(getSubplotIds(layout, "cartesian")).toEqual(["xy", "x2y2"]);
+ expect(getSubplotIds(layout, "gl2d")).toEqual([]);
- expect(getSubplotIds(layout, 'cartesian'))
- .toEqual([]);
+ layout._basePlotModules = [{ name: "gl2d" }];
+ expect(getSubplotIds(layout, "gl2d")).toEqual(["xy", "x2y2"]);
+ expect(getSubplotIds(layout, "cartesian")).toEqual([]);
+ });
+ });
- layout._basePlotModules = [{ name: 'cartesian' }];
- expect(getSubplotIds(layout, 'cartesian'))
- .toEqual(['xy', 'x2y2']);
- expect(getSubplotIds(layout, 'gl2d'))
- .toEqual([]);
+ describe("Plots.findSubplotIds", function() {
+ var findSubplotIds = Plots.findSubplotIds;
+ var ids;
- layout._basePlotModules = [{ name: 'gl2d' }];
- expect(getSubplotIds(layout, 'gl2d'))
- .toEqual(['xy', 'x2y2']);
- expect(getSubplotIds(layout, 'cartesian'))
- .toEqual([]);
+ it("should return subplots ids found in the data", function() {
+ var data = [
+ { type: "scatter3d", scene: "scene" },
+ { type: "surface", scene: "scene2" },
+ { type: "choropleth", geo: "geo" }
+ ];
- });
- });
+ ids = findSubplotIds(data, "geo");
+ expect(ids).toEqual(["geo"]);
- describe('Plots.findSubplotIds', function() {
- var findSubplotIds = Plots.findSubplotIds;
- var ids;
-
- it('should return subplots ids found in the data', function() {
- var data = [{
- type: 'scatter3d',
- scene: 'scene'
- }, {
- type: 'surface',
- scene: 'scene2'
- }, {
- type: 'choropleth',
- geo: 'geo'
- }];
-
- ids = findSubplotIds(data, 'geo');
- expect(ids).toEqual(['geo']);
-
- ids = findSubplotIds(data, 'gl3d');
- expect(ids).toEqual(['scene', 'scene2']);
- });
+ ids = findSubplotIds(data, "gl3d");
+ expect(ids).toEqual(["scene", "scene2"]);
});
+ });
- describe('Plots.resize', function() {
- var gd;
+ describe("Plots.resize", function() {
+ var gd;
- beforeAll(function(done) {
- gd = createGraphDiv();
+ beforeAll(function(done) {
+ gd = createGraphDiv();
- Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }])
- .then(function() {
- gd.style.width = '400px';
- gd.style.height = '400px';
+ Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }])
+ .then(function() {
+ gd.style.width = "400px";
+ gd.style.height = "400px";
- return Plotly.Plots.resize(gd);
- })
- .then(done);
- });
+ return Plotly.Plots.resize(gd);
+ })
+ .then(done);
+ });
- afterEach(destroyGraphDiv);
+ afterEach(destroyGraphDiv);
- it('should resize the plot clip', function() {
- var uid = gd._fullLayout._uid;
+ it("should resize the plot clip", function() {
+ var uid = gd._fullLayout._uid;
- var plotClip = document.getElementById('clip' + uid + 'xyplot'),
- clipRect = plotClip.children[0],
- clipWidth = +clipRect.getAttribute('width'),
- clipHeight = +clipRect.getAttribute('height');
+ var plotClip = document.getElementById("clip" + uid + "xyplot"),
+ clipRect = plotClip.children[0],
+ clipWidth = +clipRect.getAttribute("width"),
+ clipHeight = +clipRect.getAttribute("height");
- expect(clipWidth).toBe(240);
- expect(clipHeight).toBe(220);
- });
+ expect(clipWidth).toBe(240);
+ expect(clipHeight).toBe(220);
+ });
- it('should resize the main svgs', function() {
- var mainSvgs = document.getElementsByClassName('main-svg');
+ it("should resize the main svgs", function() {
+ var mainSvgs = document.getElementsByClassName("main-svg");
- for(var i = 0; i < mainSvgs.length; i++) {
- var svg = mainSvgs[i],
- svgWidth = +svg.getAttribute('width'),
- svgHeight = +svg.getAttribute('height');
+ for (var i = 0; i < mainSvgs.length; i++) {
+ var svg = mainSvgs[i],
+ svgWidth = +svg.getAttribute("width"),
+ svgHeight = +svg.getAttribute("height");
- expect(svgWidth).toBe(400);
- expect(svgHeight).toBe(400);
- }
- });
+ expect(svgWidth).toBe(400);
+ expect(svgHeight).toBe(400);
+ }
+ });
- it('should update the axis scales', function() {
- var fullLayout = gd._fullLayout,
- plotinfo = fullLayout._plots.xy;
+ it("should update the axis scales", function() {
+ var fullLayout = gd._fullLayout, plotinfo = fullLayout._plots.xy;
- expect(fullLayout.xaxis._length).toEqual(240);
- expect(fullLayout.yaxis._length).toEqual(220);
+ expect(fullLayout.xaxis._length).toEqual(240);
+ expect(fullLayout.yaxis._length).toEqual(220);
- expect(plotinfo.xaxis._length).toEqual(240);
- expect(plotinfo.yaxis._length).toEqual(220);
- });
+ expect(plotinfo.xaxis._length).toEqual(240);
+ expect(plotinfo.yaxis._length).toEqual(220);
});
+ });
- describe('Plots.purge', function() {
- var gd;
-
- beforeEach(function(done) {
- gd = createGraphDiv();
- Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }], {}).then(done);
- });
+ describe("Plots.purge", function() {
+ var gd;
- afterEach(destroyGraphDiv);
-
- it('should unset everything in the gd except _context', function() {
- var expectedKeys = [
- '_ev', '_internalEv', 'on', 'once', 'removeListener', 'removeAllListeners',
- '_internalOn', '_internalOnce', '_removeInternalListener',
- '_removeAllInternalListeners', 'emit', '_context', '_replotPending',
- '_hmpixcount', '_hmlumcount', '_mouseDownTime'
- ];
-
- Plots.purge(gd);
- expect(Object.keys(gd)).toEqual(expectedKeys);
- expect(gd.data).toBeUndefined();
- expect(gd.layout).toBeUndefined();
- expect(gd._fullData).toBeUndefined();
- expect(gd._fullLayout).toBeUndefined();
- expect(gd.calcdata).toBeUndefined();
- expect(gd.framework).toBeUndefined();
- expect(gd.empty).toBeUndefined();
- expect(gd.fid).toBeUndefined();
- expect(gd.undoqueue).toBeUndefined();
- expect(gd.undonum).toBeUndefined();
- expect(gd.autoplay).toBeUndefined();
- expect(gd.changed).toBeUndefined();
- expect(gd._tester).toBeUndefined();
- expect(gd._testref).toBeUndefined();
- expect(gd._promises).toBeUndefined();
- expect(gd._redrawTimer).toBeUndefined();
- expect(gd._replotting).toBeUndefined();
- expect(gd.firstscatter).toBeUndefined();
- expect(gd.hmlumcount).toBeUndefined();
- expect(gd.hmpixcount).toBeUndefined();
- expect(gd.numboxes).toBeUndefined();
- expect(gd._hoverTimer).toBeUndefined();
- expect(gd._lastHoverTime).toBeUndefined();
- expect(gd._transitionData).toBeUndefined();
- expect(gd._transitioning).toBeUndefined();
- });
+ beforeEach(function(done) {
+ gd = createGraphDiv();
+ Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }], {}).then(done);
});
- describe('extendObjectWithContainers', function() {
-
- function assert(dest, src, expected) {
- Plots.extendObjectWithContainers(dest, src, ['container']);
- expect(dest).toEqual(expected);
- }
-
- it('extend each container items', function() {
- var dest = {
- container: [
- { text: '1', x: 1, y: 1 },
- { text: '2', x: 2, y: 2 }
- ]
- };
-
- var src = {
- container: [
- { text: '1-new' },
- { text: '2-new' }
- ]
- };
-
- var expected = {
- container: [
- { text: '1-new', x: 1, y: 1 },
- { text: '2-new', x: 2, y: 2 }
- ]
- };
-
- assert(dest, src, expected);
- });
+ afterEach(destroyGraphDiv);
+
+ it("should unset everything in the gd except _context", function() {
+ var expectedKeys = [
+ "_ev",
+ "_internalEv",
+ "on",
+ "once",
+ "removeListener",
+ "removeAllListeners",
+ "_internalOn",
+ "_internalOnce",
+ "_removeInternalListener",
+ "_removeAllInternalListeners",
+ "emit",
+ "_context",
+ "_replotPending",
+ "_hmpixcount",
+ "_hmlumcount",
+ "_mouseDownTime"
+ ];
+
+ Plots.purge(gd);
+ expect(Object.keys(gd)).toEqual(expectedKeys);
+ expect(gd.data).toBeUndefined();
+ expect(gd.layout).toBeUndefined();
+ expect(gd._fullData).toBeUndefined();
+ expect(gd._fullLayout).toBeUndefined();
+ expect(gd.calcdata).toBeUndefined();
+ expect(gd.framework).toBeUndefined();
+ expect(gd.empty).toBeUndefined();
+ expect(gd.fid).toBeUndefined();
+ expect(gd.undoqueue).toBeUndefined();
+ expect(gd.undonum).toBeUndefined();
+ expect(gd.autoplay).toBeUndefined();
+ expect(gd.changed).toBeUndefined();
+ expect(gd._tester).toBeUndefined();
+ expect(gd._testref).toBeUndefined();
+ expect(gd._promises).toBeUndefined();
+ expect(gd._redrawTimer).toBeUndefined();
+ expect(gd._replotting).toBeUndefined();
+ expect(gd.firstscatter).toBeUndefined();
+ expect(gd.hmlumcount).toBeUndefined();
+ expect(gd.hmpixcount).toBeUndefined();
+ expect(gd.numboxes).toBeUndefined();
+ expect(gd._hoverTimer).toBeUndefined();
+ expect(gd._lastHoverTime).toBeUndefined();
+ expect(gd._transitionData).toBeUndefined();
+ expect(gd._transitioning).toBeUndefined();
+ });
+ });
- it('clears container items when applying null src items', function() {
- var dest = {
- container: [
- { text: '1', x: 1, y: 1 },
- { text: '2', x: 2, y: 2 }
- ]
- };
+ describe("extendObjectWithContainers", function() {
+ function assert(dest, src, expected) {
+ Plots.extendObjectWithContainers(dest, src, ["container"]);
+ expect(dest).toEqual(expected);
+ }
- var src = {
- container: [null, null]
- };
+ it("extend each container items", function() {
+ var dest = {
+ container: [{ text: "1", x: 1, y: 1 }, { text: "2", x: 2, y: 2 }]
+ };
- var expected = {
- container: [null, null]
- };
+ var src = { container: [{ text: "1-new" }, { text: "2-new" }] };
- assert(dest, src, expected);
- });
+ var expected = {
+ container: [
+ { text: "1-new", x: 1, y: 1 },
+ { text: "2-new", x: 2, y: 2 }
+ ]
+ };
- it('clears container applying null src', function() {
- var dest = {
- container: [
- { text: '1', x: 1, y: 1 },
- { text: '2', x: 2, y: 2 }
- ]
- };
+ assert(dest, src, expected);
+ });
- var src = { container: null };
+ it("clears container items when applying null src items", function() {
+ var dest = {
+ container: [{ text: "1", x: 1, y: 1 }, { text: "2", x: 2, y: 2 }]
+ };
- var expected = { container: null };
+ var src = { container: [null, null] };
- assert(dest, src, expected);
- });
- });
+ var expected = { container: [null, null] };
- describe('Plots.graphJson', function() {
-
- it('should serialize data, layout and frames', function(done) {
- var mock = {
- data: [{
- x: [1, 2, 3],
- y: [2, 1, 2]
- }],
- layout: {
- title: 'base'
- },
- frames: [{
- data: [{
- y: [1, 2, 1],
- }],
- layout: {
- title: 'frame A'
- },
- name: 'A'
- }, null, {
- data: [{
- y: [1, 2, 3],
- }],
- layout: {
- title: 'frame B'
- },
- name: 'B'
- }, {
- data: [null, false, undefined],
- layout: 'garbage',
- name: 'garbage'
- }]
- };
-
- Plotly.plot(createGraphDiv(), mock).then(function(gd) {
- var str = Plots.graphJson(gd, false, 'keepdata');
- var obj = JSON.parse(str);
-
- expect(obj.data).toEqual(mock.data);
- expect(obj.layout).toEqual(mock.layout);
- expect(obj.frames[0]).toEqual(mock.frames[0]);
- expect(obj.frames[1]).toEqual(mock.frames[2]);
- expect(obj.frames[2]).toEqual({
- data: [null, false, null],
- layout: 'garbage',
- name: 'garbage'
- });
- })
- .then(function() {
- destroyGraphDiv();
- done();
- });
- });
+ assert(dest, src, expected);
});
- describe('Plots.getSubplotCalcData', function() {
- var trace0 = { geo: 'geo2' };
- var trace1 = { subplot: 'ternary10' };
- var trace2 = { subplot: 'ternary10' };
-
- var cd = [
- [{ trace: trace0 }],
- [{ trace: trace1 }],
- [{ trace: trace2}]
- ];
+ it("clears container applying null src", function() {
+ var dest = {
+ container: [{ text: "1", x: 1, y: 1 }, { text: "2", x: 2, y: 2 }]
+ };
- it('should extract calcdata traces associated with subplot (1)', function() {
- var out = Plots.getSubplotCalcData(cd, 'geo', 'geo2');
- expect(out).toEqual([[{ trace: trace0 }]]);
- });
+ var src = { container: null };
- it('should extract calcdata traces associated with subplot (2)', function() {
- var out = Plots.getSubplotCalcData(cd, 'ternary', 'ternary10');
- expect(out).toEqual([[{ trace: trace1 }], [{ trace: trace2 }]]);
- });
+ var expected = { container: null };
- it('should return [] when no calcdata traces where found', function() {
- var out = Plots.getSubplotCalcData(cd, 'geo', 'geo');
- expect(out).toEqual([]);
- });
-
- it('should return [] when subplot type is invalid', function() {
- var out = Plots.getSubplotCalcData(cd, 'non-sense', 'geo2');
- expect(out).toEqual([]);
- });
+ assert(dest, src, expected);
});
-
- describe('Plots.generalUpdatePerTraceModule', function() {
-
- function _update(subplotCalcData, traceHashOld) {
- var subplot = { traceHash: traceHashOld || {} };
- var calcDataPerModule = [];
-
- var plot = function(_, moduleCalcData) {
- calcDataPerModule.push(moduleCalcData);
- };
-
- subplotCalcData.forEach(function(calcTrace) {
- calcTrace[0].trace._module = { plot: plot };
- });
-
- Plots.generalUpdatePerTraceModule(subplot, subplotCalcData, {});
-
- return {
- traceHash: subplot.traceHash,
- calcDataPerModule: calcDataPerModule
- };
- }
-
- it('should update subplot trace hash and call module plot method with correct calcdata traces', function() {
- var out = _update([
- [ { trace: { type: 'A', visible: false } } ],
- [ { trace: { type: 'A', visible: true } } ],
- [ { trace: { type: 'B', visible: false } } ],
- [ { trace: { type: 'C', visible: true } } ]
- ]);
-
- expect(Object.keys(out.traceHash)).toEqual(['A', 'C']);
- expect(out.traceHash.A.length).toEqual(1);
- expect(out.traceHash.C.length).toEqual(1);
-
- expect(out.calcDataPerModule.length).toEqual(2);
- expect(out.calcDataPerModule[0].length).toEqual(1);
- expect(out.calcDataPerModule[1].length).toEqual(1);
-
- var out2 = _update([
- [ { trace: { type: 'A', visible: false } } ],
- [ { trace: { type: 'A', visible: false } } ],
- [ { trace: { type: 'B', visible: true } } ],
- [ { trace: { type: 'C', visible: false } } ]
- ], out.traceHash);
-
- expect(Object.keys(out2.traceHash)).toEqual(['B', 'A', 'C']);
- expect(out2.traceHash.B.length).toEqual(1);
- expect(out2.traceHash.A.length).toEqual(1);
- expect(out2.traceHash.A[0][0].trace.visible).toBe(false);
- expect(out2.traceHash.C.length).toEqual(1);
- expect(out2.traceHash.C[0][0].trace.visible).toBe(false);
-
- expect(out2.calcDataPerModule.length).toEqual(1);
- expect(out2.calcDataPerModule[0].length).toEqual(1);
-
- var out3 = _update([
- [ { trace: { type: 'A', visible: false } } ],
- [ { trace: { type: 'A', visible: false } } ],
- [ { trace: { type: 'B', visible: false } } ],
- [ { trace: { type: 'C', visible: false } } ]
- ], out2.traceHash);
-
- expect(Object.keys(out3.traceHash)).toEqual(['B', 'A', 'C']);
- expect(out3.traceHash.B.length).toEqual(1);
- expect(out3.traceHash.B[0][0].trace.visible).toBe(false);
- expect(out3.traceHash.A.length).toEqual(1);
- expect(out3.traceHash.A[0][0].trace.visible).toBe(false);
- expect(out3.traceHash.C.length).toEqual(1);
- expect(out3.traceHash.C[0][0].trace.visible).toBe(false);
-
- expect(out3.calcDataPerModule.length).toEqual(0);
-
- var out4 = _update([
- [ { trace: { type: 'A', visible: true } } ],
- [ { trace: { type: 'A', visible: true } } ],
- [ { trace: { type: 'B', visible: true } } ],
- [ { trace: { type: 'C', visible: true } } ]
- ], out3.traceHash);
-
- expect(Object.keys(out4.traceHash)).toEqual(['A', 'B', 'C']);
- expect(out4.traceHash.A.length).toEqual(2);
- expect(out4.traceHash.B.length).toEqual(1);
- expect(out4.traceHash.C.length).toEqual(1);
-
- expect(out4.calcDataPerModule.length).toEqual(3);
- expect(out4.calcDataPerModule[0].length).toEqual(2);
- expect(out4.calcDataPerModule[1].length).toEqual(1);
- expect(out4.calcDataPerModule[2].length).toEqual(1);
+ });
+
+ describe("Plots.graphJson", function() {
+ it("should serialize data, layout and frames", function(done) {
+ var mock = {
+ data: [{ x: [1, 2, 3], y: [2, 1, 2] }],
+ layout: { title: "base" },
+ frames: [
+ {
+ data: [{ y: [1, 2, 1] }],
+ layout: { title: "frame A" },
+ name: "A"
+ },
+ null,
+ {
+ data: [{ y: [1, 2, 3] }],
+ layout: { title: "frame B" },
+ name: "B"
+ },
+ {
+ data: [null, false, undefined],
+ layout: "garbage",
+ name: "garbage"
+ }
+ ]
+ };
+
+ Plotly.plot(createGraphDiv(), mock)
+ .then(function(gd) {
+ var str = Plots.graphJson(gd, false, "keepdata");
+ var obj = JSON.parse(str);
+
+ expect(obj.data).toEqual(mock.data);
+ expect(obj.layout).toEqual(mock.layout);
+ expect(obj.frames[0]).toEqual(mock.frames[0]);
+ expect(obj.frames[1]).toEqual(mock.frames[2]);
+ expect(obj.frames[2]).toEqual({
+ data: [null, false, null],
+ layout: "garbage",
+ name: "garbage"
+ });
+ })
+ .then(function() {
+ destroyGraphDiv();
+ done();
});
+ });
+ });
+
+ describe("Plots.getSubplotCalcData", function() {
+ var trace0 = { geo: "geo2" };
+ var trace1 = { subplot: "ternary10" };
+ var trace2 = { subplot: "ternary10" };
+
+ var cd = [[{ trace: trace0 }], [{ trace: trace1 }], [{ trace: trace2 }]];
+
+ it(
+ "should extract calcdata traces associated with subplot (1)",
+ function() {
+ var out = Plots.getSubplotCalcData(cd, "geo", "geo2");
+ expect(out).toEqual([[{ trace: trace0 }]]);
+ }
+ );
+
+ it(
+ "should extract calcdata traces associated with subplot (2)",
+ function() {
+ var out = Plots.getSubplotCalcData(cd, "ternary", "ternary10");
+ expect(out).toEqual([[{ trace: trace1 }], [{ trace: trace2 }]]);
+ }
+ );
+
+ it("should return [] when no calcdata traces where found", function() {
+ var out = Plots.getSubplotCalcData(cd, "geo", "geo");
+ expect(out).toEqual([]);
+ });
- it('should handle cases when module plot is not set (geo case)', function(done) {
- Plotly.plot(createGraphDiv(), [{
- type: 'scattergeo',
- visible: false,
- lon: [10, 20],
- lat: [20, 10]
- }, {
- type: 'scattergeo',
- lon: [10, 20],
- lat: [20, 10]
- }])
- .then(function() {
- expect(d3.selectAll('g.trace.scattergeo').size()).toEqual(1);
-
- destroyGraphDiv();
- done();
- });
- });
+ it("should return [] when subplot type is invalid", function() {
+ var out = Plots.getSubplotCalcData(cd, "non-sense", "geo2");
+ expect(out).toEqual([]);
+ });
+ });
+
+ describe("Plots.generalUpdatePerTraceModule", function() {
+ function _update(subplotCalcData, traceHashOld) {
+ var subplot = { traceHash: traceHashOld || {} };
+ var calcDataPerModule = [];
+
+ var plot = function(_, moduleCalcData) {
+ calcDataPerModule.push(moduleCalcData);
+ };
+
+ subplotCalcData.forEach(function(calcTrace) {
+ calcTrace[0].trace._module = { plot: plot };
+ });
+
+ Plots.generalUpdatePerTraceModule(subplot, subplotCalcData, {});
+
+ return {
+ traceHash: subplot.traceHash,
+ calcDataPerModule: calcDataPerModule
+ };
+ }
+
+ it(
+ "should update subplot trace hash and call module plot method with correct calcdata traces",
+ function() {
+ var out = _update([
+ [{ trace: { type: "A", visible: false } }],
+ [{ trace: { type: "A", visible: true } }],
+ [{ trace: { type: "B", visible: false } }],
+ [{ trace: { type: "C", visible: true } }]
+ ]);
+
+ expect(Object.keys(out.traceHash)).toEqual(["A", "C"]);
+ expect(out.traceHash.A.length).toEqual(1);
+ expect(out.traceHash.C.length).toEqual(1);
+
+ expect(out.calcDataPerModule.length).toEqual(2);
+ expect(out.calcDataPerModule[0].length).toEqual(1);
+ expect(out.calcDataPerModule[1].length).toEqual(1);
+
+ var out2 = _update(
+ [
+ [{ trace: { type: "A", visible: false } }],
+ [{ trace: { type: "A", visible: false } }],
+ [{ trace: { type: "B", visible: true } }],
+ [{ trace: { type: "C", visible: false } }]
+ ],
+ out.traceHash
+ );
+
+ expect(Object.keys(out2.traceHash)).toEqual(["B", "A", "C"]);
+ expect(out2.traceHash.B.length).toEqual(1);
+ expect(out2.traceHash.A.length).toEqual(1);
+ expect(out2.traceHash.A[0][0].trace.visible).toBe(false);
+ expect(out2.traceHash.C.length).toEqual(1);
+ expect(out2.traceHash.C[0][0].trace.visible).toBe(false);
+
+ expect(out2.calcDataPerModule.length).toEqual(1);
+ expect(out2.calcDataPerModule[0].length).toEqual(1);
+
+ var out3 = _update(
+ [
+ [{ trace: { type: "A", visible: false } }],
+ [{ trace: { type: "A", visible: false } }],
+ [{ trace: { type: "B", visible: false } }],
+ [{ trace: { type: "C", visible: false } }]
+ ],
+ out2.traceHash
+ );
+
+ expect(Object.keys(out3.traceHash)).toEqual(["B", "A", "C"]);
+ expect(out3.traceHash.B.length).toEqual(1);
+ expect(out3.traceHash.B[0][0].trace.visible).toBe(false);
+ expect(out3.traceHash.A.length).toEqual(1);
+ expect(out3.traceHash.A[0][0].trace.visible).toBe(false);
+ expect(out3.traceHash.C.length).toEqual(1);
+ expect(out3.traceHash.C[0][0].trace.visible).toBe(false);
+
+ expect(out3.calcDataPerModule.length).toEqual(0);
+
+ var out4 = _update(
+ [
+ [{ trace: { type: "A", visible: true } }],
+ [{ trace: { type: "A", visible: true } }],
+ [{ trace: { type: "B", visible: true } }],
+ [{ trace: { type: "C", visible: true } }]
+ ],
+ out3.traceHash
+ );
+
+ expect(Object.keys(out4.traceHash)).toEqual(["A", "B", "C"]);
+ expect(out4.traceHash.A.length).toEqual(2);
+ expect(out4.traceHash.B.length).toEqual(1);
+ expect(out4.traceHash.C.length).toEqual(1);
+
+ expect(out4.calcDataPerModule.length).toEqual(3);
+ expect(out4.calcDataPerModule[0].length).toEqual(2);
+ expect(out4.calcDataPerModule[1].length).toEqual(1);
+ expect(out4.calcDataPerModule[2].length).toEqual(1);
+ }
+ );
+
+ it("should handle cases when module plot is not set (geo case)", function(
+ done
+ ) {
+ Plotly.plot(createGraphDiv(), [
+ {
+ type: "scattergeo",
+ visible: false,
+ lon: [10, 20],
+ lat: [20, 10]
+ },
+ { type: "scattergeo", lon: [10, 20], lat: [20, 10] }
+ ]).then(function() {
+ expect(d3.selectAll("g.trace.scattergeo").size()).toEqual(1);
+
+ destroyGraphDiv();
+ done();
+ });
+ });
- it('should handle cases when module plot is not set (ternary case)', function(done) {
- Plotly.plot(createGraphDiv(), [{
- type: 'scatterternary',
- visible: false,
- a: [0.1, 0.2],
- b: [0.2, 0.1]
- }, {
- type: 'scatterternary',
- a: [0.1, 0.2],
- b: [0.2, 0.1]
- }])
- .then(function() {
- expect(d3.selectAll('g.trace.scatter').size()).toEqual(1);
-
- destroyGraphDiv();
- done();
- });
+ it(
+ "should handle cases when module plot is not set (ternary case)",
+ function(done) {
+ Plotly.plot(createGraphDiv(), [
+ {
+ type: "scatterternary",
+ visible: false,
+ a: [0.1, 0.2],
+ b: [0.2, 0.1]
+ },
+ { type: "scatterternary", a: [0.1, 0.2], b: [0.2, 0.1] }
+ ]).then(function() {
+ expect(d3.selectAll("g.trace.scatter").size()).toEqual(1);
+
+ destroyGraphDiv();
+ done();
});
- });
+ }
+ );
+ });
});
diff --git a/test/jasmine/tests/plotschema_test.js b/test/jasmine/tests/plotschema_test.js
index b7b227bc8a0..490f3a295ad 100644
--- a/test/jasmine/tests/plotschema_test.js
+++ b/test/jasmine/tests/plotschema_test.js
@@ -1,216 +1,215 @@
-var Plotly = require('@lib/index');
+var Plotly = require("@lib/index");
-var Lib = require('@src/lib');
+var Lib = require("@src/lib");
-describe('plot schema', function() {
- 'use strict';
+describe("plot schema", function() {
+ "use strict";
+ var plotSchema = Plotly.PlotSchema.get(),
+ valObjects = plotSchema.defs.valObjects;
- var plotSchema = Plotly.PlotSchema.get(),
- valObjects = plotSchema.defs.valObjects;
+ var isValObject = Plotly.PlotSchema.isValObject,
+ isPlainObject = Lib.isPlainObject;
- var isValObject = Plotly.PlotSchema.isValObject,
- isPlainObject = Lib.isPlainObject;
+ var VALTYPES = Object.keys(valObjects), ROLES = ["info", "style", "data"];
- var VALTYPES = Object.keys(valObjects),
- ROLES = ['info', 'style', 'data'];
-
- function assertPlotSchema(callback) {
- var traces = plotSchema.traces;
-
- Object.keys(traces).forEach(function(traceName) {
- Plotly.PlotSchema.crawl(traces[traceName].attributes, callback);
- });
-
- Plotly.PlotSchema.crawl(plotSchema.layout.layoutAttributes, callback);
- }
-
- it('all attributes should have a valid `valType`', function() {
- assertPlotSchema(
- function(attr) {
- if(isValObject(attr)) {
- expect(VALTYPES.indexOf(attr.valType) !== -1).toBe(true);
- }
- }
- );
+ function assertPlotSchema(callback) {
+ var traces = plotSchema.traces;
+ Object.keys(traces).forEach(function(traceName) {
+ Plotly.PlotSchema.crawl(traces[traceName].attributes, callback);
});
- it('all attributes should only have valid `role`', function() {
- assertPlotSchema(
- function(attr) {
- if(isValObject(attr)) {
- expect(ROLES.indexOf(attr.role) !== -1).toBe(true, attr);
- }
- }
- );
- });
+ Plotly.PlotSchema.crawl(plotSchema.layout.layoutAttributes, callback);
+ }
- it('all nested objects should have the *object* `role`', function() {
- assertPlotSchema(
- function(attr, attrName) {
- if(!isValObject(attr) && isPlainObject(attr) && attrName !== 'items') {
- expect(attr.role === 'object').toBe(true);
- }
- }
- );
+ it("all attributes should have a valid `valType`", function() {
+ assertPlotSchema(function(attr) {
+ if (isValObject(attr)) {
+ expect(VALTYPES.indexOf(attr.valType) !== -1).toBe(true);
+ }
});
+ });
- it('all attributes should have the required options', function() {
- assertPlotSchema(
- function(attr) {
- if(isValObject(attr)) {
- var keys = Object.keys(attr);
-
- valObjects[attr.valType].requiredOpts.forEach(function(opt) {
- expect(keys.indexOf(opt) !== -1).toBe(true);
- });
- }
- }
- );
+ it("all attributes should only have valid `role`", function() {
+ assertPlotSchema(function(attr) {
+ if (isValObject(attr)) {
+ expect(ROLES.indexOf(attr.role) !== -1).toBe(true, attr);
+ }
});
+ });
- it('all attributes should only have compatible options', function() {
- assertPlotSchema(
- function(attr) {
- if(isValObject(attr)) {
- var valObject = valObjects[attr.valType],
- opts = valObject.requiredOpts
- .concat(valObject.otherOpts)
- .concat(['valType', 'description', 'role']);
-
- Object.keys(attr).forEach(function(key) {
- expect(opts.indexOf(key) !== -1).toBe(true, key, attr);
- });
- }
- }
- );
+ it("all nested objects should have the *object* `role`", function() {
+ assertPlotSchema(function(attr, attrName) {
+ if (!isValObject(attr) && isPlainObject(attr) && attrName !== "items") {
+ expect(attr.role === "object").toBe(true);
+ }
});
+ });
- it('all subplot objects should contain _isSubplotObj', function() {
- var IS_SUBPLOT_OBJ = '_isSubplotObj',
- astrs = ['xaxis', 'yaxis', 'scene', 'geo', 'ternary', 'mapbox'],
- cnt = 0;
-
- // check if the subplot objects have '_isSubplotObj'
- astrs.forEach(function(astr) {
- expect(
- Lib.nestedProperty(
- plotSchema.layout.layoutAttributes,
- astr + '.' + IS_SUBPLOT_OBJ
- ).get()
- ).toBe(true);
- });
+ it("all attributes should have the required options", function() {
+ assertPlotSchema(function(attr) {
+ if (isValObject(attr)) {
+ var keys = Object.keys(attr);
- // check that no other object has '_isSubplotObj'
- assertPlotSchema(
- function(attr, attrName) {
- if(attr[IS_SUBPLOT_OBJ] === true) {
- expect(astrs.indexOf(attrName)).not.toEqual(-1);
- cnt++;
- }
- }
- );
-
- expect(cnt).toEqual(astrs.length);
+ valObjects[attr.valType].requiredOpts.forEach(function(opt) {
+ expect(keys.indexOf(opt) !== -1).toBe(true);
+ });
+ }
});
-
- it('should convert _isLinkedToArray attributes to items object', function() {
- var astrs = [
- 'annotations', 'shapes', 'images',
- 'xaxis.rangeselector.buttons',
- 'updatemenus',
- 'sliders',
- 'mapbox.layers'
- ];
-
- astrs.forEach(function(astr) {
- var np = Lib.nestedProperty(
- plotSchema.layout.layoutAttributes, astr
- );
-
- var name = np.parts[np.parts.length - 1],
- itemName = name.substr(0, name.length - 1);
-
- var itemsObj = np.get().items,
- itemObj = itemsObj[itemName];
-
- // N.B. the specs below must be satisfied for plotly.py
- expect(isPlainObject(itemsObj)).toBe(true);
- expect(itemsObj.role).toBeUndefined();
- expect(Object.keys(itemsObj).length).toEqual(1);
- expect(isPlainObject(itemObj)).toBe(true);
- expect(itemObj.role).toBe('object');
-
- var role = np.get().role;
- expect(role).toEqual('object');
+ });
+
+ it("all attributes should only have compatible options", function() {
+ assertPlotSchema(function(attr) {
+ if (isValObject(attr)) {
+ var valObject = valObjects[attr.valType],
+ opts = valObject.requiredOpts
+ .concat(valObject.otherOpts)
+ .concat(["valType", "description", "role"]);
+
+ Object.keys(attr).forEach(function(key) {
+ expect(opts.indexOf(key) !== -1).toBe(true, key, attr);
});
+ }
});
-
- it('valObjects descriptions should be strings', function() {
- assertPlotSchema(
- function(attr) {
- var isValid;
-
- if(isValObject(attr)) {
- // attribute don't have to have a description (for now)
- isValid = (typeof attr.description === 'string') ||
- (attr.description === undefined);
-
- expect(isValid).toBe(true);
- }
- }
- );
+ });
+
+ it("all subplot objects should contain _isSubplotObj", function() {
+ var IS_SUBPLOT_OBJ = "_isSubplotObj",
+ astrs = ["xaxis", "yaxis", "scene", "geo", "ternary", "mapbox"],
+ cnt = 0;
+
+ // check if the subplot objects have '_isSubplotObj'
+ astrs.forEach(function(astr) {
+ expect(
+ Lib.nestedProperty(
+ plotSchema.layout.layoutAttributes,
+ astr + "." + IS_SUBPLOT_OBJ
+ ).get()
+ ).toBe(true);
});
- it('deprecated attributes should have a `valType` and `role`', function() {
- var DEPRECATED = '_deprecated';
-
- assertPlotSchema(
- function(attr) {
- if(isPlainObject(attr[DEPRECATED])) {
- Object.keys(attr[DEPRECATED]).forEach(function(dAttrName) {
- var dAttr = attr[DEPRECATED][dAttrName];
-
- expect(VALTYPES.indexOf(dAttr.valType) !== -1).toBe(true);
- expect(ROLES.indexOf(dAttr.role) !== -1).toBe(true);
- });
- }
- }
- );
+ // check that no other object has '_isSubplotObj'
+ assertPlotSchema(function(attr, attrName) {
+ if (attr[IS_SUBPLOT_OBJ] === true) {
+ expect(astrs.indexOf(attrName)).not.toEqual(-1);
+ cnt++;
+ }
});
- it('should work with registered transforms', function() {
- var valObjects = plotSchema.transforms.filter.attributes,
- attrNames = Object.keys(valObjects);
-
- ['operation', 'value', 'target'].forEach(function(k) {
- expect(attrNames).toContain(k);
- });
+ expect(cnt).toEqual(astrs.length);
+ });
+
+ it("should convert _isLinkedToArray attributes to items object", function() {
+ var astrs = [
+ "annotations",
+ "shapes",
+ "images",
+ "xaxis.rangeselector.buttons",
+ "updatemenus",
+ "sliders",
+ "mapbox.layers"
+ ];
+
+ astrs.forEach(function(astr) {
+ var np = Lib.nestedProperty(plotSchema.layout.layoutAttributes, astr);
+
+ var name = np.parts[np.parts.length - 1],
+ itemName = name.substr(0, name.length - 1);
+
+ var itemsObj = np.get().items, itemObj = itemsObj[itemName];
+
+ // N.B. the specs below must be satisfied for plotly.py
+ expect(isPlainObject(itemsObj)).toBe(true);
+ expect(itemsObj.role).toBeUndefined();
+ expect(Object.keys(itemsObj).length).toEqual(1);
+ expect(isPlainObject(itemObj)).toBe(true);
+ expect(itemObj.role).toBe("object");
+
+ var role = np.get().role;
+ expect(role).toEqual("object");
});
+ });
- it('should work with registered components', function() {
- expect(plotSchema.traces.scatter.attributes.xcalendar.valType).toEqual('enumerated');
- expect(plotSchema.traces.scatter3d.attributes.zcalendar.valType).toEqual('enumerated');
+ it("valObjects descriptions should be strings", function() {
+ assertPlotSchema(function(attr) {
+ var isValid;
- expect(plotSchema.layout.layoutAttributes.calendar.valType).toEqual('enumerated');
- expect(plotSchema.layout.layoutAttributes.xaxis.calendar.valType).toEqual('enumerated');
- expect(plotSchema.layout.layoutAttributes.scene.xaxis.calendar.valType).toEqual('enumerated');
+ if (isValObject(attr)) {
+ // attribute don't have to have a description (for now)
+ isValid = typeof attr.description === "string" ||
+ attr.description === undefined;
- expect(plotSchema.transforms.filter.attributes.valuecalendar.valType).toEqual('enumerated');
- expect(plotSchema.transforms.filter.attributes.targetcalendar.valType).toEqual('enumerated');
+ expect(isValid).toBe(true);
+ }
});
+ });
+
+ it("deprecated attributes should have a `valType` and `role`", function() {
+ var DEPRECATED = "_deprecated";
- it('should list correct defs', function() {
- expect(plotSchema.defs.valObjects).toBeDefined();
+ assertPlotSchema(function(attr) {
+ if (isPlainObject(attr[DEPRECATED])) {
+ Object.keys(attr[DEPRECATED]).forEach(function(dAttrName) {
+ var dAttr = attr[DEPRECATED][dAttrName];
- expect(plotSchema.defs.metaKeys)
- .toEqual(['_isSubplotObj', '_isLinkedToArray', '_deprecated', 'description', 'role']);
+ expect(VALTYPES.indexOf(dAttr.valType) !== -1).toBe(true);
+ expect(ROLES.indexOf(dAttr.role) !== -1).toBe(true);
+ });
+ }
});
+ });
+
+ it("should work with registered transforms", function() {
+ var valObjects = plotSchema.transforms.filter.attributes,
+ attrNames = Object.keys(valObjects);
- it('should list the correct frame attributes', function() {
- expect(plotSchema.frames).toBeDefined();
- expect(plotSchema.frames.role).toEqual('object');
- expect(plotSchema.frames.items.frames_entry).toBeDefined();
- expect(plotSchema.frames.items.frames_entry.role).toEqual('object');
+ ["operation", "value", "target"].forEach(function(k) {
+ expect(attrNames).toContain(k);
});
+ });
+
+ it("should work with registered components", function() {
+ expect(plotSchema.traces.scatter.attributes.xcalendar.valType).toEqual(
+ "enumerated"
+ );
+ expect(plotSchema.traces.scatter3d.attributes.zcalendar.valType).toEqual(
+ "enumerated"
+ );
+
+ expect(plotSchema.layout.layoutAttributes.calendar.valType).toEqual(
+ "enumerated"
+ );
+ expect(plotSchema.layout.layoutAttributes.xaxis.calendar.valType).toEqual(
+ "enumerated"
+ );
+ expect(
+ plotSchema.layout.layoutAttributes.scene.xaxis.calendar.valType
+ ).toEqual("enumerated");
+
+ expect(
+ plotSchema.transforms.filter.attributes.valuecalendar.valType
+ ).toEqual("enumerated");
+ expect(
+ plotSchema.transforms.filter.attributes.targetcalendar.valType
+ ).toEqual("enumerated");
+ });
+
+ it("should list correct defs", function() {
+ expect(plotSchema.defs.valObjects).toBeDefined();
+
+ expect(plotSchema.defs.metaKeys).toEqual([
+ "_isSubplotObj",
+ "_isLinkedToArray",
+ "_deprecated",
+ "description",
+ "role"
+ ]);
+ });
+
+ it("should list the correct frame attributes", function() {
+ expect(plotSchema.frames).toBeDefined();
+ expect(plotSchema.frames.role).toEqual("object");
+ expect(plotSchema.frames.items.frames_entry).toBeDefined();
+ expect(plotSchema.frames.items.frames_entry.role).toEqual("object");
+ });
});
diff --git a/test/jasmine/tests/polygon_test.js b/test/jasmine/tests/polygon_test.js
index f9fc5536fd6..6ae3d832a38 100644
--- a/test/jasmine/tests/polygon_test.js
+++ b/test/jasmine/tests/polygon_test.js
@@ -1,214 +1,340 @@
-var polygon = require('@src/lib/polygon'),
- polygonTester = polygon.tester,
- isBent = polygon.isSegmentBent,
- filter = polygon.filter;
-
-describe('polygon.tester', function() {
- 'use strict';
-
- var squareCW = [[0, 0], [0, 1], [1, 1], [1, 0]],
- squareCCW = [[0, 0], [1, 0], [1, 1], [0, 1]],
- bowtie = [[0, 0], [0, 1], [1, 0], [1, 1]],
- squareish = [
- [-0.123, -0.0456],
- [0.12345, 1.2345],
- [1.3456, 1.4567],
- [1.5678, 0.21345]],
- equilateralTriangle = [
- [0, Math.sqrt(3) / 3],
- [-0.5, -Math.sqrt(3) / 6],
- [0.5, -Math.sqrt(3) / 6]],
-
- zigzag = [ // 4 *
- [0, 0], [2, 1], // \-.
- [0, 1], [2, 2], // 3 * *
- [1, 2], [3, 3], // ,-' |
- [2, 4], [4, 3], // 2 *-* |
- [4, 0]], // ,-' |
- // 1 *---* |
- // ,-' |
- // 0 *-------*
- // 0 1 2 3 4
- inZigzag = [
- [0.5, 0.01], [1, 0.49], [1.5, 0.5], [2, 0.5], [2.5, 0.5], [3, 0.5],
- [3.5, 0.5], [0.5, 1.01], [1, 1.49], [1.5, 1.5], [2, 1.5], [2.5, 1.5],
- [3, 1.5], [3.5, 1.5], [1.5, 2.01], [2, 2.49], [2.5, 2.5], [3, 2.5],
- [3.5, 2.5], [2.5, 3.51], [3, 3.49]],
- notInZigzag = [
- [0, -0.01], [0, 0.01], [0, 0.99], [0, 1.01], [0.5, -0.01], [0.5, 0.26],
- [0.5, 0.99], [0.5, 1.26], [1, -0.01], [1, 0.51], [1, 0.99], [1, 1.51],
- [1, 1.99], [1, 2.01], [2, -0.01], [2, 2.51], [2, 3.99], [2, 4.01],
- [3, -0.01], [2.99, 3], [3, 3.51], [4, -0.01], [4, 3.01]],
-
- donut = [ // inner CCW, outer CW // 3 *-----*
- [3, 0], [0, 0], [0, 1], [2, 1], [2, 2], // | |
- [1, 2], [1, 1], [0, 1], [0, 3], [3, 3]], // 2 | *-* |
- donut2 = [ // inner CCW, outer CCW // | | | |
- [3, 3], [0, 3], [0, 1], [2, 1], [2, 2], // 1 *-*-* |
- [1, 2], [1, 1], [0, 1], [0, 0], [3, 0]], // | |
- // 0 *-----*
- // 0 1 2 3
- inDonut = [[0.5, 0.5], [1, 0.5], [1.5, 0.5], [2, 0.5], [2.5, 0.5],
- [2.5, 1], [2.5, 1.5], [2.5, 2], [2.5, 2.5], [2, 2.5], [1.5, 2.5],
- [1, 2.5], [0.5, 2.5], [0.5, 2], [0.5, 1.5], [0.5, 1]],
- notInDonut = [[1.5, -0.5], [1.5, 1.5], [1.5, 3.5], [-0.5, 1.5], [3.5, 1.5]];
-
- it('should exclude points outside the bounding box', function() {
- var poly = polygonTester([[1, 2], [3, 4]]);
- var pts = [[0, 3], [4, 3], [2, 1], [2, 5]];
- pts.forEach(function(pt) {
- expect(poly.contains(pt)).toBe(false);
- expect(poly.contains(pt, true)).toBe(false);
- expect(poly.contains(pt, false)).toBe(false);
- });
- });
+var polygon = require("@src/lib/polygon"),
+ polygonTester = polygon.tester,
+ isBent = polygon.isSegmentBent,
+ filter = polygon.filter;
- it('should prepare a polygon object correctly', function() {
- var polyPts = [squareCW, squareCCW, bowtie, squareish, equilateralTriangle,
- zigzag, donut, donut2];
-
- polyPts.forEach(function(polyPt) {
- var poly = polygonTester(polyPt),
- xArray = polyPt.map(function(pt) { return pt[0]; }),
- yArray = polyPt.map(function(pt) { return pt[1]; });
-
- expect(poly.pts.length).toEqual(polyPt.length + 1);
- polyPt.forEach(function(pt, i) {
- expect(poly.pts[i]).toEqual(pt);
- });
- expect(poly.pts[poly.pts.length - 1]).toEqual(polyPt[0]);
- expect(poly.xmin).toEqual(Math.min.apply(null, xArray));
- expect(poly.xmax).toEqual(Math.max.apply(null, xArray));
- expect(poly.ymin).toEqual(Math.min.apply(null, yArray));
- expect(poly.ymax).toEqual(Math.max.apply(null, yArray));
- });
- });
+describe("polygon.tester", function() {
+ "use strict";
+ var squareCW = [[0, 0], [0, 1], [1, 1], [1, 0]],
+ squareCCW = [[0, 0], [1, 0], [1, 1], [0, 1]],
+ bowtie = [[0, 0], [0, 1], [1, 0], [1, 1]],
+ squareish = [
+ [-0.123, -0.0456],
+ [0.12345, 1.2345],
+ [1.3456, 1.4567],
+ [1.5678, 0.21345]
+ ],
+ equilateralTriangle = [
+ [0, Math.sqrt(3) / 3],
+ [-0.5, (-Math.sqrt(3)) / 6],
+ [0.5, (-Math.sqrt(3)) / 6]
+ ],
+ zigzag = [
+ // 4 *
+ [0, 0],
+ [2, 1],
+ // \-.
+ [0, 1],
+ [2, 2],
+ // 3 * *
+ [1, 2],
+ [3, 3],
+ // ,-' |
+ [2, 4],
+ [4, 3],
+ // 2 *-* |
+ [4, 0]
+ ],
+ // ,-' |
+ // 1 *---* |
+ // ,-' |
+ // 0 *-------*
+ // 0 1 2 3 4
+ inZigzag = [
+ [0.5, 0.01],
+ [1, 0.49],
+ [1.5, 0.5],
+ [2, 0.5],
+ [2.5, 0.5],
+ [3, 0.5],
+ [3.5, 0.5],
+ [0.5, 1.01],
+ [1, 1.49],
+ [1.5, 1.5],
+ [2, 1.5],
+ [2.5, 1.5],
+ [3, 1.5],
+ [3.5, 1.5],
+ [1.5, 2.01],
+ [2, 2.49],
+ [2.5, 2.5],
+ [3, 2.5],
+ [3.5, 2.5],
+ [2.5, 3.51],
+ [3, 3.49]
+ ],
+ notInZigzag = [
+ [0, -0.01],
+ [0, 0.01],
+ [0, 0.99],
+ [0, 1.01],
+ [0.5, -0.01],
+ [0.5, 0.26],
+ [0.5, 0.99],
+ [0.5, 1.26],
+ [1, -0.01],
+ [1, 0.51],
+ [1, 0.99],
+ [1, 1.51],
+ [1, 1.99],
+ [1, 2.01],
+ [2, -0.01],
+ [2, 2.51],
+ [2, 3.99],
+ [2, 4.01],
+ [3, -0.01],
+ [2.99, 3],
+ [3, 3.51],
+ [4, -0.01],
+ [4, 3.01]
+ ],
+ donut = [
+ // inner CCW, outer CW // 3 *-----*
+ [3, 0],
+ [0, 0],
+ [0, 1],
+ [2, 1],
+ [2, 2],
+ // | |
+ [1, 2],
+ [1, 1],
+ [0, 1],
+ [0, 3],
+ [3, 3]
+ ],
+ // 2 | *-* |
+ donut2 = [
+ // inner CCW, outer CCW // | | | |
+ [3, 3],
+ [0, 3],
+ [0, 1],
+ [2, 1],
+ [2, 2],
+ // 1 *-*-* |
+ [1, 2],
+ [1, 1],
+ [0, 1],
+ [0, 0],
+ [3, 0]
+ ],
+ // | |
+ // 0 *-----*
+ // 0 1 2 3
+ inDonut = [
+ [0.5, 0.5],
+ [1, 0.5],
+ [1.5, 0.5],
+ [2, 0.5],
+ [2.5, 0.5],
+ [2.5, 1],
+ [2.5, 1.5],
+ [2.5, 2],
+ [2.5, 2.5],
+ [2, 2.5],
+ [1.5, 2.5],
+ [1, 2.5],
+ [0.5, 2.5],
+ [0.5, 2],
+ [0.5, 1.5],
+ [0.5, 1]
+ ],
+ notInDonut = [[1.5, -0.5], [1.5, 1.5], [1.5, 3.5], [-0.5, 1.5], [3.5, 1.5]];
- it('should include the whole boundary, except as per omitFirstEdge', function() {
- var polyPts = [squareCW, squareCCW, bowtie, squareish, equilateralTriangle,
- zigzag, donut, donut2];
- var np = 6; // number of intermediate points on each edge to test
-
- polyPts.forEach(function(polyPt) {
- var poly = polygonTester(polyPt);
-
- var isRect = polyPt === squareCW || polyPt === squareCCW;
- expect(poly.isRect).toBe(isRect);
- // to make sure we're only using the bounds and first pt, delete the rest
- if(isRect) poly.pts.splice(1, poly.pts.length);
-
- poly.pts.forEach(function(pt1, i) {
- if(!i) return;
- var pt0 = poly.pts[i - 1],
- j;
-
- var testPts = [pt0, pt1];
- for(j = 1; j < np; j++) {
- if(pt0[0] === pt1[0]) {
- testPts.push([pt0[0], pt0[1] + (pt1[1] - pt0[1]) * j / np]);
- }
- else {
- var x = pt0[0] + (pt1[0] - pt0[0]) * j / np;
- // calculated the same way as in the pt_in_polygon source,
- // so we know rounding errors will apply the same and this pt
- // *really* appears on the boundary
- testPts.push([x, pt0[1] + (x - pt0[0]) * (pt1[1] - pt0[1]) /
- (pt1[0] - pt0[0])]);
- }
- }
- testPts.forEach(function(pt, j) {
- expect(poly.contains(pt))
- .toBe(true, 'poly: ' + polyPt.join(';') + ', pt: ' + pt);
- var isFirstEdge = (i === 1) || (i === 2 && j === 0) ||
- (i === poly.pts.length - 1 && j === 1);
- expect(poly.contains(pt, true))
- .toBe(!isFirstEdge, 'omit: ' + !isFirstEdge + ', poly: ' +
- polyPt.join(';') + ', pt: ' + pt);
- });
- });
- });
+ it("should exclude points outside the bounding box", function() {
+ var poly = polygonTester([[1, 2], [3, 4]]);
+ var pts = [[0, 3], [4, 3], [2, 1], [2, 5]];
+ pts.forEach(function(pt) {
+ expect(poly.contains(pt)).toBe(false);
+ expect(poly.contains(pt, true)).toBe(false);
+ expect(poly.contains(pt, false)).toBe(false);
});
+ });
- it('should find only the right interior points', function() {
- var zzpoly = polygonTester(zigzag);
- inZigzag.forEach(function(pt) {
- expect(zzpoly.contains(pt)).toBe(true);
- });
- notInZigzag.forEach(function(pt) {
- expect(zzpoly.contains(pt)).toBe(false);
- });
+ it("should prepare a polygon object correctly", function() {
+ var polyPts = [
+ squareCW,
+ squareCCW,
+ bowtie,
+ squareish,
+ equilateralTriangle,
+ zigzag,
+ donut,
+ donut2
+ ];
- var donutpoly = polygonTester(donut),
- donut2poly = polygonTester(donut2);
- inDonut.forEach(function(pt) {
- expect(donutpoly.contains(pt)).toBe(true);
- expect(donut2poly.contains(pt)).toBe(true);
- });
- notInDonut.forEach(function(pt) {
- expect(donutpoly.contains(pt)).toBe(false);
- expect(donut2poly.contains(pt)).toBe(false);
+ polyPts.forEach(function(polyPt) {
+ var poly = polygonTester(polyPt),
+ xArray = polyPt.map(function(pt) {
+ return pt[0];
+ }),
+ yArray = polyPt.map(function(pt) {
+ return pt[1];
});
+
+ expect(poly.pts.length).toEqual(polyPt.length + 1);
+ polyPt.forEach(function(pt, i) {
+ expect(poly.pts[i]).toEqual(pt);
+ });
+ expect(poly.pts[poly.pts.length - 1]).toEqual(polyPt[0]);
+ expect(poly.xmin).toEqual(Math.min.apply(null, xArray));
+ expect(poly.xmax).toEqual(Math.max.apply(null, xArray));
+ expect(poly.ymin).toEqual(Math.min.apply(null, yArray));
+ expect(poly.ymax).toEqual(Math.max.apply(null, yArray));
});
-});
+ });
-describe('polygon.isSegmentBent', function() {
- 'use strict';
+ it(
+ "should include the whole boundary, except as per omitFirstEdge",
+ function() {
+ var polyPts = [
+ squareCW,
+ squareCCW,
+ bowtie,
+ squareish,
+ equilateralTriangle,
+ zigzag,
+ donut,
+ donut2
+ ];
+ var np = 6;
- var pts = [[0, 0], [1, 1], [2, 0], [1, 0], [100, -37]];
+ // number of intermediate points on each edge to test
+ polyPts.forEach(function(polyPt) {
+ var poly = polygonTester(polyPt);
- it('should treat any two points as straight', function() {
- for(var i = 0; i < pts.length - 1; i++) {
- expect(isBent(pts, i, i + 1, 0)).toBe(false);
- }
- });
+ var isRect = polyPt === squareCW || polyPt === squareCCW;
+ expect(poly.isRect).toBe(isRect);
+ // to make sure we're only using the bounds and first pt, delete the rest
+ if (isRect) poly.pts.splice(1, poly.pts.length);
+
+ poly.pts.forEach(function(pt1, i) {
+ if (!i) return;
+ var pt0 = poly.pts[i - 1], j;
- function rotatePt(theta) {
- return function(pt) {
- return [
- pt[0] * Math.cos(theta) - pt[1] * Math.sin(theta),
- pt[0] * Math.sin(theta) + pt[1] * Math.cos(theta)];
- };
+ var testPts = [pt0, pt1];
+ for (j = 1; j < np; j++) {
+ if (pt0[0] === pt1[0]) {
+ testPts.push([pt0[0], pt0[1] + (pt1[1] - pt0[1]) * j / np]);
+ } else {
+ var x = pt0[0] + (pt1[0] - pt0[0]) * j / np;
+ // calculated the same way as in the pt_in_polygon source,
+ // so we know rounding errors will apply the same and this pt
+ // *really* appears on the boundary
+ testPts.push([
+ x,
+ pt0[1] + (x - pt0[0]) * (pt1[1] - pt0[1]) / (pt1[0] - pt0[0])
+ ]);
+ }
+ }
+ testPts.forEach(function(pt, j) {
+ expect(poly.contains(pt)).toBe(
+ true,
+ "poly: " + polyPt.join(";") + ", pt: " + pt
+ );
+ var isFirstEdge = i === 1 ||
+ i === 2 && j === 0 ||
+ i === poly.pts.length - 1 && j === 1;
+ expect(poly.contains(pt, true)).toBe(
+ !isFirstEdge,
+ "omit: " +
+ !isFirstEdge +
+ ", poly: " +
+ polyPt.join(";") +
+ ", pt: " +
+ pt
+ );
+ });
+ });
+ });
}
+ );
- it('should find a bent line at the right tolerance', function() {
- for(var theta = 0; theta < 6; theta += 0.3) {
- var pts2 = pts.map(rotatePt(theta));
- expect(isBent(pts2, 0, 2, 0.99)).toBe(true);
- expect(isBent(pts2, 0, 2, 1.01)).toBe(false);
- }
+ it("should find only the right interior points", function() {
+ var zzpoly = polygonTester(zigzag);
+ inZigzag.forEach(function(pt) {
+ expect(zzpoly.contains(pt)).toBe(true);
+ });
+ notInZigzag.forEach(function(pt) {
+ expect(zzpoly.contains(pt)).toBe(false);
});
- it('should treat any backward motion as bent', function() {
- expect(isBent([[0, 0], [2, 0], [1, 0]], 0, 2, 10)).toBe(true);
+ var donutpoly = polygonTester(donut), donut2poly = polygonTester(donut2);
+ inDonut.forEach(function(pt) {
+ expect(donutpoly.contains(pt)).toBe(true);
+ expect(donut2poly.contains(pt)).toBe(true);
+ });
+ notInDonut.forEach(function(pt) {
+ expect(donutpoly.contains(pt)).toBe(false);
+ expect(donut2poly.contains(pt)).toBe(false);
});
+ });
});
-describe('polygon.filter', function() {
- 'use strict';
+describe("polygon.isSegmentBent", function() {
+ "use strict";
+ var pts = [[0, 0], [1, 1], [2, 0], [1, 0], [100, -37]];
- var pts = [
- [0, 0], [1, 0], [2, 0], [3, 0],
- [3, 1], [3, 2], [3, 3],
- [2, 3], [1, 3], [0, 3],
- [0, 2], [0, 1], [0, 0]];
+ it("should treat any two points as straight", function() {
+ for (var i = 0; i < pts.length - 1; i++) {
+ expect(isBent(pts, i, i + 1, 0)).toBe(false);
+ }
+ });
- var ptsOut = [[0, 0], [3, 0], [3, 3], [0, 3], [0, 0]];
+ function rotatePt(theta) {
+ return function(pt) {
+ return [
+ pt[0] * Math.cos(theta) - pt[1] * Math.sin(theta),
+ pt[0] * Math.sin(theta) + pt[1] * Math.cos(theta)
+ ];
+ };
+ }
- it('should give the right result if points are provided upfront', function() {
- expect(filter(pts, 0.5).filtered).toEqual(ptsOut);
- });
+ it("should find a bent line at the right tolerance", function() {
+ for (var theta = 0; theta < 6; theta += 0.3) {
+ var pts2 = pts.map(rotatePt(theta));
+ expect(isBent(pts2, 0, 2, 0.99)).toBe(true);
+ expect(isBent(pts2, 0, 2, 1.01)).toBe(false);
+ }
+ });
- it('should give the right result if points are added one-by-one', function() {
- var p = filter([pts[0]], 0.5),
- i;
+ it("should treat any backward motion as bent", function() {
+ expect(isBent([[0, 0], [2, 0], [1, 0]], 0, 2, 10)).toBe(true);
+ });
+});
- // intermediate result (the last point isn't in the final)
- for(i = 1; i < 6; i++) p.addPt(pts[i]);
- expect(p.filtered).toEqual([[0, 0], [3, 0], [3, 2]]);
+describe("polygon.filter", function() {
+ "use strict";
+ var pts = [
+ [0, 0],
+ [1, 0],
+ [2, 0],
+ [3, 0],
+ [3, 1],
+ [3, 2],
+ [3, 3],
+ [2, 3],
+ [1, 3],
+ [0, 3],
+ [0, 2],
+ [0, 1],
+ [0, 0]
+ ];
- // final result
- for(i = 6; i < pts.length; i++) p.addPt(pts[i]);
- expect(p.filtered).toEqual(ptsOut);
- });
+ var ptsOut = [[0, 0], [3, 0], [3, 3], [0, 3], [0, 0]];
+
+ it("should give the right result if points are provided upfront", function() {
+ expect(filter(pts, 0.5).filtered).toEqual(ptsOut);
+ });
+
+ it("should give the right result if points are added one-by-one", function() {
+ var p = filter([pts[0]], 0.5), i;
+
+ // intermediate result (the last point isn't in the final)
+ for (i = 1; i < 6; i++) p.addPt(pts[i]);
+ expect(p.filtered).toEqual([[0, 0], [3, 0], [3, 2]]);
+ // final result
+ for (i = 6; i < pts.length; i++) p.addPt(pts[i]);
+ expect(p.filtered).toEqual(ptsOut);
+ });
});
diff --git a/test/jasmine/tests/range_selector_test.js b/test/jasmine/tests/range_selector_test.js
index 1a306e4b24d..c481b7eabb8 100644
--- a/test/jasmine/tests/range_selector_test.js
+++ b/test/jasmine/tests/range_selector_test.js
@@ -1,596 +1,538 @@
-var RangeSelector = require('@src/components/rangeselector');
-var getUpdateObject = require('@src/components/rangeselector/get_update_object');
-
-var d3 = require('d3');
-var Plotly = require('@lib');
-var Lib = require('@src/lib');
-var Color = require('@src/components/color');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var getRectCenter = require('../assets/get_rect_center');
-var mouseEvent = require('../assets/mouse_event');
-var setConvert = require('@src/plots/cartesian/set_convert');
-
-
-describe('range selector defaults:', function() {
- 'use strict';
-
- var handleDefaults = RangeSelector.handleDefaults;
-
- function supply(containerIn, containerOut, calendar) {
- containerOut.domain = [0, 1];
-
- var layout = {
- yaxis: { domain: [0, 1] }
- };
-
- var counterAxes = ['yaxis'];
-
- handleDefaults(containerIn, containerOut, layout, counterAxes, calendar);
+var RangeSelector = require("@src/components/rangeselector");
+var getUpdateObject = require(
+ "@src/components/rangeselector/get_update_object"
+);
+
+var d3 = require("d3");
+var Plotly = require("@lib");
+var Lib = require("@src/lib");
+var Color = require("@src/components/color");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var getRectCenter = require("../assets/get_rect_center");
+var mouseEvent = require("../assets/mouse_event");
+var setConvert = require("@src/plots/cartesian/set_convert");
+
+describe("range selector defaults:", function() {
+ "use strict";
+ var handleDefaults = RangeSelector.handleDefaults;
+
+ function supply(containerIn, containerOut, calendar) {
+ containerOut.domain = [0, 1];
+
+ var layout = { yaxis: { domain: [0, 1] } };
+
+ var counterAxes = ["yaxis"];
+
+ handleDefaults(containerIn, containerOut, layout, counterAxes, calendar);
+ }
+
+ it("should set 'visible' to false when no buttons are present", function() {
+ var containerIn = {};
+ var containerOut = {};
+
+ supply(containerIn, containerOut);
+
+ expect(containerOut.rangeselector).toEqual({ visible: false, buttons: [] });
+ });
+
+ it("should coerce an empty button object", function() {
+ var containerIn = { rangeselector: { buttons: [{}] } };
+ var containerOut = {};
+
+ supply(containerIn, containerOut);
+
+ expect(containerIn.rangeselector.buttons).toEqual([{}]);
+ expect(containerOut.rangeselector.buttons).toEqual([
+ { step: "month", stepmode: "backward", count: 1, _index: 0 }
+ ]);
+ });
+
+ it("should skip over non-object buttons", function() {
+ var containerIn = {
+ rangeselector: {
+ buttons: [
+ { label: "button 0" },
+ null,
+ { label: "button 2" },
+ "remove",
+ { label: "button 4" }
+ ]
+ }
+ };
+ var containerOut = {};
+
+ supply(containerIn, containerOut);
+
+ expect(containerIn.rangeselector.buttons.length).toEqual(5);
+ expect(containerOut.rangeselector.buttons.length).toEqual(3);
+ });
+
+ it("should coerce all buttons present", function() {
+ var containerIn = {
+ rangeselector: { buttons: [{ step: "year", count: 10 }, { count: 6 }] }
+ };
+ var containerOut = {};
+
+ supply(containerIn, containerOut);
+
+ expect(containerOut.rangeselector.visible).toBe(true);
+ expect(containerOut.rangeselector.buttons).toEqual([
+ { step: "year", stepmode: "backward", count: 10, _index: 0 },
+ { step: "month", stepmode: "backward", count: 6, _index: 1 }
+ ]);
+ });
+
+ it(
+ "should not coerce 'stepmode' and 'count', for 'step' all buttons",
+ function() {
+ var containerIn = {
+ rangeselector: { buttons: [{ step: "all", label: "full range" }] }
+ };
+ var containerOut = {};
+
+ supply(containerIn, containerOut);
+
+ expect(containerOut.rangeselector.buttons).toEqual([
+ { step: "all", label: "full range", _index: 0 }
+ ]);
}
-
- it('should set \'visible\' to false when no buttons are present', function() {
- var containerIn = {};
- var containerOut = {};
-
- supply(containerIn, containerOut);
-
- expect(containerOut.rangeselector)
- .toEqual({
- visible: false,
- buttons: []
- });
- });
-
- it('should coerce an empty button object', function() {
- var containerIn = {
- rangeselector: {
- buttons: [{}]
- }
- };
- var containerOut = {};
-
- supply(containerIn, containerOut);
-
- expect(containerIn.rangeselector.buttons).toEqual([{}]);
- expect(containerOut.rangeselector.buttons).toEqual([{
- step: 'month',
- stepmode: 'backward',
- count: 1,
- _index: 0
- }]);
- });
-
- it('should skip over non-object buttons', function() {
- var containerIn = {
- rangeselector: {
- buttons: [{
- label: 'button 0'
- }, null, {
- label: 'button 2'
- }, 'remove', {
- label: 'button 4'
- }]
- }
- };
- var containerOut = {};
-
- supply(containerIn, containerOut);
-
- expect(containerIn.rangeselector.buttons.length).toEqual(5);
- expect(containerOut.rangeselector.buttons.length).toEqual(3);
- });
-
- it('should coerce all buttons present', function() {
- var containerIn = {
- rangeselector: {
- buttons: [{
- step: 'year',
- count: 10
- }, {
- count: 6
- }]
- }
- };
- var containerOut = {};
-
- supply(containerIn, containerOut);
-
- expect(containerOut.rangeselector.visible).toBe(true);
- expect(containerOut.rangeselector.buttons).toEqual([
- { step: 'year', stepmode: 'backward', count: 10, _index: 0 },
- { step: 'month', stepmode: 'backward', count: 6, _index: 1 }
- ]);
- });
-
- it('should not coerce \'stepmode\' and \'count\', for \'step\' all buttons', function() {
- var containerIn = {
- rangeselector: {
- buttons: [{
- step: 'all',
- label: 'full range'
- }]
- }
- };
- var containerOut = {};
-
- supply(containerIn, containerOut);
-
- expect(containerOut.rangeselector.buttons).toEqual([{
- step: 'all',
- label: 'full range',
- _index: 0
- }]);
- });
-
- it('should use axis and counter axis to determine \'x\' and \'y\' defaults (case 1 y)', function() {
- var containerIn = {
- rangeselector: { buttons: [{}] }
- };
- var containerOut = {
- _id: 'x',
- domain: [0, 0.5]
- };
- var layout = {
- xaxis: containerIn,
- yaxis: {
- anchor: 'x',
- domain: [0, 0.45]
- }
- };
- var counterAxes = ['yaxis'];
-
- handleDefaults(containerIn, containerOut, layout, counterAxes);
-
- expect(containerOut.rangeselector.x).toEqual(0);
- expect(containerOut.rangeselector.y).toBeCloseTo(0.47);
- });
-
- it('should use axis and counter axis to determine \'x\' and \'y\' defaults (case multi y)', function() {
- var containerIn = {
- rangeselector: { buttons: [{}] }
- };
- var containerOut = {
- _id: 'x',
- domain: [0.5, 1]
- };
- var layout = {
- xaxis: containerIn,
- yaxis: {
- anchor: 'x',
- domain: [0, 0.25]
- },
- yaxis2: {
- anchor: 'x',
- overlaying: 'y'
- },
- yaxis3: {
- anchor: 'x',
- domain: [0.6, 0.85]
- }
- };
- var counterAxes = ['yaxis', 'yaxis2', 'yaxis3'];
-
- handleDefaults(containerIn, containerOut, layout, counterAxes);
-
- expect(containerOut.rangeselector.x).toEqual(0.5);
- expect(containerOut.rangeselector.y).toBeCloseTo(0.87);
- });
-
- it('should not allow month/year todate with calendars other than Gregorian', function() {
- var containerIn = {
- rangeselector: {
- buttons: [{
- step: 'year',
- count: 1,
- stepmode: 'todate'
- }, {
- step: 'month',
- count: 6,
- stepmode: 'todate'
- }, {
- step: 'day',
- count: 1,
- stepmode: 'todate'
- }, {
- step: 'hour',
- count: 1,
- stepmode: 'todate'
- }]
- }
- };
- var containerOut;
- function getStepmode(button) { return button.stepmode; }
-
- containerOut = {};
- supply(containerIn, containerOut);
-
- expect(containerOut.rangeselector.buttons.map(getStepmode)).toEqual([
- 'todate', 'todate', 'todate', 'todate'
- ]);
-
- containerOut = {};
- supply(containerIn, containerOut, 'gregorian');
-
- expect(containerOut.rangeselector.buttons.map(getStepmode)).toEqual([
- 'todate', 'todate', 'todate', 'todate'
- ]);
-
- containerOut = {};
- supply(containerIn, containerOut, 'chinese');
-
- expect(containerOut.rangeselector.buttons.map(getStepmode)).toEqual([
- 'backward', 'backward', 'todate', 'todate'
- ]);
- });
-});
-
-describe('range selector getUpdateObject:', function() {
- 'use strict';
-
- function assertRanges(update, range0, range1) {
- expect(update['xaxis.range[0]']).toEqual(range0);
- expect(update['xaxis.range[1]']).toEqual(range1);
+ );
+
+ it(
+ "should use axis and counter axis to determine 'x' and 'y' defaults (case 1 y)",
+ function() {
+ var containerIn = { rangeselector: { buttons: [{}] } };
+ var containerOut = { _id: "x", domain: [0, 0.5] };
+ var layout = {
+ xaxis: containerIn,
+ yaxis: { anchor: "x", domain: [0, 0.45] }
+ };
+ var counterAxes = ["yaxis"];
+
+ handleDefaults(containerIn, containerOut, layout, counterAxes);
+
+ expect(containerOut.rangeselector.x).toEqual(0);
+ expect(containerOut.rangeselector.y).toBeCloseTo(0.47);
}
-
- function setupAxis(opts) {
- var axisOut = Lib.extendFlat({type: 'date'}, opts);
- setConvert(axisOut);
- return axisOut;
+ );
+
+ it(
+ "should use axis and counter axis to determine 'x' and 'y' defaults (case multi y)",
+ function() {
+ var containerIn = { rangeselector: { buttons: [{}] } };
+ var containerOut = { _id: "x", domain: [0.5, 1] };
+ var layout = {
+ xaxis: containerIn,
+ yaxis: { anchor: "x", domain: [0, 0.25] },
+ yaxis2: { anchor: "x", overlaying: "y" },
+ yaxis3: { anchor: "x", domain: [0.6, 0.85] }
+ };
+ var counterAxes = ["yaxis", "yaxis2", "yaxis3"];
+
+ handleDefaults(containerIn, containerOut, layout, counterAxes);
+
+ expect(containerOut.rangeselector.x).toEqual(0.5);
+ expect(containerOut.rangeselector.y).toBeCloseTo(0.87);
}
-
- // buttonLayout: {step, stepmode, count}
- // range0out: expected resulting range[0] (input is always '1948-01-01')
- // range1: input range[1], expected to also be the output
- function assertUpdateCase(buttonLayout, range0out, range1) {
- var axisLayout = setupAxis({
- _name: 'xaxis',
- range: ['1948-01-01', range1]
- });
-
- var update = getUpdateObject(axisLayout, buttonLayout);
-
- assertRanges(update, range0out, range1);
+ );
+
+ it(
+ "should not allow month/year todate with calendars other than Gregorian",
+ function() {
+ var containerIn = {
+ rangeselector: {
+ buttons: [
+ { step: "year", count: 1, stepmode: "todate" },
+ { step: "month", count: 6, stepmode: "todate" },
+ { step: "day", count: 1, stepmode: "todate" },
+ { step: "hour", count: 1, stepmode: "todate" }
+ ]
+ }
+ };
+ var containerOut;
+ function getStepmode(button) {
+ return button.stepmode;
+ }
+
+ containerOut = {};
+ supply(containerIn, containerOut);
+
+ expect(containerOut.rangeselector.buttons.map(getStepmode)).toEqual([
+ "todate",
+ "todate",
+ "todate",
+ "todate"
+ ]);
+
+ containerOut = {};
+ supply(containerIn, containerOut, "gregorian");
+
+ expect(containerOut.rangeselector.buttons.map(getStepmode)).toEqual([
+ "todate",
+ "todate",
+ "todate",
+ "todate"
+ ]);
+
+ containerOut = {};
+ supply(containerIn, containerOut, "chinese");
+
+ expect(containerOut.rangeselector.buttons.map(getStepmode)).toEqual([
+ "backward",
+ "backward",
+ "todate",
+ "todate"
+ ]);
}
-
- it('should return update object (1 month backward case)', function() {
- var buttonLayout = {
- step: 'month',
- stepmode: 'backward',
- count: 1
- };
-
- assertUpdateCase(buttonLayout, '2015-10-30', '2015-11-30');
- assertUpdateCase(buttonLayout, '2015-10-30 12:34:56', '2015-11-30 12:34:56');
- });
-
- it('should return update object (3 months backward case)', function() {
- var buttonLayout = {
- step: 'month',
- stepmode: 'backward',
- count: 3
- };
-
- assertUpdateCase(buttonLayout, '2015-08-30', '2015-11-30');
- assertUpdateCase(buttonLayout, '2015-08-30 12:34:56', '2015-11-30 12:34:56');
- });
-
- it('should return update object (6 months backward case)', function() {
- var buttonLayout = {
- step: 'month',
- stepmode: 'backward',
- count: 6
- };
-
- assertUpdateCase(buttonLayout, '2015-05-30', '2015-11-30');
- assertUpdateCase(buttonLayout, '2015-05-30 12:34:56', '2015-11-30 12:34:56');
- });
-
- it('should return update object (5 months to-date case)', function() {
- var buttonLayout = {
- step: 'month',
- stepmode: 'todate',
- count: 5
- };
-
- assertUpdateCase(buttonLayout, '2015-07-01', '2015-11-30');
- assertUpdateCase(buttonLayout, '2015-07-01', '2015-12-01');
- assertUpdateCase(buttonLayout, '2015-08-01', '2015-12-01 00:00:01');
- });
-
- it('should return update object (1 year to-date case)', function() {
- var buttonLayout = {
- step: 'year',
- stepmode: 'todate',
- count: 1
- };
-
- assertUpdateCase(buttonLayout, '2015-01-01', '2015-11-30');
- assertUpdateCase(buttonLayout, '2015-01-01', '2016-01-01');
- assertUpdateCase(buttonLayout, '2016-01-01', '2016-01-01 00:00:01');
- });
-
- it('should return update object (10 year to-date case)', function() {
- var buttonLayout = {
- step: 'year',
- stepmode: 'todate',
- count: 10
- };
-
- assertUpdateCase(buttonLayout, '2006-01-01', '2015-11-30');
- assertUpdateCase(buttonLayout, '2006-01-01', '2016-01-01');
- assertUpdateCase(buttonLayout, '2007-01-01', '2016-01-01 00:00:01');
- });
-
- it('should return update object (1 year backward case)', function() {
- var buttonLayout = {
- step: 'year',
- stepmode: 'backward',
- count: 1
- };
-
- assertUpdateCase(buttonLayout, '2014-11-30', '2015-11-30');
- assertUpdateCase(buttonLayout, '2014-11-30 12:34:56', '2015-11-30 12:34:56');
- });
-
- it('should return update object (reset case)', function() {
- var axisLayout = setupAxis({
- _name: 'xaxis',
- range: ['1948-01-01', '2015-11-30']
- });
-
- var buttonLayout = {
- step: 'all'
- };
-
- var update = getUpdateObject(axisLayout, buttonLayout);
-
- expect(update).toEqual({'xaxis.autorange': true});
- });
-
- it('should return update object (10 day backward case)', function() {
- var buttonLayout = {
- step: 'day',
- stepmode: 'backward',
- count: 10
- };
-
- assertUpdateCase(buttonLayout, '2015-11-20', '2015-11-30');
- assertUpdateCase(buttonLayout, '2015-11-20 12:34:56', '2015-11-30 12:34:56');
- });
-
- it('should return update object (5 hour backward case)', function() {
- var buttonLayout = {
- step: 'hour',
- stepmode: 'backward',
- count: 5
- };
-
- assertUpdateCase(buttonLayout, '2015-11-29 19:00', '2015-11-30');
- assertUpdateCase(buttonLayout, '2015-11-30 07:34:56', '2015-11-30 12:34:56');
- });
-
- it('should return update object (15 minute backward case)', function() {
- var buttonLayout = {
- step: 'minute',
- stepmode: 'backward',
- count: 15
- };
-
- assertUpdateCase(buttonLayout, '2015-11-29 23:45', '2015-11-30');
- assertUpdateCase(buttonLayout, '2015-11-30 12:19:56', '2015-11-30 12:34:56');
- });
-
- it('should return update object (10 second backward case)', function() {
- var buttonLayout = {
- step: 'second',
- stepmode: 'backward',
- count: 10
- };
-
- assertUpdateCase(buttonLayout, '2015-11-29 23:59:50', '2015-11-30');
- assertUpdateCase(buttonLayout, '2015-11-30 12:34:46', '2015-11-30 12:34:56');
- });
-
- it('should return update object (12 hour to-date case)', function() {
- var buttonLayout = {
- step: 'hour',
- stepmode: 'todate',
- count: 12
- };
-
- assertUpdateCase(buttonLayout, '2015-11-30', '2015-11-30 12');
- assertUpdateCase(buttonLayout, '2015-11-30 01:00', '2015-11-30 12:00:01');
- assertUpdateCase(buttonLayout, '2015-11-30 01:00', '2015-11-30 13');
- });
-
- it('should return update object (20 minute to-date case)', function() {
- var buttonLayout = {
- step: 'minute',
- stepmode: 'todate',
- count: 20
- };
-
- assertUpdateCase(buttonLayout, '2015-11-30 12:00', '2015-11-30 12:20');
- assertUpdateCase(buttonLayout, '2015-11-30 12:01', '2015-11-30 12:20:01');
- assertUpdateCase(buttonLayout, '2015-11-30 12:01', '2015-11-30 12:21');
- });
-
- it('should return update object (2 second to-date case)', function() {
- var buttonLayout = {
- step: 'second',
- stepmode: 'todate',
- count: 2
- };
-
- assertUpdateCase(buttonLayout, '2015-11-30 12:20', '2015-11-30 12:20:02');
- assertUpdateCase(buttonLayout, '2015-11-30 12:20:01', '2015-11-30 12:20:02.001');
- assertUpdateCase(buttonLayout, '2015-11-30 12:20:01', '2015-11-30 12:20:03');
- });
-
- it('should return update object with correct axis names', function() {
- var axisLayout = setupAxis({
- _name: 'xaxis5',
- range: ['1948-01-01', '2015-11-30']
- });
-
- var buttonLayout = {
- step: 'month',
- stepmode: 'backward',
- count: 1
- };
-
- var update = getUpdateObject(axisLayout, buttonLayout);
-
- expect(update).toEqual({
- 'xaxis5.range[0]': '2015-10-30',
- 'xaxis5.range[1]': '2015-11-30'
- });
-
- });
+ );
});
-describe('range selector interactions:', function() {
- 'use strict';
-
- var mock = require('@mocks/range_selector.json');
-
- var gd, mockCopy;
-
- beforeEach(function(done) {
- gd = createGraphDiv();
- mockCopy = Lib.extendDeep({}, mock);
+describe("range selector getUpdateObject:", function() {
+ "use strict";
+ function assertRanges(update, range0, range1) {
+ expect(update["xaxis.range[0]"]).toEqual(range0);
+ expect(update["xaxis.range[1]"]).toEqual(range1);
+ }
+
+ function setupAxis(opts) {
+ var axisOut = Lib.extendFlat({ type: "date" }, opts);
+ setConvert(axisOut);
+ return axisOut;
+ }
+
+ // buttonLayout: {step, stepmode, count}
+ // range0out: expected resulting range[0] (input is always '1948-01-01')
+ // range1: input range[1], expected to also be the output
+ function assertUpdateCase(buttonLayout, range0out, range1) {
+ var axisLayout = setupAxis({
+ _name: "xaxis",
+ range: ["1948-01-01", range1]
+ });
+
+ var update = getUpdateObject(axisLayout, buttonLayout);
+
+ assertRanges(update, range0out, range1);
+ }
+
+ it("should return update object (1 month backward case)", function() {
+ var buttonLayout = { step: "month", stepmode: "backward", count: 1 };
+
+ assertUpdateCase(buttonLayout, "2015-10-30", "2015-11-30");
+ assertUpdateCase(
+ buttonLayout,
+ "2015-10-30 12:34:56",
+ "2015-11-30 12:34:56"
+ );
+ });
+
+ it("should return update object (3 months backward case)", function() {
+ var buttonLayout = { step: "month", stepmode: "backward", count: 3 };
+
+ assertUpdateCase(buttonLayout, "2015-08-30", "2015-11-30");
+ assertUpdateCase(
+ buttonLayout,
+ "2015-08-30 12:34:56",
+ "2015-11-30 12:34:56"
+ );
+ });
+
+ it("should return update object (6 months backward case)", function() {
+ var buttonLayout = { step: "month", stepmode: "backward", count: 6 };
+
+ assertUpdateCase(buttonLayout, "2015-05-30", "2015-11-30");
+ assertUpdateCase(
+ buttonLayout,
+ "2015-05-30 12:34:56",
+ "2015-11-30 12:34:56"
+ );
+ });
+
+ it("should return update object (5 months to-date case)", function() {
+ var buttonLayout = { step: "month", stepmode: "todate", count: 5 };
+
+ assertUpdateCase(buttonLayout, "2015-07-01", "2015-11-30");
+ assertUpdateCase(buttonLayout, "2015-07-01", "2015-12-01");
+ assertUpdateCase(buttonLayout, "2015-08-01", "2015-12-01 00:00:01");
+ });
+
+ it("should return update object (1 year to-date case)", function() {
+ var buttonLayout = { step: "year", stepmode: "todate", count: 1 };
+
+ assertUpdateCase(buttonLayout, "2015-01-01", "2015-11-30");
+ assertUpdateCase(buttonLayout, "2015-01-01", "2016-01-01");
+ assertUpdateCase(buttonLayout, "2016-01-01", "2016-01-01 00:00:01");
+ });
+
+ it("should return update object (10 year to-date case)", function() {
+ var buttonLayout = { step: "year", stepmode: "todate", count: 10 };
+
+ assertUpdateCase(buttonLayout, "2006-01-01", "2015-11-30");
+ assertUpdateCase(buttonLayout, "2006-01-01", "2016-01-01");
+ assertUpdateCase(buttonLayout, "2007-01-01", "2016-01-01 00:00:01");
+ });
+
+ it("should return update object (1 year backward case)", function() {
+ var buttonLayout = { step: "year", stepmode: "backward", count: 1 };
+
+ assertUpdateCase(buttonLayout, "2014-11-30", "2015-11-30");
+ assertUpdateCase(
+ buttonLayout,
+ "2014-11-30 12:34:56",
+ "2015-11-30 12:34:56"
+ );
+ });
+
+ it("should return update object (reset case)", function() {
+ var axisLayout = setupAxis({
+ _name: "xaxis",
+ range: ["1948-01-01", "2015-11-30"]
+ });
+
+ var buttonLayout = { step: "all" };
+
+ var update = getUpdateObject(axisLayout, buttonLayout);
+
+ expect(update).toEqual({ "xaxis.autorange": true });
+ });
+
+ it("should return update object (10 day backward case)", function() {
+ var buttonLayout = { step: "day", stepmode: "backward", count: 10 };
+
+ assertUpdateCase(buttonLayout, "2015-11-20", "2015-11-30");
+ assertUpdateCase(
+ buttonLayout,
+ "2015-11-20 12:34:56",
+ "2015-11-30 12:34:56"
+ );
+ });
+
+ it("should return update object (5 hour backward case)", function() {
+ var buttonLayout = { step: "hour", stepmode: "backward", count: 5 };
+
+ assertUpdateCase(buttonLayout, "2015-11-29 19:00", "2015-11-30");
+ assertUpdateCase(
+ buttonLayout,
+ "2015-11-30 07:34:56",
+ "2015-11-30 12:34:56"
+ );
+ });
+
+ it("should return update object (15 minute backward case)", function() {
+ var buttonLayout = { step: "minute", stepmode: "backward", count: 15 };
+
+ assertUpdateCase(buttonLayout, "2015-11-29 23:45", "2015-11-30");
+ assertUpdateCase(
+ buttonLayout,
+ "2015-11-30 12:19:56",
+ "2015-11-30 12:34:56"
+ );
+ });
+
+ it("should return update object (10 second backward case)", function() {
+ var buttonLayout = { step: "second", stepmode: "backward", count: 10 };
+
+ assertUpdateCase(buttonLayout, "2015-11-29 23:59:50", "2015-11-30");
+ assertUpdateCase(
+ buttonLayout,
+ "2015-11-30 12:34:46",
+ "2015-11-30 12:34:56"
+ );
+ });
+
+ it("should return update object (12 hour to-date case)", function() {
+ var buttonLayout = { step: "hour", stepmode: "todate", count: 12 };
+
+ assertUpdateCase(buttonLayout, "2015-11-30", "2015-11-30 12");
+ assertUpdateCase(buttonLayout, "2015-11-30 01:00", "2015-11-30 12:00:01");
+ assertUpdateCase(buttonLayout, "2015-11-30 01:00", "2015-11-30 13");
+ });
+
+ it("should return update object (20 minute to-date case)", function() {
+ var buttonLayout = { step: "minute", stepmode: "todate", count: 20 };
+
+ assertUpdateCase(buttonLayout, "2015-11-30 12:00", "2015-11-30 12:20");
+ assertUpdateCase(buttonLayout, "2015-11-30 12:01", "2015-11-30 12:20:01");
+ assertUpdateCase(buttonLayout, "2015-11-30 12:01", "2015-11-30 12:21");
+ });
+
+ it("should return update object (2 second to-date case)", function() {
+ var buttonLayout = { step: "second", stepmode: "todate", count: 2 };
+
+ assertUpdateCase(buttonLayout, "2015-11-30 12:20", "2015-11-30 12:20:02");
+ assertUpdateCase(
+ buttonLayout,
+ "2015-11-30 12:20:01",
+ "2015-11-30 12:20:02.001"
+ );
+ assertUpdateCase(
+ buttonLayout,
+ "2015-11-30 12:20:01",
+ "2015-11-30 12:20:03"
+ );
+ });
+
+ it("should return update object with correct axis names", function() {
+ var axisLayout = setupAxis({
+ _name: "xaxis5",
+ range: ["1948-01-01", "2015-11-30"]
+ });
+
+ var buttonLayout = { step: "month", stepmode: "backward", count: 1 };
+
+ var update = getUpdateObject(axisLayout, buttonLayout);
+
+ expect(update).toEqual({
+ "xaxis5.range[0]": "2015-10-30",
+ "xaxis5.range[1]": "2015-11-30"
+ });
+ });
+});
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
- });
+describe("range selector interactions:", function() {
+ "use strict";
+ var mock = require("@mocks/range_selector.json");
- afterEach(destroyGraphDiv);
+ var gd, mockCopy;
- function assertNodeCount(query, cnt) {
- expect(d3.selectAll(query).size()).toEqual(cnt);
- }
+ beforeEach(function(done) {
+ gd = createGraphDiv();
+ mockCopy = Lib.extendDeep({}, mock);
- function checkActiveButton(activeIndex, msg) {
- d3.selectAll('.button').each(function(d, i) {
- expect(d.isActive).toBe(activeIndex === i, msg + ': button #' + i);
- });
- }
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- function checkButtonColor(bgColor, activeColor) {
- d3.selectAll('.button').each(function(d) {
- var rect = d3.select(this).select('rect');
+ afterEach(destroyGraphDiv);
- expect(rect.style('fill')).toEqual(
- d.isActive ? activeColor : bgColor
- );
- });
- }
+ function assertNodeCount(query, cnt) {
+ expect(d3.selectAll(query).size()).toEqual(cnt);
+ }
- it('should display the correct nodes', function() {
- assertNodeCount('.rangeselector', 1);
- assertNodeCount('.button', mockCopy.layout.xaxis.rangeselector.buttons.length);
+ function checkActiveButton(activeIndex, msg) {
+ d3.selectAll(".button").each(function(d, i) {
+ expect(d.isActive).toBe(activeIndex === i, msg + ": button #" + i);
});
+ }
- it('should be able to be removed by `relayout`', function(done) {
- Plotly.relayout(gd, 'xaxis.rangeselector.visible', false).then(function() {
- assertNodeCount('.rangeselector', 0);
- assertNodeCount('.button', 0);
- done();
- });
+ function checkButtonColor(bgColor, activeColor) {
+ d3.selectAll(".button").each(function(d) {
+ var rect = d3.select(this).select("rect");
+ expect(rect.style("fill")).toEqual(d.isActive ? activeColor : bgColor);
});
+ }
- it('should be able to remove button(s) on `relayout`', function(done) {
- var len = mockCopy.layout.xaxis.rangeselector.buttons.length;
+ it("should display the correct nodes", function() {
+ assertNodeCount(".rangeselector", 1);
+ assertNodeCount(
+ ".button",
+ mockCopy.layout.xaxis.rangeselector.buttons.length
+ );
+ });
- assertNodeCount('.button', len);
+ it("should be able to be removed by `relayout`", function(done) {
+ Plotly.relayout(gd, "xaxis.rangeselector.visible", false).then(function() {
+ assertNodeCount(".rangeselector", 0);
+ assertNodeCount(".button", 0);
+ done();
+ });
+ });
- Plotly.relayout(gd, 'xaxis.rangeselector.buttons[0]', null).then(function() {
- assertNodeCount('.button', len - 1);
+ it("should be able to remove button(s) on `relayout`", function(done) {
+ var len = mockCopy.layout.xaxis.rangeselector.buttons.length;
- return Plotly.relayout(gd, 'xaxis.rangeselector.buttons[1]', 'remove');
- }).then(function() {
- assertNodeCount('.button', len - 2);
+ assertNodeCount(".button", len);
- done();
- });
- });
+ Plotly.relayout(gd, "xaxis.rangeselector.buttons[0]", null)
+ .then(function() {
+ assertNodeCount(".button", len - 1);
- it('should be able to change its style on `relayout`', function(done) {
- var prefix = 'xaxis.rangeselector.';
+ return Plotly.relayout(gd, "xaxis.rangeselector.buttons[1]", "remove");
+ })
+ .then(function() {
+ assertNodeCount(".button", len - 2);
- checkButtonColor('rgb(238, 238, 238)', 'rgb(212, 212, 212)');
+ done();
+ });
+ });
- Plotly.relayout(gd, prefix + 'bgcolor', 'red').then(function() {
- checkButtonColor('rgb(255, 0, 0)', 'rgb(255, 128, 128)');
+ it("should be able to change its style on `relayout`", function(done) {
+ var prefix = "xaxis.rangeselector.";
- return Plotly.relayout(gd, prefix + 'activecolor', 'blue');
- }).then(function() {
- checkButtonColor('rgb(255, 0, 0)', 'rgb(0, 0, 255)');
+ checkButtonColor("rgb(238, 238, 238)", "rgb(212, 212, 212)");
- done();
- });
- });
+ Plotly.relayout(gd, prefix + "bgcolor", "red")
+ .then(function() {
+ checkButtonColor("rgb(255, 0, 0)", "rgb(255, 128, 128)");
- it('should update range and active button when clicked', function() {
- var range0 = gd.layout.xaxis.range[0];
- var buttons = d3.selectAll('.button').select('rect');
+ return Plotly.relayout(gd, prefix + "activecolor", "blue");
+ })
+ .then(function() {
+ checkButtonColor("rgb(255, 0, 0)", "rgb(0, 0, 255)");
- checkActiveButton(buttons.size() - 1);
+ done();
+ });
+ });
- var pos0 = getRectCenter(buttons[0][0]);
- var posReset = getRectCenter(buttons[0][buttons.size() - 1]);
+ it("should update range and active button when clicked", function() {
+ var range0 = gd.layout.xaxis.range[0];
+ var buttons = d3.selectAll(".button").select("rect");
- mouseEvent('click', pos0[0], pos0[1]);
- expect(gd.layout.xaxis.range[0]).toBeGreaterThan(range0);
+ checkActiveButton(buttons.size() - 1);
- checkActiveButton(0);
+ var pos0 = getRectCenter(buttons[0][0]);
+ var posReset = getRectCenter(buttons[0][buttons.size() - 1]);
- mouseEvent('click', posReset[0], posReset[1]);
- expect(gd.layout.xaxis.range[0]).toEqual(range0);
+ mouseEvent("click", pos0[0], pos0[1]);
+ expect(gd.layout.xaxis.range[0]).toBeGreaterThan(range0);
- checkActiveButton(buttons.size() - 1);
- });
+ checkActiveButton(0);
- it('should change color on mouse over', function() {
- var button = d3.select('.button').select('rect');
- var pos = getRectCenter(button.node());
+ mouseEvent("click", posReset[0], posReset[1]);
+ expect(gd.layout.xaxis.range[0]).toEqual(range0);
- var fillColor = Color.rgb(gd._fullLayout.xaxis.rangeselector.bgcolor);
- var activeColor = 'rgb(212, 212, 212)';
+ checkActiveButton(buttons.size() - 1);
+ });
- expect(button.style('fill')).toEqual(fillColor);
+ it("should change color on mouse over", function() {
+ var button = d3.select(".button").select("rect");
+ var pos = getRectCenter(button.node());
- mouseEvent('mouseover', pos[0], pos[1]);
- expect(button.style('fill')).toEqual(activeColor);
+ var fillColor = Color.rgb(gd._fullLayout.xaxis.rangeselector.bgcolor);
+ var activeColor = "rgb(212, 212, 212)";
- mouseEvent('mouseout', pos[0], pos[1]);
- expect(button.style('fill')).toEqual(fillColor);
- });
+ expect(button.style("fill")).toEqual(fillColor);
- it('should update is active relayout calls', function(done) {
- var buttons = d3.selectAll('.button').select('rect');
+ mouseEvent("mouseover", pos[0], pos[1]);
+ expect(button.style("fill")).toEqual(activeColor);
- // 'all' should be active at first
- checkActiveButton(buttons.size() - 1, 'initial');
+ mouseEvent("mouseout", pos[0], pos[1]);
+ expect(button.style("fill")).toEqual(fillColor);
+ });
- var update = {
- 'xaxis.range[0]': '2015-10-30',
- 'xaxis.range[1]': '2015-11-30'
- };
+ it("should update is active relayout calls", function(done) {
+ var buttons = d3.selectAll(".button").select("rect");
- Plotly.relayout(gd, update).then(function() {
+ // 'all' should be active at first
+ checkActiveButton(buttons.size() - 1, "initial");
- // '1m' should be active after the relayout
- checkActiveButton(0, '1m');
+ var update = {
+ "xaxis.range[0]": "2015-10-30",
+ "xaxis.range[1]": "2015-11-30"
+ };
- return Plotly.relayout(gd, 'xaxis.autorange', true);
- }).then(function() {
+ Plotly.relayout(gd, update)
+ .then(function() {
+ // '1m' should be active after the relayout
+ checkActiveButton(0, "1m");
- // 'all' should be after an autoscale
- checkActiveButton(buttons.size() - 1, 'back to all');
+ return Plotly.relayout(gd, "xaxis.autorange", true);
+ })
+ .then(function() {
+ // 'all' should be after an autoscale
+ checkActiveButton(buttons.size() - 1, "back to all");
- done();
- });
- });
+ done();
+ });
+ });
});
diff --git a/test/jasmine/tests/range_slider_test.js b/test/jasmine/tests/range_slider_test.js
index 0348c8cfaac..ae3d0b122dd 100644
--- a/test/jasmine/tests/range_slider_test.js
+++ b/test/jasmine/tests/range_slider_test.js
@@ -1,579 +1,602 @@
-var Plotly = require('@lib/index');
-var Plots = require('@src/plots/plots');
-var Lib = require('@src/lib');
-var setConvert = require('@src/plots/cartesian/set_convert');
+var Plotly = require("@lib/index");
+var Plots = require("@src/plots/plots");
+var Lib = require("@src/lib");
+var setConvert = require("@src/plots/cartesian/set_convert");
-var RangeSlider = require('@src/components/rangeslider');
-var constants = require('@src/components/rangeslider/constants');
-var mock = require('../../image/mocks/range_slider.json');
+var RangeSlider = require("@src/components/rangeslider");
+var constants = require("@src/components/rangeslider/constants");
+var mock = require("../../image/mocks/range_slider.json");
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var mouseEvent = require('../assets/mouse_event');
-var customMatchers = require('../assets/custom_matchers');
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var mouseEvent = require("../assets/mouse_event");
+var customMatchers = require("../assets/custom_matchers");
var TOL = 6;
+describe("the range slider", function() {
+ var gd, rangeSlider, children;
-describe('the range slider', function() {
+ var sliderY = 393;
- var gd,
- rangeSlider,
- children;
+ function getRangeSlider() {
+ var className = constants.containerClassName;
+ return document.getElementsByClassName(className)[0];
+ }
- var sliderY = 393;
+ function countRangeSliderClipPaths() {
+ return d3
+ .selectAll("defs")
+ .selectAll("*")
+ .filter(function() {
+ return this.id.indexOf("rangeslider") !== -1;
+ })
+ .size();
+ }
- function getRangeSlider() {
- var className = constants.containerClassName;
- return document.getElementsByClassName(className)[0];
- }
+ function testTranslate1D(node, val) {
+ var transformParts = node.getAttribute("transform").split("(");
- function countRangeSliderClipPaths() {
- return d3.selectAll('defs').selectAll('*').filter(function() {
- return this.id.indexOf('rangeslider') !== -1;
- }).size();
- }
+ expect(transformParts[0]).toEqual("translate");
+ expect(+transformParts[1].split(",0)")[0]).toBeWithin(val, TOL);
+ }
- function testTranslate1D(node, val) {
- var transformParts = node.getAttribute('transform').split('(');
+ describe("when specified as visible", function() {
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
- expect(transformParts[0]).toEqual('translate');
- expect(+transformParts[1].split(',0)')[0]).toBeWithin(val, TOL);
- }
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- describe('when specified as visible', function() {
+ var mockCopy = Lib.extendDeep({}, mock);
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
- });
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
+ rangeSlider = getRangeSlider();
+ children = rangeSlider.children;
- beforeEach(function(done) {
- gd = createGraphDiv();
+ done();
+ });
+ });
- var mockCopy = Lib.extendDeep({}, mock);
+ afterEach(destroyGraphDiv);
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
- rangeSlider = getRangeSlider();
- children = rangeSlider.children;
+ it("should be added to the DOM when specified", function() {
+ expect(rangeSlider).toBeDefined();
+ });
- done();
- });
- });
+ it("should have the correct width and height", function() {
+ var bg = children[0];
- afterEach(destroyGraphDiv);
+ var options = mock.layout.xaxis.rangeslider,
+ expectedWidth = gd._fullLayout._size.w + options.borderwidth;
- it('should be added to the DOM when specified', function() {
- expect(rangeSlider).toBeDefined();
- });
+ // width incorporates border widths
+ expect(+bg.getAttribute("width")).toEqual(expectedWidth);
+ expect(+bg.getAttribute("height")).toEqual(66);
+ });
- it('should have the correct width and height', function() {
- var bg = children[0];
+ it("should have the correct style", function() {
+ var bg = children[0];
- var options = mock.layout.xaxis.rangeslider,
- expectedWidth = gd._fullLayout._size.w + options.borderwidth;
+ expect(bg.getAttribute("fill")).toBe("#fafafa");
+ expect(bg.getAttribute("stroke")).toBe("black");
+ expect(bg.getAttribute("stroke-width")).toBe("2");
+ });
- // width incorporates border widths
- expect(+bg.getAttribute('width')).toEqual(expectedWidth);
- expect(+bg.getAttribute('height')).toEqual(66);
- });
+ it("should react to resizing the minimum handle", function(done) {
+ var start = 85, end = 140, diff = end - start;
- it('should have the correct style', function() {
- var bg = children[0];
+ expect(gd.layout.xaxis.range).toBeCloseToArray([0, 49]);
- expect(bg.getAttribute('fill')).toBe('#fafafa');
- expect(bg.getAttribute('stroke')).toBe('black');
- expect(bg.getAttribute('stroke-width')).toBe('2');
- });
+ slide(start, sliderY, end, sliderY)
+ .then(function() {
+ var maskMin = children[2], handleMin = children[5];
- it('should react to resizing the minimum handle', function(done) {
- var start = 85,
- end = 140,
- diff = end - start;
-
- expect(gd.layout.xaxis.range).toBeCloseToArray([0, 49]);
-
- slide(start, sliderY, end, sliderY).then(function() {
- var maskMin = children[2],
- handleMin = children[5];
-
- expect(gd.layout.xaxis.range).toBeCloseToArray([4, 49], -0.5);
- expect(maskMin.getAttribute('width')).toEqual(String(diff));
- expect(handleMin.getAttribute('transform')).toBe('translate(' + (diff - 3) + ',0)');
- }).then(done);
- });
-
- it('should react to resizing the maximum handle', function(done) {
- var start = 695,
- end = 490,
- dataMaxStart = gd._fullLayout.xaxis.rangeslider.d2p(49),
- diff = end - start;
-
- expect(gd.layout.xaxis.range).toBeCloseToArray([0, 49]);
-
- slide(start, sliderY, end, sliderY).then(function() {
- var maskMax = children[3],
- handleMax = children[6];
-
- expect(gd.layout.xaxis.range).toBeCloseToArray([0, 32.77], -0.5);
- expect(+maskMax.getAttribute('width')).toBeCloseTo(-diff);
-
- testTranslate1D(handleMax, dataMaxStart + diff);
- }).then(done);
- });
-
- it('should react to moving the slidebox left to right', function(done) {
- var start = 250,
- end = 300,
- dataMinStart = gd._fullLayout.xaxis.rangeslider.d2p(0),
- diff = end - start;
-
- expect(gd.layout.xaxis.range).toBeCloseToArray([0, 49]);
-
- slide(start, sliderY, end, sliderY).then(function() {
- var maskMin = children[2],
- handleMin = children[5];
-
- expect(gd.layout.xaxis.range).toBeCloseToArray([3.96, 49], -0.5);
- expect(+maskMin.getAttribute('width')).toBeCloseTo(String(diff));
- testTranslate1D(handleMin, dataMinStart + diff - 3);
- }).then(done);
- });
-
- it('should react to moving the slidebox right to left', function(done) {
- var start = 300,
- end = 250,
- dataMaxStart = gd._fullLayout.xaxis.rangeslider.d2p(49),
- diff = end - start;
-
- expect(gd.layout.xaxis.range).toBeCloseToArray([0, 49]);
-
- slide(start, sliderY, end, sliderY).then(function() {
- var maskMax = children[3],
- handleMax = children[6];
-
- expect(gd.layout.xaxis.range).toBeCloseToArray([0, 45.04], -0.5);
- expect(+maskMax.getAttribute('width')).toBeCloseTo(-diff);
- testTranslate1D(handleMax, dataMaxStart + diff);
- }).then(done);
- });
-
- it('should resize the main plot when rangeslider has moved', function(done) {
- var start = 300,
- end = 400,
- rangeDiff1 = gd._fullLayout.xaxis.range[1] - gd._fullLayout.xaxis.range[0],
- rangeDiff2,
- rangeDiff3;
-
- slide(start, sliderY, end, sliderY).then(function() {
- rangeDiff2 = gd._fullLayout.xaxis.range[1] - gd._fullLayout.xaxis.range[0];
- expect(rangeDiff2).toBeLessThan(rangeDiff1);
- }).then(function() {
- start = 400;
- end = 200;
-
- return slide(start, sliderY, end, sliderY);
- }).then(function() {
- rangeDiff3 = gd._fullLayout.xaxis.range[1] - gd._fullLayout.xaxis.range[0];
- expect(rangeDiff3).toBeLessThan(rangeDiff2);
- }).then(done);
- });
-
- it('should relayout with relayout "array syntax"', function(done) {
- Plotly.relayout(gd, 'xaxis.range', [10, 20]).then(function() {
- var maskMin = children[2],
- maskMax = children[3],
- handleMin = children[5],
- handleMax = children[6];
-
- expect(+maskMin.getAttribute('width')).toBeWithin(125, TOL);
- expect(+maskMax.getAttribute('width')).toBeWithin(365, TOL);
- testTranslate1D(handleMin, 123.32);
- testTranslate1D(handleMax, 252.65);
- })
- .then(done);
- });
-
- it('should relayout with relayout "element syntax"', function(done) {
- Plotly.relayout(gd, 'xaxis.range[0]', 10).then(function() {
- var maskMin = children[2],
- maskMax = children[3],
- handleMin = children[5],
- handleMax = children[6];
-
- expect(+maskMin.getAttribute('width')).toBeWithin(126, TOL);
- expect(+maskMax.getAttribute('width')).toEqual(0);
- testTranslate1D(handleMin, 123.32);
- testTranslate1D(handleMax, 619);
- })
- .then(done);
- });
-
- it('should relayout with style options', function(done) {
- var bg = children[0],
- maskMin = children[2],
- maskMax = children[3];
-
- var maskMinWidth, maskMaxWidth;
-
- Plotly.relayout(gd, 'xaxis.range', [5, 10]).then(function() {
- maskMinWidth = +maskMin.getAttribute('width'),
- maskMaxWidth = +maskMax.getAttribute('width');
-
- return Plotly.relayout(gd, 'xaxis.rangeslider.bgcolor', 'red');
- })
- .then(function() {
- expect(+maskMin.getAttribute('width')).toEqual(maskMinWidth);
- expect(+maskMax.getAttribute('width')).toEqual(maskMaxWidth);
-
- expect(bg.getAttribute('fill')).toBe('red');
- expect(bg.getAttribute('stroke')).toBe('black');
- expect(bg.getAttribute('stroke-width')).toBe('2');
-
- return Plotly.relayout(gd, 'xaxis.rangeslider.bordercolor', 'blue');
- })
- .then(function() {
- expect(+maskMin.getAttribute('width')).toEqual(maskMinWidth);
- expect(+maskMax.getAttribute('width')).toEqual(maskMaxWidth);
-
- expect(bg.getAttribute('fill')).toBe('red');
- expect(bg.getAttribute('stroke')).toBe('blue');
- expect(bg.getAttribute('stroke-width')).toBe('2');
-
- return Plotly.relayout(gd, 'xaxis.rangeslider.borderwidth', 3);
- })
- .then(function() {
- expect(+maskMin.getAttribute('width')).toEqual(maskMinWidth);
- expect(+maskMax.getAttribute('width')).toEqual(maskMaxWidth);
-
- expect(bg.getAttribute('fill')).toBe('red');
- expect(bg.getAttribute('stroke')).toBe('blue');
- expect(bg.getAttribute('stroke-width')).toBe('3');
- })
- .then(done);
- });
-
- it('should relayout on size / domain udpate', function(done) {
- var maskMin = children[2],
- maskMax = children[3];
-
- Plotly.relayout(gd, 'xaxis.range', [5, 10]).then(function() {
- expect(+maskMin.getAttribute('width')).toBeWithin(63.16, TOL);
- expect(+maskMax.getAttribute('width')).toBeWithin(492.67, TOL);
-
- return Plotly.relayout(gd, 'xaxis.domain', [0.3, 0.7]);
- })
- .then(function() {
- var maskMin = children[2],
- maskMax = children[3];
-
- expect(+maskMin.getAttribute('width')).toBeWithin(25.26, TOL);
- expect(+maskMax.getAttribute('width')).toBeWithin(197.06, TOL);
-
- return Plotly.relayout(gd, 'width', 400);
- })
- .then(function() {
- var maskMin = children[2],
- maskMax = children[3];
-
- expect(+maskMin.getAttribute('width')).toBeWithin(9.22, TOL);
- expect(+maskMax.getAttribute('width')).toBeWithin(71.95, TOL);
-
- })
- .then(done);
- });
+ expect(gd.layout.xaxis.range).toBeCloseToArray([4, 49], -0.5);
+ expect(maskMin.getAttribute("width")).toEqual(String(diff));
+ expect(handleMin.getAttribute("transform")).toBe(
+ "translate(" + (diff - 3) + ",0)"
+ );
+ })
+ .then(done);
});
+ it("should react to resizing the maximum handle", function(done) {
+ var start = 695,
+ end = 490,
+ dataMaxStart = gd._fullLayout.xaxis.rangeslider.d2p(49),
+ diff = end - start;
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray([0, 49]);
+
+ slide(start, sliderY, end, sliderY)
+ .then(function() {
+ var maskMax = children[3], handleMax = children[6];
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray([0, 32.77], -0.5);
+ expect(+maskMax.getAttribute("width")).toBeCloseTo(-diff);
- describe('visibility property', function() {
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(destroyGraphDiv);
-
- it('should not add the slider to the DOM by default', function(done) {
- Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }], {})
- .then(function() {
- var rangeSlider = getRangeSlider();
- expect(rangeSlider).not.toBeDefined();
- })
- .then(done);
- });
-
- it('should add the slider if rangeslider is set to anything', function(done) {
- Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }], {})
- .then(function() { Plotly.relayout(gd, 'xaxis.rangeslider', 'exists'); })
- .then(function() {
- var rangeSlider = getRangeSlider();
- expect(rangeSlider).toBeDefined();
- })
- .then(done);
- });
-
- it('should add the slider if visible changed to `true`', function(done) {
- Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }], {})
- .then(function() { Plotly.relayout(gd, 'xaxis.rangeslider.visible', true); })
- .then(function() {
- var rangeSlider = getRangeSlider();
- expect(rangeSlider).toBeDefined();
- expect(countRangeSliderClipPaths()).toEqual(1);
- })
- .then(done);
- });
-
- it('should remove the slider if changed to `false` or `undefined`', function(done) {
- Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }], { xaxis: { rangeslider: { visible: true }}})
- .then(function() { Plotly.relayout(gd, 'xaxis.rangeslider.visible', false); })
- .then(function() {
- var rangeSlider = getRangeSlider();
- expect(rangeSlider).not.toBeDefined();
- expect(countRangeSliderClipPaths()).toEqual(0);
- })
- .then(done);
- });
+ testTranslate1D(handleMax, dataMaxStart + diff);
+ })
+ .then(done);
});
- describe('handleDefaults function', function() {
-
- it('should not coerce anything if rangeslider isn\'t set', function() {
- var layoutIn = { xaxis: {} },
- layoutOut = { xaxis: {} },
- expected = { xaxis: {} };
-
- RangeSlider.handleDefaults(layoutIn, layoutOut, 'xaxis');
-
- expect(layoutIn).toEqual(expected);
- });
-
- it('should not mutate layoutIn', function() {
- var layoutIn = { xaxis: { rangeslider: { visible: true }} },
- layoutOut = { xaxis: { rangeslider: {}} },
- expected = { xaxis: { rangeslider: { visible: true }} };
-
- RangeSlider.handleDefaults(layoutIn, layoutOut, 'xaxis');
-
- expect(layoutIn).toEqual(expected);
- });
-
- it('should set defaults if rangeslider is set to anything truthy', function() {
- var layoutIn = { xaxis: { rangeslider: {} }},
- layoutOut = { xaxis: {} },
- expected = {
- xaxis: {
- rangeslider: {
- visible: true,
- thickness: 0.15,
- bgcolor: '#fff',
- borderwidth: 0,
- bordercolor: '#444',
- _input: layoutIn.xaxis.rangeslider
- },
- _needsExpand: true
- }
- };
-
- RangeSlider.handleDefaults(layoutIn, layoutOut, 'xaxis');
-
- expect(layoutOut).toEqual(expected);
- });
-
- it('should set defaults if rangeslider.visible is true', function() {
- var layoutIn = { xaxis: { rangeslider: { visible: true }} },
- layoutOut = { xaxis: { rangeslider: {}} },
- expected = {
- xaxis: {
- rangeslider: {
- visible: true,
- thickness: 0.15,
- bgcolor: '#fff',
- borderwidth: 0,
- bordercolor: '#444',
- _input: layoutIn.xaxis.rangeslider
- },
- _needsExpand: true
- }
- };
-
- RangeSlider.handleDefaults(layoutIn, layoutOut, 'xaxis');
-
- expect(layoutOut).toEqual(expected);
- });
-
- it('should set defaults if properties are invalid', function() {
- var layoutIn = { xaxis: { rangeslider: {
- visible: 'invalid',
- thickness: 'invalid',
- bgcolor: 42,
- bordercolor: 42,
- borderwidth: 'superfat'
- }}},
- layoutOut = { xaxis: {} },
- expected = {
- xaxis: {
- rangeslider: {
- visible: true,
- thickness: 0.15,
- bgcolor: '#fff',
- borderwidth: 0,
- bordercolor: '#444',
- _input: layoutIn.xaxis.rangeslider
- },
- _needsExpand: true
- }
- };
-
- RangeSlider.handleDefaults(layoutIn, layoutOut, 'xaxis');
-
- expect(layoutOut).toEqual(expected);
- });
-
- it('should expand the rangeslider range to axis range', function() {
- var layoutIn = { xaxis: { rangeslider: { range: [5, 6] } } },
- layoutOut = { xaxis: { range: [1, 10], type: 'linear'} },
- expected = {
- xaxis: {
- rangeslider: {
- visible: true,
- thickness: 0.15,
- bgcolor: '#fff',
- borderwidth: 0,
- bordercolor: '#444',
- range: [1, 10],
- _input: layoutIn.xaxis.rangeslider
- },
- range: [1, 10]
- }
- };
-
- setConvert(layoutOut.xaxis);
-
- RangeSlider.handleDefaults(layoutIn, layoutOut, 'xaxis');
-
- // don't compare the whole layout, because we had to run setConvert which
- // attaches all sorts of other stuff to xaxis
- expect(layoutOut.xaxis.rangeslider).toEqual(expected.xaxis.rangeslider);
- });
-
- it('should set _needsExpand when an axis range is set', function() {
- var layoutIn = { xaxis: { rangeslider: true } },
- layoutOut = { xaxis: { range: [2, 40]} },
- expected = {
- xaxis: {
- rangeslider: {
- visible: true,
- thickness: 0.15,
- bgcolor: '#fff',
- borderwidth: 0,
- bordercolor: '#444',
- _input: {}
- },
- range: [2, 40],
- _needsExpand: true
- },
- };
-
- RangeSlider.handleDefaults(layoutIn, layoutOut, 'xaxis');
-
- expect(layoutOut).toEqual(expected);
- });
-
- it('should default \'bgcolor\' to layout \'plot_bgcolor\'', function() {
- var layoutIn = {
- xaxis: { rangeslider: true }
- };
-
- var layoutOut = {
- xaxis: { range: [2, 40]},
- plot_bgcolor: 'blue'
- };
-
- RangeSlider.handleDefaults(layoutIn, layoutOut, 'xaxis');
-
- expect(layoutOut.xaxis.rangeslider.bgcolor).toEqual('blue');
- });
+ it("should react to moving the slidebox left to right", function(done) {
+ var start = 250,
+ end = 300,
+ dataMinStart = gd._fullLayout.xaxis.rangeslider.d2p(0),
+ diff = end - start;
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray([0, 49]);
+
+ slide(start, sliderY, end, sliderY)
+ .then(function() {
+ var maskMin = children[2], handleMin = children[5];
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray([3.96, 49], -0.5);
+ expect(+maskMin.getAttribute("width")).toBeCloseTo(String(diff));
+ testTranslate1D(handleMin, dataMinStart + diff - 3);
+ })
+ .then(done);
});
- describe('anchored axes fixedrange', function() {
-
- it('should default to *true* when range slider is visible', function() {
- var mock = {
- layout: {
- xaxis: { rangeslider: {} },
- yaxis: { anchor: 'x' },
- yaxis2: { anchor: 'x' },
- yaxis3: { anchor: 'free' }
- }
- };
-
- Plots.supplyDefaults(mock);
-
- expect(mock._fullLayout.xaxis.rangeslider.visible).toBe(true);
- expect(mock._fullLayout.yaxis.fixedrange).toBe(true);
- expect(mock._fullLayout.yaxis2.fixedrange).toBe(true);
- expect(mock._fullLayout.yaxis3.fixedrange).toBe(false);
- });
-
- it('should honor user settings', function() {
- var mock = {
- layout: {
- xaxis: { rangeslider: {} },
- yaxis: { anchor: 'x', fixedrange: false },
- yaxis2: { anchor: 'x', fixedrange: false },
- yaxis3: { anchor: 'free' }
- }
- };
-
- Plots.supplyDefaults(mock);
-
- expect(mock._fullLayout.xaxis.rangeslider.visible).toBe(true);
- expect(mock._fullLayout.yaxis.fixedrange).toBe(false);
- expect(mock._fullLayout.yaxis2.fixedrange).toBe(false);
- expect(mock._fullLayout.yaxis3.fixedrange).toBe(false);
- });
+ it("should react to moving the slidebox right to left", function(done) {
+ var start = 300,
+ end = 250,
+ dataMaxStart = gd._fullLayout.xaxis.rangeslider.d2p(49),
+ diff = end - start;
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray([0, 49]);
+ slide(start, sliderY, end, sliderY)
+ .then(function() {
+ var maskMax = children[3], handleMax = children[6];
+
+ expect(gd.layout.xaxis.range).toBeCloseToArray([0, 45.04], -0.5);
+ expect(+maskMax.getAttribute("width")).toBeCloseTo(-diff);
+ testTranslate1D(handleMax, dataMaxStart + diff);
+ })
+ .then(done);
});
- describe('in general', function() {
+ it("should resize the main plot when rangeslider has moved", function(
+ done
+ ) {
+ var start = 300,
+ end = 400,
+ rangeDiff1 = gd._fullLayout.xaxis.range[1] -
+ gd._fullLayout.xaxis.range[0],
+ rangeDiff2,
+ rangeDiff3;
+
+ slide(start, sliderY, end, sliderY)
+ .then(function() {
+ rangeDiff2 = gd._fullLayout.xaxis.range[1] -
+ gd._fullLayout.xaxis.range[0];
+ expect(rangeDiff2).toBeLessThan(rangeDiff1);
+ })
+ .then(function() {
+ start = 400;
+ end = 200;
+
+ return slide(start, sliderY, end, sliderY);
+ })
+ .then(function() {
+ rangeDiff3 = gd._fullLayout.xaxis.range[1] -
+ gd._fullLayout.xaxis.range[0];
+ expect(rangeDiff3).toBeLessThan(rangeDiff2);
+ })
+ .then(done);
+ });
- beforeEach(function() {
- gd = createGraphDiv();
- });
+ it('should relayout with relayout "array syntax"', function(done) {
+ Plotly.relayout(gd, "xaxis.range", [10, 20])
+ .then(function() {
+ var maskMin = children[2],
+ maskMax = children[3],
+ handleMin = children[5],
+ handleMax = children[6];
+
+ expect(+maskMin.getAttribute("width")).toBeWithin(125, TOL);
+ expect(+maskMax.getAttribute("width")).toBeWithin(365, TOL);
+ testTranslate1D(handleMin, 123.32);
+ testTranslate1D(handleMax, 252.65);
+ })
+ .then(done);
+ });
- afterEach(destroyGraphDiv);
+ it('should relayout with relayout "element syntax"', function(done) {
+ Plotly.relayout(gd, "xaxis.range[0]", 10)
+ .then(function() {
+ var maskMin = children[2],
+ maskMax = children[3],
+ handleMin = children[5],
+ handleMax = children[6];
+
+ expect(+maskMin.getAttribute("width")).toBeWithin(126, TOL);
+ expect(+maskMax.getAttribute("width")).toEqual(0);
+ testTranslate1D(handleMin, 123.32);
+ testTranslate1D(handleMax, 619);
+ })
+ .then(done);
+ });
- it('should plot when only x data is provided', function(done) {
- Plotly.plot(gd, [{ x: [1, 2, 3] }], { xaxis: { rangeslider: {} }})
- .then(function() {
- var rangeSlider = getRangeSlider();
+ it("should relayout with style options", function(done) {
+ var bg = children[0], maskMin = children[2], maskMax = children[3];
+
+ var maskMinWidth, maskMaxWidth;
+
+ Plotly.relayout(gd, "xaxis.range", [5, 10])
+ .then(function() {
+ maskMinWidth = +maskMin.getAttribute(
+ "width"
+ ), maskMaxWidth = +maskMax.getAttribute("width");
+
+ return Plotly.relayout(gd, "xaxis.rangeslider.bgcolor", "red");
+ })
+ .then(function() {
+ expect(+maskMin.getAttribute("width")).toEqual(maskMinWidth);
+ expect(+maskMax.getAttribute("width")).toEqual(maskMaxWidth);
+
+ expect(bg.getAttribute("fill")).toBe("red");
+ expect(bg.getAttribute("stroke")).toBe("black");
+ expect(bg.getAttribute("stroke-width")).toBe("2");
+
+ return Plotly.relayout(gd, "xaxis.rangeslider.bordercolor", "blue");
+ })
+ .then(function() {
+ expect(+maskMin.getAttribute("width")).toEqual(maskMinWidth);
+ expect(+maskMax.getAttribute("width")).toEqual(maskMaxWidth);
+
+ expect(bg.getAttribute("fill")).toBe("red");
+ expect(bg.getAttribute("stroke")).toBe("blue");
+ expect(bg.getAttribute("stroke-width")).toBe("2");
+
+ return Plotly.relayout(gd, "xaxis.rangeslider.borderwidth", 3);
+ })
+ .then(function() {
+ expect(+maskMin.getAttribute("width")).toEqual(maskMinWidth);
+ expect(+maskMax.getAttribute("width")).toEqual(maskMaxWidth);
+
+ expect(bg.getAttribute("fill")).toBe("red");
+ expect(bg.getAttribute("stroke")).toBe("blue");
+ expect(bg.getAttribute("stroke-width")).toBe("3");
+ })
+ .then(done);
+ });
+
+ it("should relayout on size / domain udpate", function(done) {
+ var maskMin = children[2], maskMax = children[3];
+
+ Plotly.relayout(gd, "xaxis.range", [5, 10])
+ .then(function() {
+ expect(+maskMin.getAttribute("width")).toBeWithin(63.16, TOL);
+ expect(+maskMax.getAttribute("width")).toBeWithin(492.67, TOL);
+
+ return Plotly.relayout(gd, "xaxis.domain", [0.3, 0.7]);
+ })
+ .then(function() {
+ var maskMin = children[2], maskMax = children[3];
- expect(rangeSlider).toBeDefined();
- })
- .then(done);
- });
+ expect(+maskMin.getAttribute("width")).toBeWithin(25.26, TOL);
+ expect(+maskMax.getAttribute("width")).toBeWithin(197.06, TOL);
- it('should plot when only y data is provided', function(done) {
- Plotly.plot(gd, [{ y: [1, 2, 3] }], { xaxis: { rangeslider: {} }})
- .then(function() {
- var rangeSlider = getRangeSlider();
+ return Plotly.relayout(gd, "width", 400);
+ })
+ .then(function() {
+ var maskMin = children[2], maskMax = children[3];
- expect(rangeSlider).toBeDefined();
- })
- .then(done);
- });
+ expect(+maskMin.getAttribute("width")).toBeWithin(9.22, TOL);
+ expect(+maskMax.getAttribute("width")).toBeWithin(71.95, TOL);
+ })
+ .then(done);
+ });
+ });
+
+ describe("visibility property", function() {
+ beforeEach(function() {
+ gd = createGraphDiv();
});
-});
+ afterEach(destroyGraphDiv);
-function slide(fromX, fromY, toX, toY) {
- return new Promise(function(resolve) {
- mouseEvent('mousemove', fromX, fromY);
- mouseEvent('mousedown', fromX, fromY);
- mouseEvent('mousemove', toX, toY);
- mouseEvent('mouseup', toX, toY);
-
- setTimeout(function() {
- return resolve();
- }, 20);
+ it("should not add the slider to the DOM by default", function(done) {
+ Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }], {})
+ .then(function() {
+ var rangeSlider = getRangeSlider();
+ expect(rangeSlider).not.toBeDefined();
+ })
+ .then(done);
+ });
+
+ it("should add the slider if rangeslider is set to anything", function(
+ done
+ ) {
+ Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }], {})
+ .then(function() {
+ Plotly.relayout(gd, "xaxis.rangeslider", "exists");
+ })
+ .then(function() {
+ var rangeSlider = getRangeSlider();
+ expect(rangeSlider).toBeDefined();
+ })
+ .then(done);
+ });
+
+ it("should add the slider if visible changed to `true`", function(done) {
+ Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }], {})
+ .then(function() {
+ Plotly.relayout(gd, "xaxis.rangeslider.visible", true);
+ })
+ .then(function() {
+ var rangeSlider = getRangeSlider();
+ expect(rangeSlider).toBeDefined();
+ expect(countRangeSliderClipPaths()).toEqual(1);
+ })
+ .then(done);
+ });
+
+ it(
+ "should remove the slider if changed to `false` or `undefined`",
+ function(done) {
+ Plotly.plot(gd, [{ x: [1, 2, 3], y: [2, 3, 4] }], {
+ xaxis: { rangeslider: { visible: true } }
+ })
+ .then(function() {
+ Plotly.relayout(gd, "xaxis.rangeslider.visible", false);
+ })
+ .then(function() {
+ var rangeSlider = getRangeSlider();
+ expect(rangeSlider).not.toBeDefined();
+ expect(countRangeSliderClipPaths()).toEqual(0);
+ })
+ .then(done);
+ }
+ );
+ });
+
+ describe("handleDefaults function", function() {
+ it("should not coerce anything if rangeslider isn't set", function() {
+ var layoutIn = { xaxis: {} },
+ layoutOut = { xaxis: {} },
+ expected = { xaxis: {} };
+
+ RangeSlider.handleDefaults(layoutIn, layoutOut, "xaxis");
+
+ expect(layoutIn).toEqual(expected);
+ });
+
+ it("should not mutate layoutIn", function() {
+ var layoutIn = { xaxis: { rangeslider: { visible: true } } },
+ layoutOut = { xaxis: { rangeslider: {} } },
+ expected = { xaxis: { rangeslider: { visible: true } } };
+
+ RangeSlider.handleDefaults(layoutIn, layoutOut, "xaxis");
+
+ expect(layoutIn).toEqual(expected);
+ });
+
+ it(
+ "should set defaults if rangeslider is set to anything truthy",
+ function() {
+ var layoutIn = { xaxis: { rangeslider: {} } },
+ layoutOut = { xaxis: {} },
+ expected = {
+ xaxis: {
+ rangeslider: {
+ visible: true,
+ thickness: 0.15,
+ bgcolor: "#fff",
+ borderwidth: 0,
+ bordercolor: "#444",
+ _input: layoutIn.xaxis.rangeslider
+ },
+ _needsExpand: true
+ }
+ };
+
+ RangeSlider.handleDefaults(layoutIn, layoutOut, "xaxis");
+
+ expect(layoutOut).toEqual(expected);
+ }
+ );
+
+ it("should set defaults if rangeslider.visible is true", function() {
+ var layoutIn = { xaxis: { rangeslider: { visible: true } } },
+ layoutOut = { xaxis: { rangeslider: {} } },
+ expected = {
+ xaxis: {
+ rangeslider: {
+ visible: true,
+ thickness: 0.15,
+ bgcolor: "#fff",
+ borderwidth: 0,
+ bordercolor: "#444",
+ _input: layoutIn.xaxis.rangeslider
+ },
+ _needsExpand: true
+ }
+ };
+
+ RangeSlider.handleDefaults(layoutIn, layoutOut, "xaxis");
+
+ expect(layoutOut).toEqual(expected);
+ });
+
+ it("should set defaults if properties are invalid", function() {
+ var layoutIn = {
+ xaxis: {
+ rangeslider: {
+ visible: "invalid",
+ thickness: "invalid",
+ bgcolor: 42,
+ bordercolor: 42,
+ borderwidth: "superfat"
+ }
+ }
+ },
+ layoutOut = { xaxis: {} },
+ expected = {
+ xaxis: {
+ rangeslider: {
+ visible: true,
+ thickness: 0.15,
+ bgcolor: "#fff",
+ borderwidth: 0,
+ bordercolor: "#444",
+ _input: layoutIn.xaxis.rangeslider
+ },
+ _needsExpand: true
+ }
+ };
+
+ RangeSlider.handleDefaults(layoutIn, layoutOut, "xaxis");
+
+ expect(layoutOut).toEqual(expected);
+ });
+
+ it("should expand the rangeslider range to axis range", function() {
+ var layoutIn = { xaxis: { rangeslider: { range: [5, 6] } } },
+ layoutOut = { xaxis: { range: [1, 10], type: "linear" } },
+ expected = {
+ xaxis: {
+ rangeslider: {
+ visible: true,
+ thickness: 0.15,
+ bgcolor: "#fff",
+ borderwidth: 0,
+ bordercolor: "#444",
+ range: [1, 10],
+ _input: layoutIn.xaxis.rangeslider
+ },
+ range: [1, 10]
+ }
+ };
+
+ setConvert(layoutOut.xaxis);
+
+ RangeSlider.handleDefaults(layoutIn, layoutOut, "xaxis");
+
+ // don't compare the whole layout, because we had to run setConvert which
+ // attaches all sorts of other stuff to xaxis
+ expect(layoutOut.xaxis.rangeslider).toEqual(expected.xaxis.rangeslider);
+ });
+
+ it("should set _needsExpand when an axis range is set", function() {
+ var layoutIn = { xaxis: { rangeslider: true } },
+ layoutOut = { xaxis: { range: [2, 40] } },
+ expected = {
+ xaxis: {
+ rangeslider: {
+ visible: true,
+ thickness: 0.15,
+ bgcolor: "#fff",
+ borderwidth: 0,
+ bordercolor: "#444",
+ _input: {}
+ },
+ range: [2, 40],
+ _needsExpand: true
+ }
+ };
+
+ RangeSlider.handleDefaults(layoutIn, layoutOut, "xaxis");
+
+ expect(layoutOut).toEqual(expected);
+ });
+
+ it("should default 'bgcolor' to layout 'plot_bgcolor'", function() {
+ var layoutIn = { xaxis: { rangeslider: true } };
+
+ var layoutOut = { xaxis: { range: [2, 40] }, plot_bgcolor: "blue" };
+
+ RangeSlider.handleDefaults(layoutIn, layoutOut, "xaxis");
+
+ expect(layoutOut.xaxis.rangeslider.bgcolor).toEqual("blue");
});
+ });
+
+ describe("anchored axes fixedrange", function() {
+ it("should default to *true* when range slider is visible", function() {
+ var mock = {
+ layout: {
+ xaxis: { rangeslider: {} },
+ yaxis: { anchor: "x" },
+ yaxis2: { anchor: "x" },
+ yaxis3: { anchor: "free" }
+ }
+ };
+
+ Plots.supplyDefaults(mock);
+
+ expect(mock._fullLayout.xaxis.rangeslider.visible).toBe(true);
+ expect(mock._fullLayout.yaxis.fixedrange).toBe(true);
+ expect(mock._fullLayout.yaxis2.fixedrange).toBe(true);
+ expect(mock._fullLayout.yaxis3.fixedrange).toBe(false);
+ });
+
+ it("should honor user settings", function() {
+ var mock = {
+ layout: {
+ xaxis: { rangeslider: {} },
+ yaxis: { anchor: "x", fixedrange: false },
+ yaxis2: { anchor: "x", fixedrange: false },
+ yaxis3: { anchor: "free" }
+ }
+ };
+
+ Plots.supplyDefaults(mock);
+
+ expect(mock._fullLayout.xaxis.rangeslider.visible).toBe(true);
+ expect(mock._fullLayout.yaxis.fixedrange).toBe(false);
+ expect(mock._fullLayout.yaxis2.fixedrange).toBe(false);
+ expect(mock._fullLayout.yaxis3.fixedrange).toBe(false);
+ });
+ });
+
+ describe("in general", function() {
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
+
+ afterEach(destroyGraphDiv);
+
+ it("should plot when only x data is provided", function(done) {
+ Plotly.plot(gd, [{ x: [1, 2, 3] }], { xaxis: { rangeslider: {} } })
+ .then(function() {
+ var rangeSlider = getRangeSlider();
+
+ expect(rangeSlider).toBeDefined();
+ })
+ .then(done);
+ });
+
+ it("should plot when only y data is provided", function(done) {
+ Plotly.plot(gd, [{ y: [1, 2, 3] }], { xaxis: { rangeslider: {} } })
+ .then(function() {
+ var rangeSlider = getRangeSlider();
+
+ expect(rangeSlider).toBeDefined();
+ })
+ .then(done);
+ });
+ });
+});
+
+function slide(fromX, fromY, toX, toY) {
+ return new Promise(function(resolve) {
+ mouseEvent("mousemove", fromX, fromY);
+ mouseEvent("mousedown", fromX, fromY);
+ mouseEvent("mousemove", toX, toY);
+ mouseEvent("mouseup", toX, toY);
+
+ setTimeout(
+ function() {
+ return resolve();
+ },
+ 20
+ );
+ });
}
diff --git a/test/jasmine/tests/register_test.js b/test/jasmine/tests/register_test.js
index 6fa534a2e42..7f06b187ff0 100644
--- a/test/jasmine/tests/register_test.js
+++ b/test/jasmine/tests/register_test.js
@@ -1,280 +1,309 @@
-var Plotly = require('@lib/index');
-var Registry = require('@src/registry');
+var Plotly = require("@lib/index");
+var Registry = require("@src/registry");
-describe('Test Registry', function() {
- 'use strict';
-
- describe('register, getModule, and traceIs', function() {
- beforeEach(function() {
- this.modulesKeys = Object.keys(Registry.modules);
- this.allTypesKeys = Object.keys(Registry.allTypes);
- this.allCategoriesKeys = Object.keys(Registry.allCategories);
-
- this.fakeModule = {
- calc: function() { return 42; },
- plot: function() { return 1000000; }
- };
- this.fakeModule2 = {
- plot: function() { throw new Error('nope!'); }
- };
-
- Registry.register(this.fakeModule, 'newtype', ['red', 'green']);
-
- spyOn(console, 'warn');
- });
-
- afterEach(function() {
- function revertObj(obj, initialKeys) {
- Object.keys(obj).forEach(function(k) {
- if(initialKeys.indexOf(k) === -1) delete obj[k];
- });
- }
-
- revertObj(Registry.modules, this.modulesKeys);
- revertObj(Registry.allTypes, this.allTypesKeys);
- revertObj(Registry.allCategories, this.allCategoriesKeys);
- });
-
- it('should not reregister a type', function() {
- Registry.register(this.fakeModule2, 'newtype', ['yellow', 'blue']);
- expect(Registry.allCategories.yellow).toBeUndefined();
- });
-
- it('should find the module for a type', function() {
- expect(Registry.getModule('newtype')).toBe(this.fakeModule);
- expect(Registry.getModule({type: 'newtype'})).toBe(this.fakeModule);
- });
-
- it('should return false for types it doesn\'t know', function() {
- expect(Registry.getModule('notatype')).toBe(false);
- expect(Registry.getModule({type: 'notatype'})).toBe(false);
- expect(Registry.getModule({type: 'newtype', r: 'this is polar'})).toBe(false);
- });
-
- it('should find the categories for this type', function() {
- expect(Registry.traceIs('newtype', 'red')).toBe(true);
- expect(Registry.traceIs({type: 'newtype'}, 'red')).toBe(true);
- });
-
- it('should not find other real categories', function() {
- expect(Registry.traceIs('newtype', 'cartesian')).toBe(false);
- expect(Registry.traceIs({type: 'newtype'}, 'cartesian')).toBe(false);
- expect(console.warn).not.toHaveBeenCalled();
- });
- });
-
- describe('Registry.registerSubplot', function() {
- var fake = {
- name: 'fake',
- attr: 'abc',
- idRoot: 'cba',
- attrRegex: /^abc([2-9]|[1-9][0-9]+)?$/,
- idRegex: /^cba([2-9]|[1-9][0-9]+)?$/,
- attributes: { stuff: { 'more stuff': 102102 } }
- };
-
- Registry.registerSubplot(fake);
-
- var subplotsRegistry = Registry.subplotsRegistry;
-
- it('should register attr, idRoot and attributes', function() {
- expect(subplotsRegistry.fake.attr).toEqual('abc');
- expect(subplotsRegistry.fake.idRoot).toEqual('cba');
- expect(subplotsRegistry.fake.attributes)
- .toEqual({stuff: { 'more stuff': 102102 }});
- });
-
- describe('registered subplot type attribute regex', function() {
- it('should compile to correct attribute regex string', function() {
- expect(subplotsRegistry.fake.attrRegex.toString())
- .toEqual('/^abc([2-9]|[1-9][0-9]+)?$/');
- });
-
- var shouldPass = [
- 'abc', 'abc2', 'abc3', 'abc10', 'abc9', 'abc100', 'abc2002'
- ];
- var shouldFail = [
- '0abc', 'abc0', 'abc1', 'abc021321', 'abc00021321'
- ];
-
- shouldPass.forEach(function(s) {
- it('considers ' + JSON.stringify(s) + 'as a correct attribute name', function() {
- expect(subplotsRegistry.fake.attrRegex.test(s)).toBe(true);
- });
- });
-
- shouldFail.forEach(function(s) {
- it('considers ' + JSON.stringify(s) + 'as an incorrect attribute name', function() {
- expect(subplotsRegistry.fake.attrRegex.test(s)).toBe(false);
- });
- });
- });
-
- describe('registered subplot type id regex', function() {
- it('should compile to correct id regular expression', function() {
- expect(subplotsRegistry.fake.idRegex.toString())
- .toEqual('/^cba([2-9]|[1-9][0-9]+)?$/');
- });
-
- var shouldPass = [
- 'cba', 'cba2', 'cba3', 'cba10', 'cba9', 'cba100', 'cba2002'
- ];
- var shouldFail = [
- '0cba', 'cba0', 'cba1', 'cba021321', 'cba00021321'
- ];
-
- shouldPass.forEach(function(s) {
- it('considers ' + JSON.stringify(s) + 'as a correct attribute name', function() {
- expect(subplotsRegistry.fake.idRegex.test(s)).toBe(true);
- });
- });
-
- shouldFail.forEach(function(s) {
- it('considers ' + JSON.stringify(s) + 'as an incorrect attribute name', function() {
- expect(subplotsRegistry.fake.idRegex.test(s)).toBe(false);
- });
- });
- });
-
- });
-});
+describe("Test Registry", function() {
+ "use strict";
+ describe("register, getModule, and traceIs", function() {
+ beforeEach(function() {
+ this.modulesKeys = Object.keys(Registry.modules);
+ this.allTypesKeys = Object.keys(Registry.allTypes);
+ this.allCategoriesKeys = Object.keys(Registry.allCategories);
+
+ this.fakeModule = {
+ calc: function() {
+ return 42;
+ },
+ plot: function() {
+ return 1000000;
+ }
+ };
+ this.fakeModule2 = {
+ plot: function() {
+ throw new Error("nope!");
+ }
+ };
-describe('the register function', function() {
- 'use strict';
+ Registry.register(this.fakeModule, "newtype", ["red", "green"]);
- beforeEach(function() {
- this.modulesKeys = Object.keys(Registry.modules);
- this.allTypesKeys = Object.keys(Registry.allTypes);
- this.allCategoriesKeys = Object.keys(Registry.allCategories);
- this.allTransformsKeys = Object.keys(Registry.transformsRegistry);
+ spyOn(console, "warn");
});
afterEach(function() {
- function revertObj(obj, initialKeys) {
- Object.keys(obj).forEach(function(k) {
- if(initialKeys.indexOf(k) === -1) delete obj[k];
- });
- }
+ function revertObj(obj, initialKeys) {
+ Object.keys(obj).forEach(function(k) {
+ if (initialKeys.indexOf(k) === -1) delete obj[k];
+ });
+ }
- revertObj(Registry.modules, this.modulesKeys);
- revertObj(Registry.allTypes, this.allTypesKeys);
- revertObj(Registry.allCategories, this.allCategoriesKeys);
- revertObj(Registry.transformsRegistry, this.allTransformsKeys);
+ revertObj(Registry.modules, this.modulesKeys);
+ revertObj(Registry.allTypes, this.allTypesKeys);
+ revertObj(Registry.allCategories, this.allCategoriesKeys);
});
- it('should throw an error when no argument is given', function() {
- expect(function() {
- Plotly.register();
- }).toThrowError(Error, 'No argument passed to Plotly.register.');
+ it("should not reregister a type", function() {
+ Registry.register(this.fakeModule2, "newtype", ["yellow", "blue"]);
+ expect(Registry.allCategories.yellow).toBeUndefined();
});
- it('should work with a single module', function() {
- var mockTrace1 = {
- moduleType: 'trace',
- name: 'mockTrace1',
- meta: 'Meta string',
- basePlotModule: { name: 'plotModule' },
- categories: ['categories', 'array']
- };
-
- expect(function() {
- Plotly.register(mockTrace1);
- }).not.toThrow();
-
- expect(Registry.getModule('mockTrace1')).toBe(mockTrace1);
+ it("should find the module for a type", function() {
+ expect(Registry.getModule("newtype")).toBe(this.fakeModule);
+ expect(Registry.getModule({ type: "newtype" })).toBe(this.fakeModule);
});
- it('should work with an array of modules', function() {
- var mockTrace2 = {
- moduleType: 'trace',
- name: 'mockTrace2',
- meta: 'Meta string',
- basePlotModule: { name: 'plotModule' },
- categories: ['categories', 'array']
- };
-
- expect(function() {
- Plotly.register([mockTrace2]);
- }).not.toThrow();
-
- expect(Registry.getModule('mockTrace2')).toBe(mockTrace2);
+ it("should return false for types it doesn't know", function() {
+ expect(Registry.getModule("notatype")).toBe(false);
+ expect(Registry.getModule({ type: "notatype" })).toBe(false);
+ expect(Registry.getModule({ type: "newtype", r: "this is polar" })).toBe(
+ false
+ );
});
- it('should throw an error when an invalid module is given', function() {
- var invalidTrace = { moduleType: 'invalid' };
-
- expect(function() {
- Plotly.register([invalidTrace]);
- }).toThrowError(Error, 'Invalid module was attempted to be registered!');
-
- expect(Registry.transformsRegistry['mah-transform']).toBeUndefined();
+ it("should find the categories for this type", function() {
+ expect(Registry.traceIs("newtype", "red")).toBe(true);
+ expect(Registry.traceIs({ type: "newtype" }, "red")).toBe(true);
});
- it('should throw when if transform module is invalid (1)', function() {
- var missingTransformName = {
- moduleType: 'transform'
- };
-
- expect(function() {
- Plotly.register(missingTransformName);
- }).toThrowError(Error, 'Transform module *name* must be a string.');
-
- expect(Registry.transformsRegistry['mah-transform']).toBeUndefined();
+ it("should not find other real categories", function() {
+ expect(Registry.traceIs("newtype", "cartesian")).toBe(false);
+ expect(Registry.traceIs({ type: "newtype" }, "cartesian")).toBe(false);
+ expect(console.warn).not.toHaveBeenCalled();
});
-
- it('should throw when if transform module is invalid (2)', function() {
- var missingTransformFunc = {
- moduleType: 'transform',
- name: 'mah-transform'
- };
-
- expect(function() {
- Plotly.register(missingTransformFunc);
- }).toThrowError(Error, 'Transform module mah-transform is missing a *transform* or *calcTransform* method.');
-
- expect(Registry.transformsRegistry['mah-transform']).toBeUndefined();
+ });
+
+ describe("Registry.registerSubplot", function() {
+ var fake = {
+ name: "fake",
+ attr: "abc",
+ idRoot: "cba",
+ attrRegex: /^abc([2-9]|[1-9][0-9]+)?$/,
+ idRegex: /^cba([2-9]|[1-9][0-9]+)?$/,
+ attributes: { stuff: { "more stuff": 102102 } }
+ };
+
+ Registry.registerSubplot(fake);
+
+ var subplotsRegistry = Registry.subplotsRegistry;
+
+ it("should register attr, idRoot and attributes", function() {
+ expect(subplotsRegistry.fake.attr).toEqual("abc");
+ expect(subplotsRegistry.fake.idRoot).toEqual("cba");
+ expect(subplotsRegistry.fake.attributes).toEqual({
+ stuff: { "more stuff": 102102 }
+ });
});
- it('should not throw when transform module is valid (1)', function() {
- var transformModule = {
- moduleType: 'transform',
- name: 'mah-transform',
- transform: function() {}
- };
-
- expect(function() {
- Plotly.register(transformModule);
- }).not.toThrow();
-
- expect(Registry.transformsRegistry['mah-transform']).toBeDefined();
+ describe("registered subplot type attribute regex", function() {
+ it("should compile to correct attribute regex string", function() {
+ expect(subplotsRegistry.fake.attrRegex.toString()).toEqual(
+ "/^abc([2-9]|[1-9][0-9]+)?$/"
+ );
+ });
+
+ var shouldPass = [
+ "abc",
+ "abc2",
+ "abc3",
+ "abc10",
+ "abc9",
+ "abc100",
+ "abc2002"
+ ];
+ var shouldFail = ["0abc", "abc0", "abc1", "abc021321", "abc00021321"];
+
+ shouldPass.forEach(function(s) {
+ it(
+ "considers " + JSON.stringify(s) + "as a correct attribute name",
+ function() {
+ expect(subplotsRegistry.fake.attrRegex.test(s)).toBe(true);
+ }
+ );
+ });
+
+ shouldFail.forEach(function(s) {
+ it(
+ "considers " + JSON.stringify(s) + "as an incorrect attribute name",
+ function() {
+ expect(subplotsRegistry.fake.attrRegex.test(s)).toBe(false);
+ }
+ );
+ });
});
- it('should not throw when transform module is valid (2)', function() {
- var transformModule = {
- moduleType: 'transform',
- name: 'mah-transform',
- calcTransform: function() {}
- };
-
- expect(function() {
- Plotly.register(transformModule);
- }).not.toThrow();
-
- expect(Registry.transformsRegistry['mah-transform']).toBeDefined();
+ describe("registered subplot type id regex", function() {
+ it("should compile to correct id regular expression", function() {
+ expect(subplotsRegistry.fake.idRegex.toString()).toEqual(
+ "/^cba([2-9]|[1-9][0-9]+)?$/"
+ );
+ });
+
+ var shouldPass = [
+ "cba",
+ "cba2",
+ "cba3",
+ "cba10",
+ "cba9",
+ "cba100",
+ "cba2002"
+ ];
+ var shouldFail = ["0cba", "cba0", "cba1", "cba021321", "cba00021321"];
+
+ shouldPass.forEach(function(s) {
+ it(
+ "considers " + JSON.stringify(s) + "as a correct attribute name",
+ function() {
+ expect(subplotsRegistry.fake.idRegex.test(s)).toBe(true);
+ }
+ );
+ });
+
+ shouldFail.forEach(function(s) {
+ it(
+ "considers " + JSON.stringify(s) + "as an incorrect attribute name",
+ function() {
+ expect(subplotsRegistry.fake.idRegex.test(s)).toBe(false);
+ }
+ );
+ });
});
+ });
+});
- it('should not throw when transform module is valid (3)', function() {
- var transformModule = {
- moduleType: 'transform',
- name: 'mah-transform',
- transform: function() {},
- calcTransform: function() {}
- };
-
- expect(function() {
- Plotly.register(transformModule);
- }).not.toThrow();
-
- expect(Registry.transformsRegistry['mah-transform']).toBeDefined();
- });
+describe("the register function", function() {
+ "use strict";
+ beforeEach(function() {
+ this.modulesKeys = Object.keys(Registry.modules);
+ this.allTypesKeys = Object.keys(Registry.allTypes);
+ this.allCategoriesKeys = Object.keys(Registry.allCategories);
+ this.allTransformsKeys = Object.keys(Registry.transformsRegistry);
+ });
+
+ afterEach(function() {
+ function revertObj(obj, initialKeys) {
+ Object.keys(obj).forEach(function(k) {
+ if (initialKeys.indexOf(k) === -1) delete obj[k];
+ });
+ }
+
+ revertObj(Registry.modules, this.modulesKeys);
+ revertObj(Registry.allTypes, this.allTypesKeys);
+ revertObj(Registry.allCategories, this.allCategoriesKeys);
+ revertObj(Registry.transformsRegistry, this.allTransformsKeys);
+ });
+
+ it("should throw an error when no argument is given", function() {
+ expect(function() {
+ Plotly.register();
+ }).toThrowError(Error, "No argument passed to Plotly.register.");
+ });
+
+ it("should work with a single module", function() {
+ var mockTrace1 = {
+ moduleType: "trace",
+ name: "mockTrace1",
+ meta: "Meta string",
+ basePlotModule: { name: "plotModule" },
+ categories: ["categories", "array"]
+ };
+
+ expect(function() {
+ Plotly.register(mockTrace1);
+ }).not.toThrow();
+
+ expect(Registry.getModule("mockTrace1")).toBe(mockTrace1);
+ });
+
+ it("should work with an array of modules", function() {
+ var mockTrace2 = {
+ moduleType: "trace",
+ name: "mockTrace2",
+ meta: "Meta string",
+ basePlotModule: { name: "plotModule" },
+ categories: ["categories", "array"]
+ };
+
+ expect(function() {
+ Plotly.register([mockTrace2]);
+ }).not.toThrow();
+
+ expect(Registry.getModule("mockTrace2")).toBe(mockTrace2);
+ });
+
+ it("should throw an error when an invalid module is given", function() {
+ var invalidTrace = { moduleType: "invalid" };
+
+ expect(function() {
+ Plotly.register([invalidTrace]);
+ }).toThrowError(Error, "Invalid module was attempted to be registered!");
+
+ expect(Registry.transformsRegistry["mah-transform"]).toBeUndefined();
+ });
+
+ it("should throw when if transform module is invalid (1)", function() {
+ var missingTransformName = { moduleType: "transform" };
+
+ expect(function() {
+ Plotly.register(missingTransformName);
+ }).toThrowError(Error, "Transform module *name* must be a string.");
+
+ expect(Registry.transformsRegistry["mah-transform"]).toBeUndefined();
+ });
+
+ it("should throw when if transform module is invalid (2)", function() {
+ var missingTransformFunc = {
+ moduleType: "transform",
+ name: "mah-transform"
+ };
+
+ expect(function() {
+ Plotly.register(missingTransformFunc);
+ }).toThrowError(
+ Error,
+ "Transform module mah-transform is missing a *transform* or *calcTransform* method."
+ );
+
+ expect(Registry.transformsRegistry["mah-transform"]).toBeUndefined();
+ });
+
+ it("should not throw when transform module is valid (1)", function() {
+ var transformModule = {
+ moduleType: "transform",
+ name: "mah-transform",
+ transform: function() {}
+ };
+
+ expect(function() {
+ Plotly.register(transformModule);
+ }).not.toThrow();
+
+ expect(Registry.transformsRegistry["mah-transform"]).toBeDefined();
+ });
+
+ it("should not throw when transform module is valid (2)", function() {
+ var transformModule = {
+ moduleType: "transform",
+ name: "mah-transform",
+ calcTransform: function() {}
+ };
+
+ expect(function() {
+ Plotly.register(transformModule);
+ }).not.toThrow();
+
+ expect(Registry.transformsRegistry["mah-transform"]).toBeDefined();
+ });
+
+ it("should not throw when transform module is valid (3)", function() {
+ var transformModule = {
+ moduleType: "transform",
+ name: "mah-transform",
+ transform: function() {},
+ calcTransform: function() {}
+ };
+
+ expect(function() {
+ Plotly.register(transformModule);
+ }).not.toThrow();
+
+ expect(Registry.transformsRegistry["mah-transform"]).toBeDefined();
+ });
});
diff --git a/test/jasmine/tests/scatter3d_test.js b/test/jasmine/tests/scatter3d_test.js
index 7518da16166..05e002a1984 100644
--- a/test/jasmine/tests/scatter3d_test.js
+++ b/test/jasmine/tests/scatter3d_test.js
@@ -1,91 +1,92 @@
-var Scatter3D = require('@src/traces/scatter3d');
-var Lib = require('@src/lib');
-var Color = require('@src/components/color');
-
-
-describe('Scatter3D defaults', function() {
- 'use strict';
-
- var defaultColor = '#d3d3d3';
-
- function _supply(traceIn, layoutEdits) {
- var traceOut = { visible: true },
- layout = Lib.extendFlat({ _dataLength: 1 }, layoutEdits);
-
- Scatter3D.supplyDefaults(traceIn, traceOut, defaultColor, layout);
- return traceOut;
+var Scatter3D = require("@src/traces/scatter3d");
+var Lib = require("@src/lib");
+var Color = require("@src/components/color");
+
+describe("Scatter3D defaults", function() {
+ "use strict";
+ var defaultColor = "#d3d3d3";
+
+ function _supply(traceIn, layoutEdits) {
+ var traceOut = { visible: true },
+ layout = Lib.extendFlat({ _dataLength: 1 }, layoutEdits);
+
+ Scatter3D.supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ return traceOut;
+ }
+
+ var base = { x: [1, 2, 3], y: [1, 2, 3], z: [1, 2, 1] };
+
+ it(
+ "should make marker.color inherit from line.color (scalar case)",
+ function() {
+ var out = _supply(Lib.extendFlat({}, base, { line: { color: "red" } }));
+
+ expect(out.line.color).toEqual("red");
+ expect(out.marker.color).toEqual("red");
+ expect(out.marker.line.color).toBe(
+ Color.defaultLine,
+ "but not marker.line.color"
+ );
}
+ );
- var base = {
- x: [1, 2, 3],
- y: [1, 2, 3],
- z: [1, 2, 1]
- };
-
- it('should make marker.color inherit from line.color (scalar case)', function() {
- var out = _supply(Lib.extendFlat({}, base, {
- line: { color: 'red' }
- }));
-
- expect(out.line.color).toEqual('red');
- expect(out.marker.color).toEqual('red');
- expect(out.marker.line.color).toBe(Color.defaultLine, 'but not marker.line.color');
- });
-
- it('should make marker.color inherit from line.color (array case)', function() {
- var color = [1, 2, 3];
+ it(
+ "should make marker.color inherit from line.color (array case)",
+ function() {
+ var color = [1, 2, 3];
- var out = _supply(Lib.extendFlat({}, base, {
- line: { color: color }
- }));
+ var out = _supply(Lib.extendFlat({}, base, { line: { color: color } }));
- expect(out.line.color).toBe(color);
- expect(out.marker.color).toBe(color);
- expect(out.marker.line.color).toBe(Color.defaultLine, 'but not marker.line.color');
- });
-
- it('should make line.color inherit from marker.color if scalar)', function() {
- var out = _supply(Lib.extendFlat({}, base, {
- marker: { color: 'red' }
- }));
-
- expect(out.line.color).toEqual('red');
- expect(out.marker.color).toEqual('red');
- expect(out.marker.line.color).toBe(Color.defaultLine);
- });
+ expect(out.line.color).toBe(color);
+ expect(out.marker.color).toBe(color);
+ expect(out.marker.line.color).toBe(
+ Color.defaultLine,
+ "but not marker.line.color"
+ );
+ }
+ );
- it('should not make line.color inherit from marker.color if array', function() {
- var color = [1, 2, 3];
+ it("should make line.color inherit from marker.color if scalar)", function() {
+ var out = _supply(Lib.extendFlat({}, base, { marker: { color: "red" } }));
- var out = _supply(Lib.extendFlat({}, base, {
- marker: { color: color }
- }));
+ expect(out.line.color).toEqual("red");
+ expect(out.marker.color).toEqual("red");
+ expect(out.marker.line.color).toBe(Color.defaultLine);
+ });
- expect(out.line.color).toBe(defaultColor);
- expect(out.marker.color).toBe(color);
- expect(out.marker.line.color).toBe(Color.defaultLine);
- });
+ it(
+ "should not make line.color inherit from marker.color if array",
+ function() {
+ var color = [1, 2, 3];
- it('should inherit layout.calendar', function() {
- var out = _supply(base, {calendar: 'islamic'});
+ var out = _supply(Lib.extendFlat({}, base, { marker: { color: color } }));
- // we always fill calendar attributes, because it's hard to tell if
- // we're on a date axis at this point.
- expect(out.xcalendar).toBe('islamic');
- expect(out.ycalendar).toBe('islamic');
- expect(out.zcalendar).toBe('islamic');
+ expect(out.line.color).toBe(defaultColor);
+ expect(out.marker.color).toBe(color);
+ expect(out.marker.line.color).toBe(Color.defaultLine);
+ }
+ );
+
+ it("should inherit layout.calendar", function() {
+ var out = _supply(base, { calendar: "islamic" });
+
+ // we always fill calendar attributes, because it's hard to tell if
+ // we're on a date axis at this point.
+ expect(out.xcalendar).toBe("islamic");
+ expect(out.ycalendar).toBe("islamic");
+ expect(out.zcalendar).toBe("islamic");
+ });
+
+ it("should take its own calendars", function() {
+ var traceIn = Lib.extendFlat({}, base, {
+ xcalendar: "coptic",
+ ycalendar: "ethiopian",
+ zcalendar: "mayan"
});
+ var out = _supply(traceIn, { calendar: "islamic" });
- it('should take its own calendars', function() {
- var traceIn = Lib.extendFlat({}, base, {
- xcalendar: 'coptic',
- ycalendar: 'ethiopian',
- zcalendar: 'mayan'
- });
- var out = _supply(traceIn, {calendar: 'islamic'});
-
- expect(out.xcalendar).toBe('coptic');
- expect(out.ycalendar).toBe('ethiopian');
- expect(out.zcalendar).toBe('mayan');
- });
+ expect(out.xcalendar).toBe("coptic");
+ expect(out.ycalendar).toBe("ethiopian");
+ expect(out.zcalendar).toBe("mayan");
+ });
});
diff --git a/test/jasmine/tests/scatter_test.js b/test/jasmine/tests/scatter_test.js
index 1dcb3abbee3..f48a205b487 100644
--- a/test/jasmine/tests/scatter_test.js
+++ b/test/jasmine/tests/scatter_test.js
@@ -1,328 +1,398 @@
-var Scatter = require('@src/traces/scatter');
-var makeBubbleSizeFn = require('@src/traces/scatter/make_bubble_size_func');
-var linePoints = require('@src/traces/scatter/line_points');
-var Lib = require('@src/lib');
-
-describe('Test scatter', function() {
- 'use strict';
-
- describe('supplyDefaults', function() {
- var traceIn,
- traceOut;
-
- var defaultColor = '#444',
- layout = {};
-
- var supplyDefaults = Scatter.supplyDefaults;
-
- beforeEach(function() {
- traceOut = {};
- });
-
- it('should set visible to false when x and y are empty', function() {
- traceIn = {};
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
-
- traceIn = {
- x: [],
- y: []
- };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
- });
-
- it('should set visible to false when x or y is empty', function() {
- traceIn = {
- x: []
- };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
-
- traceIn = {
- x: [],
- y: [1, 2, 3]
- };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
-
- traceIn = {
- y: []
- };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
-
- traceIn = {
- x: [1, 2, 3],
- y: []
- };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
- });
-
- it('should correctly assign \'hoveron\' default', function() {
- traceIn = {
- x: [1, 2, 3],
- y: [1, 2, 3],
- mode: 'lines+markers',
- fill: 'tonext'
- };
-
- // fills and markers, you get both hover types
- // you need visible: true here, as that normally gets set
- // outside of the module supplyDefaults
- traceOut = {visible: true};
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.hoveron).toBe('points+fills');
-
- // but with only lines (or just fill) and fill tonext or toself
- // you get fills
- traceIn.mode = 'lines';
- traceOut = {visible: true};
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.hoveron).toBe('fills');
-
- // with the wrong fill you always get points
- // only area fills default to hoveron points. Vertical or
- // horizontal fills don't have the same physical meaning,
- // they're generally just filling their own slice, so they
- // default to hoveron points.
- traceIn.fill = 'tonexty';
- traceOut = {visible: true};
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.hoveron).toBe('points');
- });
-
- it('should inherit layout.calendar', function() {
- traceIn = {
- x: [1, 2, 3],
- y: [1, 2, 3]
- };
- supplyDefaults(traceIn, traceOut, defaultColor, {calendar: 'islamic'});
-
- // we always fill calendar attributes, because it's hard to tell if
- // we're on a date axis at this point.
- expect(traceOut.xcalendar).toBe('islamic');
- expect(traceOut.ycalendar).toBe('islamic');
- });
-
- it('should take its own calendars', function() {
- traceIn = {
- x: [1, 2, 3],
- y: [1, 2, 3],
- xcalendar: 'coptic',
- ycalendar: 'ethiopian'
- };
- supplyDefaults(traceIn, traceOut, defaultColor, {calendar: 'islamic'});
-
- expect(traceOut.xcalendar).toBe('coptic');
- expect(traceOut.ycalendar).toBe('ethiopian');
- });
+var Scatter = require("@src/traces/scatter");
+var makeBubbleSizeFn = require("@src/traces/scatter/make_bubble_size_func");
+var linePoints = require("@src/traces/scatter/line_points");
+var Lib = require("@src/lib");
+
+describe("Test scatter", function() {
+ "use strict";
+ describe("supplyDefaults", function() {
+ var traceIn, traceOut;
+
+ var defaultColor = "#444", layout = {};
+
+ var supplyDefaults = Scatter.supplyDefaults;
+
+ beforeEach(function() {
+ traceOut = {};
+ });
+
+ it("should set visible to false when x and y are empty", function() {
+ traceIn = {};
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+
+ traceIn = { x: [], y: [] };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+ });
+
+ it("should set visible to false when x or y is empty", function() {
+ traceIn = { x: [] };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+
+ traceIn = { x: [], y: [1, 2, 3] };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+
+ traceIn = { y: [] };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+
+ traceIn = { x: [1, 2, 3], y: [] };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+ });
+
+ it("should correctly assign 'hoveron' default", function() {
+ traceIn = {
+ x: [1, 2, 3],
+ y: [1, 2, 3],
+ mode: "lines+markers",
+ fill: "tonext"
+ };
+
+ // fills and markers, you get both hover types
+ // you need visible: true here, as that normally gets set
+ // outside of the module supplyDefaults
+ traceOut = { visible: true };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.hoveron).toBe("points+fills");
+
+ // but with only lines (or just fill) and fill tonext or toself
+ // you get fills
+ traceIn.mode = "lines";
+ traceOut = { visible: true };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.hoveron).toBe("fills");
+
+ // with the wrong fill you always get points
+ // only area fills default to hoveron points. Vertical or
+ // horizontal fills don't have the same physical meaning,
+ // they're generally just filling their own slice, so they
+ // default to hoveron points.
+ traceIn.fill = "tonexty";
+ traceOut = { visible: true };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.hoveron).toBe("points");
+ });
+
+ it("should inherit layout.calendar", function() {
+ traceIn = { x: [1, 2, 3], y: [1, 2, 3] };
+ supplyDefaults(traceIn, traceOut, defaultColor, { calendar: "islamic" });
+
+ // we always fill calendar attributes, because it's hard to tell if
+ // we're on a date axis at this point.
+ expect(traceOut.xcalendar).toBe("islamic");
+ expect(traceOut.ycalendar).toBe("islamic");
+ });
+
+ it("should take its own calendars", function() {
+ traceIn = {
+ x: [1, 2, 3],
+ y: [1, 2, 3],
+ xcalendar: "coptic",
+ ycalendar: "ethiopian"
+ };
+ supplyDefaults(traceIn, traceOut, defaultColor, { calendar: "islamic" });
+
+ expect(traceOut.xcalendar).toBe("coptic");
+ expect(traceOut.ycalendar).toBe("ethiopian");
+ });
+ });
+
+ describe("isBubble", function() {
+ it("should return true when marker.size is an Array", function() {
+ var trace = { marker: { size: [1, 4, 2, 10] } },
+ isBubble = Scatter.isBubble(trace);
+
+ expect(isBubble).toBe(true);
+ });
+
+ it("should return false when marker.size is an number", function() {
+ var trace = { marker: { size: 10 } }, isBubble = Scatter.isBubble(trace);
+
+ expect(isBubble).toBe(false);
+ });
+
+ it("should return false when marker.size is not defined", function() {
+ var trace = { marker: { color: "red" } },
+ isBubble = Scatter.isBubble(trace);
+
+ expect(isBubble).toBe(false);
+ });
+
+ it("should return false when marker is not defined", function() {
+ var trace = { line: { color: "red" } },
+ isBubble = Scatter.isBubble(trace);
+
+ expect(isBubble).toBe(false);
+ });
+ });
+
+ describe("makeBubbleSizeFn", function() {
+ var markerSizes = [
+ 0,
+ "1",
+ 2.21321321,
+ "not-a-number",
+ 100,
+ 1000.213213,
+ 1e7,
+ undefined,
+ null,
+ -100
+ ],
+ trace = { marker: {} };
+
+ var sizeFn, expected;
+
+ it(
+ "should scale w.r.t. bubble diameter when sizemode=diameter",
+ function() {
+ trace.marker.sizemode = "diameter";
+ sizeFn = makeBubbleSizeFn(trace);
+
+ expected = [0, 0.5, 1.106606605, 0, 50, 500.1066065, 5000000, 0, 0, 0];
+ expect(markerSizes.map(sizeFn)).toEqual(expected);
+ }
+ );
+
+ it("should scale w.r.t. bubble area when sizemode=area", function() {
+ trace.marker.sizemode = "area";
+ sizeFn = makeBubbleSizeFn(trace);
+
+ expected = [
+ 0,
+ 0.7071067811865476,
+ 1.051953708582274,
+ 0,
+ 7.0710678118654755,
+ 22.363063441755916,
+ 2236.06797749979,
+ 0,
+ 0,
+ 0
+ ];
+ expect(markerSizes.map(sizeFn)).toEqual(expected);
});
- describe('isBubble', function() {
- it('should return true when marker.size is an Array', function() {
- var trace = {
- marker: {
- size: [1, 4, 2, 10]
- }
- },
- isBubble = Scatter.isBubble(trace);
-
- expect(isBubble).toBe(true);
- });
-
- it('should return false when marker.size is an number', function() {
- var trace = {
- marker: {
- size: 10
- }
- },
- isBubble = Scatter.isBubble(trace);
-
- expect(isBubble).toBe(false);
- });
-
- it('should return false when marker.size is not defined', function() {
- var trace = {
- marker: {
- color: 'red'
- }
- },
- isBubble = Scatter.isBubble(trace);
-
- expect(isBubble).toBe(false);
- });
-
- it('should return false when marker is not defined', function() {
- var trace = {
- line: {
- color: 'red'
- }
- },
- isBubble = Scatter.isBubble(trace);
-
- expect(isBubble).toBe(false);
- });
+ it("should adjust scaling according to sizeref", function() {
+ trace.marker.sizemode = "diameter";
+ trace.marker.sizeref = 0.1;
+ sizeFn = makeBubbleSizeFn(trace);
+
+ expected = [0, 5, 11.06606605, 0, 500, 5001.066065, 50000000, 0, 0, 0];
+ expect(markerSizes.map(sizeFn)).toEqual(expected);
+ });
+
+ it("should adjust the small sizes according to sizemin", function() {
+ trace.marker.sizemode = "diameter";
+ trace.marker.sizeref = 10;
+ trace.marker.sizemin = 5;
+ sizeFn = makeBubbleSizeFn(trace);
+
+ expected = [0, 5, 5, 0, 5, 50.01066065, 500000, 0, 0, 0];
+ expect(markerSizes.map(sizeFn)).toEqual(expected);
+ });
+ });
+
+ describe("linePoints", function() {
+ // test axes are unit-scaled and 100 units long
+ var ax = { _length: 100, c2p: Lib.identity },
+ baseOpts = {
+ xaxis: ax,
+ yaxis: ax,
+ connectGaps: false,
+ baseTolerance: 1,
+ linear: true,
+ simplify: true
+ };
+
+ function makeCalcData(ptsIn) {
+ return ptsIn.map(function(pt) {
+ return { x: pt[0], y: pt[1] };
+ });
+ }
+
+ function callLinePoints(ptsIn, opts) {
+ var thisOpts = {};
+ if (!opts) opts = {};
+ Object.keys(baseOpts).forEach(function(key) {
+ if (opts[key] !== undefined) thisOpts[key] = opts[key];
+ else thisOpts[key] = baseOpts[key];
+ });
+ return linePoints(makeCalcData(ptsIn), thisOpts);
+ }
+
+ it("should pass along well-separated non-linear points", function() {
+ var ptsIn = [[0, 0], [10, 20], [20, 10], [30, 40], [40, 60], [50, 30]];
+ var ptsOut = callLinePoints(ptsIn);
+
+ expect(ptsOut).toEqual([ptsIn]);
+ });
+
+ it("should collapse straight lines to just their endpoints", function() {
+ var ptsIn = [
+ [0, 0],
+ [5, 10],
+ [13, 26],
+ [15, 30],
+ [22, 16],
+ [28, 4],
+ [30, 0]
+ ];
+ var ptsOut = callLinePoints(ptsIn);
+ // TODO: [22,16] should not appear here. This is ok but not optimal.
+ expect(ptsOut).toEqual([[[0, 0], [15, 30], [22, 16], [30, 0]]]);
+ });
+
+ it("should not collapse straight lines if simplify is false", function() {
+ var ptsIn = [
+ [0, 0],
+ [5, 10],
+ [13, 26],
+ [15, 30],
+ [22, 16],
+ [28, 4],
+ [30, 0]
+ ];
+ var ptsOut = callLinePoints(ptsIn, { simplify: false });
+ expect(ptsOut).toEqual([ptsIn]);
+ });
+ it("should separate out blanks, unless connectgaps is true", function() {
+ var ptsIn = [
+ [0, 0],
+ [10, 20],
+ [20, 10],
+ [undefined, undefined],
+ [30, 40],
+ [undefined, undefined],
+ [40, 60],
+ [50, 30]
+ ];
+ var ptsDisjoint = callLinePoints(ptsIn);
+ var ptsConnected = callLinePoints(ptsIn, { connectGaps: true });
+
+ expect(ptsDisjoint).toEqual([
+ [[0, 0], [10, 20], [20, 10]],
+ [[30, 40]],
+ [[40, 60], [50, 30]]
+ ]);
+ expect(ptsConnected).toEqual([
+ [[0, 0], [10, 20], [20, 10], [30, 40], [40, 60], [50, 30]]
+ ]);
});
- describe('makeBubbleSizeFn', function() {
- var markerSizes = [
- 0, '1', 2.21321321, 'not-a-number',
- 100, 1000.213213, 1e7, undefined, null, -100
- ],
- trace = { marker: {} };
-
- var sizeFn, expected;
-
- it('should scale w.r.t. bubble diameter when sizemode=diameter', function() {
- trace.marker.sizemode = 'diameter';
- sizeFn = makeBubbleSizeFn(trace);
-
- expected = [
- 0, 0.5, 1.106606605, 0, 50, 500.1066065, 5000000, 0, 0, 0
- ];
- expect(markerSizes.map(sizeFn)).toEqual(expected);
- });
-
- it('should scale w.r.t. bubble area when sizemode=area', function() {
- trace.marker.sizemode = 'area';
- sizeFn = makeBubbleSizeFn(trace);
-
- expected = [
- 0, 0.7071067811865476, 1.051953708582274, 0, 7.0710678118654755,
- 22.363063441755916, 2236.06797749979, 0, 0, 0
- ];
- expect(markerSizes.map(sizeFn)).toEqual(expected);
- });
-
- it('should adjust scaling according to sizeref', function() {
- trace.marker.sizemode = 'diameter';
- trace.marker.sizeref = 0.1;
- sizeFn = makeBubbleSizeFn(trace);
-
- expected = [
- 0, 5, 11.06606605, 0, 500, 5001.066065, 50000000, 0, 0, 0
- ];
- expect(markerSizes.map(sizeFn)).toEqual(expected);
- });
-
- it('should adjust the small sizes according to sizemin', function() {
- trace.marker.sizemode = 'diameter';
- trace.marker.sizeref = 10;
- trace.marker.sizemin = 5;
- sizeFn = makeBubbleSizeFn(trace);
-
- expected = [
- 0, 5, 5, 0, 5, 50.01066065, 500000, 0, 0, 0
- ];
- expect(markerSizes.map(sizeFn)).toEqual(expected);
- });
+ it("should collapse a vertical cluster into 4 points", function() {
+ // the four being initial, high, low, and final if the high is before the low
+ var ptsIn = [
+ [-10, 0],
+ [0, 0],
+ [0, 10],
+ [0, 20],
+ [0, -10],
+ [0, 15],
+ [0, -25],
+ [0, 10],
+ [0, 5],
+ [10, 10]
+ ];
+ var ptsOut = callLinePoints(ptsIn);
+
+ // TODO: [0, 10] should not appear in either of these results - this is OK but not optimal.
+ expect(ptsOut).toEqual([
+ [[-10, 0], [0, 0], [0, 10], [0, 20], [0, -25], [0, 5], [10, 10]]
+ ]);
+
+ // or initial, low, high, final if the low is before the high
+ ptsIn = [
+ [-10, 0],
+ [0, 0],
+ [0, 10],
+ [0, -25],
+ [0, -10],
+ [0, 15],
+ [0, 20],
+ [0, 10],
+ [0, 5],
+ [10, 10]
+ ];
+ ptsOut = callLinePoints(ptsIn);
+
+ expect(ptsOut).toEqual([
+ [[-10, 0], [0, 0], [0, 10], [0, -25], [0, 20], [0, 5], [10, 10]]
+ ]);
});
- describe('linePoints', function() {
- // test axes are unit-scaled and 100 units long
- var ax = {_length: 100, c2p: Lib.identity},
- baseOpts = {
- xaxis: ax,
- yaxis: ax,
- connectGaps: false,
- baseTolerance: 1,
- linear: true,
- simplify: true
- };
-
- function makeCalcData(ptsIn) {
- return ptsIn.map(function(pt) {
- return {x: pt[0], y: pt[1]};
- });
- }
-
- function callLinePoints(ptsIn, opts) {
- var thisOpts = {};
- if(!opts) opts = {};
- Object.keys(baseOpts).forEach(function(key) {
- if(opts[key] !== undefined) thisOpts[key] = opts[key];
- else thisOpts[key] = baseOpts[key];
- });
- return linePoints(makeCalcData(ptsIn), thisOpts);
- }
-
- it('should pass along well-separated non-linear points', function() {
- var ptsIn = [[0, 0], [10, 20], [20, 10], [30, 40], [40, 60], [50, 30]];
- var ptsOut = callLinePoints(ptsIn);
-
- expect(ptsOut).toEqual([ptsIn]);
- });
-
- it('should collapse straight lines to just their endpoints', function() {
- var ptsIn = [[0, 0], [5, 10], [13, 26], [15, 30], [22, 16], [28, 4], [30, 0]];
- var ptsOut = callLinePoints(ptsIn);
- // TODO: [22,16] should not appear here. This is ok but not optimal.
- expect(ptsOut).toEqual([[[0, 0], [15, 30], [22, 16], [30, 0]]]);
- });
-
- it('should not collapse straight lines if simplify is false', function() {
- var ptsIn = [[0, 0], [5, 10], [13, 26], [15, 30], [22, 16], [28, 4], [30, 0]];
- var ptsOut = callLinePoints(ptsIn, {simplify: false});
- expect(ptsOut).toEqual([ptsIn]);
- });
-
- it('should separate out blanks, unless connectgaps is true', function() {
- var ptsIn = [
- [0, 0], [10, 20], [20, 10], [undefined, undefined],
- [30, 40], [undefined, undefined],
- [40, 60], [50, 30]];
- var ptsDisjoint = callLinePoints(ptsIn);
- var ptsConnected = callLinePoints(ptsIn, {connectGaps: true});
-
- expect(ptsDisjoint).toEqual([[[0, 0], [10, 20], [20, 10]], [[30, 40]], [[40, 60], [50, 30]]]);
- expect(ptsConnected).toEqual([[[0, 0], [10, 20], [20, 10], [30, 40], [40, 60], [50, 30]]]);
- });
-
- it('should collapse a vertical cluster into 4 points', function() {
- // the four being initial, high, low, and final if the high is before the low
- var ptsIn = [[-10, 0], [0, 0], [0, 10], [0, 20], [0, -10], [0, 15], [0, -25], [0, 10], [0, 5], [10, 10]];
- var ptsOut = callLinePoints(ptsIn);
-
- // TODO: [0, 10] should not appear in either of these results - this is OK but not optimal.
- expect(ptsOut).toEqual([[[-10, 0], [0, 0], [0, 10], [0, 20], [0, -25], [0, 5], [10, 10]]]);
-
- // or initial, low, high, final if the low is before the high
- ptsIn = [[-10, 0], [0, 0], [0, 10], [0, -25], [0, -10], [0, 15], [0, 20], [0, 10], [0, 5], [10, 10]];
- ptsOut = callLinePoints(ptsIn);
-
- expect(ptsOut).toEqual([[[-10, 0], [0, 0], [0, 10], [0, -25], [0, 20], [0, 5], [10, 10]]]);
- });
-
- it('should collapse a horizontal cluster into 4 points', function() {
- // same deal
- var ptsIn = [[0, -10], [0, 0], [10, 0], [20, 0], [-10, 0], [15, 0], [-25, 0], [10, 0], [5, 0], [10, 10]];
- var ptsOut = callLinePoints(ptsIn);
-
- // TODO: [10, 0] should not appear in either of these results - this is OK but not optimal.
- // same problem as the test above
- expect(ptsOut).toEqual([[[0, -10], [0, 0], [10, 0], [20, 0], [-25, 0], [5, 0], [10, 10]]]);
-
- ptsIn = [[0, -10], [0, 0], [10, 0], [-25, 0], [-10, 0], [15, 0], [20, 0], [10, 0], [5, 0], [10, 10]];
- ptsOut = callLinePoints(ptsIn);
-
- expect(ptsOut).toEqual([[[0, -10], [0, 0], [10, 0], [-25, 0], [20, 0], [5, 0], [10, 10]]]);
- });
-
- it('should use lineWidth to determine whether a cluster counts', function() {
- var ptsIn = [[0, 0], [20, 0], [21, 10], [22, 20], [23, -10], [24, 15], [25, -25], [26, 10], [27, 5], [100, 10]];
- var ptsThin = callLinePoints(ptsIn);
- var ptsThick = callLinePoints(ptsIn, {baseTolerance: 8});
-
- // thin line, no decimation. thick line yes.
- expect(ptsThin).toEqual([ptsIn]);
- // TODO: [21,10] should not appear in this result (same issue again)
- expect(ptsThick).toEqual([[[0, 0], [20, 0], [21, 10], [22, 20], [25, -25], [27, 5], [100, 10]]]);
- });
-
- // TODO: test coarser decimation outside plot, and removing very near duplicates from the four of a cluster
+ it("should collapse a horizontal cluster into 4 points", function() {
+ // same deal
+ var ptsIn = [
+ [0, -10],
+ [0, 0],
+ [10, 0],
+ [20, 0],
+ [-10, 0],
+ [15, 0],
+ [-25, 0],
+ [10, 0],
+ [5, 0],
+ [10, 10]
+ ];
+ var ptsOut = callLinePoints(ptsIn);
+
+ // TODO: [10, 0] should not appear in either of these results - this is OK but not optimal.
+ // same problem as the test above
+ expect(ptsOut).toEqual([
+ [[0, -10], [0, 0], [10, 0], [20, 0], [-25, 0], [5, 0], [10, 10]]
+ ]);
+
+ ptsIn = [
+ [0, -10],
+ [0, 0],
+ [10, 0],
+ [-25, 0],
+ [-10, 0],
+ [15, 0],
+ [20, 0],
+ [10, 0],
+ [5, 0],
+ [10, 10]
+ ];
+ ptsOut = callLinePoints(ptsIn);
+
+ expect(ptsOut).toEqual([
+ [[0, -10], [0, 0], [10, 0], [-25, 0], [20, 0], [5, 0], [10, 10]]
+ ]);
});
+ it(
+ "should use lineWidth to determine whether a cluster counts",
+ function() {
+ var ptsIn = [
+ [0, 0],
+ [20, 0],
+ [21, 10],
+ [22, 20],
+ [23, -10],
+ [24, 15],
+ [25, -25],
+ [26, 10],
+ [27, 5],
+ [100, 10]
+ ];
+ var ptsThin = callLinePoints(ptsIn);
+ var ptsThick = callLinePoints(ptsIn, { baseTolerance: 8 });
+
+ // thin line, no decimation. thick line yes.
+ expect(ptsThin).toEqual([ptsIn]);
+ // TODO: [21,10] should not appear in this result (same issue again)
+ expect(ptsThick).toEqual([
+ [[0, 0], [20, 0], [21, 10], [22, 20], [25, -25], [27, 5], [100, 10]]
+ ]);
+ }
+ );
+ // TODO: test coarser decimation outside plot, and removing very near duplicates from the four of a cluster
+ });
});
diff --git a/test/jasmine/tests/scattergeo_test.js b/test/jasmine/tests/scattergeo_test.js
index 2391cdfb512..f7b3718dccc 100644
--- a/test/jasmine/tests/scattergeo_test.js
+++ b/test/jasmine/tests/scattergeo_test.js
@@ -1,74 +1,63 @@
-var ScatterGeo = require('@src/traces/scattergeo');
+var ScatterGeo = require("@src/traces/scattergeo");
-describe('Test scattergeo', function() {
- 'use strict';
+describe("Test scattergeo", function() {
+ "use strict";
+ describe("supplyDefaults", function() {
+ var traceIn, traceOut;
- describe('supplyDefaults', function() {
- var traceIn,
- traceOut;
+ var defaultColor = "#444", layout = {};
- var defaultColor = '#444',
- layout = {};
-
- beforeEach(function() {
- traceOut = {};
- });
-
- it('should slice lat if it it longer than lon', function() {
- traceIn = {
- lon: [-75],
- lat: [45, 45, 45]
- };
-
- ScatterGeo.supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.lat).toEqual([45]);
- expect(traceOut.lon).toEqual([-75]);
- });
-
- it('should slice lon if it it longer than lat', function() {
- traceIn = {
- lon: [-75, -75, -75],
- lat: [45]
- };
-
- ScatterGeo.supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.lat).toEqual([45]);
- expect(traceOut.lon).toEqual([-75]);
- });
+ beforeEach(function() {
+ traceOut = {};
+ });
- it('should not coerce lat and lon if locations is valid', function() {
- traceIn = {
- locations: ['CAN', 'USA'],
- lon: [20, 40],
- lat: [20, 40]
- };
+ it("should slice lat if it it longer than lon", function() {
+ traceIn = { lon: [-75], lat: [45, 45, 45] };
- ScatterGeo.supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.lon).toBeUndefined();
- expect(traceOut.lat).toBeUndefined();
- });
+ ScatterGeo.supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.lat).toEqual([45]);
+ expect(traceOut.lon).toEqual([-75]);
+ });
- it('should make trace invisible if lon or lat is omitted and locations not given', function() {
- function testOne() {
- ScatterGeo.supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
- }
+ it("should slice lon if it it longer than lat", function() {
+ traceIn = { lon: [-75, -75, -75], lat: [45] };
- traceIn = {
- lat: [45, 45, 45]
- };
- testOne();
+ ScatterGeo.supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.lat).toEqual([45]);
+ expect(traceOut.lon).toEqual([-75]);
+ });
- traceIn = {
- lon: [-75, -75, -75]
- };
- traceOut = {};
- testOne();
+ it("should not coerce lat and lon if locations is valid", function() {
+ traceIn = {
+ locations: ["CAN", "USA"],
+ lon: [20, 40],
+ lat: [20, 40]
+ };
- traceIn = {};
- traceOut = {};
- testOne();
- });
+ ScatterGeo.supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.lon).toBeUndefined();
+ expect(traceOut.lat).toBeUndefined();
});
+ it(
+ "should make trace invisible if lon or lat is omitted and locations not given",
+ function() {
+ function testOne() {
+ ScatterGeo.supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+ }
+
+ traceIn = { lat: [45, 45, 45] };
+ testOne();
+
+ traceIn = { lon: [-75, -75, -75] };
+ traceOut = {};
+ testOne();
+
+ traceIn = {};
+ traceOut = {};
+ testOne();
+ }
+ );
+ });
});
diff --git a/test/jasmine/tests/scattermapbox_test.js b/test/jasmine/tests/scattermapbox_test.js
index 1e9556f44cd..02b8942b874 100644
--- a/test/jasmine/tests/scattermapbox_test.js
+++ b/test/jasmine/tests/scattermapbox_test.js
@@ -1,590 +1,653 @@
-var Plotly = require('@lib');
-var Plots = require('@src/plots/plots');
-var Lib = require('@src/lib');
+var Plotly = require("@lib");
+var Plots = require("@src/plots/plots");
+var Lib = require("@src/lib");
-var ScatterMapbox = require('@src/traces/scattermapbox');
-var convert = require('@src/traces/scattermapbox/convert');
+var ScatterMapbox = require("@src/traces/scattermapbox");
+var convert = require("@src/traces/scattermapbox/convert");
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var hasWebGLSupport = require('../assets/has_webgl_support');
-var customMatchers = require('../assets/custom_matchers');
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var hasWebGLSupport = require("../assets/has_webgl_support");
+var customMatchers = require("../assets/custom_matchers");
Plotly.setPlotConfig({
- mapboxAccessToken: require('@build/credentials.json').MAPBOX_ACCESS_TOKEN
+ mapboxAccessToken: require("@build/credentials.json").MAPBOX_ACCESS_TOKEN
});
+describe("scattermapbox defaults", function() {
+ "use strict";
+ function _supply(traceIn) {
+ var traceOut = { visible: true },
+ defaultColor = "#444",
+ layout = { _dataLength: 1 };
-describe('scattermapbox defaults', function() {
- 'use strict';
+ ScatterMapbox.supplyDefaults(traceIn, traceOut, defaultColor, layout);
- function _supply(traceIn) {
- var traceOut = { visible: true },
- defaultColor = '#444',
- layout = { _dataLength: 1 };
+ return traceOut;
+ }
- ScatterMapbox.supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ it("should truncate 'lon' if longer than 'lat'", function() {
+ var fullTrace = _supply({ lon: [1, 2, 3], lat: [2, 3] });
- return traceOut;
- }
-
- it('should truncate \'lon\' if longer than \'lat\'', function() {
- var fullTrace = _supply({
- lon: [1, 2, 3],
- lat: [2, 3]
- });
-
- expect(fullTrace.lon).toEqual([1, 2]);
- expect(fullTrace.lat).toEqual([2, 3]);
- });
-
- it('should truncate \'lat\' if longer than \'lon\'', function() {
- var fullTrace = _supply({
- lon: [1, 2, 3],
- lat: [2, 3, 3, 5]
- });
+ expect(fullTrace.lon).toEqual([1, 2]);
+ expect(fullTrace.lat).toEqual([2, 3]);
+ });
- expect(fullTrace.lon).toEqual([1, 2, 3]);
- expect(fullTrace.lat).toEqual([2, 3, 3]);
- });
+ it("should truncate 'lat' if longer than 'lon'", function() {
+ var fullTrace = _supply({ lon: [1, 2, 3], lat: [2, 3, 3, 5] });
- it('should set \'visible\' to false if \'lat\' and/or \'lon\' has zero length', function() {
- var fullTrace = _supply({
- lon: [1, 2, 3],
- lat: []
- });
+ expect(fullTrace.lon).toEqual([1, 2, 3]);
+ expect(fullTrace.lat).toEqual([2, 3, 3]);
+ });
- expect(fullTrace.visible).toEqual(false);
+ it(
+ "should set 'visible' to false if 'lat' and/or 'lon' has zero length",
+ function() {
+ var fullTrace = _supply({ lon: [1, 2, 3], lat: [] });
- fullTrace = _supply({
- lon: null,
- lat: [1, 2, 3]
- });
-
- expect(fullTrace.visible).toEqual(false);
- });
-
- it('should set \'marker.color\' and \'marker.size\' to first item if symbol is set to \'circle\'', function() {
- var base = {
- mode: 'markers',
- lon: [1, 2, 3],
- lat: [2, 3, 3],
- marker: {
- color: ['red', 'green', 'blue'],
- size: [10, 20, 30]
- }
- };
-
- var fullTrace = _supply(Lib.extendDeep({}, base, {
- marker: { symbol: 'monument' }
- }));
-
- expect(fullTrace.marker.color).toEqual('red');
- expect(fullTrace.marker.size).toEqual(10);
-
- fullTrace = _supply(Lib.extendDeep({}, base, {
- marker: { symbol: ['monument', 'music', 'harbor'] }
- }));
-
- expect(fullTrace.marker.color).toEqual('red');
- expect(fullTrace.marker.size).toEqual(10);
-
- fullTrace = _supply(Lib.extendDeep({}, base, {
- marker: { symbol: 'circle' }
- }));
-
- expect(fullTrace.marker.color).toEqual(['red', 'green', 'blue']);
- expect(fullTrace.marker.size).toEqual([10, 20, 30]);
- });
-});
+ expect(fullTrace.visible).toEqual(false);
-describe('scattermapbox calc', function() {
- 'use strict';
+ fullTrace = _supply({ lon: null, lat: [1, 2, 3] });
- function _calc(trace) {
- var gd = { data: [trace] };
-
- Plots.supplyDefaults(gd);
-
- var fullTrace = gd._fullData[0];
- return ScatterMapbox.calc(gd, fullTrace);
+ expect(fullTrace.visible).toEqual(false);
}
+ );
+
+ it(
+ "should set 'marker.color' and 'marker.size' to first item if symbol is set to 'circle'",
+ function() {
+ var base = {
+ mode: "markers",
+ lon: [1, 2, 3],
+ lat: [2, 3, 3],
+ marker: { color: ["red", "green", "blue"], size: [10, 20, 30] }
+ };
+
+ var fullTrace = _supply(
+ Lib.extendDeep({}, base, { marker: { symbol: "monument" } })
+ );
+
+ expect(fullTrace.marker.color).toEqual("red");
+ expect(fullTrace.marker.size).toEqual(10);
+
+ fullTrace = _supply(
+ Lib.extendDeep({}, base, {
+ marker: { symbol: ["monument", "music", "harbor"] }
+ })
+ );
- var base = { type: 'scattermapbox' };
-
- it('should place lon/lat data in lonlat pairs', function() {
- var calcTrace = _calc(Lib.extendFlat({}, base, {
- lon: [10, 20, 30],
- lat: [20, 30, 10]
- }));
-
- expect(calcTrace).toEqual([
- { lonlat: [10, 20] },
- { lonlat: [20, 30] },
- { lonlat: [30, 10] }
- ]);
- });
-
- it('should coerce numeric strings lon/lat data into numbers', function() {
- var calcTrace = _calc(Lib.extendFlat({}, base, {
- lon: [10, 20, '30', '40'],
- lat: [20, '30', 10, '50']
- }));
-
- expect(calcTrace).toEqual([
- { lonlat: [10, 20] },
- { lonlat: [20, 30] },
- { lonlat: [30, 10] },
- { lonlat: [40, 50] }
- ]);
- });
-
- it('should keep track of gaps in data', function() {
- var calcTrace = _calc(Lib.extendFlat({}, base, {
- lon: [null, 10, null, null, 20, '30', null, '40', null, 10],
- lat: [10, 20, '30', null, 10, '50', null, 60, null, null]
- }));
-
- expect(calcTrace).toEqual([
- { lonlat: [10, 20], gapAfter: true },
- { lonlat: [20, 10] },
- { lonlat: [30, 50], gapAfter: true },
- { lonlat: [40, 60], gapAfter: true }
- ]);
- });
-
- it('should fill array text (base case)', function() {
- var calcTrace = _calc(Lib.extendFlat({}, base, {
- lon: [10, 20, 30],
- lat: [20, 30, 10],
- text: ['A', 'B', 'C']
- }));
-
- expect(calcTrace).toEqual([
- { lonlat: [10, 20], tx: 'A' },
- { lonlat: [20, 30], tx: 'B' },
- { lonlat: [30, 10], tx: 'C' }
- ]);
- });
-
- it('should fill array text (invalid entry case)', function() {
- var calcTrace = _calc(Lib.extendFlat({}, base, {
- lon: [10, 20, 30],
- lat: [20, 30, 10],
- text: ['A', 'B', null]
- }));
-
- expect(calcTrace).toEqual([
- { lonlat: [10, 20], tx: 'A' },
- { lonlat: [20, 30], tx: 'B' },
- { lonlat: [30, 10], tx: '' }
- ]);
- });
-
- it('should fill array marker attributes (base case)', function() {
- var calcTrace = _calc(Lib.extendFlat({}, base, {
- lon: [10, 20, null, 30],
- lat: [20, 30, null, 10],
- marker: {
- color: ['red', 'blue', 'green', 'yellow'],
- size: [10, 20, 8, 10]
- }
- }));
-
- expect(calcTrace).toEqual([
- { lonlat: [10, 20], mc: 'red', ms: 10, mcc: 'red', mrc: 5 },
- { lonlat: [20, 30], mc: 'blue', ms: 20, mcc: 'blue', mrc: 10, gapAfter: true },
- { lonlat: [30, 10], mc: 'yellow', ms: 10, mcc: 'yellow', mrc: 5 }
- ]);
- });
-
- it('should fill array marker attributes (invalid scale case)', function() {
- var calcTrace = _calc(Lib.extendFlat({}, base, {
- lon: [10, 20, null, 30],
- lat: [20, 30, null, 10],
- marker: {
- color: [0, null, 5, 10],
- size: [10, NaN, 8, 10],
- colorscale: [
- [0, 'blue'], [0.5, 'red'], [1, 'green']
- ]
- }
- }));
-
- expect(calcTrace).toEqual([
- { lonlat: [10, 20], mc: 0, ms: 10, mcc: 'rgb(0, 0, 255)', mrc: 5 },
- { lonlat: [20, 30], mc: null, ms: NaN, mcc: '#444', mrc: 0, gapAfter: true },
- { lonlat: [30, 10], mc: 10, ms: 10, mcc: 'rgb(0, 128, 0)', mrc: 5 }
- ]);
- });
-
- it('should fill marker attributes (symbol case)', function() {
- var calcTrace = _calc(Lib.extendFlat({}, base, {
- lon: [10, 20, null, 30],
- lat: [20, 30, null, 10],
- marker: {
- symbol: ['monument', 'music', 'harbor', null]
- }
- }));
-
- expect(calcTrace).toEqual([
- { lonlat: [10, 20], mx: 'monument' },
- { lonlat: [20, 30], mx: 'music', gapAfter: true },
- { lonlat: [30, 10], mx: 'circle' }
- ]);
- });
-});
-
-describe('scattermapbox convert', function() {
- 'use strict';
-
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
- });
-
- function _convert(trace) {
- var gd = { data: [trace] };
- Plots.supplyDefaults(gd);
+ expect(fullTrace.marker.color).toEqual("red");
+ expect(fullTrace.marker.size).toEqual(10);
- var fullTrace = gd._fullData[0];
- Plots.doCalcdata(gd, fullTrace);
+ fullTrace = _supply(
+ Lib.extendDeep({}, base, { marker: { symbol: "circle" } })
+ );
- var calcTrace = gd.calcdata[0];
- return convert(calcTrace);
+ expect(fullTrace.marker.color).toEqual(["red", "green", "blue"]);
+ expect(fullTrace.marker.size).toEqual([10, 20, 30]);
}
+ );
+});
- var base = {
- type: 'scattermapbox',
- lon: [10, '20', 30, 20, null, 20, 10],
- lat: [20, 20, '10', null, 10, 10, 20]
- };
-
- it('for markers + circle bubbles traces, should', function() {
- var opts = _convert(Lib.extendFlat({}, base, {
- mode: 'markers',
- marker: {
- symbol: 'circle',
- size: [10, 20, null, 10, '10'],
- color: [10, null, '30', 20, 10]
- }
- }));
-
- assertVisibility(opts, ['none', 'none', 'visible', 'none']);
-
- expect(opts.circle.paint['circle-color']).toEqual({
- property: 'circle-color',
- stops: [
- [0, 'rgb(220, 220, 220)'], [1, '#444'], [2, 'rgb(178, 10, 28)']
- ]
- }, 'have correct circle-color stops');
-
- expect(opts.circle.paint['circle-radius']).toEqual({
- property: 'circle-radius',
- stops: [ [0, 5], [1, 10], [2, 0] ]
- }, 'have correct circle-radius stops');
-
- var circleProps = opts.circle.geojson.features.map(function(f) {
- return f.properties;
- });
-
- // N.B repeated values have same geojson props
- expect(circleProps).toEqual([
- { 'circle-color': 0, 'circle-radius': 0 },
- { 'circle-color': 1, 'circle-radius': 1 },
- { 'circle-color': 2, 'circle-radius': 2 },
- { 'circle-color': 1, 'circle-radius': 2 },
- { 'circle-color': 1, 'circle-radius': 2 }
- ], 'have correct geojson feature properties');
- });
-
- it('fill + markers + lines traces, should', function() {
- var opts = _convert(Lib.extendFlat({}, base, {
- mode: 'markers+lines',
- marker: { symbol: 'circle' },
- fill: 'toself'
- }));
-
- assertVisibility(opts, ['visible', 'visible', 'visible', 'none']);
-
- var segment1 = [[10, 20], [20, 20], [30, 10]],
- segment2 = [[20, 10], [10, 20]];
-
- var lineCoords = [segment1, segment2],
- fillCoords = [[segment1], [segment2]];
-
- expect(opts.line.geojson.coordinates).toEqual(lineCoords, 'have correct line coords');
- expect(opts.fill.geojson.coordinates).toEqual(fillCoords, 'have correct fill coords');
-
- var circleCoords = opts.circle.geojson.features.map(function(f) {
- return f.geometry.coordinates;
- });
+describe("scattermapbox calc", function() {
+ "use strict";
+ function _calc(trace) {
+ var gd = { data: [trace] };
+
+ Plots.supplyDefaults(gd);
+
+ var fullTrace = gd._fullData[0];
+ return ScatterMapbox.calc(gd, fullTrace);
+ }
+
+ var base = { type: "scattermapbox" };
+
+ it("should place lon/lat data in lonlat pairs", function() {
+ var calcTrace = _calc(
+ Lib.extendFlat({}, base, { lon: [10, 20, 30], lat: [20, 30, 10] })
+ );
+
+ expect(calcTrace).toEqual([
+ { lonlat: [10, 20] },
+ { lonlat: [20, 30] },
+ { lonlat: [30, 10] }
+ ]);
+ });
+
+ it("should coerce numeric strings lon/lat data into numbers", function() {
+ var calcTrace = _calc(
+ Lib.extendFlat({}, base, {
+ lon: [10, 20, "30", "40"],
+ lat: [20, "30", 10, "50"]
+ })
+ );
+
+ expect(calcTrace).toEqual([
+ { lonlat: [10, 20] },
+ { lonlat: [20, 30] },
+ { lonlat: [30, 10] },
+ { lonlat: [40, 50] }
+ ]);
+ });
+
+ it("should keep track of gaps in data", function() {
+ var calcTrace = _calc(
+ Lib.extendFlat({}, base, {
+ lon: [null, 10, null, null, 20, "30", null, "40", null, 10],
+ lat: [10, 20, "30", null, 10, "50", null, 60, null, null]
+ })
+ );
+
+ expect(calcTrace).toEqual([
+ { lonlat: [10, 20], gapAfter: true },
+ { lonlat: [20, 10] },
+ { lonlat: [30, 50], gapAfter: true },
+ { lonlat: [40, 60], gapAfter: true }
+ ]);
+ });
+
+ it("should fill array text (base case)", function() {
+ var calcTrace = _calc(
+ Lib.extendFlat({}, base, {
+ lon: [10, 20, 30],
+ lat: [20, 30, 10],
+ text: ["A", "B", "C"]
+ })
+ );
+
+ expect(calcTrace).toEqual([
+ { lonlat: [10, 20], tx: "A" },
+ { lonlat: [20, 30], tx: "B" },
+ { lonlat: [30, 10], tx: "C" }
+ ]);
+ });
+
+ it("should fill array text (invalid entry case)", function() {
+ var calcTrace = _calc(
+ Lib.extendFlat({}, base, {
+ lon: [10, 20, 30],
+ lat: [20, 30, 10],
+ text: ["A", "B", null]
+ })
+ );
+
+ expect(calcTrace).toEqual([
+ { lonlat: [10, 20], tx: "A" },
+ { lonlat: [20, 30], tx: "B" },
+ { lonlat: [30, 10], tx: "" }
+ ]);
+ });
+
+ it("should fill array marker attributes (base case)", function() {
+ var calcTrace = _calc(
+ Lib.extendFlat({}, base, {
+ lon: [10, 20, null, 30],
+ lat: [20, 30, null, 10],
+ marker: {
+ color: ["red", "blue", "green", "yellow"],
+ size: [10, 20, 8, 10]
+ }
+ })
+ );
+
+ expect(calcTrace).toEqual([
+ { lonlat: [10, 20], mc: "red", ms: 10, mcc: "red", mrc: 5 },
+ {
+ lonlat: [20, 30],
+ mc: "blue",
+ ms: 20,
+ mcc: "blue",
+ mrc: 10,
+ gapAfter: true
+ },
+ { lonlat: [30, 10], mc: "yellow", ms: 10, mcc: "yellow", mrc: 5 }
+ ]);
+ });
+
+ it("should fill array marker attributes (invalid scale case)", function() {
+ var calcTrace = _calc(
+ Lib.extendFlat({}, base, {
+ lon: [10, 20, null, 30],
+ lat: [20, 30, null, 10],
+ marker: {
+ color: [0, null, 5, 10],
+ size: [10, NaN, 8, 10],
+ colorscale: [[0, "blue"], [0.5, "red"], [1, "green"]]
+ }
+ })
+ );
+
+ expect(calcTrace).toEqual([
+ { lonlat: [10, 20], mc: 0, ms: 10, mcc: "rgb(0, 0, 255)", mrc: 5 },
+ {
+ lonlat: [20, 30],
+ mc: null,
+ ms: NaN,
+ mcc: "#444",
+ mrc: 0,
+ gapAfter: true
+ },
+ { lonlat: [30, 10], mc: 10, ms: 10, mcc: "rgb(0, 128, 0)", mrc: 5 }
+ ]);
+ });
+
+ it("should fill marker attributes (symbol case)", function() {
+ var calcTrace = _calc(
+ Lib.extendFlat({}, base, {
+ lon: [10, 20, null, 30],
+ lat: [20, 30, null, 10],
+ marker: { symbol: ["monument", "music", "harbor", null] }
+ })
+ );
+
+ expect(calcTrace).toEqual([
+ { lonlat: [10, 20], mx: "monument" },
+ { lonlat: [20, 30], mx: "music", gapAfter: true },
+ { lonlat: [30, 10], mx: "circle" }
+ ]);
+ });
+});
- expect(circleCoords).toEqual([
- [10, 20], [20, 20], [30, 10], [20, 10], [10, 20]
- ], 'have correct circle coords');
+describe("scattermapbox convert", function() {
+ "use strict";
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
+
+ function _convert(trace) {
+ var gd = { data: [trace] };
+ Plots.supplyDefaults(gd);
+
+ var fullTrace = gd._fullData[0];
+ Plots.doCalcdata(gd, fullTrace);
+
+ var calcTrace = gd.calcdata[0];
+ return convert(calcTrace);
+ }
+
+ var base = {
+ type: "scattermapbox",
+ lon: [10, "20", 30, 20, null, 20, 10],
+ lat: [20, 20, "10", null, 10, 10, 20]
+ };
+
+ it("for markers + circle bubbles traces, should", function() {
+ var opts = _convert(
+ Lib.extendFlat({}, base, {
+ mode: "markers",
+ marker: {
+ symbol: "circle",
+ size: [10, 20, null, 10, "10"],
+ color: [10, null, "30", 20, 10]
+ }
+ })
+ );
+
+ assertVisibility(opts, ["none", "none", "visible", "none"]);
+
+ expect(opts.circle.paint["circle-color"]).toEqual(
+ {
+ property: "circle-color",
+ stops: [[0, "rgb(220, 220, 220)"], [1, "#444"], [2, "rgb(178, 10, 28)"]]
+ },
+ "have correct circle-color stops"
+ );
+
+ expect(opts.circle.paint["circle-radius"]).toEqual(
+ { property: "circle-radius", stops: [[0, 5], [1, 10], [2, 0]] },
+ "have correct circle-radius stops"
+ );
+
+ var circleProps = opts.circle.geojson.features.map(function(f) {
+ return f.properties;
});
- it('for markers + non-circle traces, should', function() {
- var opts = _convert(Lib.extendFlat({}, base, {
- mode: 'markers',
- marker: { symbol: 'monument' }
- }));
-
- assertVisibility(opts, ['none', 'none', 'none', 'visible']);
-
- var symbolProps = opts.symbol.geojson.features.map(function(f) {
- return [f.properties.symbol, f.properties.text];
- });
-
- var expected = opts.symbol.geojson.features.map(function() {
- return ['monument', ''];
- });
-
- expect(symbolProps).toEqual(expected, 'have correct geojson properties');
+ // N.B repeated values have same geojson props
+ expect(circleProps).toEqual(
+ [
+ { "circle-color": 0, "circle-radius": 0 },
+ { "circle-color": 1, "circle-radius": 1 },
+ { "circle-color": 2, "circle-radius": 2 },
+ { "circle-color": 1, "circle-radius": 2 },
+ { "circle-color": 1, "circle-radius": 2 }
+ ],
+ "have correct geojson feature properties"
+ );
+ });
+
+ it("fill + markers + lines traces, should", function() {
+ var opts = _convert(
+ Lib.extendFlat({}, base, {
+ mode: "markers+lines",
+ marker: { symbol: "circle" },
+ fill: "toself"
+ })
+ );
+
+ assertVisibility(opts, ["visible", "visible", "visible", "none"]);
+
+ var segment1 = [[10, 20], [20, 20], [30, 10]],
+ segment2 = [[20, 10], [10, 20]];
+
+ var lineCoords = [segment1, segment2],
+ fillCoords = [[segment1], [segment2]];
+
+ expect(opts.line.geojson.coordinates).toEqual(
+ lineCoords,
+ "have correct line coords"
+ );
+ expect(opts.fill.geojson.coordinates).toEqual(
+ fillCoords,
+ "have correct fill coords"
+ );
+
+ var circleCoords = opts.circle.geojson.features.map(function(f) {
+ return f.geometry.coordinates;
});
- it('for text + lines traces, should', function() {
- var opts = _convert(Lib.extendFlat({}, base, {
- mode: 'lines+text',
- connectgaps: true,
- text: ['A', 'B', 'C', 'D', 'E', 'F']
- }));
-
- assertVisibility(opts, ['none', 'visible', 'none', 'visible']);
+ expect(circleCoords).toEqual(
+ [[10, 20], [20, 20], [30, 10], [20, 10], [10, 20]],
+ "have correct circle coords"
+ );
+ });
- var lineCoords = [
- [10, 20], [20, 20], [30, 10], [20, 10], [10, 20]
- ];
+ it("for markers + non-circle traces, should", function() {
+ var opts = _convert(
+ Lib.extendFlat({}, base, {
+ mode: "markers",
+ marker: { symbol: "monument" }
+ })
+ );
- expect(opts.line.geojson.coordinates).toEqual(lineCoords, 'have correct line coords');
+ assertVisibility(opts, ["none", "none", "none", "visible"]);
- var actualText = opts.symbol.geojson.features.map(function(f) {
- return f.properties.text;
- });
-
- expect(actualText).toEqual(['A', 'B', 'C', 'F', '']);
+ var symbolProps = opts.symbol.geojson.features.map(function(f) {
+ return [f.properties.symbol, f.properties.text];
});
- it('should correctly convert \'textposition\' to \'text-anchor\' and \'text-offset\'', function() {
- var specs = {
- 'top left': ['top-right', [-0.65, -1.65]],
- 'top center': ['top', [0, -1.65]],
- 'top right': ['top-left', [0.65, -1.65]],
- 'middle left': ['right', [-0.65, 0]],
- 'middle center': ['center', [0, 0]],
- 'middle right': ['left', [0.65, 0]],
- 'bottom left': ['bottom-right', [-0.65, 1.65]],
- 'bottom center': ['bottom', [0, 1.65]],
- 'bottom right': ['bottom-left', [0.65, 1.65]]
- };
-
- Object.keys(specs).forEach(function(k) {
- var spec = specs[k];
-
- var opts = _convert(Lib.extendFlat({}, base, {
- textposition: k,
- mode: 'text+markers',
- marker: { size: 15 },
- text: ['A', 'B', 'C']
- }));
-
- expect([
- opts.symbol.layout['text-anchor'],
- opts.symbol.layout['text-offset']
- ]).toEqual(spec, '(case ' + k + ')');
- });
+ var expected = opts.symbol.geojson.features.map(function() {
+ return ["monument", ""];
});
- it('for markers + circle bubbles traces with repeated values, should', function() {
- var opts = _convert(Lib.extendFlat({}, base, {
- lon: ['-96.796988', '-81.379236', '-85.311819', ''],
- lat: ['32.776664', '28.538335', '35.047157', '' ],
- marker: { size: ['5', '49', '5', ''] }
- }));
-
- expect(opts.circle.paint['circle-radius'].stops)
- .toBeCloseTo2DArray([[0, 2.5], [1, 24.5]], 'not replicate stops');
+ expect(symbolProps).toEqual(expected, "have correct geojson properties");
+ });
- var radii = opts.circle.geojson.features.map(function(f) {
- return f.properties['circle-radius'];
- });
+ it("for text + lines traces, should", function() {
+ var opts = _convert(
+ Lib.extendFlat({}, base, {
+ mode: "lines+text",
+ connectgaps: true,
+ text: ["A", "B", "C", "D", "E", "F"]
+ })
+ );
- expect(radii).toBeCloseToArray([0, 1, 0], 'link features to correct stops');
- });
+ assertVisibility(opts, ["none", "visible", "none", "visible"]);
- it('for input only blank pts', function() {
- var opts = _convert(Lib.extendFlat({}, base, {
- mode: 'lines',
- lon: ['', null],
- lat: [null, ''],
- fill: 'toself'
- }));
+ var lineCoords = [[10, 20], [20, 20], [30, 10], [20, 10], [10, 20]];
- assertVisibility(opts, ['none', 'none', 'none', 'none']);
+ expect(opts.line.geojson.coordinates).toEqual(
+ lineCoords,
+ "have correct line coords"
+ );
- expect(opts.line.geojson.coordinates).toEqual([], 'have correct line coords');
- expect(opts.fill.geojson.coordinates).toEqual([], 'have correct fill coords');
+ var actualText = opts.symbol.geojson.features.map(function(f) {
+ return f.properties.text;
});
- function assertVisibility(opts, expectations) {
- var actual = ['fill', 'line', 'circle', 'symbol'].map(function(l) {
- return opts[l].layout.visibility;
- });
-
- var msg = 'set layer visibility properly';
-
- expect(actual).toEqual(expectations, msg);
+ expect(actualText).toEqual(["A", "B", "C", "F", ""]);
+ });
+
+ it(
+ "should correctly convert 'textposition' to 'text-anchor' and 'text-offset'",
+ function() {
+ var specs = {
+ "top left": ["top-right", [-0.65, -1.65]],
+ "top center": ["top", [0, -1.65]],
+ "top right": ["top-left", [0.65, -1.65]],
+ "middle left": ["right", [-0.65, 0]],
+ "middle center": ["center", [0, 0]],
+ "middle right": ["left", [0.65, 0]],
+ "bottom left": ["bottom-right", [-0.65, 1.65]],
+ "bottom center": ["bottom", [0, 1.65]],
+ "bottom right": ["bottom-left", [0.65, 1.65]]
+ };
+
+ Object.keys(specs).forEach(function(k) {
+ var spec = specs[k];
+
+ var opts = _convert(
+ Lib.extendFlat({}, base, {
+ textposition: k,
+ mode: "text+markers",
+ marker: { size: 15 },
+ text: ["A", "B", "C"]
+ })
+ );
+
+ expect([
+ opts.symbol.layout["text-anchor"],
+ opts.symbol.layout["text-offset"]
+ ]).toEqual(spec, "(case " + k + ")");
+ });
}
-});
-
-describe('scattermapbox hover', function() {
- 'use strict';
-
- if(!hasWebGLSupport('scattermapbox hover')) return;
-
- var hoverPoints = ScatterMapbox.hoverPoints;
-
- var gd;
-
- beforeAll(function(done) {
- jasmine.addMatchers(customMatchers);
-
- gd = createGraphDiv();
-
- var data = [{
- type: 'scattermapbox',
- lon: [10, 20, 30],
- lat: [10, 20, 30],
- text: ['A', 'B', 'C']
- }];
+ );
+
+ it(
+ "for markers + circle bubbles traces with repeated values, should",
+ function() {
+ var opts = _convert(
+ Lib.extendFlat({}, base, {
+ lon: ["-96.796988", "-81.379236", "-85.311819", ""],
+ lat: ["32.776664", "28.538335", "35.047157", ""],
+ marker: { size: ["5", "49", "5", ""] }
+ })
+ );
- Plotly.plot(gd, data, { autosize: true }).then(done);
- });
+ expect(opts.circle.paint["circle-radius"].stops).toBeCloseTo2DArray(
+ [[0, 2.5], [1, 24.5]],
+ "not replicate stops"
+ );
- afterAll(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
+ var radii = opts.circle.geojson.features.map(function(f) {
+ return f.properties["circle-radius"];
+ });
- function getPointData(gd) {
- var cd = gd.calcdata,
- mapbox = gd._fullLayout.mapbox._subplot;
-
- return {
- index: false,
- distance: 20,
- cd: cd[0],
- trace: cd[0][0].trace,
- xa: mapbox.xaxis,
- ya: mapbox.yaxis
- };
+ expect(radii).toBeCloseToArray(
+ [0, 1, 0],
+ "link features to correct stops"
+ );
}
-
- it('should generate hover label info (base case)', function() {
- var xval = 11,
- yval = 11;
-
- var out = hoverPoints(getPointData(gd), xval, yval)[0];
-
- expect(out.index).toEqual(0);
- expect([out.x0, out.x1, out.y0, out.y1]).toBeCloseToArray([
- 297.444, 299.444, 105.410, 107.410
- ]);
- expect(out.extraText).toEqual('(10°, 10°)
A');
- expect(out.color).toEqual('#1f77b4');
+ );
+
+ it("for input only blank pts", function() {
+ var opts = _convert(
+ Lib.extendFlat({}, base, {
+ mode: "lines",
+ lon: ["", null],
+ lat: [null, ""],
+ fill: "toself"
+ })
+ );
+
+ assertVisibility(opts, ["none", "none", "none", "none"]);
+
+ expect(opts.line.geojson.coordinates).toEqual(
+ [],
+ "have correct line coords"
+ );
+ expect(opts.fill.geojson.coordinates).toEqual(
+ [],
+ "have correct fill coords"
+ );
+ });
+
+ function assertVisibility(opts, expectations) {
+ var actual = ["fill", "line", "circle", "symbol"].map(function(l) {
+ return opts[l].layout.visibility;
});
- it('should skip over blank and non-string text items', function(done) {
- var xval = 11,
- yval = 11,
- out;
-
- Plotly.restyle(gd, 'text', [['', 'B', 'C']]).then(function() {
- out = hoverPoints(getPointData(gd), xval, yval)[0];
- expect(out.extraText).toEqual('(10°, 10°)');
+ var msg = "set layer visibility properly";
- return Plotly.restyle(gd, 'text', [[null, 'B', 'C']]);
- })
- .then(function() {
- out = hoverPoints(getPointData(gd), xval, yval)[0];
- expect(out.extraText).toEqual('(10°, 10°)');
-
- return Plotly.restyle(gd, 'text', [[false, 'B', 'C']]);
- })
- .then(function() {
- out = hoverPoints(getPointData(gd), xval, yval)[0];
- expect(out.extraText).toEqual('(10°, 10°)');
+ expect(actual).toEqual(expectations, msg);
+ }
+});
- return Plotly.restyle(gd, 'text', [['A', 'B', 'C']]);
- })
- .then(function() {
- out = hoverPoints(getPointData(gd), xval, yval)[0];
- expect(out.extraText).toEqual('(10°, 10°)
A');
- })
- .then(done);
- });
+describe("scattermapbox hover", function() {
+ "use strict";
+ if (!hasWebGLSupport("scattermapbox hover")) return;
- it('should generate hover label info (positive winding case)', function() {
- var xval = 11 + 720,
- yval = 11;
+ var hoverPoints = ScatterMapbox.hoverPoints;
- var out = hoverPoints(getPointData(gd), xval, yval)[0];
+ var gd;
- expect(out.index).toEqual(0);
- expect([out.x0, out.x1, out.y0, out.y1]).toBeCloseToArray([
- 2345.444, 2347.444, 105.410, 107.410
- ]);
- expect(out.extraText).toEqual('(10°, 10°)
A');
- expect(out.color).toEqual('#1f77b4');
- });
+ beforeAll(function(done) {
+ jasmine.addMatchers(customMatchers);
- it('should generate hover label info (negative winding case)', function() {
- var xval = 11 - 1080,
- yval = 11;
+ gd = createGraphDiv();
- var out = hoverPoints(getPointData(gd), xval, yval)[0];
+ var data = [
+ {
+ type: "scattermapbox",
+ lon: [10, 20, 30],
+ lat: [10, 20, 30],
+ text: ["A", "B", "C"]
+ }
+ ];
- expect(out.index).toEqual(0);
- expect([out.x0, out.x1, out.y0, out.y1]).toBeCloseToArray([
- -2774.555, -2772.555, 105.410, 107.410
- ]);
- expect(out.extraText).toEqual('(10°, 10°)
A');
- expect(out.color).toEqual('#1f77b4');
- });
+ Plotly.plot(gd, data, { autosize: true }).then(done);
+ });
- it('should generate hover label info (hoverinfo: \'lon\' case)', function(done) {
- Plotly.restyle(gd, 'hoverinfo', 'lon').then(function() {
- var xval = 11,
- yval = 11;
+ afterAll(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
- var out = hoverPoints(getPointData(gd), xval, yval)[0];
+ function getPointData(gd) {
+ var cd = gd.calcdata, mapbox = gd._fullLayout.mapbox._subplot;
- expect(out.extraText).toEqual('lon: 10°');
- done();
- });
+ return {
+ index: false,
+ distance: 20,
+ cd: cd[0],
+ trace: cd[0][0].trace,
+ xa: mapbox.xaxis,
+ ya: mapbox.yaxis
+ };
+ }
+
+ it("should generate hover label info (base case)", function() {
+ var xval = 11, yval = 11;
+
+ var out = hoverPoints(getPointData(gd), xval, yval)[0];
+
+ expect(out.index).toEqual(0);
+ expect([out.x0, out.x1, out.y0, out.y1]).toBeCloseToArray([
+ 297.444,
+ 299.444,
+ 105.410,
+ 107.410
+ ]);
+ expect(out.extraText).toEqual("(10\xB0, 10\xB0)
A");
+ expect(out.color).toEqual("#1f77b4");
+ });
+
+ it("should skip over blank and non-string text items", function(done) {
+ var xval = 11, yval = 11, out;
+
+ Plotly.restyle(gd, "text", [["", "B", "C"]])
+ .then(function() {
+ out = hoverPoints(getPointData(gd), xval, yval)[0];
+ expect(out.extraText).toEqual("(10\xB0, 10\xB0)");
+
+ return Plotly.restyle(gd, "text", [[null, "B", "C"]]);
+ })
+ .then(function() {
+ out = hoverPoints(getPointData(gd), xval, yval)[0];
+ expect(out.extraText).toEqual("(10\xB0, 10\xB0)");
+
+ return Plotly.restyle(gd, "text", [[false, "B", "C"]]);
+ })
+ .then(function() {
+ out = hoverPoints(getPointData(gd), xval, yval)[0];
+ expect(out.extraText).toEqual("(10\xB0, 10\xB0)");
+
+ return Plotly.restyle(gd, "text", [["A", "B", "C"]]);
+ })
+ .then(function() {
+ out = hoverPoints(getPointData(gd), xval, yval)[0];
+ expect(out.extraText).toEqual("(10\xB0, 10\xB0)
A");
+ })
+ .then(done);
+ });
+
+ it("should generate hover label info (positive winding case)", function() {
+ var xval = 11 + 720, yval = 11;
+
+ var out = hoverPoints(getPointData(gd), xval, yval)[0];
+
+ expect(out.index).toEqual(0);
+ expect([out.x0, out.x1, out.y0, out.y1]).toBeCloseToArray([
+ 2345.444,
+ 2347.444,
+ 105.410,
+ 107.410
+ ]);
+ expect(out.extraText).toEqual("(10\xB0, 10\xB0)
A");
+ expect(out.color).toEqual("#1f77b4");
+ });
+
+ it("should generate hover label info (negative winding case)", function() {
+ var xval = 11 - 1080, yval = 11;
+
+ var out = hoverPoints(getPointData(gd), xval, yval)[0];
+
+ expect(out.index).toEqual(0);
+ expect([out.x0, out.x1, out.y0, out.y1]).toBeCloseToArray([
+ -2774.555,
+ -2772.555,
+ 105.410,
+ 107.410
+ ]);
+ expect(out.extraText).toEqual("(10\xB0, 10\xB0)
A");
+ expect(out.color).toEqual("#1f77b4");
+ });
+
+ it("should generate hover label info (hoverinfo: 'lon' case)", function(
+ done
+ ) {
+ Plotly.restyle(gd, "hoverinfo", "lon").then(function() {
+ var xval = 11, yval = 11;
+
+ var out = hoverPoints(getPointData(gd), xval, yval)[0];
+
+ expect(out.extraText).toEqual("lon: 10\xB0");
+ done();
});
+ });
- it('should generate hover label info (hoverinfo: \'lat\' case)', function(done) {
- Plotly.restyle(gd, 'hoverinfo', 'lat').then(function() {
- var xval = 11,
- yval = 11;
+ it("should generate hover label info (hoverinfo: 'lat' case)", function(
+ done
+ ) {
+ Plotly.restyle(gd, "hoverinfo", "lat").then(function() {
+ var xval = 11, yval = 11;
- var out = hoverPoints(getPointData(gd), xval, yval)[0];
+ var out = hoverPoints(getPointData(gd), xval, yval)[0];
- expect(out.extraText).toEqual('lat: 10°');
- done();
- });
+ expect(out.extraText).toEqual("lat: 10\xB0");
+ done();
});
+ });
- it('should generate hover label info (hoverinfo: \'text\' case)', function(done) {
- Plotly.restyle(gd, 'hoverinfo', 'text').then(function() {
- var xval = 11,
- yval = 11;
+ it("should generate hover label info (hoverinfo: 'text' case)", function(
+ done
+ ) {
+ Plotly.restyle(gd, "hoverinfo", "text").then(function() {
+ var xval = 11, yval = 11;
- var out = hoverPoints(getPointData(gd), xval, yval)[0];
+ var out = hoverPoints(getPointData(gd), xval, yval)[0];
- expect(out.extraText).toEqual('A');
- done();
- });
+ expect(out.extraText).toEqual("A");
+ done();
});
+ });
});
diff --git a/test/jasmine/tests/scatterternary_test.js b/test/jasmine/tests/scatterternary_test.js
index 21da09876f0..bba0003b4d4 100644
--- a/test/jasmine/tests/scatterternary_test.js
+++ b/test/jasmine/tests/scatterternary_test.js
@@ -1,351 +1,338 @@
-var Plotly = require('@lib');
-var Lib = require('@src/lib');
-var ScatterTernary = require('@src/traces/scatterternary');
+var Plotly = require("@lib");
+var Lib = require("@src/lib");
+var ScatterTernary = require("@src/traces/scatterternary");
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var customMatchers = require('../assets/custom_matchers');
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var customMatchers = require("../assets/custom_matchers");
+describe("scatterternary defaults", function() {
+ "use strict";
+ var supplyDefaults = ScatterTernary.supplyDefaults;
-describe('scatterternary defaults', function() {
- 'use strict';
+ var traceIn, traceOut;
- var supplyDefaults = ScatterTernary.supplyDefaults;
+ var defaultColor = "#444", layout = {};
- var traceIn, traceOut;
+ beforeEach(function() {
+ traceOut = {};
+ });
- var defaultColor = '#444',
- layout = {};
+ it(
+ "should allow one of 'a', 'b' or 'c' to be missing (base case)",
+ function() {
+ traceIn = { a: [1, 2, 3], b: [1, 2, 3], c: [1, 2, 3] };
- beforeEach(function() {
- traceOut = {};
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).not.toBe(true);
+ }
+ );
- it('should allow one of \'a\', \'b\' or \'c\' to be missing (base case)', function() {
- traceIn = {
- a: [1, 2, 3],
- b: [1, 2, 3],
- c: [1, 2, 3]
- };
+ it(
+ "should allow one of 'a', 'b' or 'c' to be missing ('c' is missing case)",
+ function() {
+ traceIn = { a: [1, 2, 3], b: [1, 2, 3] };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).not.toBe(true);
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).not.toBe(true);
+ }
+ );
- it('should allow one of \'a\', \'b\' or \'c\' to be missing (\'c\' is missing case)', function() {
- traceIn = {
- a: [1, 2, 3],
- b: [1, 2, 3]
- };
+ it(
+ "should allow one of 'a', 'b' or 'c' to be missing ('b' is missing case)",
+ function() {
+ traceIn = { a: [1, 2, 3], c: [1, 2, 3] };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).not.toBe(true);
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).not.toBe(true);
+ }
+ );
- it('should allow one of \'a\', \'b\' or \'c\' to be missing (\'b\' is missing case)', function() {
- traceIn = {
- a: [1, 2, 3],
- c: [1, 2, 3]
- };
+ it(
+ "should allow one of 'a', 'b' or 'c' to be missing ('a' is missing case)",
+ function() {
+ traceIn = { b: [1, 2, 3], c: [1, 2, 3] };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).not.toBe(true);
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).not.toBe(true);
+ }
+ );
- it('should allow one of \'a\', \'b\' or \'c\' to be missing (\'a\' is missing case)', function() {
- traceIn = {
- b: [1, 2, 3],
- c: [1, 2, 3]
- };
+ it(
+ "should allow one of 'a', 'b' or 'c' to be missing ('b and 'c' are missing case)",
+ function() {
+ traceIn = { a: [1, 2, 3] };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).not.toBe(true);
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+ }
+ );
- it('should allow one of \'a\', \'b\' or \'c\' to be missing (\'b\ and \'c\' are missing case)', function() {
- traceIn = {
- a: [1, 2, 3]
- };
+ it(
+ "should allow one of 'a', 'b' or 'c' to be missing ('a and 'c' are missing case)",
+ function() {
+ traceIn = { b: [1, 2, 3] };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+ }
+ );
- it('should allow one of \'a\', \'b\' or \'c\' to be missing (\'a\ and \'c\' are missing case)', function() {
- traceIn = {
- b: [1, 2, 3]
- };
+ it(
+ "should allow one of 'a', 'b' or 'c' to be missing ('a and 'b' are missing case)",
+ function() {
+ traceIn = { c: [1, 2, 3] };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+ }
+ );
- it('should allow one of \'a\', \'b\' or \'c\' to be missing (\'a\ and \'b\' are missing case)', function() {
- traceIn = {
- c: [1, 2, 3]
- };
+ it(
+ "should allow one of 'a', 'b' or 'c' to be missing (all are missing case)",
+ function() {
+ traceIn = {};
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+ }
+ );
- it('should allow one of \'a\', \'b\' or \'c\' to be missing (all are missing case)', function() {
- traceIn = {};
+ it(
+ "should truncate data arrays to the same length ('c' is shortest case)",
+ function() {
+ traceIn = { a: [1, 2, 3], b: [1, 2], c: [1] };
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.a).toEqual([1]);
+ expect(traceOut.b).toEqual([1]);
+ expect(traceOut.c).toEqual([1]);
+ }
+ );
- it('should truncate data arrays to the same length (\'c\' is shortest case)', function() {
- traceIn = {
- a: [1, 2, 3],
- b: [1, 2],
- c: [1]
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.a).toEqual([1]);
- expect(traceOut.b).toEqual([1]);
- expect(traceOut.c).toEqual([1]);
- });
+ it(
+ "should truncate data arrays to the same length ('a' is shortest case)",
+ function() {
+ traceIn = { a: [1], b: [1, 2, 3], c: [1, 2] };
- it('should truncate data arrays to the same length (\'a\' is shortest case)', function() {
- traceIn = {
- a: [1],
- b: [1, 2, 3],
- c: [1, 2]
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.a).toEqual([1]);
- expect(traceOut.b).toEqual([1]);
- expect(traceOut.c).toEqual([1]);
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.a).toEqual([1]);
+ expect(traceOut.b).toEqual([1]);
+ expect(traceOut.c).toEqual([1]);
+ }
+ );
- it('should truncate data arrays to the same length (\'a\' is shortest case)', function() {
- traceIn = {
- a: [1, 2],
- b: [1],
- c: [1, 2, 3]
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.a).toEqual([1]);
- expect(traceOut.b).toEqual([1]);
- expect(traceOut.c).toEqual([1]);
- });
- it('should include \'name\' in \'hoverinfo\' default if multi trace graph', function() {
- traceIn = {
- a: [1, 2, 3],
- b: [1, 2, 3],
- c: [1, 2, 3]
- };
- layout._dataLength = 2;
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.hoverinfo).toBe('all');
- });
+ it(
+ "should truncate data arrays to the same length ('a' is shortest case)",
+ function() {
+ traceIn = { a: [1, 2], b: [1], c: [1, 2, 3] };
- it('should not include \'name\' in \'hoverinfo\' default if single trace graph', function() {
- traceIn = {
- a: [1, 2, 3],
- b: [1, 2, 3],
- c: [1, 2, 3]
- };
- layout._dataLength = 1;
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.a).toEqual([1]);
+ expect(traceOut.b).toEqual([1]);
+ expect(traceOut.c).toEqual([1]);
+ }
+ );
+ it(
+ "should include 'name' in 'hoverinfo' default if multi trace graph",
+ function() {
+ traceIn = { a: [1, 2, 3], b: [1, 2, 3], c: [1, 2, 3] };
+ layout._dataLength = 2;
+
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.hoverinfo).toBe("all");
+ }
+ );
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.hoverinfo).toBe('a+b+c+text');
- });
+ it(
+ "should not include 'name' in 'hoverinfo' default if single trace graph",
+ function() {
+ traceIn = { a: [1, 2, 3], b: [1, 2, 3], c: [1, 2, 3] };
+ layout._dataLength = 1;
- it('should correctly assign \'hoveron\' default', function() {
- traceIn = {
- a: [1, 2, 3],
- b: [1, 2, 3],
- c: [1, 2, 3],
- mode: 'lines+markers',
- fill: 'tonext'
- };
-
- // fills and markers, you get both hover types
- // you need visible: true here, as that normally gets set
- // outside of the module supplyDefaults
- traceOut = {visible: true};
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.hoveron).toBe('points+fills');
-
- // but with only lines (or just fill) and fill tonext or toself
- // you get fills
- traceIn.mode = 'lines';
- traceOut = {visible: true};
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.hoveron).toBe('fills');
-
- // without a fill you always get points. For scatterternary, unlike
- // scatter, every allowed fill but 'none' is an area fill (rather than
- // a vertical / horizontal fill) so they all should default to
- // hoveron points.
- traceIn.fill = 'none';
- traceOut = {visible: true};
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.hoveron).toBe('points');
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.hoverinfo).toBe("a+b+c+text");
+ }
+ );
+
+ it("should correctly assign 'hoveron' default", function() {
+ traceIn = {
+ a: [1, 2, 3],
+ b: [1, 2, 3],
+ c: [1, 2, 3],
+ mode: "lines+markers",
+ fill: "tonext"
+ };
+
+ // fills and markers, you get both hover types
+ // you need visible: true here, as that normally gets set
+ // outside of the module supplyDefaults
+ traceOut = { visible: true };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.hoveron).toBe("points+fills");
+
+ // but with only lines (or just fill) and fill tonext or toself
+ // you get fills
+ traceIn.mode = "lines";
+ traceOut = { visible: true };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.hoveron).toBe("fills");
+
+ // without a fill you always get points. For scatterternary, unlike
+ // scatter, every allowed fill but 'none' is an area fill (rather than
+ // a vertical / horizontal fill) so they all should default to
+ // hoveron points.
+ traceIn.fill = "none";
+ traceOut = { visible: true };
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.hoveron).toBe("points");
+ });
});
-describe('scatterternary calc', function() {
- 'use strict';
+describe("scatterternary calc", function() {
+ "use strict";
+ var calc = ScatterTernary.calc;
- var calc = ScatterTernary.calc;
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
- });
+ var gd, trace, cd;
- var gd, trace, cd;
+ beforeEach(function() {
+ gd = { _fullLayout: { ternary: { sum: 1 } } };
- beforeEach(function() {
- gd = {
- _fullLayout: {
- ternary: { sum: 1 }
- }
- };
+ trace = { subplot: "ternary", sum: 1 };
+ });
- trace = {
- subplot: 'ternary',
- sum: 1
- };
- });
+ it("should fill in missing component (case 'c')", function() {
+ trace.a = [0.1, 0.3, 0.6];
+ trace.b = [0.3, 0.6, 0.1];
- it('should fill in missing component (case \'c\')', function() {
- trace.a = [0.1, 0.3, 0.6];
- trace.b = [0.3, 0.6, 0.1];
+ calc(gd, trace);
+ expect(trace.c).toBeCloseToArray([0.6, 0.1, 0.3]);
+ });
- calc(gd, trace);
- expect(trace.c).toBeCloseToArray([0.6, 0.1, 0.3]);
- });
+ it("should fill in missing component (case 'b')", function() {
+ trace.a = [0.1, 0.3, 0.6];
+ trace.c = [0.1, 0.3, 0.2];
- it('should fill in missing component (case \'b\')', function() {
- trace.a = [0.1, 0.3, 0.6];
- trace.c = [0.1, 0.3, 0.2];
+ calc(gd, trace);
+ expect(trace.b).toBeCloseToArray([0.8, 0.4, 0.2]);
+ });
- calc(gd, trace);
- expect(trace.b).toBeCloseToArray([0.8, 0.4, 0.2]);
- });
+ it("should fill in missing component (case 'a')", function() {
+ trace.b = [0.1, 0.3, 0.6];
+ trace.c = [0.8, 0.4, 0.1];
- it('should fill in missing component (case \'a\')', function() {
- trace.b = [0.1, 0.3, 0.6];
- trace.c = [0.8, 0.4, 0.1];
+ calc(gd, trace);
+ expect(trace.a).toBeCloseToArray([0.1, 0.3, 0.3]);
+ });
- calc(gd, trace);
- expect(trace.a).toBeCloseToArray([0.1, 0.3, 0.3]);
- });
+ it("should skip over non-numeric values", function() {
+ trace.a = [0.1, "a", 0.6];
+ trace.b = [0.1, 0.3, null];
+ trace.c = [8, 0.4, 0.1];
- it('should skip over non-numeric values', function() {
- trace.a = [0.1, 'a', 0.6];
- trace.b = [0.1, 0.3, null];
- trace.c = [8, 0.4, 0.1];
+ cd = calc(gd, trace);
- cd = calc(gd, trace);
+ expect(objectToArray(cd[0])).toBeCloseToArray([
+ 0.963414634,
+ 0.012195121,
+ 0.012195121,
+ 0.012195121,
+ 0.975609756
+ ]);
+ expect(cd[1]).toEqual({ x: false, y: false });
+ expect(cd[2]).toEqual({ x: false, y: false });
+ });
- expect(objectToArray(cd[0])).toBeCloseToArray([
- 0.963414634, 0.012195121, 0.012195121, 0.012195121, 0.975609756
- ]);
- expect(cd[1]).toEqual({ x: false, y: false });
- expect(cd[2]).toEqual({ x: false, y: false });
+ function objectToArray(obj) {
+ return Object.keys(obj).map(function(k) {
+ return obj[k];
});
-
- function objectToArray(obj) {
- return Object.keys(obj).map(function(k) {
- return obj[k];
- });
- }
-
+ }
});
-describe('scatterternary plot and hover', function() {
- 'use strict';
+describe("scatterternary plot and hover", function() {
+ "use strict";
+ var mock = require("@mocks/ternary_simple.json");
- var mock = require('@mocks/ternary_simple.json');
+ afterAll(destroyGraphDiv);
- afterAll(destroyGraphDiv);
+ beforeAll(function(done) {
+ var gd = createGraphDiv();
+ var mockCopy = Lib.extendDeep({}, mock);
- beforeAll(function(done) {
- var gd = createGraphDiv();
- var mockCopy = Lib.extendDeep({}, mock);
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
- });
-
- it('should put scatterternary trace in \'frontplot\' node', function() {
- var nodes = d3.select('.frontplot').selectAll('.scatter');
+ it("should put scatterternary trace in 'frontplot' node", function() {
+ var nodes = d3.select(".frontplot").selectAll(".scatter");
- expect(nodes.size()).toEqual(1);
- });
+ expect(nodes.size()).toEqual(1);
+ });
- it('should generate one line path per trace', function() {
- var nodes = d3.selectAll('path.js-line');
+ it("should generate one line path per trace", function() {
+ var nodes = d3.selectAll("path.js-line");
- expect(nodes.size()).toEqual(mock.data.length);
- });
+ expect(nodes.size()).toEqual(mock.data.length);
+ });
- it('should generate as many points as there are data points', function() {
- var nodes = d3.selectAll('path.point');
+ it("should generate as many points as there are data points", function() {
+ var nodes = d3.selectAll("path.point");
- expect(nodes.size()).toEqual(mock.data[0].a.length);
- });
+ expect(nodes.size()).toEqual(mock.data[0].a.length);
+ });
});
-describe('scatterternary hover', function() {
- 'use strict';
+describe("scatterternary hover", function() {
+ "use strict";
+ var hoverPoints = ScatterTernary.hoverPoints;
- var hoverPoints = ScatterTernary.hoverPoints;
+ var gd, pointData;
- var gd, pointData;
+ beforeAll(function(done) {
+ gd = createGraphDiv();
- beforeAll(function(done) {
- gd = createGraphDiv();
+ var data = [
+ {
+ type: "scatterternary",
+ a: [0.1, 0.2, 0.3],
+ b: [0.3, 0.2, 0.1],
+ c: [0.1, 0.4, 0.5]
+ }
+ ];
- var data = [{
- type: 'scatterternary',
- a: [0.1, 0.2, 0.3],
- b: [0.3, 0.2, 0.1],
- c: [0.1, 0.4, 0.5]
- }];
+ Plotly.plot(gd, data).then(done);
+ });
- Plotly.plot(gd, data).then(done);
- });
+ beforeEach(function() {
+ var cd = gd.calcdata, ternary = gd._fullLayout.ternary._subplot;
- beforeEach(function() {
- var cd = gd.calcdata,
- ternary = gd._fullLayout.ternary._subplot;
+ pointData = {
+ index: false,
+ distance: 20,
+ cd: cd[0],
+ trace: cd[0][0].trace,
+ xa: ternary.xaxis,
+ ya: ternary.yaxis
+ };
+ });
- pointData = {
- index: false,
- distance: 20,
- cd: cd[0],
- trace: cd[0][0].trace,
- xa: ternary.xaxis,
- ya: ternary.yaxis
- };
+ afterAll(destroyGraphDiv);
- });
-
- afterAll(destroyGraphDiv);
-
- it('should generate extra text field on hover', function() {
- var xval = 0.42,
- yval = 0.37,
- hovermode = 'closest';
+ it("should generate extra text field on hover", function() {
+ var xval = 0.42, yval = 0.37, hovermode = "closest";
- var scatterPointData = hoverPoints(pointData, xval, yval, hovermode);
+ var scatterPointData = hoverPoints(pointData, xval, yval, hovermode);
- expect(scatterPointData[0].extraText).toEqual(
- 'Component A: 0.3333333
Component B: 0.1111111
Component C: 0.5555556'
- );
-
- expect(scatterPointData[0].xLabelVal).toBeUndefined();
- expect(scatterPointData[0].yLabelVal).toBeUndefined();
- });
+ expect(scatterPointData[0].extraText).toEqual(
+ "Component A: 0.3333333
Component B: 0.1111111
Component C: 0.5555556"
+ );
+ expect(scatterPointData[0].xLabelVal).toBeUndefined();
+ expect(scatterPointData[0].yLabelVal).toBeUndefined();
+ });
});
diff --git a/test/jasmine/tests/search_test.js b/test/jasmine/tests/search_test.js
index 6b6b122c117..e44c3793439 100644
--- a/test/jasmine/tests/search_test.js
+++ b/test/jasmine/tests/search_test.js
@@ -1,37 +1,36 @@
-var Lib = require('@src/lib');
+var Lib = require("@src/lib");
-describe('Test search.js:', function() {
- 'use strict';
-
- describe('findBin', function() {
- it('should work on ascending arrays', function() {
- expect(Lib.findBin(-10000, [0, 1, 3])).toBe(-1);
- expect(Lib.findBin(0.5, [0, 1, 3])).toBe(0);
- expect(Lib.findBin(2, [0, 1, 3])).toBe(1);
- expect(Lib.findBin(10000, [0, 1, 3])).toBe(2);
- // default: linelow falsey, so the line is in the higher bin
- expect(Lib.findBin(1, [0, 1, 3])).toBe(1);
- // linelow truthy, so the line is in the lower bin
- expect(Lib.findBin(1, [0, 1, 3], true)).toBe(0);
- });
+describe("Test search.js:", function() {
+ "use strict";
+ describe("findBin", function() {
+ it("should work on ascending arrays", function() {
+ expect(Lib.findBin(-10000, [0, 1, 3])).toBe(-1);
+ expect(Lib.findBin(0.5, [0, 1, 3])).toBe(0);
+ expect(Lib.findBin(2, [0, 1, 3])).toBe(1);
+ expect(Lib.findBin(10000, [0, 1, 3])).toBe(2);
+ // default: linelow falsey, so the line is in the higher bin
+ expect(Lib.findBin(1, [0, 1, 3])).toBe(1);
+ // linelow truthy, so the line is in the lower bin
+ expect(Lib.findBin(1, [0, 1, 3], true)).toBe(0);
+ });
- it('should work on decending arrays', function() {
- expect(Lib.findBin(-10000, [3, 1, 0])).toBe(2);
- expect(Lib.findBin(0.5, [3, 1, 0])).toBe(1);
- expect(Lib.findBin(2, [3, 1, 0])).toBe(0);
- expect(Lib.findBin(10000, [3, 1, 0])).toBe(-1);
+ it("should work on decending arrays", function() {
+ expect(Lib.findBin(-10000, [3, 1, 0])).toBe(2);
+ expect(Lib.findBin(0.5, [3, 1, 0])).toBe(1);
+ expect(Lib.findBin(2, [3, 1, 0])).toBe(0);
+ expect(Lib.findBin(10000, [3, 1, 0])).toBe(-1);
- expect(Lib.findBin(1, [3, 1, 0])).toBe(0);
- expect(Lib.findBin(1, [3, 1, 0], true)).toBe(1);
- });
+ expect(Lib.findBin(1, [3, 1, 0])).toBe(0);
+ expect(Lib.findBin(1, [3, 1, 0], true)).toBe(1);
+ });
- it('should treat a length-1 array as ascending', function() {
- expect(Lib.findBin(-1, [0])).toBe(-1);
- expect(Lib.findBin(1, [0])).toBe(0);
+ it("should treat a length-1 array as ascending", function() {
+ expect(Lib.findBin(-1, [0])).toBe(-1);
+ expect(Lib.findBin(1, [0])).toBe(0);
- expect(Lib.findBin(0, [0])).toBe(0);
- expect(Lib.findBin(0, [0], true)).toBe(-1);
- });
- // TODO: didn't test bins as objects {start, stop, size}
+ expect(Lib.findBin(0, [0])).toBe(0);
+ expect(Lib.findBin(0, [0], true)).toBe(-1);
});
+ // TODO: didn't test bins as objects {start, stop, size}
+ });
});
diff --git a/test/jasmine/tests/select_test.js b/test/jasmine/tests/select_test.js
index f2be564a41d..917c55f5105 100644
--- a/test/jasmine/tests/select_test.js
+++ b/test/jasmine/tests/select_test.js
@@ -1,325 +1,289 @@
-var d3 = require('d3');
+var d3 = require("d3");
-var Plotly = require('@lib/index');
-var Lib = require('@src/lib');
-var doubleClick = require('../assets/double_click');
+var Plotly = require("@lib/index");
+var Lib = require("@src/lib");
+var doubleClick = require("../assets/double_click");
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var mouseEvent = require('../assets/mouse_event');
-var customMatchers = require('../assets/custom_matchers');
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var mouseEvent = require("../assets/mouse_event");
+var customMatchers = require("../assets/custom_matchers");
+describe("select box and lasso", function() {
+ var mock = require("@mocks/14.json");
-describe('select box and lasso', function() {
- var mock = require('@mocks/14.json');
+ var selectPath = [[93, 193], [143, 193]];
+ var lassoPath = [[316, 171], [318, 239], [335, 243], [328, 169]];
- var selectPath = [[93, 193], [143, 193]];
- var lassoPath = [[316, 171], [318, 239], [335, 243], [328, 169]];
+ beforeEach(function() {
+ jasmine.addMatchers(customMatchers);
+ });
- beforeEach(function() {
- jasmine.addMatchers(customMatchers);
- });
+ afterEach(destroyGraphDiv);
- afterEach(destroyGraphDiv);
+ function drag(path) {
+ var len = path.length;
- function drag(path) {
- var len = path.length;
+ mouseEvent("mousemove", path[0][0], path[0][1]);
+ mouseEvent("mousedown", path[0][0], path[0][1]);
- mouseEvent('mousemove', path[0][0], path[0][1]);
- mouseEvent('mousedown', path[0][0], path[0][1]);
+ path.slice(1, len).forEach(function(pt) {
+ mouseEvent("mousemove", pt[0], pt[1]);
+ });
- path.slice(1, len).forEach(function(pt) {
- mouseEvent('mousemove', pt[0], pt[1]);
- });
+ mouseEvent("mouseup", path[len - 1][0], path[len - 1][1]);
+ }
- mouseEvent('mouseup', path[len - 1][0], path[len - 1][1]);
- }
+ function assertRange(actual, expected) {
+ var PRECISION = 4;
- function assertRange(actual, expected) {
- var PRECISION = 4;
+ expect(actual.x).toBeCloseToArray(expected.x, PRECISION);
+ expect(actual.y).toBeCloseToArray(expected.y, PRECISION);
+ }
- expect(actual.x).toBeCloseToArray(expected.x, PRECISION);
- expect(actual.y).toBeCloseToArray(expected.y, PRECISION);
- }
+ describe("select elements", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
+ mockCopy.layout.dragmode = "select";
- describe('select elements', function() {
- var mockCopy = Lib.extendDeep({}, mock);
- mockCopy.layout.dragmode = 'select';
+ var gd;
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- var gd;
- beforeEach(function(done) {
- gd = createGraphDiv();
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- Plotly.plot(gd, mockCopy.data, mockCopy.layout)
- .then(done);
- });
+ it("should be appended to the zoom layer", function(done) {
+ var x0 = 100, y0 = 200, x1 = 150, y1 = 250, x2 = 50, y2 = 50;
- it('should be appended to the zoom layer', function(done) {
- var x0 = 100,
- y0 = 200,
- x1 = 150,
- y1 = 250,
- x2 = 50,
- y2 = 50;
-
- gd.once('plotly_selecting', function() {
- expect(d3.selectAll('.zoomlayer > .zoombox-corners').size())
- .toEqual(1);
- expect(d3.selectAll('.zoomlayer > .select-outline').size())
- .toEqual(2);
- });
-
- gd.once('plotly_selected', function() {
- expect(d3.selectAll('.zoomlayer > .zoombox-corners').size())
- .toEqual(0);
- expect(d3.selectAll('.zoomlayer > .select-outline').size())
- .toEqual(2);
- });
-
- gd.once('plotly_deselect', function() {
- expect(d3.selectAll('.zoomlayer > .select-outline').size())
- .toEqual(0);
- });
-
- mouseEvent('mousemove', x0, y0);
- expect(d3.selectAll('.zoomlayer > .zoombox-corners').size())
- .toEqual(0);
-
- drag([[x0, y0], [x1, y1]]);
-
- doubleClick(x2, y2).then(done);
- });
- });
+ gd.once("plotly_selecting", function() {
+ expect(d3.selectAll(".zoomlayer > .zoombox-corners").size()).toEqual(1);
+ expect(d3.selectAll(".zoomlayer > .select-outline").size()).toEqual(2);
+ });
- describe('lasso elements', function() {
- var mockCopy = Lib.extendDeep({}, mock);
- mockCopy.layout.dragmode = 'lasso';
+ gd.once("plotly_selected", function() {
+ expect(d3.selectAll(".zoomlayer > .zoombox-corners").size()).toEqual(0);
+ expect(d3.selectAll(".zoomlayer > .select-outline").size()).toEqual(2);
+ });
- var gd;
- beforeEach(function(done) {
- gd = createGraphDiv();
+ gd.once("plotly_deselect", function() {
+ expect(d3.selectAll(".zoomlayer > .select-outline").size()).toEqual(0);
+ });
- Plotly.plot(gd, mockCopy.data, mockCopy.layout)
- .then(done);
- });
+ mouseEvent("mousemove", x0, y0);
+ expect(d3.selectAll(".zoomlayer > .zoombox-corners").size()).toEqual(0);
- it('should be appended to the zoom layer', function(done) {
- var x0 = 100,
- y0 = 200,
- x1 = 150,
- y1 = 250,
- x2 = 50,
- y2 = 50;
-
- gd.once('plotly_selecting', function() {
- expect(d3.selectAll('.zoomlayer > .zoombox-corners').size())
- .toEqual(1);
- expect(d3.selectAll('.zoomlayer > .select-outline').size())
- .toEqual(2);
- });
-
- gd.once('plotly_selected', function() {
- expect(d3.selectAll('.zoomlayer > .zoombox-corners').size())
- .toEqual(0);
- expect(d3.selectAll('.zoomlayer > .select-outline').size())
- .toEqual(2);
- });
-
- gd.once('plotly_deselect', function() {
- expect(d3.selectAll('.zoomlayer > .select-outline').size())
- .toEqual(0);
- });
-
- mouseEvent('mousemove', x0, y0);
- expect(d3.selectAll('.zoomlayer > .zoombox-corners').size())
- .toEqual(0);
-
- drag([[x0, y0], [x1, y1]]);
-
- doubleClick(x2, y2).then(done);
- });
+ drag([[x0, y0], [x1, y1]]);
+
+ doubleClick(x2, y2).then(done);
});
+ });
- describe('select events', function() {
- var mockCopy = Lib.extendDeep({}, mock);
- mockCopy.layout.dragmode = 'select';
+ describe("lasso elements", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
+ mockCopy.layout.dragmode = "lasso";
- var gd;
- beforeEach(function(done) {
- gd = createGraphDiv();
+ var gd;
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- Plotly.plot(gd, mockCopy.data, mockCopy.layout)
- .then(done);
- });
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- it('should trigger selecting/selected/deselect events', function(done) {
- var selectingCnt = 0,
- selectingData;
- gd.on('plotly_selecting', function(data) {
- selectingCnt++;
- selectingData = data;
- });
-
- var selectedCnt = 0,
- selectedData;
- gd.on('plotly_selected', function(data) {
- selectedCnt++;
- selectedData = data;
- });
-
- var doubleClickData;
- gd.on('plotly_deselect', function(data) {
- doubleClickData = data;
- });
-
- drag(selectPath);
-
- expect(selectingCnt).toEqual(1, 'with the correct selecting count');
- expect(selectingData.points).toEqual([{
- curveNumber: 0,
- pointNumber: 0,
- x: 0.002,
- y: 16.25,
- id: undefined
- }, {
- curveNumber: 0,
- pointNumber: 1,
- x: 0.004,
- y: 12.5,
- id: undefined
- }], 'with the correct selecting points');
- assertRange(selectingData.range, {
- x: [0.002000, 0.0046236],
- y: [0.10209191961595454, 24.512223978291406]
- }, 'with the correct selecting range');
-
- expect(selectedCnt).toEqual(1, 'with the correct selected count');
- expect(selectedData.points).toEqual([{
- curveNumber: 0,
- pointNumber: 0,
- x: 0.002,
- y: 16.25,
- id: undefined
- }, {
- curveNumber: 0,
- pointNumber: 1,
- x: 0.004,
- y: 12.5,
- id: undefined
- }], 'with the correct selected points');
- assertRange(selectedData.range, {
- x: [0.002000, 0.0046236],
- y: [0.10209191961595454, 24.512223978291406]
- }, 'with the correct selected range');
-
- doubleClick(250, 200).then(function() {
- expect(doubleClickData).toBe(null, 'with the correct deselect data');
- done();
- });
- });
+ it("should be appended to the zoom layer", function(done) {
+ var x0 = 100, y0 = 200, x1 = 150, y1 = 250, x2 = 50, y2 = 50;
- });
+ gd.once("plotly_selecting", function() {
+ expect(d3.selectAll(".zoomlayer > .zoombox-corners").size()).toEqual(1);
+ expect(d3.selectAll(".zoomlayer > .select-outline").size()).toEqual(2);
+ });
- describe('lasso events', function() {
- var mockCopy = Lib.extendDeep({}, mock);
- mockCopy.layout.dragmode = 'lasso';
+ gd.once("plotly_selected", function() {
+ expect(d3.selectAll(".zoomlayer > .zoombox-corners").size()).toEqual(0);
+ expect(d3.selectAll(".zoomlayer > .select-outline").size()).toEqual(2);
+ });
- var gd;
- beforeEach(function(done) {
- gd = createGraphDiv();
+ gd.once("plotly_deselect", function() {
+ expect(d3.selectAll(".zoomlayer > .select-outline").size()).toEqual(0);
+ });
- Plotly.plot(gd, mockCopy.data, mockCopy.layout)
- .then(done);
- });
+ mouseEvent("mousemove", x0, y0);
+ expect(d3.selectAll(".zoomlayer > .zoombox-corners").size()).toEqual(0);
- it('should trigger selecting/selected/deselect events', function(done) {
- var selectingCnt = 0,
- selectingData;
- gd.on('plotly_selecting', function(data) {
- selectingCnt++;
- selectingData = data;
- });
-
- var selectedCnt = 0,
- selectedData;
- gd.on('plotly_selected', function(data) {
- selectedCnt++;
- selectedData = data;
- });
-
- var doubleClickData;
- gd.on('plotly_deselect', function(data) {
- doubleClickData = data;
- });
-
- drag(lassoPath);
-
- expect(selectingCnt).toEqual(3, 'with the correct selecting count');
- expect(selectingData.points).toEqual([{
- curveNumber: 0,
- pointNumber: 10,
- x: 0.099,
- y: 2.75,
- id: undefined
- }], 'with the correct selecting points');
-
- expect(selectedCnt).toEqual(1, 'with the correct selected count');
- expect(selectedData.points).toEqual([{
- curveNumber: 0,
- pointNumber: 10,
- x: 0.099,
- y: 2.75,
- id: undefined
- }], 'with the correct selected points');
-
- doubleClick(250, 200).then(function() {
- expect(doubleClickData).toBe(null, 'with the correct deselect data');
- done();
- });
- });
+ drag([[x0, y0], [x1, y1]]);
+
+ doubleClick(x2, y2).then(done);
});
+ });
+
+ describe("select events", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
+ mockCopy.layout.dragmode = "select";
- it('should skip over non-visible traces', function(done) {
- var mockCopy = Lib.extendDeep({}, mock);
- mockCopy.layout.dragmode = 'select';
+ var gd;
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- var gd = createGraphDiv();
- var selectedPtLength;
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
- gd.on('plotly_selected', function(data) {
- selectedPtLength = data.points.length;
- });
+ it("should trigger selecting/selected/deselect events", function(done) {
+ var selectingCnt = 0, selectingData;
+ gd.on("plotly_selecting", function(data) {
+ selectingCnt++;
+ selectingData = data;
+ });
+
+ var selectedCnt = 0, selectedData;
+ gd.on("plotly_selected", function(data) {
+ selectedCnt++;
+ selectedData = data;
+ });
+
+ var doubleClickData;
+ gd.on("plotly_deselect", function(data) {
+ doubleClickData = data;
+ });
+
+ drag(selectPath);
+
+ expect(selectingCnt).toEqual(1, "with the correct selecting count");
+ expect(selectingData.points).toEqual(
+ [
+ { curveNumber: 0, pointNumber: 0, x: 0.002, y: 16.25, id: undefined },
+ { curveNumber: 0, pointNumber: 1, x: 0.004, y: 12.5, id: undefined }
+ ],
+ "with the correct selecting points"
+ );
+ assertRange(
+ selectingData.range,
+ {
+ x: [0.002000, 0.0046236],
+ y: [0.10209191961595454, 24.512223978291406]
+ },
+ "with the correct selecting range"
+ );
+
+ expect(selectedCnt).toEqual(1, "with the correct selected count");
+ expect(selectedData.points).toEqual(
+ [
+ { curveNumber: 0, pointNumber: 0, x: 0.002, y: 16.25, id: undefined },
+ { curveNumber: 0, pointNumber: 1, x: 0.004, y: 12.5, id: undefined }
+ ],
+ "with the correct selected points"
+ );
+ assertRange(
+ selectedData.range,
+ {
+ x: [0.002000, 0.0046236],
+ y: [0.10209191961595454, 24.512223978291406]
+ },
+ "with the correct selected range"
+ );
+
+ doubleClick(250, 200).then(function() {
+ expect(doubleClickData).toBe(null, "with the correct deselect data");
+ done();
+ });
+ });
+ });
- drag(selectPath);
- expect(selectedPtLength).toEqual(2, '(case 0)');
+ describe("lasso events", function() {
+ var mockCopy = Lib.extendDeep({}, mock);
+ mockCopy.layout.dragmode = "lasso";
- return Plotly.restyle(gd, 'visible', 'legendonly');
- }).then(function() {
- drag(selectPath);
- expect(selectedPtLength).toEqual(0, '(legendonly case)');
+ var gd;
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- return Plotly.restyle(gd, 'visible', true);
- }).then(function() {
- drag(selectPath);
- expect(selectedPtLength).toEqual(2, '(back to case 0)');
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- return Plotly.relayout(gd, 'dragmode', 'lasso');
- }).then(function() {
- drag(lassoPath);
- expect(selectedPtLength).toEqual(1, '(case 0 lasso)');
+ it("should trigger selecting/selected/deselect events", function(done) {
+ var selectingCnt = 0, selectingData;
+ gd.on("plotly_selecting", function(data) {
+ selectingCnt++;
+ selectingData = data;
+ });
+
+ var selectedCnt = 0, selectedData;
+ gd.on("plotly_selected", function(data) {
+ selectedCnt++;
+ selectedData = data;
+ });
+
+ var doubleClickData;
+ gd.on("plotly_deselect", function(data) {
+ doubleClickData = data;
+ });
+
+ drag(lassoPath);
+
+ expect(selectingCnt).toEqual(3, "with the correct selecting count");
+ expect(selectingData.points).toEqual(
+ [{ curveNumber: 0, pointNumber: 10, x: 0.099, y: 2.75, id: undefined }],
+ "with the correct selecting points"
+ );
+
+ expect(selectedCnt).toEqual(1, "with the correct selected count");
+ expect(selectedData.points).toEqual(
+ [{ curveNumber: 0, pointNumber: 10, x: 0.099, y: 2.75, id: undefined }],
+ "with the correct selected points"
+ );
+
+ doubleClick(250, 200).then(function() {
+ expect(doubleClickData).toBe(null, "with the correct deselect data");
+ done();
+ });
+ });
+ });
- return Plotly.restyle(gd, 'visible', 'legendonly');
- }).then(function() {
- drag(lassoPath);
- expect(selectedPtLength).toEqual(0, '(lasso legendonly case)');
+ it("should skip over non-visible traces", function(done) {
+ var mockCopy = Lib.extendDeep({}, mock);
+ mockCopy.layout.dragmode = "select";
- return Plotly.restyle(gd, 'visible', true);
- }).then(function() {
- drag(lassoPath);
- expect(selectedPtLength).toEqual(1, '(back to lasso case 0)');
+ var gd = createGraphDiv();
+ var selectedPtLength;
- done();
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout)
+ .then(function() {
+ gd.on("plotly_selected", function(data) {
+ selectedPtLength = data.points.length;
});
- });
+
+ drag(selectPath);
+ expect(selectedPtLength).toEqual(2, "(case 0)");
+
+ return Plotly.restyle(gd, "visible", "legendonly");
+ })
+ .then(function() {
+ drag(selectPath);
+ expect(selectedPtLength).toEqual(0, "(legendonly case)");
+
+ return Plotly.restyle(gd, "visible", true);
+ })
+ .then(function() {
+ drag(selectPath);
+ expect(selectedPtLength).toEqual(2, "(back to case 0)");
+
+ return Plotly.relayout(gd, "dragmode", "lasso");
+ })
+ .then(function() {
+ drag(lassoPath);
+ expect(selectedPtLength).toEqual(1, "(case 0 lasso)");
+
+ return Plotly.restyle(gd, "visible", "legendonly");
+ })
+ .then(function() {
+ drag(lassoPath);
+ expect(selectedPtLength).toEqual(0, "(lasso legendonly case)");
+
+ return Plotly.restyle(gd, "visible", true);
+ })
+ .then(function() {
+ drag(lassoPath);
+ expect(selectedPtLength).toEqual(1, "(back to lasso case 0)");
+
+ done();
+ });
+ });
});
diff --git a/test/jasmine/tests/shapes_test.js b/test/jasmine/tests/shapes_test.js
index 43714ebd8df..9df3a7829b9 100644
--- a/test/jasmine/tests/shapes_test.js
+++ b/test/jasmine/tests/shapes_test.js
@@ -1,893 +1,884 @@
-var Shapes = require('@src/components/shapes');
-var helpers = require('@src/components/shapes/helpers');
-var constants = require('@src/components/shapes/constants');
+var Shapes = require("@src/components/shapes");
+var helpers = require("@src/components/shapes/helpers");
+var constants = require("@src/components/shapes/constants");
-var Plotly = require('@lib/index');
-var PlotlyInternal = require('@src/plotly');
-var Lib = require('@src/lib');
+var Plotly = require("@lib/index");
+var PlotlyInternal = require("@src/plotly");
+var Lib = require("@src/lib");
var Plots = PlotlyInternal.Plots;
var Axes = PlotlyInternal.Axes;
-var d3 = require('d3');
-var customMatchers = require('../assets/custom_matchers');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
+var d3 = require("d3");
+var customMatchers = require("../assets/custom_matchers");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+describe("Test shapes defaults:", function() {
+ "use strict";
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
-describe('Test shapes defaults:', function() {
- 'use strict';
+ function _supply(layoutIn, layoutOut) {
+ layoutOut = layoutOut || {};
+ layoutOut._has = Plots._hasPlotType.bind(layoutOut);
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
- });
-
- function _supply(layoutIn, layoutOut) {
- layoutOut = layoutOut || {};
- layoutOut._has = Plots._hasPlotType.bind(layoutOut);
+ Shapes.supplyLayoutDefaults(layoutIn, layoutOut);
- Shapes.supplyLayoutDefaults(layoutIn, layoutOut);
+ return layoutOut.shapes;
+ }
- return layoutOut.shapes;
- }
+ it("should skip non-array containers", function() {
+ [null, undefined, {}, "str", 0, false, true].forEach(function(cont) {
+ var msg = "- " + JSON.stringify(cont);
+ var layoutIn = { shapes: cont };
+ var out = _supply(layoutIn);
- it('should skip non-array containers', function() {
- [null, undefined, {}, 'str', 0, false, true].forEach(function(cont) {
- var msg = '- ' + JSON.stringify(cont);
- var layoutIn = { shapes: cont };
- var out = _supply(layoutIn);
-
- expect(layoutIn.shapes).toBe(cont, msg);
- expect(out).toEqual([], msg);
- });
+ expect(layoutIn.shapes).toBe(cont, msg);
+ expect(out).toEqual([], msg);
});
+ });
- it('should make non-object item visible: false', function() {
- var shapes = [null, undefined, [], 'str', 0, false, true];
- var layoutIn = { shapes: shapes };
- var out = _supply(layoutIn);
+ it("should make non-object item visible: false", function() {
+ var shapes = [null, undefined, [], "str", 0, false, true];
+ var layoutIn = { shapes: shapes };
+ var out = _supply(layoutIn);
- expect(layoutIn.shapes).toEqual(shapes);
+ expect(layoutIn.shapes).toEqual(shapes);
- out.forEach(function(item, i) {
- expect(item).toEqual({
- visible: false,
- _input: {},
- _index: i
- });
- });
+ out.forEach(function(item, i) {
+ expect(item).toEqual({ visible: false, _input: {}, _index: i });
});
+ });
- it('should provide the right defaults on all axis types', function() {
- var fullLayout = {
- xaxis: {type: 'linear', range: [0, 20]},
- yaxis: {type: 'log', range: [1, 5]},
- xaxis2: {type: 'date', range: ['2006-06-05', '2006-06-09']},
- yaxis2: {type: 'category', range: [-0.5, 7.5]}
- };
+ it("should provide the right defaults on all axis types", function() {
+ var fullLayout = {
+ xaxis: { type: "linear", range: [0, 20] },
+ yaxis: { type: "log", range: [1, 5] },
+ xaxis2: { type: "date", range: ["2006-06-05", "2006-06-09"] },
+ yaxis2: { type: "category", range: [-0.5, 7.5] }
+ };
- Axes.setConvert(fullLayout.xaxis);
- Axes.setConvert(fullLayout.yaxis);
- Axes.setConvert(fullLayout.xaxis2);
- Axes.setConvert(fullLayout.yaxis2);
+ Axes.setConvert(fullLayout.xaxis);
+ Axes.setConvert(fullLayout.yaxis);
+ Axes.setConvert(fullLayout.xaxis2);
+ Axes.setConvert(fullLayout.yaxis2);
- var shape1In = {type: 'rect'},
- shape2In = {type: 'circle', xref: 'x2', yref: 'y2'};
+ var shape1In = { type: "rect" },
+ shape2In = { type: "circle", xref: "x2", yref: "y2" };
- var layoutIn = {
- shapes: [shape1In, shape2In]
- };
+ var layoutIn = { shapes: [shape1In, shape2In] };
- _supply(layoutIn, fullLayout);
+ _supply(layoutIn, fullLayout);
- var shape1Out = fullLayout.shapes[0],
- shape2Out = fullLayout.shapes[1];
+ var shape1Out = fullLayout.shapes[0], shape2Out = fullLayout.shapes[1];
- // default positions are 1/4 and 3/4 of the full range of that axis
- expect(shape1Out.x0).toBe(5);
- expect(shape1Out.x1).toBe(15);
+ // default positions are 1/4 and 3/4 of the full range of that axis
+ expect(shape1Out.x0).toBe(5);
+ expect(shape1Out.x1).toBe(15);
- // shapes use data values for log axes (like everyone will in V2.0)
- expect(shape1Out.y0).toBeWithin(100, 0.001);
- expect(shape1Out.y1).toBeWithin(10000, 0.001);
+ // shapes use data values for log axes (like everyone will in V2.0)
+ expect(shape1Out.y0).toBeWithin(100, 0.001);
+ expect(shape1Out.y1).toBeWithin(10000, 0.001);
- // date strings also interpolate
- expect(shape2Out.x0).toBe('2006-06-06');
- expect(shape2Out.x1).toBe('2006-06-08');
+ // date strings also interpolate
+ expect(shape2Out.x0).toBe("2006-06-06");
+ expect(shape2Out.x1).toBe("2006-06-08");
- // categories must use serial numbers to get continuous values
- expect(shape2Out.y0).toBeWithin(1.5, 0.001);
- expect(shape2Out.y1).toBeWithin(5.5, 0.001);
- });
+ // categories must use serial numbers to get continuous values
+ expect(shape2Out.y0).toBeWithin(1.5, 0.001);
+ expect(shape2Out.y1).toBeWithin(5.5, 0.001);
+ });
});
-describe('Test shapes:', function() {
- 'use strict';
+describe("Test shapes:", function() {
+ "use strict";
+ var mock = require("@mocks/shapes.json");
+ var gd;
- var mock = require('@mocks/shapes.json');
- var gd;
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- beforeEach(function(done) {
- gd = createGraphDiv();
+ var mockData = Lib.extendDeep([], mock.data),
+ mockLayout = Lib.extendDeep({}, mock.layout);
- var mockData = Lib.extendDeep([], mock.data),
- mockLayout = Lib.extendDeep({}, mock.layout);
+ Plotly.plot(gd, mockData, mockLayout).then(done);
+ });
- Plotly.plot(gd, mockData, mockLayout).then(done);
- });
+ afterEach(destroyGraphDiv);
- afterEach(destroyGraphDiv);
+ function countShapesInLowerLayer() {
+ return gd._fullLayout.shapes.filter(isShapeInLowerLayer).length;
+ }
- function countShapesInLowerLayer() {
- return gd._fullLayout.shapes.filter(isShapeInLowerLayer).length;
- }
+ function countShapesInUpperLayer() {
+ return gd._fullLayout.shapes.filter(isShapeInUpperLayer).length;
+ }
- function countShapesInUpperLayer() {
- return gd._fullLayout.shapes.filter(isShapeInUpperLayer).length;
- }
+ function countShapesInSubplots() {
+ return gd._fullLayout.shapes.filter(isShapeInSubplot).length;
+ }
- function countShapesInSubplots() {
- return gd._fullLayout.shapes.filter(isShapeInSubplot).length;
- }
+ function isShapeInUpperLayer(shape) {
+ return shape.layer !== "below";
+ }
- function isShapeInUpperLayer(shape) {
- return shape.layer !== 'below';
- }
+ function isShapeInLowerLayer(shape) {
+ return shape.xref === "paper" &&
+ shape.yref === "paper" &&
+ !isShapeInUpperLayer(shape);
+ }
- function isShapeInLowerLayer(shape) {
- return (shape.xref === 'paper' && shape.yref === 'paper') &&
- !isShapeInUpperLayer(shape);
- }
+ function isShapeInSubplot(shape) {
+ return !isShapeInUpperLayer(shape) && !isShapeInLowerLayer(shape);
+ }
- function isShapeInSubplot(shape) {
- return !isShapeInUpperLayer(shape) && !isShapeInLowerLayer(shape);
- }
+ function countShapeLowerLayerNodes() {
+ return d3.selectAll(".layer-below > .shapelayer").size();
+ }
- function countShapeLowerLayerNodes() {
- return d3.selectAll('.layer-below > .shapelayer').size();
- }
+ function countShapeUpperLayerNodes() {
+ return d3.selectAll(".layer-above > .shapelayer").size();
+ }
- function countShapeUpperLayerNodes() {
- return d3.selectAll('.layer-above > .shapelayer').size();
- }
+ function countShapeLayerNodesInSubplots() {
+ return d3.selectAll(".layer-subplot").size();
+ }
- function countShapeLayerNodesInSubplots() {
- return d3.selectAll('.layer-subplot').size();
- }
+ function countSubplots(gd) {
+ return Object.keys(gd._fullLayout._plots || {}).length;
+ }
- function countSubplots(gd) {
- return Object.keys(gd._fullLayout._plots || {}).length;
- }
+ function countShapePathsInLowerLayer() {
+ return d3.selectAll(".layer-below > .shapelayer > path").size();
+ }
- function countShapePathsInLowerLayer() {
- return d3.selectAll('.layer-below > .shapelayer > path').size();
- }
+ function countShapePathsInUpperLayer() {
+ return d3.selectAll(".layer-above > .shapelayer > path").size();
+ }
- function countShapePathsInUpperLayer() {
- return d3.selectAll('.layer-above > .shapelayer > path').size();
- }
+ function countShapePathsInSubplots() {
+ return d3.selectAll(".layer-subplot > .shapelayer > path").size();
+ }
- function countShapePathsInSubplots() {
- return d3.selectAll('.layer-subplot > .shapelayer > path').size();
- }
-
- describe('*shapeLowerLayer*', function() {
- it('has one node', function() {
- expect(countShapeLowerLayerNodes()).toEqual(1);
- });
-
- it('has as many *path* nodes as shapes in the lower layer', function() {
- expect(countShapePathsInLowerLayer())
- .toEqual(countShapesInLowerLayer());
- });
-
- it('should be able to get relayout', function(done) {
- Plotly.relayout(gd, {height: 200, width: 400}).then(function() {
- expect(countShapeLowerLayerNodes()).toEqual(1);
- expect(countShapePathsInLowerLayer())
- .toEqual(countShapesInLowerLayer());
- }).then(done);
- });
+ describe("*shapeLowerLayer*", function() {
+ it("has one node", function() {
+ expect(countShapeLowerLayerNodes()).toEqual(1);
});
- describe('*shapeUpperLayer*', function() {
- it('has one node', function() {
- expect(countShapeUpperLayerNodes()).toEqual(1);
- });
-
- it('has as many *path* nodes as shapes in the upper layer', function() {
- expect(countShapePathsInUpperLayer())
- .toEqual(countShapesInUpperLayer());
- });
-
- it('should be able to get relayout', function(done) {
- Plotly.relayout(gd, {height: 200, width: 400}).then(function() {
- expect(countShapeUpperLayerNodes()).toEqual(1);
- expect(countShapePathsInUpperLayer())
- .toEqual(countShapesInUpperLayer());
- }).then(done);
- });
+ it("has as many *path* nodes as shapes in the lower layer", function() {
+ expect(countShapePathsInLowerLayer()).toEqual(countShapesInLowerLayer());
});
- describe('each *subplot*', function() {
- it('has one *shapelayer*', function() {
- expect(countShapeLayerNodesInSubplots())
- .toEqual(countSubplots(gd));
- });
-
- it('has as many *path* nodes as shapes in the subplot', function() {
- expect(countShapePathsInSubplots())
- .toEqual(countShapesInSubplots());
- });
-
- it('should be able to get relayout', function(done) {
- Plotly.relayout(gd, {height: 200, width: 400}).then(function() {
- expect(countShapeLayerNodesInSubplots())
- .toEqual(countSubplots(gd));
- expect(countShapePathsInSubplots())
- .toEqual(countShapesInSubplots());
- }).then(done);
- });
+ it("should be able to get relayout", function(done) {
+ Plotly.relayout(gd, { height: 200, width: 400 })
+ .then(function() {
+ expect(countShapeLowerLayerNodes()).toEqual(1);
+ expect(countShapePathsInLowerLayer()).toEqual(
+ countShapesInLowerLayer()
+ );
+ })
+ .then(done);
});
+ });
- function countShapes(gd) {
- return gd.layout.shapes ?
- gd.layout.shapes.length :
- 0;
- }
-
- function getLastShape(gd) {
- return gd.layout.shapes ?
- gd.layout.shapes[gd.layout.shapes.length - 1] :
- null;
- }
-
- function getRandomShape() {
- return {
- x0: Math.random(),
- y0: Math.random(),
- x1: Math.random(),
- y1: Math.random()
- };
- }
-
- describe('Plotly.relayout', function() {
- it('should be able to add a shape', function(done) {
- var pathCount = countShapePathsInUpperLayer();
- var index = countShapes(gd);
- var shape = getRandomShape();
-
- Plotly.relayout(gd, 'shapes[' + index + ']', shape).then(function() {
- expect(countShapePathsInUpperLayer()).toEqual(pathCount + 1);
- expect(getLastShape(gd)).toEqual(shape);
- expect(countShapes(gd)).toEqual(index + 1);
- }).then(done);
- });
-
- it('should be able to remove a shape', function(done) {
- var pathCount = countShapePathsInUpperLayer();
- var index = countShapes(gd);
- var shape = getRandomShape();
-
- Plotly.relayout(gd, 'shapes[' + index + ']', shape).then(function() {
- expect(countShapePathsInUpperLayer()).toEqual(pathCount + 1);
- expect(getLastShape(gd)).toEqual(shape);
- expect(countShapes(gd)).toEqual(index + 1);
-
- return Plotly.relayout(gd, 'shapes[' + index + ']', 'remove');
- })
- .then(function() {
- expect(countShapePathsInUpperLayer()).toEqual(pathCount);
- expect(countShapes(gd)).toEqual(index);
-
- return Plotly.relayout(gd, 'shapes[2].visible', false);
- })
- .then(function() {
- expect(countShapePathsInUpperLayer()).toEqual(pathCount - 1);
- expect(countShapes(gd)).toEqual(index);
-
- return Plotly.relayout(gd, 'shapes[1]', null);
- })
- .then(function() {
- expect(countShapePathsInUpperLayer()).toEqual(pathCount - 2);
- expect(countShapes(gd)).toEqual(index - 1);
- })
- .then(done);
- });
+ describe("*shapeUpperLayer*", function() {
+ it("has one node", function() {
+ expect(countShapeUpperLayerNodes()).toEqual(1);
+ });
- it('should be able to remove all shapes', function(done) {
- Plotly.relayout(gd, { shapes: [] }).then(function() {
- expect(countShapePathsInUpperLayer()).toEqual(0);
- expect(countShapePathsInLowerLayer()).toEqual(0);
- expect(countShapePathsInSubplots()).toEqual(0);
- }).then(done);
- });
+ it("has as many *path* nodes as shapes in the upper layer", function() {
+ expect(countShapePathsInUpperLayer()).toEqual(countShapesInUpperLayer());
+ });
- it('should be able to update a shape layer', function(done) {
- var index = countShapes(gd),
- astr = 'shapes[' + index + ']',
- shape = getRandomShape(),
- shapesInLowerLayer = countShapePathsInLowerLayer(),
- shapesInUpperLayer = countShapePathsInUpperLayer();
-
- shape.xref = 'paper';
- shape.yref = 'paper';
-
- Plotly.relayout(gd, astr, shape).then(function() {
- expect(countShapePathsInLowerLayer())
- .toEqual(shapesInLowerLayer);
- expect(countShapePathsInUpperLayer())
- .toEqual(shapesInUpperLayer + 1);
- expect(getLastShape(gd)).toEqual(shape);
- expect(countShapes(gd)).toEqual(index + 1);
- }).then(function() {
- shape.layer = 'below';
- Plotly.relayout(gd, astr + '.layer', shape.layer);
- }).then(function() {
- expect(countShapePathsInLowerLayer())
- .toEqual(shapesInLowerLayer + 1);
- expect(countShapePathsInUpperLayer())
- .toEqual(shapesInUpperLayer);
- expect(getLastShape(gd)).toEqual(shape);
- expect(countShapes(gd)).toEqual(index + 1);
- }).then(function() {
- shape.layer = 'above';
- Plotly.relayout(gd, astr + '.layer', shape.layer);
- }).then(function() {
- expect(countShapePathsInLowerLayer())
- .toEqual(shapesInLowerLayer);
- expect(countShapePathsInUpperLayer())
- .toEqual(shapesInUpperLayer + 1);
- expect(getLastShape(gd)).toEqual(shape);
- expect(countShapes(gd)).toEqual(index + 1);
- }).then(done);
- });
+ it("should be able to get relayout", function(done) {
+ Plotly.relayout(gd, { height: 200, width: 400 })
+ .then(function() {
+ expect(countShapeUpperLayerNodes()).toEqual(1);
+ expect(countShapePathsInUpperLayer()).toEqual(
+ countShapesInUpperLayer()
+ );
+ })
+ .then(done);
});
-});
+ });
-describe('shapes autosize', function() {
- 'use strict';
+ describe("each *subplot*", function() {
+ it("has one *shapelayer*", function() {
+ expect(countShapeLayerNodesInSubplots()).toEqual(countSubplots(gd));
+ });
- var gd;
+ it("has as many *path* nodes as shapes in the subplot", function() {
+ expect(countShapePathsInSubplots()).toEqual(countShapesInSubplots());
+ });
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
+ it("should be able to get relayout", function(done) {
+ Plotly.relayout(gd, { height: 200, width: 400 })
+ .then(function() {
+ expect(countShapeLayerNodesInSubplots()).toEqual(countSubplots(gd));
+ expect(countShapePathsInSubplots()).toEqual(countShapesInSubplots());
+ })
+ .then(done);
+ });
+ });
+
+ function countShapes(gd) {
+ return gd.layout.shapes ? gd.layout.shapes.length : 0;
+ }
+
+ function getLastShape(gd) {
+ return gd.layout.shapes
+ ? gd.layout.shapes[gd.layout.shapes.length - 1]
+ : null;
+ }
+
+ function getRandomShape() {
+ return {
+ x0: Math.random(),
+ y0: Math.random(),
+ x1: Math.random(),
+ y1: Math.random()
+ };
+ }
+
+ describe("Plotly.relayout", function() {
+ it("should be able to add a shape", function(done) {
+ var pathCount = countShapePathsInUpperLayer();
+ var index = countShapes(gd);
+ var shape = getRandomShape();
+
+ Plotly.relayout(gd, "shapes[" + index + "]", shape)
+ .then(function() {
+ expect(countShapePathsInUpperLayer()).toEqual(pathCount + 1);
+ expect(getLastShape(gd)).toEqual(shape);
+ expect(countShapes(gd)).toEqual(index + 1);
+ })
+ .then(done);
});
- afterEach(destroyGraphDiv);
-
- it('should adapt to relayout calls', function(done) {
- gd = createGraphDiv();
-
- var mock = {
- data: [{}],
- layout: {
- shapes: [{
- type: 'line',
- x0: 0,
- y0: 0,
- x1: 1,
- y1: 1
- }, {
- type: 'line',
- x0: 0,
- y0: 0,
- x1: 2,
- y1: 2
- }]
- }
- };
-
- function assertRanges(x, y) {
- var fullLayout = gd._fullLayout;
- var PREC = 1;
-
- expect(fullLayout.xaxis.range).toBeCloseToArray(x, PREC, '- xaxis');
- expect(fullLayout.yaxis.range).toBeCloseToArray(y, PREC, '- yaxis');
- }
+ it("should be able to remove a shape", function(done) {
+ var pathCount = countShapePathsInUpperLayer();
+ var index = countShapes(gd);
+ var shape = getRandomShape();
- Plotly.plot(gd, mock).then(function() {
- assertRanges([0, 2], [0, 2]);
+ Plotly.relayout(gd, "shapes[" + index + "]", shape)
+ .then(function() {
+ expect(countShapePathsInUpperLayer()).toEqual(pathCount + 1);
+ expect(getLastShape(gd)).toEqual(shape);
+ expect(countShapes(gd)).toEqual(index + 1);
- return Plotly.relayout(gd, { 'shapes[1].visible': false });
+ return Plotly.relayout(gd, "shapes[" + index + "]", "remove");
})
.then(function() {
- assertRanges([0, 1], [0, 1]);
+ expect(countShapePathsInUpperLayer()).toEqual(pathCount);
+ expect(countShapes(gd)).toEqual(index);
- return Plotly.relayout(gd, { 'shapes[1].visible': true });
+ return Plotly.relayout(gd, "shapes[2].visible", false);
})
.then(function() {
- assertRanges([0, 2], [0, 2]);
+ expect(countShapePathsInUpperLayer()).toEqual(pathCount - 1);
+ expect(countShapes(gd)).toEqual(index);
- return Plotly.relayout(gd, { 'shapes[0].x1': 3 });
+ return Plotly.relayout(gd, "shapes[1]", null);
})
.then(function() {
- assertRanges([0, 3], [0, 2]);
+ expect(countShapePathsInUpperLayer()).toEqual(pathCount - 2);
+ expect(countShapes(gd)).toEqual(index - 1);
})
.then(done);
});
-});
-describe('Test shapes: a plot with shapes and an overlaid axis', function() {
- 'use strict';
-
- var gd, data, layout;
-
- beforeEach(function() {
- gd = createGraphDiv();
-
- data = [{
- 'y': [1934.5, 1932.3, 1930.3],
- 'x': ['1947-01-01', '1947-04-01', '1948-07-01'],
- 'type': 'scatter'
- }];
-
- layout = {
- 'yaxis': {
- 'type': 'linear'
- },
- 'xaxis': {
- 'type': 'date'
- },
- 'yaxis2': {
- 'side': 'right',
- 'overlaying': 'y'
- },
- 'shapes': [{
- 'fillcolor': '#ccc',
- 'type': 'rect',
- 'x0': '1947-01-01',
- 'x1': '1947-04-01',
- 'xref': 'x',
- 'y0': 0,
- 'y1': 1,
- 'yref': 'paper',
- 'layer': 'below'
- }]
- };
+ it("should be able to remove all shapes", function(done) {
+ Plotly.relayout(gd, { shapes: [] })
+ .then(function() {
+ expect(countShapePathsInUpperLayer()).toEqual(0);
+ expect(countShapePathsInLowerLayer()).toEqual(0);
+ expect(countShapePathsInSubplots()).toEqual(0);
+ })
+ .then(done);
});
- afterEach(destroyGraphDiv);
+ it("should be able to update a shape layer", function(done) {
+ var index = countShapes(gd),
+ astr = "shapes[" + index + "]",
+ shape = getRandomShape(),
+ shapesInLowerLayer = countShapePathsInLowerLayer(),
+ shapesInUpperLayer = countShapePathsInUpperLayer();
- it('should not throw an exception', function(done) {
- Plotly.plot(gd, data, layout).then(done);
+ shape.xref = "paper";
+ shape.yref = "paper";
+
+ Plotly.relayout(gd, astr, shape)
+ .then(function() {
+ expect(countShapePathsInLowerLayer()).toEqual(shapesInLowerLayer);
+ expect(countShapePathsInUpperLayer()).toEqual(shapesInUpperLayer + 1);
+ expect(getLastShape(gd)).toEqual(shape);
+ expect(countShapes(gd)).toEqual(index + 1);
+ })
+ .then(function() {
+ shape.layer = "below";
+ Plotly.relayout(gd, astr + ".layer", shape.layer);
+ })
+ .then(function() {
+ expect(countShapePathsInLowerLayer()).toEqual(shapesInLowerLayer + 1);
+ expect(countShapePathsInUpperLayer()).toEqual(shapesInUpperLayer);
+ expect(getLastShape(gd)).toEqual(shape);
+ expect(countShapes(gd)).toEqual(index + 1);
+ })
+ .then(function() {
+ shape.layer = "above";
+ Plotly.relayout(gd, astr + ".layer", shape.layer);
+ })
+ .then(function() {
+ expect(countShapePathsInLowerLayer()).toEqual(shapesInLowerLayer);
+ expect(countShapePathsInUpperLayer()).toEqual(shapesInUpperLayer + 1);
+ expect(getLastShape(gd)).toEqual(shape);
+ expect(countShapes(gd)).toEqual(index + 1);
+ })
+ .then(done);
});
+ });
});
-describe('Test shapes', function() {
- 'use strict';
+describe("shapes autosize", function() {
+ "use strict";
+ var gd;
- var gd, data, layout, config;
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
- beforeEach(function() {
- gd = createGraphDiv();
- data = [{}];
- layout = {};
- config = {
- editable: true,
- displayModeBar: false
- };
- });
+ afterEach(destroyGraphDiv);
- afterEach(destroyGraphDiv);
+ it("should adapt to relayout calls", function(done) {
+ gd = createGraphDiv();
- var testCases = [
- // xref: 'paper', yref: 'paper'
- {
- title: 'linked to paper'
- },
+ var mock = {
+ data: [{}],
+ layout: {
+ shapes: [
+ { type: "line", x0: 0, y0: 0, x1: 1, y1: 1 },
+ { type: "line", x0: 0, y0: 0, x1: 2, y1: 2 }
+ ]
+ }
+ };
- // xaxis.type: 'linear', yaxis.type: 'log'
- {
- title: 'linked to linear and log axes',
- xaxis: { type: 'linear', range: [0, 10] },
- yaxis: { type: 'log', range: [Math.log10(1), Math.log10(1000)] }
- },
+ function assertRanges(x, y) {
+ var fullLayout = gd._fullLayout;
+ var PREC = 1;
- // xaxis.type: 'date', yaxis.type: 'category'
- {
- title: 'linked to date and category axes',
- xaxis: {
- type: 'date',
- range: ['2000-01-01', '2000-02-02']
- },
- yaxis: { type: 'category', range: ['a', 'b'] }
- }
- ];
+ expect(fullLayout.xaxis.range).toBeCloseToArray(x, PREC, "- xaxis");
+ expect(fullLayout.yaxis.range).toBeCloseToArray(y, PREC, "- yaxis");
+ }
- testCases.forEach(function(testCase) {
- it(testCase.title + 'should be draggable', function(done) {
- setupLayout(testCase);
- testDragEachShape(done);
- });
- });
+ Plotly.plot(gd, mock)
+ .then(function() {
+ assertRanges([0, 2], [0, 2]);
+
+ return Plotly.relayout(gd, { "shapes[1].visible": false });
+ })
+ .then(function() {
+ assertRanges([0, 1], [0, 1]);
+
+ return Plotly.relayout(gd, { "shapes[1].visible": true });
+ })
+ .then(function() {
+ assertRanges([0, 2], [0, 2]);
+
+ return Plotly.relayout(gd, { "shapes[0].x1": 3 });
+ })
+ .then(function() {
+ assertRanges([0, 3], [0, 2]);
+ })
+ .then(done);
+ });
+});
- testCases.forEach(function(testCase) {
- ['n', 's', 'w', 'e', 'nw', 'se', 'ne', 'sw'].forEach(function(direction) {
- var testTitle = testCase.title +
- 'should be resizeable over direction ' +
- direction;
- it(testTitle, function(done) {
- setupLayout(testCase);
- testResizeEachShape(direction, done);
- });
- });
- });
+describe("Test shapes: a plot with shapes and an overlaid axis", function() {
+ "use strict";
+ var gd, data, layout;
- function setupLayout(testCase) {
- Lib.extendDeep(layout, testCase);
-
- var xrange = testCase.xaxis ? testCase.xaxis.range : [0.25, 0.75],
- yrange = testCase.yaxis ? testCase.yaxis.range : [0.25, 0.75],
- xref = testCase.xaxis ? 'x' : 'paper',
- yref = testCase.yaxis ? 'y' : 'paper',
- x0 = xrange[0],
- x1 = xrange[1],
- y0 = yrange[0],
- y1 = yrange[1];
-
- if(testCase.xaxis && testCase.xaxis.type === 'log') {
- x0 = Math.pow(10, x0);
- x1 = Math.pow(10, x1);
- }
+ beforeEach(function() {
+ gd = createGraphDiv();
- if(testCase.yaxis && testCase.yaxis.type === 'log') {
- y0 = Math.pow(10, y0);
- y1 = Math.pow(10, y1);
- }
+ data = [
+ {
+ y: [1934.5, 1932.3, 1930.3],
+ x: ["1947-01-01", "1947-04-01", "1948-07-01"],
+ type: "scatter"
+ }
+ ];
- if(testCase.xaxis && testCase.xaxis.type === 'category') {
- x0 = 0;
- x1 = 1;
+ layout = {
+ yaxis: { type: "linear" },
+ xaxis: { type: "date" },
+ yaxis2: { side: "right", overlaying: "y" },
+ shapes: [
+ {
+ fillcolor: "#ccc",
+ type: "rect",
+ x0: "1947-01-01",
+ x1: "1947-04-01",
+ xref: "x",
+ y0: 0,
+ y1: 1,
+ yref: "paper",
+ layer: "below"
}
+ ]
+ };
+ });
- if(testCase.yaxis && testCase.yaxis.type === 'category') {
- y0 = 0;
- y1 = 1;
- }
+ afterEach(destroyGraphDiv);
- var x0y0 = x0 + ',' + y0,
- x1y1 = x1 + ',' + y1,
- x1y0 = x1 + ',' + y0;
-
- var layoutShapes = [
- { type: 'line' },
- { type: 'rect' },
- { type: 'circle' },
- {} // path
- ];
-
- layoutShapes.forEach(function(s) {
- s.xref = xref;
- s.yref = yref;
-
- if(s.type) {
- s.x0 = x0;
- s.x1 = x1;
- s.y0 = y0;
- s.y1 = y1;
- }
- else {
- s.path = 'M' + x0y0 + 'L' + x1y1 + 'L' + x1y0 + 'Z';
- }
- });
+ it("should not throw an exception", function(done) {
+ Plotly.plot(gd, data, layout).then(done);
+ });
+});
- layout.shapes = layoutShapes;
+describe("Test shapes", function() {
+ "use strict";
+ var gd, data, layout, config;
+
+ beforeEach(function() {
+ gd = createGraphDiv();
+ data = [{}];
+ layout = {};
+ config = { editable: true, displayModeBar: false };
+ });
+
+ afterEach(destroyGraphDiv);
+
+ var testCases = [
+ // xref: 'paper', yref: 'paper'
+ { title: "linked to paper" },
+ // xaxis.type: 'linear', yaxis.type: 'log'
+ {
+ title: "linked to linear and log axes",
+ xaxis: { type: "linear", range: [0, 10] },
+ yaxis: { type: "log", range: [Math.log10(1), Math.log10(1000)] }
+ },
+ // xaxis.type: 'date', yaxis.type: 'category'
+ {
+ title: "linked to date and category axes",
+ xaxis: { type: "date", range: ["2000-01-01", "2000-02-02"] },
+ yaxis: { type: "category", range: ["a", "b"] }
}
+ ];
- function testDragEachShape(done) {
- var promise = Plotly.plot(gd, data, layout, config);
-
- var layoutShapes = gd.layout.shapes;
-
- expect(layoutShapes.length).toBe(4); // line, rect, circle and path
-
- layoutShapes.forEach(function(layoutShape, index) {
- var dx = 100,
- dy = 100;
- promise = promise.then(function() {
- var node = getShapeNode(index);
- expect(node).not.toBe(null);
-
- return (layoutShape.path) ?
- testPathDrag(dx, dy, layoutShape, node) :
- testShapeDrag(dx, dy, layoutShape, node);
- });
- });
-
- return promise.then(done);
+ testCases.forEach(function(testCase) {
+ it(testCase.title + "should be draggable", function(done) {
+ setupLayout(testCase);
+ testDragEachShape(done);
+ });
+ });
+
+ testCases.forEach(function(testCase) {
+ ["n", "s", "w", "e", "nw", "se", "ne", "sw"].forEach(function(direction) {
+ var testTitle = testCase.title +
+ "should be resizeable over direction " +
+ direction;
+ it(testTitle, function(done) {
+ setupLayout(testCase);
+ testResizeEachShape(direction, done);
+ });
+ });
+ });
+
+ function setupLayout(testCase) {
+ Lib.extendDeep(layout, testCase);
+
+ var xrange = testCase.xaxis ? testCase.xaxis.range : [0.25, 0.75],
+ yrange = testCase.yaxis ? testCase.yaxis.range : [0.25, 0.75],
+ xref = testCase.xaxis ? "x" : "paper",
+ yref = testCase.yaxis ? "y" : "paper",
+ x0 = xrange[0],
+ x1 = xrange[1],
+ y0 = yrange[0],
+ y1 = yrange[1];
+
+ if (testCase.xaxis && testCase.xaxis.type === "log") {
+ x0 = Math.pow(10, x0);
+ x1 = Math.pow(10, x1);
}
- function testResizeEachShape(direction, done) {
- var promise = Plotly.plot(gd, data, layout, config);
-
- var layoutShapes = gd.layout.shapes;
-
- expect(layoutShapes.length).toBe(4); // line, rect, circle and path
-
- var dxToShrinkWidth = {
- n: 0, s: 0, w: 10, e: -10, nw: 10, se: -10, ne: -10, sw: 10
- },
- dyToShrinkHeight = {
- n: 10, s: -10, w: 0, e: 0, nw: 10, se: -10, ne: 10, sw: -10
- };
- layoutShapes.forEach(function(layoutShape, index) {
- if(layoutShape.path) return;
-
- var dx = dxToShrinkWidth[direction],
- dy = dyToShrinkHeight[direction];
-
- promise = promise.then(function() {
- var node = getShapeNode(index);
- expect(node).not.toBe(null);
-
- return testShapeResize(direction, dx, dy, layoutShape, node);
- });
-
- promise = promise.then(function() {
- var node = getShapeNode(index);
- expect(node).not.toBe(null);
-
- return testShapeResize(direction, -dx, -dy, layoutShape, node);
- });
- });
-
- return promise.then(done);
+ if (testCase.yaxis && testCase.yaxis.type === "log") {
+ y0 = Math.pow(10, y0);
+ y1 = Math.pow(10, y1);
}
- function getShapeNode(index) {
- return d3.selectAll('.shapelayer path').filter(function() {
- return +this.getAttribute('data-index') === index;
- }).node();
+ if (testCase.xaxis && testCase.xaxis.type === "category") {
+ x0 = 0;
+ x1 = 1;
}
- function testShapeDrag(dx, dy, layoutShape, node) {
- var xa = Axes.getFromId(gd, layoutShape.xref),
- ya = Axes.getFromId(gd, layoutShape.yref),
- x2p = helpers.getDataToPixel(gd, xa),
- y2p = helpers.getDataToPixel(gd, ya, true);
-
- var initialCoordinates = getShapeCoordinates(layoutShape, x2p, y2p);
-
- return drag(node, dx, dy).then(function() {
- var finalCoordinates = getShapeCoordinates(layoutShape, x2p, y2p);
-
- expect(finalCoordinates.x0 - initialCoordinates.x0).toBeCloseTo(dx);
- expect(finalCoordinates.x1 - initialCoordinates.x1).toBeCloseTo(dx);
- expect(finalCoordinates.y0 - initialCoordinates.y0).toBeCloseTo(dy);
- expect(finalCoordinates.y1 - initialCoordinates.y1).toBeCloseTo(dy);
- });
+ if (testCase.yaxis && testCase.yaxis.type === "category") {
+ y0 = 0;
+ y1 = 1;
}
- function getShapeCoordinates(layoutShape, x2p, y2p) {
- return {
- x0: x2p(layoutShape.x0),
- x1: x2p(layoutShape.x1),
- y0: y2p(layoutShape.y0),
- y1: y2p(layoutShape.y1)
- };
- }
+ var x0y0 = x0 + "," + y0, x1y1 = x1 + "," + y1, x1y0 = x1 + "," + y0;
- function testPathDrag(dx, dy, layoutShape, node) {
- var xa = Axes.getFromId(gd, layoutShape.xref),
- ya = Axes.getFromId(gd, layoutShape.yref),
- x2p = helpers.getDataToPixel(gd, xa),
- y2p = helpers.getDataToPixel(gd, ya, true);
+ var layoutShapes = [
+ { type: "line" },
+ { type: "rect" },
+ { type: "circle" },
+ // path
+ {}
+ ];
- var initialPath = layoutShape.path,
- initialCoordinates = getPathCoordinates(initialPath, x2p, y2p);
+ layoutShapes.forEach(function(s) {
+ s.xref = xref;
+ s.yref = yref;
+
+ if (s.type) {
+ s.x0 = x0;
+ s.x1 = x1;
+ s.y0 = y0;
+ s.y1 = y1;
+ } else {
+ s.path = "M" + x0y0 + "L" + x1y1 + "L" + x1y0 + "Z";
+ }
+ });
- expect(initialCoordinates.length).toBe(6);
+ layout.shapes = layoutShapes;
+ }
- return drag(node, dx, dy).then(function() {
- var finalPath = layoutShape.path,
- finalCoordinates = getPathCoordinates(finalPath, x2p, y2p);
+ function testDragEachShape(done) {
+ var promise = Plotly.plot(gd, data, layout, config);
- expect(finalCoordinates.length).toBe(initialCoordinates.length);
+ var layoutShapes = gd.layout.shapes;
- for(var i = 0; i < initialCoordinates.length; i++) {
- var initialCoordinate = initialCoordinates[i],
- finalCoordinate = finalCoordinates[i];
+ expect(layoutShapes.length).toBe(4);
- if(initialCoordinate.x) {
- expect(finalCoordinate.x - initialCoordinate.x)
- .toBeCloseTo(dx);
- }
- else {
- expect(finalCoordinate.y - initialCoordinate.y)
- .toBeCloseTo(dy);
- }
- }
- });
- }
+ // line, rect, circle and path
+ layoutShapes.forEach(function(layoutShape, index) {
+ var dx = 100, dy = 100;
+ promise = promise.then(function() {
+ var node = getShapeNode(index);
+ expect(node).not.toBe(null);
- function testShapeResize(direction, dx, dy, layoutShape, node) {
- var xa = Axes.getFromId(gd, layoutShape.xref),
- ya = Axes.getFromId(gd, layoutShape.yref),
- x2p = helpers.getDataToPixel(gd, xa),
- y2p = helpers.getDataToPixel(gd, ya, true);
-
- var initialCoordinates = getShapeCoordinates(layoutShape, x2p, y2p);
-
- return resize(direction, node, dx, dy).then(function() {
- var finalCoordinates = getShapeCoordinates(layoutShape, x2p, y2p);
-
- var keyN, keyS, keyW, keyE;
- if(initialCoordinates.y0 < initialCoordinates.y1) {
- keyN = 'y0'; keyS = 'y1';
- }
- else {
- keyN = 'y1'; keyS = 'y0';
- }
- if(initialCoordinates.x0 < initialCoordinates.x1) {
- keyW = 'x0'; keyE = 'x1';
- }
- else {
- keyW = 'x1'; keyE = 'x0';
- }
-
- if(~direction.indexOf('n')) {
- expect(finalCoordinates[keyN] - initialCoordinates[keyN])
- .toBeCloseTo(dy);
- }
- else if(~direction.indexOf('s')) {
- expect(finalCoordinates[keyS] - initialCoordinates[keyS])
- .toBeCloseTo(dy);
- }
-
- if(~direction.indexOf('w')) {
- expect(finalCoordinates[keyW] - initialCoordinates[keyW])
- .toBeCloseTo(dx);
- }
- else if(~direction.indexOf('e')) {
- expect(finalCoordinates[keyE] - initialCoordinates[keyE])
- .toBeCloseTo(dx);
- }
- });
- }
+ return layoutShape.path
+ ? testPathDrag(dx, dy, layoutShape, node)
+ : testShapeDrag(dx, dy, layoutShape, node);
+ });
+ });
+
+ return promise.then(done);
+ }
+
+ function testResizeEachShape(direction, done) {
+ var promise = Plotly.plot(gd, data, layout, config);
+
+ var layoutShapes = gd.layout.shapes;
+
+ expect(layoutShapes.length).toBe(4);
+
+ // line, rect, circle and path
+ var dxToShrinkWidth = {
+ n: 0,
+ s: 0,
+ w: 10,
+ e: -10,
+ nw: 10,
+ se: -10,
+ ne: -10,
+ sw: 10
+ },
+ dyToShrinkHeight = {
+ n: 10,
+ s: -10,
+ w: 0,
+ e: 0,
+ nw: 10,
+ se: -10,
+ ne: 10,
+ sw: -10
+ };
+ layoutShapes.forEach(function(layoutShape, index) {
+ if (layoutShape.path) return;
+
+ var dx = dxToShrinkWidth[direction], dy = dyToShrinkHeight[direction];
+
+ promise = promise.then(function() {
+ var node = getShapeNode(index);
+ expect(node).not.toBe(null);
+
+ return testShapeResize(direction, dx, dy, layoutShape, node);
+ });
+
+ promise = promise.then(function() {
+ var node = getShapeNode(index);
+ expect(node).not.toBe(null);
+
+ return testShapeResize(direction, -dx, -dy, layoutShape, node);
+ });
+ });
- function getPathCoordinates(pathString, x2p, y2p) {
- var coordinates = [];
-
- pathString.match(constants.segmentRE).forEach(function(segment) {
- var paramNumber = 0,
- segmentType = segment.charAt(0),
- xParams = constants.paramIsX[segmentType],
- yParams = constants.paramIsY[segmentType],
- nParams = constants.numParams[segmentType],
- params = segment.substr(1).match(constants.paramRE);
-
- if(params) {
- params.forEach(function(param) {
- if(paramNumber >= nParams) return;
-
- if(xParams[paramNumber]) {
- coordinates.push({ x: x2p(param) });
- }
- else if(yParams[paramNumber]) {
- coordinates.push({ y: y2p(param) });
- }
-
- paramNumber++;
- });
- }
+ return promise.then(done);
+ }
+
+ function getShapeNode(index) {
+ return d3
+ .selectAll(".shapelayer path")
+ .filter(function() {
+ return +this.getAttribute("data-index") === index;
+ })
+ .node();
+ }
+
+ function testShapeDrag(dx, dy, layoutShape, node) {
+ var xa = Axes.getFromId(gd, layoutShape.xref),
+ ya = Axes.getFromId(gd, layoutShape.yref),
+ x2p = helpers.getDataToPixel(gd, xa),
+ y2p = helpers.getDataToPixel(gd, ya, true);
+
+ var initialCoordinates = getShapeCoordinates(layoutShape, x2p, y2p);
+
+ return drag(node, dx, dy).then(function() {
+ var finalCoordinates = getShapeCoordinates(layoutShape, x2p, y2p);
+
+ expect(finalCoordinates.x0 - initialCoordinates.x0).toBeCloseTo(dx);
+ expect(finalCoordinates.x1 - initialCoordinates.x1).toBeCloseTo(dx);
+ expect(finalCoordinates.y0 - initialCoordinates.y0).toBeCloseTo(dy);
+ expect(finalCoordinates.y1 - initialCoordinates.y1).toBeCloseTo(dy);
+ });
+ }
+
+ function getShapeCoordinates(layoutShape, x2p, y2p) {
+ return {
+ x0: x2p(layoutShape.x0),
+ x1: x2p(layoutShape.x1),
+ y0: y2p(layoutShape.y0),
+ y1: y2p(layoutShape.y1)
+ };
+ }
+
+ function testPathDrag(dx, dy, layoutShape, node) {
+ var xa = Axes.getFromId(gd, layoutShape.xref),
+ ya = Axes.getFromId(gd, layoutShape.yref),
+ x2p = helpers.getDataToPixel(gd, xa),
+ y2p = helpers.getDataToPixel(gd, ya, true);
+
+ var initialPath = layoutShape.path,
+ initialCoordinates = getPathCoordinates(initialPath, x2p, y2p);
+
+ expect(initialCoordinates.length).toBe(6);
+
+ return drag(node, dx, dy).then(function() {
+ var finalPath = layoutShape.path,
+ finalCoordinates = getPathCoordinates(finalPath, x2p, y2p);
+
+ expect(finalCoordinates.length).toBe(initialCoordinates.length);
+
+ for (var i = 0; i < initialCoordinates.length; i++) {
+ var initialCoordinate = initialCoordinates[i],
+ finalCoordinate = finalCoordinates[i];
+
+ if (initialCoordinate.x) {
+ expect(finalCoordinate.x - initialCoordinate.x).toBeCloseTo(dx);
+ } else {
+ expect(finalCoordinate.y - initialCoordinate.y).toBeCloseTo(dy);
+ }
+ }
+ });
+ }
+
+ function testShapeResize(direction, dx, dy, layoutShape, node) {
+ var xa = Axes.getFromId(gd, layoutShape.xref),
+ ya = Axes.getFromId(gd, layoutShape.yref),
+ x2p = helpers.getDataToPixel(gd, xa),
+ y2p = helpers.getDataToPixel(gd, ya, true);
+
+ var initialCoordinates = getShapeCoordinates(layoutShape, x2p, y2p);
+
+ return resize(direction, node, dx, dy).then(function() {
+ var finalCoordinates = getShapeCoordinates(layoutShape, x2p, y2p);
+
+ var keyN, keyS, keyW, keyE;
+ if (initialCoordinates.y0 < initialCoordinates.y1) {
+ keyN = "y0";
+ keyS = "y1";
+ } else {
+ keyN = "y1";
+ keyS = "y0";
+ }
+ if (initialCoordinates.x0 < initialCoordinates.x1) {
+ keyW = "x0";
+ keyE = "x1";
+ } else {
+ keyW = "x1";
+ keyE = "x0";
+ }
+
+ if (~direction.indexOf("n")) {
+ expect(finalCoordinates[keyN] - initialCoordinates[keyN]).toBeCloseTo(
+ dy
+ );
+ } else if (~direction.indexOf("s")) {
+ expect(finalCoordinates[keyS] - initialCoordinates[keyS]).toBeCloseTo(
+ dy
+ );
+ }
+
+ if (~direction.indexOf("w")) {
+ expect(finalCoordinates[keyW] - initialCoordinates[keyW]).toBeCloseTo(
+ dx
+ );
+ } else if (~direction.indexOf("e")) {
+ expect(finalCoordinates[keyE] - initialCoordinates[keyE]).toBeCloseTo(
+ dx
+ );
+ }
+ });
+ }
+
+ function getPathCoordinates(pathString, x2p, y2p) {
+ var coordinates = [];
+
+ pathString.match(constants.segmentRE).forEach(function(segment) {
+ var paramNumber = 0,
+ segmentType = segment.charAt(0),
+ xParams = constants.paramIsX[segmentType],
+ yParams = constants.paramIsY[segmentType],
+ nParams = constants.numParams[segmentType],
+ params = segment.substr(1).match(constants.paramRE);
+
+ if (params) {
+ params.forEach(function(param) {
+ if (paramNumber >= nParams) return;
+
+ if (xParams[paramNumber]) {
+ coordinates.push({ x: x2p(param) });
+ } else if (yParams[paramNumber]) {
+ coordinates.push({ y: y2p(param) });
+ }
+
+ paramNumber++;
});
+ }
+ });
- return coordinates;
- }
+ return coordinates;
+ }
});
-var DBLCLICKDELAY = require('@src/plots/cartesian/constants').DBLCLICKDELAY;
+var DBLCLICKDELAY = require("@src/plots/cartesian/constants").DBLCLICKDELAY;
function mouseDown(node, x, y) {
- node.dispatchEvent(new MouseEvent('mousedown', {
- bubbles: true,
- clientX: x,
- clientY: y
- }));
+ node.dispatchEvent(new MouseEvent("mousedown", {
+ bubbles: true,
+ clientX: x,
+ clientY: y
+ }));
}
function mouseMove(node, x, y) {
- node.dispatchEvent(new MouseEvent('mousemove', {
- bubbles: true,
- clientX: x,
- clientY: y
- }));
+ node.dispatchEvent(new MouseEvent("mousemove", {
+ bubbles: true,
+ clientX: x,
+ clientY: y
+ }));
}
function mouseUp(node, x, y) {
- node.dispatchEvent(new MouseEvent('mouseup', {
- bubbles: true,
- clientX: x,
- clientY: y
- }));
+ node.dispatchEvent(new MouseEvent("mouseup", {
+ bubbles: true,
+ clientX: x,
+ clientY: y
+ }));
}
function drag(node, dx, dy) {
- var bbox = node.getBoundingClientRect(),
- fromX = (bbox.left + bbox.right) / 2,
- fromY = (bbox.bottom + bbox.top) / 2,
- toX = fromX + dx,
- toY = fromY + dy;
-
- mouseMove(node, fromX, fromY);
- mouseDown(node, fromX, fromY);
-
- var promise = waitForDragCover().then(function(dragCoverNode) {
- mouseMove(dragCoverNode, toX, toY);
- mouseUp(dragCoverNode, toX, toY);
- return waitForDragCoverRemoval();
- });
+ var bbox = node.getBoundingClientRect(),
+ fromX = (bbox.left + bbox.right) / 2,
+ fromY = (bbox.bottom + bbox.top) / 2,
+ toX = fromX + dx,
+ toY = fromY + dy;
+
+ mouseMove(node, fromX, fromY);
+ mouseDown(node, fromX, fromY);
- return promise;
+ var promise = waitForDragCover().then(function(dragCoverNode) {
+ mouseMove(dragCoverNode, toX, toY);
+ mouseUp(dragCoverNode, toX, toY);
+ return waitForDragCoverRemoval();
+ });
+
+ return promise;
}
function resize(direction, node, dx, dy) {
- var bbox = node.getBoundingClientRect();
+ var bbox = node.getBoundingClientRect();
- var fromX, fromY, toX, toY;
+ var fromX, fromY, toX, toY;
- if(~direction.indexOf('n')) fromY = bbox.top;
- else if(~direction.indexOf('s')) fromY = bbox.bottom;
- else fromY = (bbox.bottom + bbox.top) / 2;
+ if (~direction.indexOf("n")) fromY = bbox.top;
+ else if (~direction.indexOf("s")) fromY = bbox.bottom;
+ else fromY = (bbox.bottom + bbox.top) / 2;
- if(~direction.indexOf('w')) fromX = bbox.left;
- else if(~direction.indexOf('e')) fromX = bbox.right;
- else fromX = (bbox.left + bbox.right) / 2;
+ if (~direction.indexOf("w")) fromX = bbox.left;
+ else if (~direction.indexOf("e")) fromX = bbox.right;
+ else fromX = (bbox.left + bbox.right) / 2;
- toX = fromX + dx;
- toY = fromY + dy;
+ toX = fromX + dx;
+ toY = fromY + dy;
- mouseMove(node, fromX, fromY);
- mouseDown(node, fromX, fromY);
+ mouseMove(node, fromX, fromY);
+ mouseDown(node, fromX, fromY);
- var promise = waitForDragCover().then(function(dragCoverNode) {
- mouseMove(dragCoverNode, toX, toY);
- mouseUp(dragCoverNode, toX, toY);
- return waitForDragCoverRemoval();
- });
+ var promise = waitForDragCover().then(function(dragCoverNode) {
+ mouseMove(dragCoverNode, toX, toY);
+ mouseUp(dragCoverNode, toX, toY);
+ return waitForDragCoverRemoval();
+ });
- return promise;
+ return promise;
}
function waitForDragCover() {
- return new Promise(function(resolve) {
- var interval = DBLCLICKDELAY / 4,
- timeout = 5000;
-
- var id = setInterval(function() {
- var dragCoverNode = d3.selectAll('.dragcover').node();
- if(dragCoverNode) {
- clearInterval(id);
- resolve(dragCoverNode);
- }
-
- timeout -= interval;
- if(timeout < 0) {
- clearInterval(id);
- throw new Error('waitForDragCover: timeout');
- }
- }, interval);
- });
+ return new Promise(function(resolve) {
+ var interval = DBLCLICKDELAY / 4, timeout = 5000;
+
+ var id = setInterval(
+ function() {
+ var dragCoverNode = d3.selectAll(".dragcover").node();
+ if (dragCoverNode) {
+ clearInterval(id);
+ resolve(dragCoverNode);
+ }
+
+ timeout -= interval;
+ if (timeout < 0) {
+ clearInterval(id);
+ throw new Error("waitForDragCover: timeout");
+ }
+ },
+ interval
+ );
+ });
}
function waitForDragCoverRemoval() {
- return new Promise(function(resolve) {
- var interval = DBLCLICKDELAY / 4,
- timeout = 5000;
-
- var id = setInterval(function() {
- var dragCoverNode = d3.selectAll('.dragcover').node();
- if(!dragCoverNode) {
- clearInterval(id);
- resolve(dragCoverNode);
- }
-
- timeout -= interval;
- if(timeout < 0) {
- clearInterval(id);
- throw new Error('waitForDragCoverRemoval: timeout');
- }
- }, interval);
- });
+ return new Promise(function(resolve) {
+ var interval = DBLCLICKDELAY / 4, timeout = 5000;
+
+ var id = setInterval(
+ function() {
+ var dragCoverNode = d3.selectAll(".dragcover").node();
+ if (!dragCoverNode) {
+ clearInterval(id);
+ resolve(dragCoverNode);
+ }
+
+ timeout -= interval;
+ if (timeout < 0) {
+ clearInterval(id);
+ throw new Error("waitForDragCoverRemoval: timeout");
+ }
+ },
+ interval
+ );
+ });
}
diff --git a/test/jasmine/tests/sliders_test.js b/test/jasmine/tests/sliders_test.js
index 5a1274769a2..42a0695f32e 100644
--- a/test/jasmine/tests/sliders_test.js
+++ b/test/jasmine/tests/sliders_test.js
@@ -1,443 +1,467 @@
-var Sliders = require('@src/components/sliders');
-var constants = require('@src/components/sliders/constants');
-
-var d3 = require('d3');
-var Plotly = require('@lib');
-var Lib = require('@src/lib');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var fail = require('../assets/fail_test');
-
-describe('sliders defaults', function() {
- 'use strict';
-
- var supply = Sliders.supplyLayoutDefaults;
-
- var layoutIn, layoutOut;
-
- beforeEach(function() {
- layoutIn = {};
- layoutOut = {};
- });
-
- it('should set \'visible\' to false when no steps are present', function() {
- layoutIn.sliders = [{
- steps: [{
- method: 'relayout',
- args: ['title', 'Hello World']
- }, {
- method: 'update',
- args: [ { 'marker.size': 20 }, { 'xaxis.range': [0, 10] }, [0, 1] ]
- }, {
- method: 'animate',
- args: [ 'frame1', { transition: { duration: 500, ease: 'cubic-in-out' }}]
- }]
- }, {
- bgcolor: 'red'
- }, {
- visible: false,
- steps: [{
- method: 'relayout',
- args: ['title', 'Hello World']
- }]
- }];
-
- supply(layoutIn, layoutOut);
-
- expect(layoutOut.sliders[0].visible).toBe(true);
- expect(layoutOut.sliders[0].active).toEqual(0);
- expect(layoutOut.sliders[0].steps[0].args.length).toEqual(2);
- expect(layoutOut.sliders[0].steps[1].args.length).toEqual(3);
- expect(layoutOut.sliders[0].steps[2].args.length).toEqual(2);
-
- expect(layoutOut.sliders[1].visible).toBe(false);
- expect(layoutOut.sliders[1].active).toBeUndefined();
-
- expect(layoutOut.sliders[2].visible).toBe(false);
- expect(layoutOut.sliders[2].active).toBeUndefined();
- });
-
- it('should not coerce currentvalue defaults unless currentvalue is visible', function() {
- layoutIn.sliders = [{
- currentvalue: {
- visible: false,
- xanchor: 'left'
- },
- steps: [
- {method: 'restyle', args: [], label: 'step0'},
- {method: 'restyle', args: [], label: 'step1'}
- ]
- }];
-
- supply(layoutIn, layoutOut);
-
- expect(layoutOut.sliders[0].currentvalue.xanchor).toBeUndefined();
- expect(layoutOut.sliders[0].currentvalue.prefix).toBeUndefined();
- expect(layoutOut.sliders[0].currentvalue.suffix).toBeUndefined();
- expect(layoutOut.sliders[0].currentvalue.offset).toBeUndefined();
- expect(layoutOut.sliders[0].currentvalue.font).toBeUndefined();
- });
-
- it('should set the default values equal to the labels', function() {
- layoutIn.sliders = [{
- steps: [{
- method: 'relayout', args: [],
- label: 'Label #1',
- value: 'label-1'
- }, {
- method: 'update', args: [],
- label: 'Label #2'
- }, {
- method: 'animate', args: [],
- value: 'lacks-label'
- }]
- }];
-
- supply(layoutIn, layoutOut);
-
- expect(layoutOut.sliders[0].steps.length).toEqual(3);
- expect(layoutOut.sliders[0].steps).toEqual([{
- method: 'relayout', args: [],
- label: 'Label #1',
- value: 'label-1'
- }, {
- method: 'update', args: [],
- label: 'Label #2',
- value: 'Label #2'
- }, {
- method: 'animate', args: [],
- label: 'step-2',
- value: 'lacks-label'
- }]);
- });
-
- it('should skip over non-object steps', function() {
- layoutIn.sliders = [{
- steps: [
- null,
- {
- method: 'relayout',
- args: ['title', 'Hello World']
- },
- 'remove'
+var Sliders = require("@src/components/sliders");
+var constants = require("@src/components/sliders/constants");
+
+var d3 = require("d3");
+var Plotly = require("@lib");
+var Lib = require("@src/lib");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var fail = require("../assets/fail_test");
+
+describe("sliders defaults", function() {
+ "use strict";
+ var supply = Sliders.supplyLayoutDefaults;
+
+ var layoutIn, layoutOut;
+
+ beforeEach(function() {
+ layoutIn = {};
+ layoutOut = {};
+ });
+
+ it("should set 'visible' to false when no steps are present", function() {
+ layoutIn.sliders = [
+ {
+ steps: [
+ { method: "relayout", args: ["title", "Hello World"] },
+ {
+ method: "update",
+ args: [{ "marker.size": 20 }, { "xaxis.range": [0, 10] }, [0, 1]]
+ },
+ {
+ method: "animate",
+ args: [
+ "frame1",
+ { transition: { duration: 500, ease: "cubic-in-out" } }
]
- }];
-
- supply(layoutIn, layoutOut);
+ }
+ ]
+ },
+ { bgcolor: "red" },
+ {
+ visible: false,
+ steps: [{ method: "relayout", args: ["title", "Hello World"] }]
+ }
+ ];
+
+ supply(layoutIn, layoutOut);
+
+ expect(layoutOut.sliders[0].visible).toBe(true);
+ expect(layoutOut.sliders[0].active).toEqual(0);
+ expect(layoutOut.sliders[0].steps[0].args.length).toEqual(2);
+ expect(layoutOut.sliders[0].steps[1].args.length).toEqual(3);
+ expect(layoutOut.sliders[0].steps[2].args.length).toEqual(2);
+
+ expect(layoutOut.sliders[1].visible).toBe(false);
+ expect(layoutOut.sliders[1].active).toBeUndefined();
+
+ expect(layoutOut.sliders[2].visible).toBe(false);
+ expect(layoutOut.sliders[2].active).toBeUndefined();
+ });
+
+ it(
+ "should not coerce currentvalue defaults unless currentvalue is visible",
+ function() {
+ layoutIn.sliders = [
+ {
+ currentvalue: { visible: false, xanchor: "left" },
+ steps: [
+ { method: "restyle", args: [], label: "step0" },
+ { method: "restyle", args: [], label: "step1" }
+ ]
+ }
+ ];
- expect(layoutOut.sliders[0].steps.length).toEqual(1);
- expect(layoutOut.sliders[0].steps[0]).toEqual({
- method: 'relayout',
- args: ['title', 'Hello World'],
- label: 'step-1',
- value: 'step-1',
- });
- });
+ supply(layoutIn, layoutOut);
- it('should skip over steps with non-array \'args\' field', function() {
- layoutIn.sliders = [{
- steps: [{
- method: 'restyle',
- }, {
- method: 'relayout',
- args: ['title', 'Hello World']
- }, {
- method: 'relayout',
- args: null
- }, {}]
- }];
-
- supply(layoutIn, layoutOut);
-
- expect(layoutOut.sliders[0].steps.length).toEqual(1);
- expect(layoutOut.sliders[0].steps[0]).toEqual({
- method: 'relayout',
- args: ['title', 'Hello World'],
- label: 'step-1',
- value: 'step-1',
- });
+ expect(layoutOut.sliders[0].currentvalue.xanchor).toBeUndefined();
+ expect(layoutOut.sliders[0].currentvalue.prefix).toBeUndefined();
+ expect(layoutOut.sliders[0].currentvalue.suffix).toBeUndefined();
+ expect(layoutOut.sliders[0].currentvalue.offset).toBeUndefined();
+ expect(layoutOut.sliders[0].currentvalue.font).toBeUndefined();
+ }
+ );
+
+ it("should set the default values equal to the labels", function() {
+ layoutIn.sliders = [
+ {
+ steps: [
+ { method: "relayout", args: [], label: "Label #1", value: "label-1" },
+ { method: "update", args: [], label: "Label #2" },
+ { method: "animate", args: [], value: "lacks-label" }
+ ]
+ }
+ ];
+
+ supply(layoutIn, layoutOut);
+
+ expect(layoutOut.sliders[0].steps.length).toEqual(3);
+ expect(layoutOut.sliders[0].steps).toEqual([
+ { method: "relayout", args: [], label: "Label #1", value: "label-1" },
+ { method: "update", args: [], label: "Label #2", value: "Label #2" },
+ { method: "animate", args: [], label: "step-2", value: "lacks-label" }
+ ]);
+ });
+
+ it("should skip over non-object steps", function() {
+ layoutIn.sliders = [
+ {
+ steps: [
+ null,
+ { method: "relayout", args: ["title", "Hello World"] },
+ "remove"
+ ]
+ }
+ ];
+
+ supply(layoutIn, layoutOut);
+
+ expect(layoutOut.sliders[0].steps.length).toEqual(1);
+ expect(layoutOut.sliders[0].steps[0]).toEqual({
+ method: "relayout",
+ args: ["title", "Hello World"],
+ label: "step-1",
+ value: "step-1"
});
-
- it('should keep ref to input update menu container', function() {
- layoutIn.sliders = [{
- steps: [{
- method: 'relayout',
- args: ['title', 'Hello World']
- }]
- }, {
- bgcolor: 'red'
- }, {
- visible: false,
- steps: [{
- method: 'relayout',
- args: ['title', 'Hello World']
- }]
- }];
-
- supply(layoutIn, layoutOut);
-
- expect(layoutOut.sliders[0]._input).toBe(layoutIn.sliders[0]);
- expect(layoutOut.sliders[1]._input).toBe(layoutIn.sliders[1]);
- expect(layoutOut.sliders[2]._input).toBe(layoutIn.sliders[2]);
+ });
+
+ it("should skip over steps with non-array 'args' field", function() {
+ layoutIn.sliders = [
+ {
+ steps: [
+ { method: "restyle" },
+ { method: "relayout", args: ["title", "Hello World"] },
+ { method: "relayout", args: null },
+ {}
+ ]
+ }
+ ];
+
+ supply(layoutIn, layoutOut);
+
+ expect(layoutOut.sliders[0].steps.length).toEqual(1);
+ expect(layoutOut.sliders[0].steps[0]).toEqual({
+ method: "relayout",
+ args: ["title", "Hello World"],
+ label: "step-1",
+ value: "step-1"
});
+ });
+
+ it("should keep ref to input update menu container", function() {
+ layoutIn.sliders = [
+ { steps: [{ method: "relayout", args: ["title", "Hello World"] }] },
+ { bgcolor: "red" },
+ {
+ visible: false,
+ steps: [{ method: "relayout", args: ["title", "Hello World"] }]
+ }
+ ];
+
+ supply(layoutIn, layoutOut);
+
+ expect(layoutOut.sliders[0]._input).toBe(layoutIn.sliders[0]);
+ expect(layoutOut.sliders[1]._input).toBe(layoutIn.sliders[1]);
+ expect(layoutOut.sliders[2]._input).toBe(layoutIn.sliders[2]);
+ });
});
-describe('sliders initialization', function() {
- 'use strict';
- var gd;
-
- beforeEach(function(done) {
- gd = createGraphDiv();
-
- Plotly.plot(gd, [{x: [1, 2, 3]}], {
- sliders: [{
- transition: {duration: 0},
- steps: [
- {method: 'restyle', args: [], label: 'first'},
- {method: 'restyle', args: [], label: 'second'},
- ]
- }]
- }).then(done);
- });
-
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
-
- it('does not set active on initial plot', function() {
- expect(gd.layout.sliders[0].active).toBeUndefined();
- });
+describe("sliders initialization", function() {
+ "use strict";
+ var gd;
+
+ beforeEach(function(done) {
+ gd = createGraphDiv();
+
+ Plotly.plot(gd, [{ x: [1, 2, 3] }], {
+ sliders: [
+ {
+ transition: { duration: 0 },
+ steps: [
+ { method: "restyle", args: [], label: "first" },
+ { method: "restyle", args: [], label: "second" }
+ ]
+ }
+ ]
+ }).then(done);
+ });
+
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
+
+ it("does not set active on initial plot", function() {
+ expect(gd.layout.sliders[0].active).toBeUndefined();
+ });
});
-describe('ugly internal manipulation of steps', function() {
- 'use strict';
- var gd;
-
- beforeEach(function(done) {
- gd = createGraphDiv();
-
- Plotly.plot(gd, [{x: [1, 2, 3]}], {
- sliders: [{
- transition: {duration: 0},
- steps: [
- {method: 'restyle', args: [], label: 'first'},
- {method: 'restyle', args: [], label: 'second'},
- ]
- }]
- }).then(done);
- });
+describe("ugly internal manipulation of steps", function() {
+ "use strict";
+ var gd;
+
+ beforeEach(function(done) {
+ gd = createGraphDiv();
+
+ Plotly.plot(gd, [{ x: [1, 2, 3] }], {
+ sliders: [
+ {
+ transition: { duration: 0 },
+ steps: [
+ { method: "restyle", args: [], label: "first" },
+ { method: "restyle", args: [], label: "second" }
+ ]
+ }
+ ]
+ }).then(done);
+ });
+
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
+
+ it("adds and removes slider steps gracefully", function(done) {
+ expect(gd._fullLayout.sliders[0].active).toEqual(0);
+
+ // Set the active index higher than it can go:
+ Plotly.relayout(gd, { "sliders[0].active": 2 })
+ .then(function() {
+ // Confirm nothing changed
+ expect(gd._fullLayout.sliders[0].active).toEqual(0);
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
+ // Add an option manually without calling API functions:
+ gd.layout.sliders[0].steps.push({
+ method: "restyle",
+ args: [],
+ label: "first"
+ });
- it('adds and removes slider steps gracefully', function(done) {
+ // Now that it's been added, restyle and try again:
+ return Plotly.relayout(gd, { "sliders[0].active": 2 });
+ })
+ .then(function() {
+ // Confirm it's been changed:
+ expect(gd._fullLayout.sliders[0].active).toEqual(2);
+
+ // Remove the option:
+ gd.layout.sliders[0].steps.pop();
+
+ // And redraw the plot:
+ return Plotly.redraw(gd);
+ })
+ .then(function() {
+ // The selected option no longer exists, so confirm it's
+ // been fixed during the process of updating/drawing it:
expect(gd._fullLayout.sliders[0].active).toEqual(0);
-
- // Set the active index higher than it can go:
- Plotly.relayout(gd, {'sliders[0].active': 2}).then(function() {
- // Confirm nothing changed
- expect(gd._fullLayout.sliders[0].active).toEqual(0);
-
- // Add an option manually without calling API functions:
- gd.layout.sliders[0].steps.push({method: 'restyle', args: [], label: 'first'});
-
- // Now that it's been added, restyle and try again:
- return Plotly.relayout(gd, {'sliders[0].active': 2});
- }).then(function() {
- // Confirm it's been changed:
- expect(gd._fullLayout.sliders[0].active).toEqual(2);
-
- // Remove the option:
- gd.layout.sliders[0].steps.pop();
-
- // And redraw the plot:
- return Plotly.redraw(gd);
- }).then(function() {
- // The selected option no longer exists, so confirm it's
- // been fixed during the process of updating/drawing it:
- expect(gd._fullLayout.sliders[0].active).toEqual(0);
- }).catch(fail).then(done);
- });
+ })
+ .catch(fail)
+ .then(done);
+ });
});
-describe('sliders interactions', function() {
- 'use strict';
+describe("sliders interactions", function() {
+ "use strict";
+ var mock = require("@mocks/sliders.json");
+ var mockCopy;
- var mock = require('@mocks/sliders.json');
- var mockCopy;
+ var gd;
- var gd;
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- beforeEach(function(done) {
- gd = createGraphDiv();
+ mockCopy = Lib.extendDeep({}, mock);
- mockCopy = Lib.extendDeep({}, mock);
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
- });
-
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
-
- it('should draw only visible sliders', function(done) {
- expect(gd._fullLayout._pushmargin['slider-0']).toBeDefined();
- expect(gd._fullLayout._pushmargin['slider-1']).toBeDefined();
-
- Plotly.relayout(gd, 'sliders[0].visible', false).then(function() {
- assertNodeCount('.' + constants.groupClassName, 1);
- expect(gd._fullLayout._pushmargin['slider-0']).toBeUndefined();
- expect(gd._fullLayout._pushmargin['slider-1']).toBeDefined();
- expect(gd.layout.sliders.length).toEqual(2);
-
- return Plotly.relayout(gd, 'sliders[1]', null);
- })
- .then(function() {
- assertNodeCount('.' + constants.groupClassName, 0);
- expect(gd._fullLayout._pushmargin['slider-0']).toBeUndefined();
- expect(gd._fullLayout._pushmargin['slider-1']).toBeUndefined();
- expect(gd.layout.sliders.length).toEqual(1);
-
- return Plotly.relayout(gd, {
- 'sliders[0].visible': true,
- 'sliders[1].visible': true
- });
- }).then(function() {
- assertNodeCount('.' + constants.groupClassName, 1);
- expect(gd._fullLayout._pushmargin['slider-0']).toBeDefined();
- expect(gd._fullLayout._pushmargin['slider-1']).toBeUndefined();
-
- return Plotly.relayout(gd, {
- 'sliders[1]': {
- steps: [{
- method: 'relayout',
- args: ['title', 'new title'],
- label: '1970'
- }, {
- method: 'relayout',
- args: ['title', 'new title'],
- label: '1971'
- }]
- }
- });
- })
- .then(function() {
- assertNodeCount('.' + constants.groupClassName, 2);
- expect(gd._fullLayout._pushmargin['slider-0']).toBeDefined();
- expect(gd._fullLayout._pushmargin['slider-1']).toBeDefined();
- })
- .catch(fail).then(done);
- });
-
- it('should respond to mouse clicks', function(done) {
- var firstGroup = gd._fullLayout._infolayer.select('.' + constants.railTouchRectClass);
- var firstGrip = gd._fullLayout._infolayer.select('.' + constants.gripRectClass);
- var railNode = firstGroup.node();
- var touchRect = railNode.getBoundingClientRect();
-
- var originalFill = firstGrip.style('fill');
-
- // Dispatch a click on the right side of the bar:
- railNode.dispatchEvent(new MouseEvent('mousedown', {
- clientY: touchRect.top + 5,
- clientX: touchRect.left + touchRect.width - 5,
- }));
-
- expect(mockCopy.layout.sliders[0].active).toEqual(5);
- var mousedownFill = firstGrip.style('fill');
- expect(mousedownFill).not.toEqual(originalFill);
-
- // Drag to the left side:
- gd.dispatchEvent(new MouseEvent('mousemove', {
- clientY: touchRect.top + 5,
- clientX: touchRect.left + 5,
- }));
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
- var mousemoveFill = firstGrip.style('fill');
- expect(mousemoveFill).toEqual(mousedownFill);
+ it("should draw only visible sliders", function(done) {
+ expect(gd._fullLayout._pushmargin["slider-0"]).toBeDefined();
+ expect(gd._fullLayout._pushmargin["slider-1"]).toBeDefined();
- setTimeout(function() {
- expect(mockCopy.layout.sliders[0].active).toEqual(0);
+ Plotly.relayout(gd, "sliders[0].visible", false)
+ .then(function() {
+ assertNodeCount("." + constants.groupClassName, 1);
+ expect(gd._fullLayout._pushmargin["slider-0"]).toBeUndefined();
+ expect(gd._fullLayout._pushmargin["slider-1"]).toBeDefined();
+ expect(gd.layout.sliders.length).toEqual(2);
- gd.dispatchEvent(new MouseEvent('mouseup'));
+ return Plotly.relayout(gd, "sliders[1]", null);
+ })
+ .then(function() {
+ assertNodeCount("." + constants.groupClassName, 0);
+ expect(gd._fullLayout._pushmargin["slider-0"]).toBeUndefined();
+ expect(gd._fullLayout._pushmargin["slider-1"]).toBeUndefined();
+ expect(gd.layout.sliders.length).toEqual(1);
- var mouseupFill = firstGrip.style('fill');
- expect(mouseupFill).toEqual(originalFill);
- expect(mockCopy.layout.sliders[0].active).toEqual(0);
-
- done();
- }, 100);
- });
-
- it('should issue events on interaction', function(done) {
- var cntStart = 0;
- var cntInteraction = 0;
- var cntNonInteraction = 0;
- var cntEnd = 0;
-
- gd.on('plotly_sliderstart', function() {
- cntStart++;
- }).on('plotly_sliderchange', function(datum) {
- if(datum.interaction) {
- cntInteraction++;
- } else {
- cntNonInteraction++;
- }
- }).on('plotly_sliderend', function() {
- cntEnd++;
+ return Plotly.relayout(gd, {
+ "sliders[0].visible": true,
+ "sliders[1].visible": true
});
-
- function assertEventCounts(starts, interactions, noninteractions, ends) {
- expect(
- [cntStart, cntInteraction, cntNonInteraction, cntEnd]
- ).toEqual(
- [starts, interactions, noninteractions, ends]
- );
+ })
+ .then(function() {
+ assertNodeCount("." + constants.groupClassName, 1);
+ expect(gd._fullLayout._pushmargin["slider-0"]).toBeDefined();
+ expect(gd._fullLayout._pushmargin["slider-1"]).toBeUndefined();
+
+ return Plotly.relayout(gd, {
+ "sliders[1]": {
+ steps: [
+ {
+ method: "relayout",
+ args: ["title", "new title"],
+ label: "1970"
+ },
+ {
+ method: "relayout",
+ args: ["title", "new title"],
+ label: "1971"
+ }
+ ]
+ }
+ });
+ })
+ .then(function() {
+ assertNodeCount("." + constants.groupClassName, 2);
+ expect(gd._fullLayout._pushmargin["slider-0"]).toBeDefined();
+ expect(gd._fullLayout._pushmargin["slider-1"]).toBeDefined();
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ it("should respond to mouse clicks", function(done) {
+ var firstGroup = gd._fullLayout._infolayer.select(
+ "." + constants.railTouchRectClass
+ );
+ var firstGrip = gd._fullLayout._infolayer.select(
+ "." + constants.gripRectClass
+ );
+ var railNode = firstGroup.node();
+ var touchRect = railNode.getBoundingClientRect();
+
+ var originalFill = firstGrip.style("fill");
+
+ // Dispatch a click on the right side of the bar:
+ railNode.dispatchEvent(new MouseEvent("mousedown", {
+ clientY: touchRect.top + 5,
+ clientX: touchRect.left + touchRect.width - 5
+ }));
+
+ expect(mockCopy.layout.sliders[0].active).toEqual(5);
+ var mousedownFill = firstGrip.style("fill");
+ expect(mousedownFill).not.toEqual(originalFill);
+
+ // Drag to the left side:
+ gd.dispatchEvent(new MouseEvent("mousemove", {
+ clientY: touchRect.top + 5,
+ clientX: touchRect.left + 5
+ }));
+
+ var mousemoveFill = firstGrip.style("fill");
+ expect(mousemoveFill).toEqual(mousedownFill);
+
+ setTimeout(
+ function() {
+ expect(mockCopy.layout.sliders[0].active).toEqual(0);
+
+ gd.dispatchEvent(new MouseEvent("mouseup"));
+
+ var mouseupFill = firstGrip.style("fill");
+ expect(mouseupFill).toEqual(originalFill);
+ expect(mockCopy.layout.sliders[0].active).toEqual(0);
+
+ done();
+ },
+ 100
+ );
+ });
+
+ it("should issue events on interaction", function(done) {
+ var cntStart = 0;
+ var cntInteraction = 0;
+ var cntNonInteraction = 0;
+ var cntEnd = 0;
+
+ gd
+ .on("plotly_sliderstart", function() {
+ cntStart++;
+ })
+ .on("plotly_sliderchange", function(datum) {
+ if (datum.interaction) {
+ cntInteraction++;
+ } else {
+ cntNonInteraction++;
}
+ })
+ .on("plotly_sliderend", function() {
+ cntEnd++;
+ });
+
+ function assertEventCounts(starts, interactions, noninteractions, ends) {
+ expect([cntStart, cntInteraction, cntNonInteraction, cntEnd]).toEqual([
+ starts,
+ interactions,
+ noninteractions,
+ ends
+ ]);
+ }
- assertEventCounts(0, 0, 0, 0);
-
- var firstGroup = gd._fullLayout._infolayer.select('.' + constants.railTouchRectClass);
- var railNode = firstGroup.node();
- var touchRect = railNode.getBoundingClientRect();
+ assertEventCounts(0, 0, 0, 0);
- // Dispatch a click on the right side of the bar:
- railNode.dispatchEvent(new MouseEvent('mousedown', {
- clientY: touchRect.top + 5,
- clientX: touchRect.left + touchRect.width - 5,
- }));
+ var firstGroup = gd._fullLayout._infolayer.select(
+ "." + constants.railTouchRectClass
+ );
+ var railNode = firstGroup.node();
+ var touchRect = railNode.getBoundingClientRect();
- setTimeout(function() {
- // One slider received a mousedown, one received an interaction, and one received a change:
- assertEventCounts(1, 1, 1, 0);
+ // Dispatch a click on the right side of the bar:
+ railNode.dispatchEvent(new MouseEvent("mousedown", {
+ clientY: touchRect.top + 5,
+ clientX: touchRect.left + touchRect.width - 5
+ }));
- // Drag to the left side:
- gd.dispatchEvent(new MouseEvent('mousemove', {
- clientY: touchRect.top + 5,
- clientX: touchRect.left + 5,
- }));
+ setTimeout(
+ function() {
+ // One slider received a mousedown, one received an interaction, and one received a change:
+ assertEventCounts(1, 1, 1, 0);
- setTimeout(function() {
- // On move, now to changes for the each slider, and no ends:
- assertEventCounts(1, 2, 2, 0);
+ // Drag to the left side:
+ gd.dispatchEvent(new MouseEvent("mousemove", {
+ clientY: touchRect.top + 5,
+ clientX: touchRect.left + 5
+ }));
- gd.dispatchEvent(new MouseEvent('mouseup'));
+ setTimeout(
+ function() {
+ // On move, now to changes for the each slider, and no ends:
+ assertEventCounts(1, 2, 2, 0);
- setTimeout(function() {
- // Now an end:
- assertEventCounts(1, 2, 2, 1);
+ gd.dispatchEvent(new MouseEvent("mouseup"));
- done();
- }, 50);
- }, 50);
- }, 50);
- });
+ setTimeout(
+ function() {
+ // Now an end:
+ assertEventCounts(1, 2, 2, 1);
- function assertNodeCount(query, cnt) {
- expect(d3.selectAll(query).size()).toEqual(cnt);
- }
+ done();
+ },
+ 50
+ );
+ },
+ 50
+ );
+ },
+ 50
+ );
+ });
+
+ function assertNodeCount(query, cnt) {
+ expect(d3.selectAll(query).size()).toEqual(cnt);
+ }
});
diff --git a/test/jasmine/tests/snapshot_test.js b/test/jasmine/tests/snapshot_test.js
index 72c01d2a8ab..485b5b64a3e 100644
--- a/test/jasmine/tests/snapshot_test.js
+++ b/test/jasmine/tests/snapshot_test.js
@@ -1,248 +1,255 @@
-var Plotly = require('@lib/index');
-
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-
-var subplotMock = require('../../image/mocks/multiple_subplots.json');
-var annotationMock = require('../../image/mocks/annotations.json');
-
-describe('Plotly.Snapshot', function() {
- 'use strict';
-
- describe('clone', function() {
-
- var data,
- layout,
- dummyTrace1, dummyTrace2,
- dummyGraphObj;
-
- dummyTrace1 = {
- x: ['0', '1', '2', '3', '4', '5'],
- y: ['2', '4', '6', '8', '6', '4'],
- mode: 'markers',
- name: 'Col2',
- type: 'scatter'
- };
- dummyTrace2 = {
- x: ['0', '1', '2', '3', '4', '5'],
- y: ['4', '6', '8', '10', '8', '6'],
- mode: 'markers',
- name: 'Col3',
- type: 'scatter'
+var Plotly = require("@lib/index");
+
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+
+var subplotMock = require("../../image/mocks/multiple_subplots.json");
+var annotationMock = require("../../image/mocks/annotations.json");
+
+describe("Plotly.Snapshot", function() {
+ "use strict";
+ describe("clone", function() {
+ var data, layout, dummyTrace1, dummyTrace2, dummyGraphObj;
+
+ dummyTrace1 = {
+ x: ["0", "1", "2", "3", "4", "5"],
+ y: ["2", "4", "6", "8", "6", "4"],
+ mode: "markers",
+ name: "Col2",
+ type: "scatter"
+ };
+ dummyTrace2 = {
+ x: ["0", "1", "2", "3", "4", "5"],
+ y: ["4", "6", "8", "10", "8", "6"],
+ mode: "markers",
+ name: "Col3",
+ type: "scatter"
+ };
+
+ data = [dummyTrace1, dummyTrace2];
+ layout = {
+ title: "Chart Title",
+ showlegend: true,
+ autosize: true,
+ width: 688,
+ height: 460,
+ xaxis: {
+ title: "xaxis title",
+ range: [-0.323374917925, 5.32337491793],
+ type: "linear",
+ autorange: true
+ },
+ yaxis: {
+ title: "yaxis title",
+ range: [1.41922290389, 10.5807770961],
+ type: "linear",
+ autorange: true
+ }
+ };
+
+ dummyGraphObj = { data: data, layout: layout };
+
+ it(
+ "should create a themeTile, with width certain things stripped out",
+ function() {
+ var themeOptions = { tileClass: "themes__thumb" };
+
+ // Defaults from clone()
+ var THEMETILE_DEFAULT_LAYOUT = {
+ autosize: true,
+ width: 150,
+ height: 150,
+ title: "",
+ showlegend: false,
+ margin: { l: 5, r: 5, t: 5, b: 5, pad: 0 },
+ annotations: []
};
- data = [dummyTrace1, dummyTrace2];
- layout = {
- title: 'Chart Title',
- showlegend: true,
- autosize: true,
- width: 688,
- height: 460,
- xaxis: {
- title: 'xaxis title',
- range: [-0.323374917925, 5.32337491793],
- type: 'linear',
- autorange: true
- },
- yaxis: {
- title: 'yaxis title',
- range: [1.41922290389, 10.5807770961],
- type: 'linear',
- autorange: true
- }
+ var config = {
+ staticPlot: true,
+ plotGlPixelRatio: 2,
+ displaylogo: false,
+ showLink: false,
+ showTips: false,
+ setBackground: "opaque"
};
- dummyGraphObj = {
- data: data,
- layout: layout
+ var themeTile = Plotly.Snapshot.clone(dummyGraphObj, themeOptions);
+ expect(themeTile.layout.height).toEqual(
+ THEMETILE_DEFAULT_LAYOUT.height
+ );
+ expect(themeTile.layout.width).toEqual(THEMETILE_DEFAULT_LAYOUT.width);
+ expect(themeTile.gd.defaultLayout).toEqual(THEMETILE_DEFAULT_LAYOUT);
+ expect(themeTile.gd).toBe(themeTile.td);
+ // image server compatibility
+ expect(themeTile.config).toEqual(config);
+ }
+ );
+
+ it(
+ "should create a thumbnail for image export to the filewell",
+ function() {
+ var thumbnailOptions = { tileClass: "thumbnail" };
+
+ var THUMBNAIL_DEFAULT_LAYOUT = {
+ title: "",
+ hidesources: true,
+ showlegend: false,
+ hovermode: false,
+ dragmode: false,
+ zoom: false,
+ borderwidth: 0,
+ bordercolor: "",
+ margin: { l: 1, r: 1, t: 1, b: 1, pad: 0 },
+ annotations: []
};
- it('should create a themeTile, with width certain things stripped out', function() {
- var themeOptions = {
- tileClass: 'themes__thumb'
- };
-
- // Defaults from clone()
- var THEMETILE_DEFAULT_LAYOUT = {
- autosize: true,
- width: 150,
- height: 150,
- title: '',
- showlegend: false,
- margin: {'l': 5, 'r': 5, 't': 5, 'b': 5, 'pad': 0},
- annotations: []
- };
-
- var config = {
- staticPlot: true,
- plotGlPixelRatio: 2,
- displaylogo: false,
- showLink: false,
- showTips: false,
- setBackground: 'opaque'
- };
-
- var themeTile = Plotly.Snapshot.clone(dummyGraphObj, themeOptions);
- expect(themeTile.layout.height).toEqual(THEMETILE_DEFAULT_LAYOUT.height);
- expect(themeTile.layout.width).toEqual(THEMETILE_DEFAULT_LAYOUT.width);
- expect(themeTile.gd.defaultLayout).toEqual(THEMETILE_DEFAULT_LAYOUT);
- expect(themeTile.gd).toBe(themeTile.td); // image server compatibility
- expect(themeTile.config).toEqual(config);
- });
-
- it('should create a thumbnail for image export to the filewell', function() {
- var thumbnailOptions = {
- tileClass: 'thumbnail'
- };
-
- var THUMBNAIL_DEFAULT_LAYOUT = {
- 'title': '',
- 'hidesources': true,
- 'showlegend': false,
- 'hovermode': false,
- 'dragmode': false,
- 'zoom': false,
- 'borderwidth': 0,
- 'bordercolor': '',
- 'margin': {'l': 1, 'r': 1, 't': 1, 'b': 1, 'pad': 0},
- 'annotations': []
- };
-
- var thumbTile = Plotly.Snapshot.clone(dummyGraphObj, thumbnailOptions);
- expect(thumbTile.layout.hidesources).toEqual(THUMBNAIL_DEFAULT_LAYOUT.hidesources);
- expect(thumbTile.layout.showlegend).toEqual(THUMBNAIL_DEFAULT_LAYOUT.showlegend);
- expect(thumbTile.layout.borderwidth).toEqual(THUMBNAIL_DEFAULT_LAYOUT.borderwidth);
- expect(thumbTile.layout.annotations).toEqual(THUMBNAIL_DEFAULT_LAYOUT.annotations);
- });
-
- it('should create a 3D thumbnail with limited attributes', function() {
-
- var figure = {
- data: [{
- type: 'scatter',
- mode: 'markers',
- y: [2, 4, 6, 5, 7, 4],
- x: [1, 3, 4, 6, 3, 1],
- name: 'C'
- }],
- layout: {
- autosize: true,
- scene: {
- aspectratio: {y: 1, x: 1, z: 1}
- }
- }};
-
-
- var thumbnailOptions = {
- tileClass: 'thumbnail'
- };
-
- var AXIS_OVERRIDE = {
- title: '',
- showaxeslabels: false,
- showticklabels: false,
- linetickenable: false
- };
-
- var thumbTile = Plotly.Snapshot.clone(figure, thumbnailOptions);
- expect(thumbTile.layout.scene.xaxis).toEqual(AXIS_OVERRIDE);
- expect(thumbTile.layout.scene.yaxis).toEqual(AXIS_OVERRIDE);
- expect(thumbTile.layout.scene.zaxis).toEqual(AXIS_OVERRIDE);
- });
-
-
- it('should create a custom sized Tile based on options', function() {
- var customOptions = {
- tileClass: 'notarealclass',
- height: 888,
- width: 888
- };
-
- var customTile = Plotly.Snapshot.clone(dummyGraphObj, customOptions);
- expect(customTile.layout.height).toEqual(customOptions.height);
- expect(customTile.layout.width).toEqual(customOptions.width);
- });
-
- it('should not touch the data or layout if you do not specify an existing tileClass', function() {
- var vanillaOptions = {
- tileClass: 'notarealclass'
- };
-
- var vanillaPlotTile = Plotly.Snapshot.clone(dummyGraphObj, vanillaOptions);
- expect(vanillaPlotTile.data[0].x).toEqual(data[0].x);
- expect(vanillaPlotTile.layout).toEqual(layout);
- expect(vanillaPlotTile.layout.height).toEqual(layout.height);
- expect(vanillaPlotTile.layout.width).toEqual(layout.width);
- });
-
- it('should set the background parameter appropriately', function() {
- var pt = Plotly.Snapshot.clone(dummyGraphObj, {
- setBackground: 'transparent'
- });
- expect(pt.config.setBackground).not.toBeDefined();
-
- pt = Plotly.Snapshot.clone(dummyGraphObj, {
- setBackground: 'blue'
- });
- expect(pt.config.setBackground).toEqual('blue');
- });
+ var thumbTile = Plotly.Snapshot.clone(dummyGraphObj, thumbnailOptions);
+ expect(thumbTile.layout.hidesources).toEqual(
+ THUMBNAIL_DEFAULT_LAYOUT.hidesources
+ );
+ expect(thumbTile.layout.showlegend).toEqual(
+ THUMBNAIL_DEFAULT_LAYOUT.showlegend
+ );
+ expect(thumbTile.layout.borderwidth).toEqual(
+ THUMBNAIL_DEFAULT_LAYOUT.borderwidth
+ );
+ expect(thumbTile.layout.annotations).toEqual(
+ THUMBNAIL_DEFAULT_LAYOUT.annotations
+ );
+ }
+ );
+
+ it("should create a 3D thumbnail with limited attributes", function() {
+ var figure = {
+ data: [
+ {
+ type: "scatter",
+ mode: "markers",
+ y: [2, 4, 6, 5, 7, 4],
+ x: [1, 3, 4, 6, 3, 1],
+ name: "C"
+ }
+ ],
+ layout: { autosize: true, scene: { aspectratio: { y: 1, x: 1, z: 1 } } }
+ };
+
+ var thumbnailOptions = { tileClass: "thumbnail" };
+
+ var AXIS_OVERRIDE = {
+ title: "",
+ showaxeslabels: false,
+ showticklabels: false,
+ linetickenable: false
+ };
+
+ var thumbTile = Plotly.Snapshot.clone(figure, thumbnailOptions);
+ expect(thumbTile.layout.scene.xaxis).toEqual(AXIS_OVERRIDE);
+ expect(thumbTile.layout.scene.yaxis).toEqual(AXIS_OVERRIDE);
+ expect(thumbTile.layout.scene.zaxis).toEqual(AXIS_OVERRIDE);
});
- describe('toSVG', function() {
- var parser = new DOMParser(),
- gd;
+ it("should create a custom sized Tile based on options", function() {
+ var customOptions = {
+ tileClass: "notarealclass",
+ height: 888,
+ width: 888
+ };
- beforeEach(function() {
- gd = createGraphDiv();
- });
+ var customTile = Plotly.Snapshot.clone(dummyGraphObj, customOptions);
+ expect(customTile.layout.height).toEqual(customOptions.height);
+ expect(customTile.layout.width).toEqual(customOptions.width);
+ });
- afterEach(destroyGraphDiv);
+ it(
+ "should not touch the data or layout if you do not specify an existing tileClass",
+ function() {
+ var vanillaOptions = { tileClass: "notarealclass" };
+
+ var vanillaPlotTile = Plotly.Snapshot.clone(
+ dummyGraphObj,
+ vanillaOptions
+ );
+ expect(vanillaPlotTile.data[0].x).toEqual(data[0].x);
+ expect(vanillaPlotTile.layout).toEqual(layout);
+ expect(vanillaPlotTile.layout.height).toEqual(layout.height);
+ expect(vanillaPlotTile.layout.width).toEqual(layout.width);
+ }
+ );
+
+ it("should set the background parameter appropriately", function() {
+ var pt = Plotly.Snapshot.clone(dummyGraphObj, {
+ setBackground: "transparent"
+ });
+ expect(pt.config.setBackground).not.toBeDefined();
+
+ pt = Plotly.Snapshot.clone(dummyGraphObj, { setBackground: "blue" });
+ expect(pt.config.setBackground).toEqual("blue");
+ });
+ });
+ describe("toSVG", function() {
+ var parser = new DOMParser(), gd;
- it('should not return any nested svg tags of plots', function(done) {
- Plotly.plot(gd, subplotMock.data, subplotMock.layout).then(function() {
- return Plotly.Snapshot.toSVG(gd);
- }).then(function(svg) {
- var svgDOM = parser.parseFromString(svg, 'image/svg+xml'),
- svgElements = svgDOM.getElementsByTagName('svg');
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
- expect(svgElements.length).toBe(1);
- }).then(done);
- });
+ afterEach(destroyGraphDiv);
- it('should not return any nested svg tags of annotations', function(done) {
- Plotly.plot(gd, annotationMock.data, annotationMock.layout).then(function() {
- return Plotly.Snapshot.toSVG(gd);
- }).then(function(svg) {
- var svgDOM = parser.parseFromString(svg, 'image/svg+xml'),
- svgElements = svgDOM.getElementsByTagName('svg');
+ it("should not return any nested svg tags of plots", function(done) {
+ Plotly.plot(gd, subplotMock.data, subplotMock.layout)
+ .then(function() {
+ return Plotly.Snapshot.toSVG(gd);
+ })
+ .then(function(svg) {
+ var svgDOM = parser.parseFromString(svg, "image/svg+xml"),
+ svgElements = svgDOM.getElementsByTagName("svg");
- expect(svgElements.length).toBe(1);
- }).then(done);
- });
+ expect(svgElements.length).toBe(1);
+ })
+ .then(done);
+ });
- it('should force *visibility: visible* for text elements with *visibility: inherit*', function(done) {
- d3.select(gd).style('visibility', 'inherit');
+ it("should not return any nested svg tags of annotations", function(done) {
+ Plotly.plot(gd, annotationMock.data, annotationMock.layout)
+ .then(function() {
+ return Plotly.Snapshot.toSVG(gd);
+ })
+ .then(function(svg) {
+ var svgDOM = parser.parseFromString(svg, "image/svg+xml"),
+ svgElements = svgDOM.getElementsByTagName("svg");
+
+ expect(svgElements.length).toBe(1);
+ })
+ .then(done);
+ });
- Plotly.plot(gd, subplotMock.data, subplotMock.layout).then(function() {
+ it(
+ "should force *visibility: visible* for text elements with *visibility: inherit*",
+ function(done) {
+ d3.select(gd).style("visibility", "inherit");
- d3.select(gd).selectAll('text').each(function() {
- expect(d3.select(this).style('visibility')).toEqual('visible');
- });
+ Plotly.plot(gd, subplotMock.data, subplotMock.layout)
+ .then(function() {
+ d3.select(gd).selectAll("text").each(function() {
+ expect(d3.select(this).style("visibility")).toEqual("visible");
+ });
- return Plotly.Snapshot.toSVG(gd);
- })
- .then(function(svg) {
- var svgDOM = parser.parseFromString(svg, 'image/svg+xml'),
- textElements = svgDOM.getElementsByTagName('text');
+ return Plotly.Snapshot.toSVG(gd);
+ })
+ .then(function(svg) {
+ var svgDOM = parser.parseFromString(svg, "image/svg+xml"),
+ textElements = svgDOM.getElementsByTagName("text");
- for(var i = 0; i < textElements.length; i++) {
- expect(textElements[i].style.visibility).toEqual('visible');
- }
+ for (var i = 0; i < textElements.length; i++) {
+ expect(textElements[i].style.visibility).toEqual("visible");
+ }
- done();
- });
- });
- });
+ done();
+ });
+ }
+ );
+ });
});
diff --git a/test/jasmine/tests/surface_test.js b/test/jasmine/tests/surface_test.js
index 96aa26f0193..02361ee2586 100644
--- a/test/jasmine/tests/surface_test.js
+++ b/test/jasmine/tests/surface_test.js
@@ -1,181 +1,187 @@
-var Surface = require('@src/traces/surface');
+var Surface = require("@src/traces/surface");
-var Lib = require('@src/lib');
+var Lib = require("@src/lib");
+describe("Test surface", function() {
+ "use strict";
+ describe("supplyDefaults", function() {
+ var supplyDefaults = Surface.supplyDefaults;
-describe('Test surface', function() {
- 'use strict';
+ var defaultColor = "#444", layout = {};
- describe('supplyDefaults', function() {
- var supplyDefaults = Surface.supplyDefaults;
+ var traceIn, traceOut;
- var defaultColor = '#444',
- layout = {};
-
- var traceIn, traceOut;
-
- beforeEach(function() {
- traceOut = {};
- });
-
- it('should set \'visible\' to false if \'z\' isn\'t provided', function() {
- traceIn = {};
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.visible).toBe(false);
- });
-
- it('should fill \'x\' and \'y\' if not provided', function() {
- traceIn = {
- z: [[1, 2, 3], [2, 1, 2]]
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.x).toEqual([0, 1, 2]);
- expect(traceOut.y).toEqual([0, 1]);
- });
-
- it('should coerce \'project\' if contours or highlight lines are enabled', function() {
- traceIn = {
- z: [[1, 2, 3], [2, 1, 2]],
- contours: {
- x: {},
- y: { show: true },
- z: { show: false, highlight: false }
- }
- };
-
- var fullOpts = {
- show: false,
- highlight: true,
- project: { x: false, y: false, z: false },
- highlightcolor: '#444',
- highlightwidth: 2
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.contours.x).toEqual(fullOpts);
- expect(traceOut.contours.y).toEqual(Lib.extendDeep({}, fullOpts, {
- show: true,
- color: '#444',
- width: 2,
- usecolormap: false
- }));
- expect(traceOut.contours.z).toEqual({ show: false, highlight: false });
- });
+ beforeEach(function() {
+ traceOut = {};
+ });
- it('should coerce contour style attributes if contours lines are enabled', function() {
- traceIn = {
- z: [[1, 2, 3], [2, 1, 2]],
- contours: {
- x: { show: true }
- }
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.contours.x.color).toEqual('#444');
- expect(traceOut.contours.x.width).toEqual(2);
- expect(traceOut.contours.x.usecolormap).toEqual(false);
-
- ['y', 'z'].forEach(function(ax) {
- expect(traceOut.contours[ax].color).toBeUndefined();
- expect(traceOut.contours[ax].width).toBeUndefined();
- expect(traceOut.contours[ax].usecolormap).toBeUndefined();
- });
- });
+ it("should set 'visible' to false if 'z' isn't provided", function() {
+ traceIn = {};
- it('should coerce colorscale and colorbar attributes', function() {
- traceIn = {
- z: [[1, 2, 3], [2, 1, 2]]
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.cauto).toBe(true);
- expect(traceOut.cmin).toBeUndefined();
- expect(traceOut.cmax).toBeUndefined();
- expect(traceOut.colorscale).toEqual([
- [0, 'rgb(5,10,172)'],
- [0.35, 'rgb(106,137,247)'],
- [0.5, 'rgb(190,190,190)'],
- [0.6, 'rgb(220,170,132)'],
- [0.7, 'rgb(230,145,90)'],
- [1, 'rgb(178,10,28)']
- ]);
- expect(traceOut.showscale).toBe(true);
- expect(traceOut.colorbar).toBeDefined();
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.visible).toBe(false);
+ });
- it('should coerce \'c\' attributes with \'z\' if \'c\' isn\'t present', function() {
- traceIn = {
- z: [[1, 2, 3], [2, 1, 2]],
- zauto: false,
- zmin: 0,
- zmax: 10
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.cauto).toEqual(false);
- expect(traceOut.cmin).toEqual(0);
- expect(traceOut.cmax).toEqual(10);
- });
+ it("should fill 'x' and 'y' if not provided", function() {
+ traceIn = { z: [[1, 2, 3], [2, 1, 2]] };
- it('should coerce \'c\' attributes with \'c\' values regardless of `\'z\' if \'c\' is present', function() {
- traceIn = {
- z: [[1, 2, 3], [2, 1, 2]],
- zauto: false,
- zmin: 0,
- zmax: 10,
- cauto: true,
- cmin: -10,
- cmax: 20
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.cauto).toEqual(true);
- expect(traceOut.cmin).toEqual(-10);
- expect(traceOut.cmax).toEqual(20);
- });
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.x).toEqual([0, 1, 2]);
+ expect(traceOut.y).toEqual([0, 1]);
+ });
- it('should default \'c\' attributes with if \'surfacecolor\' is present', function() {
- traceIn = {
- z: [[1, 2, 3], [2, 1, 2]],
- surfacecolor: [[2, 1, 2], [1, 2, 3]],
- zauto: false,
- zmin: 0,
- zmax: 10
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.cauto).toEqual(true);
- expect(traceOut.cmin).toBeUndefined();
- expect(traceOut.cmax).toBeUndefined();
+ it(
+ "should coerce 'project' if contours or highlight lines are enabled",
+ function() {
+ traceIn = {
+ z: [[1, 2, 3], [2, 1, 2]],
+ contours: {
+ x: {},
+ y: { show: true },
+ z: { show: false, highlight: false }
+ }
+ };
+
+ var fullOpts = {
+ show: false,
+ highlight: true,
+ project: { x: false, y: false, z: false },
+ highlightcolor: "#444",
+ highlightwidth: 2
+ };
+
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.contours.x).toEqual(fullOpts);
+ expect(traceOut.contours.y).toEqual(
+ Lib.extendDeep({}, fullOpts, {
+ show: true,
+ color: "#444",
+ width: 2,
+ usecolormap: false
+ })
+ );
+ expect(traceOut.contours.z).toEqual({ show: false, highlight: false });
+ }
+ );
+
+ it(
+ "should coerce contour style attributes if contours lines are enabled",
+ function() {
+ traceIn = {
+ z: [[1, 2, 3], [2, 1, 2]],
+ contours: { x: { show: true } }
+ };
+
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.contours.x.color).toEqual("#444");
+ expect(traceOut.contours.x.width).toEqual(2);
+ expect(traceOut.contours.x.usecolormap).toEqual(false);
+
+ ["y", "z"].forEach(function(ax) {
+ expect(traceOut.contours[ax].color).toBeUndefined();
+ expect(traceOut.contours[ax].width).toBeUndefined();
+ expect(traceOut.contours[ax].usecolormap).toBeUndefined();
});
+ }
+ );
+
+ it("should coerce colorscale and colorbar attributes", function() {
+ traceIn = { z: [[1, 2, 3], [2, 1, 2]] };
+
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.cauto).toBe(true);
+ expect(traceOut.cmin).toBeUndefined();
+ expect(traceOut.cmax).toBeUndefined();
+ expect(traceOut.colorscale).toEqual([
+ [0, "rgb(5,10,172)"],
+ [0.35, "rgb(106,137,247)"],
+ [0.5, "rgb(190,190,190)"],
+ [0.6, "rgb(220,170,132)"],
+ [0.7, "rgb(230,145,90)"],
+ [1, "rgb(178,10,28)"]
+ ]);
+ expect(traceOut.showscale).toBe(true);
+ expect(traceOut.colorbar).toBeDefined();
+ });
- it('should inherit layout.calendar', function() {
- traceIn = {
- z: [[1, 2, 3], [2, 1, 2]]
- };
- supplyDefaults(traceIn, traceOut, defaultColor, {calendar: 'islamic'});
-
- // we always fill calendar attributes, because it's hard to tell if
- // we're on a date axis at this point.
- expect(traceOut.xcalendar).toBe('islamic');
- expect(traceOut.ycalendar).toBe('islamic');
- expect(traceOut.zcalendar).toBe('islamic');
- });
+ it(
+ "should coerce 'c' attributes with 'z' if 'c' isn't present",
+ function() {
+ traceIn = {
+ z: [[1, 2, 3], [2, 1, 2]],
+ zauto: false,
+ zmin: 0,
+ zmax: 10
+ };
+
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.cauto).toEqual(false);
+ expect(traceOut.cmin).toEqual(0);
+ expect(traceOut.cmax).toEqual(10);
+ }
+ );
+
+ it(
+ "should coerce 'c' attributes with 'c' values regardless of `'z' if 'c' is present",
+ function() {
+ traceIn = {
+ z: [[1, 2, 3], [2, 1, 2]],
+ zauto: false,
+ zmin: 0,
+ zmax: 10,
+ cauto: true,
+ cmin: -10,
+ cmax: 20
+ };
+
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.cauto).toEqual(true);
+ expect(traceOut.cmin).toEqual(-10);
+ expect(traceOut.cmax).toEqual(20);
+ }
+ );
+
+ it(
+ "should default 'c' attributes with if 'surfacecolor' is present",
+ function() {
+ traceIn = {
+ z: [[1, 2, 3], [2, 1, 2]],
+ surfacecolor: [[2, 1, 2], [1, 2, 3]],
+ zauto: false,
+ zmin: 0,
+ zmax: 10
+ };
+
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.cauto).toEqual(true);
+ expect(traceOut.cmin).toBeUndefined();
+ expect(traceOut.cmax).toBeUndefined();
+ }
+ );
+
+ it("should inherit layout.calendar", function() {
+ traceIn = { z: [[1, 2, 3], [2, 1, 2]] };
+ supplyDefaults(traceIn, traceOut, defaultColor, { calendar: "islamic" });
+
+ // we always fill calendar attributes, because it's hard to tell if
+ // we're on a date axis at this point.
+ expect(traceOut.xcalendar).toBe("islamic");
+ expect(traceOut.ycalendar).toBe("islamic");
+ expect(traceOut.zcalendar).toBe("islamic");
+ });
- it('should take its own calendars', function() {
- var traceIn = {
- z: [[1, 2, 3], [2, 1, 2]],
- xcalendar: 'coptic',
- ycalendar: 'ethiopian',
- zcalendar: 'mayan'
- };
-
- supplyDefaults(traceIn, traceOut, defaultColor, layout);
- expect(traceOut.xcalendar).toBe('coptic');
- expect(traceOut.ycalendar).toBe('ethiopian');
- expect(traceOut.zcalendar).toBe('mayan');
- });
+ it("should take its own calendars", function() {
+ var traceIn = {
+ z: [[1, 2, 3], [2, 1, 2]],
+ xcalendar: "coptic",
+ ycalendar: "ethiopian",
+ zcalendar: "mayan"
+ };
+
+ supplyDefaults(traceIn, traceOut, defaultColor, layout);
+ expect(traceOut.xcalendar).toBe("coptic");
+ expect(traceOut.ycalendar).toBe("ethiopian");
+ expect(traceOut.zcalendar).toBe("mayan");
});
+ });
});
diff --git a/test/jasmine/tests/svg_text_utils_test.js b/test/jasmine/tests/svg_text_utils_test.js
index 3468f65317c..a13ba24b5fb 100644
--- a/test/jasmine/tests/svg_text_utils_test.js
+++ b/test/jasmine/tests/svg_text_utils_test.js
@@ -1,207 +1,205 @@
-var d3 = require('d3');
+var d3 = require("d3");
+
+var util = require("@src/lib/svg_text_utils");
+
+describe("svg+text utils", function() {
+ "use strict";
+ describe("convertToTspans should", function() {
+ function mockTextSVGElement(txt) {
+ return d3
+ .select("body")
+ .append("svg")
+ .attr("id", "text")
+ .append("text")
+ .text(txt)
+ .call(util.convertToTspans)
+ .attr("transform", "translate(50,50)");
+ }
+
+ function assertAnchorLink(node, href) {
+ var a = node.select("a");
+
+ expect(a.attr("xlink:href")).toBe(href);
+ expect(a.attr("xlink:show")).toBe(href === null ? null : "new");
+ }
+
+ function assertTspanStyle(node, style) {
+ var tspan = node.select("tspan");
+ expect(tspan.attr("style")).toBe(style);
+ }
+
+ function assertAnchorAttrs(node) {
+ var a = node.select("a");
+
+ var WHITE_LIST = ["xlink:href", "xlink:show", "style"],
+ attrs = listAttributes(a.node());
+
+ // check that no other attribute are found in anchor,
+ // which can be lead to XSS attacks.
+ var hasWrongAttr = attrs.some(function(attr) {
+ return WHITE_LIST.indexOf(attr) === -1;
+ });
+
+ expect(hasWrongAttr).toBe(false);
+ }
+
+ function listAttributes(node) {
+ var items = Array.prototype.slice.call(node.attributes);
+
+ var attrs = items.map(function(item) {
+ return item.name;
+ });
+
+ return attrs;
+ }
+
+ afterEach(function() {
+ d3.select("#text").remove();
+ });
+
+ it("check for XSS attack in href", function() {
+ var node = mockTextSVGElement(
+ "XSS"
+ );
+
+ expect(node.text()).toEqual("XSS");
+ assertAnchorAttrs(node);
+ assertAnchorLink(node, null);
+ });
+
+ it(
+ "check for XSS attack in href (with plenty of white spaces)",
+ function() {
+ var node = mockTextSVGElement(
+ "XSS"
+ );
+
+ expect(node.text()).toEqual("XSS");
+ assertAnchorAttrs(node);
+ assertAnchorLink(node, null);
+ }
+ );
+
+ it("whitelist relative hrefs (interpreted as http)", function() {
+ var node = mockTextSVGElement('mylink');
+
+ expect(node.text()).toEqual("mylink");
+ assertAnchorAttrs(node);
+ assertAnchorLink(node, "/mylink");
+ });
+
+ it("whitelist http hrefs", function() {
+ var node = mockTextSVGElement(
+ 'bl.ocks.org'
+ );
+
+ expect(node.text()).toEqual("bl.ocks.org");
+ assertAnchorAttrs(node);
+ assertAnchorLink(node, "http://bl.ocks.org/");
+ });
+
+ it("whitelist https hrefs", function() {
+ var node = mockTextSVGElement('plot.ly');
+
+ expect(node.text()).toEqual("plot.ly");
+ assertAnchorAttrs(node);
+ assertAnchorLink(node, "https://plot.ly");
+ });
+
+ it("whitelist mailto hrefs", function() {
+ var node = mockTextSVGElement(
+ 'support'
+ );
+
+ expect(node.text()).toEqual("support");
+ assertAnchorAttrs(node);
+ assertAnchorLink(node, "mailto:support@plot.ly");
+ });
-var util = require('@src/lib/svg_text_utils');
+ it("wrap XSS attacks in href", function() {
+ var textCases = [
+ 'Subtitle',
+ 'Subtitle'
+ ];
+
+ textCases.forEach(function(textCase) {
+ var node = mockTextSVGElement(textCase);
+
+ expect(node.text()).toEqual("Subtitle");
+ assertAnchorAttrs(node);
+ assertAnchorLink(
+ node,
+ "XSS onmouseover=alert(1) style=font-size:300px"
+ );
+ });
+ });
+
+ it("should keep query parameters in href", function() {
+ var textCases = [
+ 'abc.com?shared-key',
+ 'abc.com?shared-key'
+ ];
+
+ textCases.forEach(function(textCase) {
+ var node = mockTextSVGElement(textCase);
+
+ assertAnchorAttrs(node);
+ expect(node.text()).toEqual("abc.com?shared-key");
+ assertAnchorLink(
+ node,
+ "https://abc.com/myFeature.jsp?name=abc&pwd=def"
+ );
+ });
+ });
+
+ it("allow basic spans", function() {
+ var node = mockTextSVGElement("text");
+ expect(node.text()).toEqual("text");
+ assertTspanStyle(node, null);
+ });
+
+ it("ignore unquoted styles in spans", function() {
+ var node = mockTextSVGElement("text");
+
+ expect(node.text()).toEqual("text");
+ assertTspanStyle(node, null);
+ });
-describe('svg+text utils', function() {
- 'use strict';
+ it("allow quoted styles in spans", function() {
+ var node = mockTextSVGElement('text');
- describe('convertToTspans should', function() {
+ expect(node.text()).toEqual("text");
+ assertTspanStyle(node, "quoted: yeah;");
+ });
+
+ it("ignore extra stuff after span styles", function() {
+ var node = mockTextSVGElement(
+ 'text'
+ );
+
+ expect(node.text()).toEqual("text");
+ assertTspanStyle(node, "quoted: yeah;");
+ });
+
+ it("escapes HTML entities in span styles", function() {
+ var node = mockTextSVGElement(
+ 'text'
+ );
+
+ expect(node.text()).toEqual("text");
+ assertTspanStyle(node, "quoted: yeah&';;");
+ });
- function mockTextSVGElement(txt) {
- return d3.select('body')
- .append('svg')
- .attr('id', 'text')
- .append('text')
- .text(txt)
- .call(util.convertToTspans)
- .attr('transform', 'translate(50,50)');
- }
-
- function assertAnchorLink(node, href) {
- var a = node.select('a');
+ it("decode some HTML entities in text", function() {
+ var node = mockTextSVGElement(
+ "100μ & < 10 > 0 " +
+ "100 × 20 ± 0.5 °"
+ );
- expect(a.attr('xlink:href')).toBe(href);
- expect(a.attr('xlink:show')).toBe(href === null ? null : 'new');
- }
-
- function assertTspanStyle(node, style) {
- var tspan = node.select('tspan');
- expect(tspan.attr('style')).toBe(style);
- }
-
- function assertAnchorAttrs(node) {
- var a = node.select('a');
-
- var WHITE_LIST = ['xlink:href', 'xlink:show', 'style'],
- attrs = listAttributes(a.node());
-
- // check that no other attribute are found in anchor,
- // which can be lead to XSS attacks.
-
- var hasWrongAttr = attrs.some(function(attr) {
- return WHITE_LIST.indexOf(attr) === -1;
- });
-
- expect(hasWrongAttr).toBe(false);
- }
-
- function listAttributes(node) {
- var items = Array.prototype.slice.call(node.attributes);
-
- var attrs = items.map(function(item) {
- return item.name;
- });
-
- return attrs;
- }
-
- afterEach(function() {
- d3.select('#text').remove();
- });
-
- it('check for XSS attack in href', function() {
- var node = mockTextSVGElement(
- 'XSS'
- );
-
- expect(node.text()).toEqual('XSS');
- assertAnchorAttrs(node);
- assertAnchorLink(node, null);
- });
-
- it('check for XSS attack in href (with plenty of white spaces)', function() {
- var node = mockTextSVGElement(
- 'XSS'
- );
-
- expect(node.text()).toEqual('XSS');
- assertAnchorAttrs(node);
- assertAnchorLink(node, null);
- });
-
- it('whitelist relative hrefs (interpreted as http)', function() {
- var node = mockTextSVGElement(
- 'mylink'
- );
-
- expect(node.text()).toEqual('mylink');
- assertAnchorAttrs(node);
- assertAnchorLink(node, '/mylink');
- });
-
- it('whitelist http hrefs', function() {
- var node = mockTextSVGElement(
- 'bl.ocks.org'
- );
-
- expect(node.text()).toEqual('bl.ocks.org');
- assertAnchorAttrs(node);
- assertAnchorLink(node, 'http://bl.ocks.org/');
- });
-
- it('whitelist https hrefs', function() {
- var node = mockTextSVGElement(
- 'plot.ly'
- );
-
- expect(node.text()).toEqual('plot.ly');
- assertAnchorAttrs(node);
- assertAnchorLink(node, 'https://plot.ly');
- });
-
- it('whitelist mailto hrefs', function() {
- var node = mockTextSVGElement(
- 'support'
- );
-
- expect(node.text()).toEqual('support');
- assertAnchorAttrs(node);
- assertAnchorLink(node, 'mailto:support@plot.ly');
- });
-
- it('wrap XSS attacks in href', function() {
- var textCases = [
- 'Subtitle',
- 'Subtitle'
- ];
-
- textCases.forEach(function(textCase) {
- var node = mockTextSVGElement(textCase);
-
- expect(node.text()).toEqual('Subtitle');
- assertAnchorAttrs(node);
- assertAnchorLink(node, 'XSS onmouseover=alert(1) style=font-size:300px');
- });
- });
-
- it('should keep query parameters in href', function() {
- var textCases = [
- 'abc.com?shared-key',
- 'abc.com?shared-key'
- ];
-
- textCases.forEach(function(textCase) {
- var node = mockTextSVGElement(textCase);
-
- assertAnchorAttrs(node);
- expect(node.text()).toEqual('abc.com?shared-key');
- assertAnchorLink(node, 'https://abc.com/myFeature.jsp?name=abc&pwd=def');
- });
- });
-
- it('allow basic spans', function() {
- var node = mockTextSVGElement(
- 'text'
- );
-
- expect(node.text()).toEqual('text');
- assertTspanStyle(node, null);
- });
-
- it('ignore unquoted styles in spans', function() {
- var node = mockTextSVGElement(
- 'text'
- );
-
- expect(node.text()).toEqual('text');
- assertTspanStyle(node, null);
- });
-
- it('allow quoted styles in spans', function() {
- var node = mockTextSVGElement(
- 'text'
- );
-
- expect(node.text()).toEqual('text');
- assertTspanStyle(node, 'quoted: yeah;');
- });
-
- it('ignore extra stuff after span styles', function() {
- var node = mockTextSVGElement(
- 'text'
- );
-
- expect(node.text()).toEqual('text');
- assertTspanStyle(node, 'quoted: yeah;');
- });
-
- it('escapes HTML entities in span styles', function() {
- var node = mockTextSVGElement(
- 'text'
- );
-
- expect(node.text()).toEqual('text');
- assertTspanStyle(node, 'quoted: yeah&\';;');
- });
-
- it('decode some HTML entities in text', function() {
- var node = mockTextSVGElement(
- '100μ & < 10 > 0 ' +
- '100 × 20 ± 0.5 °'
- );
-
- expect(node.text()).toEqual('100μ & < 10 > 0 100 × 20 ± 0.5 °');
- });
+ expect(node.text()).toEqual(
+ "100\u03BC & < 10 > 0 \xA0100 \xD7 20 \xB1 0.5 \xB0"
+ );
});
+ });
});
diff --git a/test/jasmine/tests/ternary_test.js b/test/jasmine/tests/ternary_test.js
index c563a500b1b..5393002cb0e 100644
--- a/test/jasmine/tests/ternary_test.js
+++ b/test/jasmine/tests/ternary_test.js
@@ -1,336 +1,390 @@
-var Plotly = require('@lib');
-var Lib = require('@src/lib');
+var Plotly = require("@lib");
+var Lib = require("@src/lib");
-var supplyLayoutDefaults = require('@src/plots/ternary/layout/defaults');
+var supplyLayoutDefaults = require("@src/plots/ternary/layout/defaults");
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var mouseEvent = require('../assets/mouse_event');
-var click = require('../assets/click');
-var doubleClick = require('../assets/double_click');
-var customMatchers = require('../assets/custom_matchers');
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var mouseEvent = require("../assets/mouse_event");
+var click = require("../assets/click");
+var doubleClick = require("../assets/double_click");
+var customMatchers = require("../assets/custom_matchers");
+describe("ternary plots", function() {
+ "use strict";
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
-describe('ternary plots', function() {
- 'use strict';
+ afterEach(destroyGraphDiv);
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
- });
-
- afterEach(destroyGraphDiv);
-
- describe('with scatterternary trace(s)', function() {
- var mock = require('@mocks/ternary_simple.json');
- var gd;
-
- var pointPos = [391, 219];
- var blankPos = [200, 200];
-
- beforeEach(function(done) {
- gd = createGraphDiv();
-
- var mockCopy = Lib.extendDeep({}, mock);
-
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
- });
-
- it('should be able to toggle trace visibility', function(done) {
- expect(countTraces('scatter')).toEqual(1);
-
- Plotly.restyle(gd, 'visible', false).then(function() {
- expect(countTraces('scatter')).toEqual(0);
-
- return Plotly.restyle(gd, 'visible', true);
- }).then(function() {
- expect(countTraces('scatter')).toEqual(1);
-
- return Plotly.restyle(gd, 'visible', 'legendonly');
- }).then(function() {
- expect(countTraces('scatter')).toEqual(0);
+ describe("with scatterternary trace(s)", function() {
+ var mock = require("@mocks/ternary_simple.json");
+ var gd;
- return Plotly.restyle(gd, 'visible', true);
- }).then(function() {
- expect(countTraces('scatter')).toEqual(1);
+ var pointPos = [391, 219];
+ var blankPos = [200, 200];
- done();
- });
- });
-
- it('should be able to delete and add traces', function(done) {
- expect(countTernarySubplot()).toEqual(1);
- expect(countTraces('scatter')).toEqual(1);
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- Plotly.deleteTraces(gd, [0]).then(function() {
- expect(countTernarySubplot()).toEqual(0);
- expect(countTraces('scatter')).toEqual(0);
+ var mockCopy = Lib.extendDeep({}, mock);
- var trace = Lib.extendDeep({}, mock.data[0]);
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- return Plotly.addTraces(gd, [trace]);
- }).then(function() {
- expect(countTernarySubplot()).toEqual(1);
- expect(countTraces('scatter')).toEqual(1);
+ it("should be able to toggle trace visibility", function(done) {
+ expect(countTraces("scatter")).toEqual(1);
- var trace = Lib.extendDeep({}, mock.data[0]);
+ Plotly.restyle(gd, "visible", false)
+ .then(function() {
+ expect(countTraces("scatter")).toEqual(0);
- return Plotly.addTraces(gd, [trace]);
- }).then(function() {
- expect(countTernarySubplot()).toEqual(1);
- expect(countTraces('scatter')).toEqual(2);
+ return Plotly.restyle(gd, "visible", true);
+ })
+ .then(function() {
+ expect(countTraces("scatter")).toEqual(1);
- return Plotly.deleteTraces(gd, [0]);
- }).then(function() {
- expect(countTernarySubplot()).toEqual(1);
- expect(countTraces('scatter')).toEqual(1);
+ return Plotly.restyle(gd, "visible", "legendonly");
+ })
+ .then(function() {
+ expect(countTraces("scatter")).toEqual(0);
- done();
- });
- });
+ return Plotly.restyle(gd, "visible", true);
+ })
+ .then(function() {
+ expect(countTraces("scatter")).toEqual(1);
- it('should be able to restyle', function(done) {
- Plotly.restyle(gd, { a: [[1, 2, 3]]}, 0).then(function() {
- var transforms = [];
- d3.selectAll('.ternary .point').each(function() {
- var point = d3.select(this);
- transforms.push(point.attr('transform'));
- });
-
- expect(transforms).toEqual([
- 'translate(186.45,209.8)',
- 'translate(118.53,170.59)',
- 'translate(248.76,117.69)'
- ]);
- }).then(done);
+ done();
});
+ });
- it('should display to hover labels', function() {
- var hoverLabels;
-
- mouseEvent('mousemove', blankPos[0], blankPos[1]);
- hoverLabels = findHoverLabels();
- expect(hoverLabels.size()).toEqual(0, 'only on data points');
+ it("should be able to delete and add traces", function(done) {
+ expect(countTernarySubplot()).toEqual(1);
+ expect(countTraces("scatter")).toEqual(1);
- mouseEvent('mousemove', pointPos[0], pointPos[1]);
- hoverLabels = findHoverLabels();
- expect(hoverLabels.size()).toEqual(1, 'one per data point');
+ Plotly.deleteTraces(gd, [0])
+ .then(function() {
+ expect(countTernarySubplot()).toEqual(0);
+ expect(countTraces("scatter")).toEqual(0);
- var rows = hoverLabels.selectAll('tspan');
- expect(rows[0][0].innerHTML).toEqual('Component A: 0.5', 'with correct text');
- expect(rows[0][1].innerHTML).toEqual('B: 0.25', 'with correct text');
- expect(rows[0][2].innerHTML).toEqual('Component C: 0.25', 'with correct text');
- });
+ var trace = Lib.extendDeep({}, mock.data[0]);
- it('should respond to hover interactions by', function() {
- var hoverCnt = 0,
- unhoverCnt = 0;
-
- var hoverData, unhoverData;
-
- gd.on('plotly_hover', function(eventData) {
- hoverCnt++;
- hoverData = eventData.points[0];
- });
-
- gd.on('plotly_unhover', function(eventData) {
- unhoverCnt++;
- unhoverData = eventData.points[0];
- });
-
- mouseEvent('mousemove', blankPos[0], blankPos[1]);
- expect(hoverData).toBe(undefined, 'not firing on blank points');
- expect(unhoverData).toBe(undefined, 'not firing on blank points');
-
- mouseEvent('mousemove', pointPos[0], pointPos[1]);
- expect(hoverData).not.toBe(undefined, 'firing on data points');
- expect(Object.keys(hoverData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber',
- 'x', 'y', 'xaxis', 'yaxis'
- ], 'returning the correct event data keys');
- expect(hoverData.curveNumber).toEqual(0, 'returning the correct curve number');
- expect(hoverData.pointNumber).toEqual(0, 'returning the correct point number');
-
- mouseEvent('mouseout', pointPos[0], pointPos[1]);
- expect(unhoverData).not.toBe(undefined, 'firing on data points');
- expect(Object.keys(unhoverData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber',
- 'x', 'y', 'xaxis', 'yaxis'
- ], 'returning the correct event data keys');
- expect(unhoverData.curveNumber).toEqual(0, 'returning the correct curve number');
- expect(unhoverData.pointNumber).toEqual(0, 'returning the correct point number');
-
- expect(hoverCnt).toEqual(1);
- expect(unhoverCnt).toEqual(1);
- });
+ return Plotly.addTraces(gd, [trace]);
+ })
+ .then(function() {
+ expect(countTernarySubplot()).toEqual(1);
+ expect(countTraces("scatter")).toEqual(1);
- it('should respond to click interactions by', function() {
- var ptData;
+ var trace = Lib.extendDeep({}, mock.data[0]);
- gd.on('plotly_click', function(eventData) {
- ptData = eventData.points[0];
- });
+ return Plotly.addTraces(gd, [trace]);
+ })
+ .then(function() {
+ expect(countTernarySubplot()).toEqual(1);
+ expect(countTraces("scatter")).toEqual(2);
- click(blankPos[0], blankPos[1]);
- expect(ptData).toBe(undefined, 'not firing on blank points');
+ return Plotly.deleteTraces(gd, [0]);
+ })
+ .then(function() {
+ expect(countTernarySubplot()).toEqual(1);
+ expect(countTraces("scatter")).toEqual(1);
- click(pointPos[0], pointPos[1]);
- expect(ptData).not.toBe(undefined, 'firing on data points');
- expect(Object.keys(ptData)).toEqual([
- 'data', 'fullData', 'curveNumber', 'pointNumber',
- 'x', 'y', 'xaxis', 'yaxis'
- ], 'returning the correct event data keys');
- expect(ptData.curveNumber).toEqual(0, 'returning the correct curve number');
- expect(ptData.pointNumber).toEqual(0, 'returning the correct point number');
- });
-
- it('should respond zoom drag interactions', function(done) {
- assertRange(gd, [0.231, 0.2, 0.11]);
-
- drag([[383, 213], [293, 243]]);
- assertRange(gd, [0.4435, 0.2462, 0.1523]);
-
- doubleClick(pointPos[0], pointPos[1]).then(function() {
- assertRange(gd, [0, 0, 0]);
-
- done();
- });
+ done();
});
});
- describe('static plots', function() {
- var mock = require('@mocks/ternary_simple.json');
- var gd;
-
- beforeEach(function(done) {
- gd = createGraphDiv();
+ it("should be able to restyle", function(done) {
+ Plotly.restyle(gd, { a: [[1, 2, 3]] }, 0)
+ .then(function() {
+ var transforms = [];
+ d3.selectAll(".ternary .point").each(function() {
+ var point = d3.select(this);
+ transforms.push(point.attr("transform"));
+ });
+
+ expect(transforms).toEqual([
+ "translate(186.45,209.8)",
+ "translate(118.53,170.59)",
+ "translate(248.76,117.69)"
+ ]);
+ })
+ .then(done);
+ });
- var mockCopy = Lib.extendDeep({}, mock);
- var config = { staticPlot: true };
+ it("should display to hover labels", function() {
+ var hoverLabels;
+
+ mouseEvent("mousemove", blankPos[0], blankPos[1]);
+ hoverLabels = findHoverLabels();
+ expect(hoverLabels.size()).toEqual(0, "only on data points");
+
+ mouseEvent("mousemove", pointPos[0], pointPos[1]);
+ hoverLabels = findHoverLabels();
+ expect(hoverLabels.size()).toEqual(1, "one per data point");
+
+ var rows = hoverLabels.selectAll("tspan");
+ expect(rows[0][0].innerHTML).toEqual(
+ "Component A: 0.5",
+ "with correct text"
+ );
+ expect(rows[0][1].innerHTML).toEqual("B: 0.25", "with correct text");
+ expect(rows[0][2].innerHTML).toEqual(
+ "Component C: 0.25",
+ "with correct text"
+ );
+ });
- Plotly.plot(gd, mockCopy.data, mockCopy.layout, config).then(done);
- });
+ it("should respond to hover interactions by", function() {
+ var hoverCnt = 0, unhoverCnt = 0;
+
+ var hoverData, unhoverData;
+
+ gd.on("plotly_hover", function(eventData) {
+ hoverCnt++;
+ hoverData = eventData.points[0];
+ });
+
+ gd.on("plotly_unhover", function(eventData) {
+ unhoverCnt++;
+ unhoverData = eventData.points[0];
+ });
+
+ mouseEvent("mousemove", blankPos[0], blankPos[1]);
+ expect(hoverData).toBe(undefined, "not firing on blank points");
+ expect(unhoverData).toBe(undefined, "not firing on blank points");
+
+ mouseEvent("mousemove", pointPos[0], pointPos[1]);
+ expect(hoverData).not.toBe(undefined, "firing on data points");
+ expect(Object.keys(hoverData)).toEqual(
+ [
+ "data",
+ "fullData",
+ "curveNumber",
+ "pointNumber",
+ "x",
+ "y",
+ "xaxis",
+ "yaxis"
+ ],
+ "returning the correct event data keys"
+ );
+ expect(hoverData.curveNumber).toEqual(
+ 0,
+ "returning the correct curve number"
+ );
+ expect(hoverData.pointNumber).toEqual(
+ 0,
+ "returning the correct point number"
+ );
+
+ mouseEvent("mouseout", pointPos[0], pointPos[1]);
+ expect(unhoverData).not.toBe(undefined, "firing on data points");
+ expect(Object.keys(unhoverData)).toEqual(
+ [
+ "data",
+ "fullData",
+ "curveNumber",
+ "pointNumber",
+ "x",
+ "y",
+ "xaxis",
+ "yaxis"
+ ],
+ "returning the correct event data keys"
+ );
+ expect(unhoverData.curveNumber).toEqual(
+ 0,
+ "returning the correct curve number"
+ );
+ expect(unhoverData.pointNumber).toEqual(
+ 0,
+ "returning the correct point number"
+ );
+
+ expect(hoverCnt).toEqual(1);
+ expect(unhoverCnt).toEqual(1);
+ });
- it('should not respond to drag', function(done) {
- var range = [0.231, 0.2, 0.11];
+ it("should respond to click interactions by", function() {
+ var ptData;
+
+ gd.on("plotly_click", function(eventData) {
+ ptData = eventData.points[0];
+ });
+
+ click(blankPos[0], blankPos[1]);
+ expect(ptData).toBe(undefined, "not firing on blank points");
+
+ click(pointPos[0], pointPos[1]);
+ expect(ptData).not.toBe(undefined, "firing on data points");
+ expect(Object.keys(ptData)).toEqual(
+ [
+ "data",
+ "fullData",
+ "curveNumber",
+ "pointNumber",
+ "x",
+ "y",
+ "xaxis",
+ "yaxis"
+ ],
+ "returning the correct event data keys"
+ );
+ expect(ptData.curveNumber).toEqual(
+ 0,
+ "returning the correct curve number"
+ );
+ expect(ptData.pointNumber).toEqual(
+ 0,
+ "returning the correct point number"
+ );
+ });
- assertRange(gd, range);
+ it("should respond zoom drag interactions", function(done) {
+ assertRange(gd, [0.231, 0.2, 0.11]);
- drag([[390, 220], [300, 250]]);
- assertRange(gd, range);
+ drag([[383, 213], [293, 243]]);
+ assertRange(gd, [0.4435, 0.2462, 0.1523]);
- doubleClick(390, 220).then(function() {
- assertRange(gd, range);
+ doubleClick(pointPos[0], pointPos[1]).then(function() {
+ assertRange(gd, [0, 0, 0]);
- done();
- });
- });
+ done();
+ });
});
+ });
- function countTernarySubplot() {
- return d3.selectAll('.ternary').size();
- }
+ describe("static plots", function() {
+ var mock = require("@mocks/ternary_simple.json");
+ var gd;
- function countTraces(type) {
- return d3.selectAll('.ternary').selectAll('g.trace.' + type).size();
- }
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- function findHoverLabels() {
- return d3.select('.hoverlayer').selectAll('g');
- }
+ var mockCopy = Lib.extendDeep({}, mock);
+ var config = { staticPlot: true };
- function drag(path) {
- var len = path.length;
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout, config).then(done);
+ });
- mouseEvent('mousemove', path[0][0], path[0][1]);
- mouseEvent('mousedown', path[0][0], path[0][1]);
+ it("should not respond to drag", function(done) {
+ var range = [0.231, 0.2, 0.11];
- path.slice(1, len).forEach(function(pt) {
- mouseEvent('mousemove', pt[0], pt[1]);
- });
+ assertRange(gd, range);
- mouseEvent('mouseup', path[len - 1][0], path[len - 1][1]);
- }
+ drag([[390, 220], [300, 250]]);
+ assertRange(gd, range);
- function assertRange(gd, expected) {
- var ternary = gd._fullLayout.ternary;
- var actual = [
- ternary.aaxis.min,
- ternary.baxis.min,
- ternary.caxis.min
- ];
+ doubleClick(390, 220).then(function() {
+ assertRange(gd, range);
- expect(actual).toBeCloseToArray(expected);
- }
-});
+ done();
+ });
+ });
+ });
-describe('ternary defaults', function() {
- 'use strict';
+ function countTernarySubplot() {
+ return d3.selectAll(".ternary").size();
+ }
- var layoutIn, layoutOut, fullData;
+ function countTraces(type) {
+ return d3.selectAll(".ternary").selectAll("g.trace." + type).size();
+ }
- beforeEach(function() {
- layoutOut = {
- font: { color: 'red' }
- };
+ function findHoverLabels() {
+ return d3.select(".hoverlayer").selectAll("g");
+ }
- // needs a ternary-ref in a trace in order to be detected
- fullData = [{ type: 'scatterternary', subplot: 'ternary' }];
- });
+ function drag(path) {
+ var len = path.length;
- it('should fill empty containers', function() {
- layoutIn = {};
+ mouseEvent("mousemove", path[0][0], path[0][1]);
+ mouseEvent("mousedown", path[0][0], path[0][1]);
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutIn).toEqual({ ternary: {} });
- expect(layoutOut.ternary.aaxis.type).toEqual('linear');
- expect(layoutOut.ternary.baxis.type).toEqual('linear');
- expect(layoutOut.ternary.caxis.type).toEqual('linear');
+ path.slice(1, len).forEach(function(pt) {
+ mouseEvent("mousemove", pt[0], pt[1]);
});
- it('should coerce \'min\' values to 0 and delete them for user data if they contradict', function() {
- layoutIn = {
- ternary: {
- aaxis: { min: 1 },
- baxis: { min: 1 },
- caxis: { min: 1 },
- sum: 2
- }
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.ternary.aaxis.min).toEqual(0);
- expect(layoutOut.ternary.baxis.min).toEqual(0);
- expect(layoutOut.ternary.caxis.min).toEqual(0);
- expect(layoutOut.ternary.sum).toEqual(2);
- expect(layoutIn.ternary.aaxis.min).toBeUndefined();
- expect(layoutIn.ternary.baxis.min).toBeUndefined();
- expect(layoutIn.ternary.caxis.min).toBeUndefined();
- });
+ mouseEvent("mouseup", path[len - 1][0], path[len - 1][1]);
+ }
- it('should default \'title\' to Component + _name', function() {
- layoutIn = {};
+ function assertRange(gd, expected) {
+ var ternary = gd._fullLayout.ternary;
+ var actual = [ternary.aaxis.min, ternary.baxis.min, ternary.caxis.min];
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.ternary.aaxis.title).toEqual('Component A');
- expect(layoutOut.ternary.baxis.title).toEqual('Component B');
- expect(layoutOut.ternary.caxis.title).toEqual('Component C');
- });
+ expect(actual).toBeCloseToArray(expected);
+ }
+});
- it('should default \'gricolor\' to 60% dark', function() {
- layoutIn = {
- ternary: {
- aaxis: { showgrid: true, color: 'red' },
- baxis: { showgrid: true },
- caxis: { gridcolor: 'black' },
- bgcolor: 'blue'
- },
- paper_bgcolor: 'green'
- };
-
- supplyLayoutDefaults(layoutIn, layoutOut, fullData);
- expect(layoutOut.ternary.aaxis.gridcolor).toEqual('rgb(102, 0, 153)');
- expect(layoutOut.ternary.baxis.gridcolor).toEqual('rgb(27, 27, 180)');
- expect(layoutOut.ternary.caxis.gridcolor).toEqual('black');
- });
+describe("ternary defaults", function() {
+ "use strict";
+ var layoutIn, layoutOut, fullData;
+
+ beforeEach(function() {
+ layoutOut = { font: { color: "red" } };
+
+ // needs a ternary-ref in a trace in order to be detected
+ fullData = [{ type: "scatterternary", subplot: "ternary" }];
+ });
+
+ it("should fill empty containers", function() {
+ layoutIn = {};
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutIn).toEqual({ ternary: {} });
+ expect(layoutOut.ternary.aaxis.type).toEqual("linear");
+ expect(layoutOut.ternary.baxis.type).toEqual("linear");
+ expect(layoutOut.ternary.caxis.type).toEqual("linear");
+ });
+
+ it(
+ "should coerce 'min' values to 0 and delete them for user data if they contradict",
+ function() {
+ layoutIn = {
+ ternary: {
+ aaxis: { min: 1 },
+ baxis: { min: 1 },
+ caxis: { min: 1 },
+ sum: 2
+ }
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.ternary.aaxis.min).toEqual(0);
+ expect(layoutOut.ternary.baxis.min).toEqual(0);
+ expect(layoutOut.ternary.caxis.min).toEqual(0);
+ expect(layoutOut.ternary.sum).toEqual(2);
+ expect(layoutIn.ternary.aaxis.min).toBeUndefined();
+ expect(layoutIn.ternary.baxis.min).toBeUndefined();
+ expect(layoutIn.ternary.caxis.min).toBeUndefined();
+ }
+ );
+
+ it("should default 'title' to Component + _name", function() {
+ layoutIn = {};
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.ternary.aaxis.title).toEqual("Component A");
+ expect(layoutOut.ternary.baxis.title).toEqual("Component B");
+ expect(layoutOut.ternary.caxis.title).toEqual("Component C");
+ });
+
+ it("should default 'gricolor' to 60% dark", function() {
+ layoutIn = {
+ ternary: {
+ aaxis: { showgrid: true, color: "red" },
+ baxis: { showgrid: true },
+ caxis: { gridcolor: "black" },
+ bgcolor: "blue"
+ },
+ paper_bgcolor: "green"
+ };
+
+ supplyLayoutDefaults(layoutIn, layoutOut, fullData);
+ expect(layoutOut.ternary.aaxis.gridcolor).toEqual("rgb(102, 0, 153)");
+ expect(layoutOut.ternary.baxis.gridcolor).toEqual("rgb(27, 27, 180)");
+ expect(layoutOut.ternary.caxis.gridcolor).toEqual("black");
+ });
});
diff --git a/test/jasmine/tests/titles_test.js b/test/jasmine/tests/titles_test.js
index 7e6b58e64d5..e837b2d17cc 100644
--- a/test/jasmine/tests/titles_test.js
+++ b/test/jasmine/tests/titles_test.js
@@ -1,123 +1,131 @@
-var d3 = require('d3');
-
-var Plotly = require('@lib/index');
-var interactConstants = require('@src/constants/interactions');
-
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var mouseEvent = require('../assets/mouse_event');
-
-describe('editable titles', function() {
- 'use strict';
-
- var data = [{x: [1, 2, 3], y: [1, 2, 3]}];
-
- var gd;
-
- afterEach(destroyGraphDiv);
-
- beforeEach(function() {
- gd = createGraphDiv();
+var d3 = require("d3");
+
+var Plotly = require("@lib/index");
+var interactConstants = require("@src/constants/interactions");
+
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var mouseEvent = require("../assets/mouse_event");
+
+describe("editable titles", function() {
+ "use strict";
+ var data = [{ x: [1, 2, 3], y: [1, 2, 3] }];
+
+ var gd;
+
+ afterEach(destroyGraphDiv);
+
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
+
+ function checkTitle(letter, text, opacityOut, opacityIn) {
+ var titleEl = d3.select("." + letter + "title");
+ expect(titleEl.text()).toBe(text);
+ expect(+titleEl.style("opacity")).toBe(opacityOut);
+
+ var bb = titleEl.node().getBoundingClientRect(),
+ xCenter = (bb.left + bb.right) / 2,
+ yCenter = (bb.top + bb.bottom) / 2,
+ done,
+ promise = new Promise(function(resolve) {
+ done = resolve;
+ });
+
+ mouseEvent("mouseover", xCenter, yCenter);
+ setTimeout(
+ function() {
+ expect(+titleEl.style("opacity")).toBe(opacityIn);
+
+ mouseEvent("mouseout", xCenter, yCenter);
+ setTimeout(
+ function() {
+ expect(+titleEl.style("opacity")).toBe(opacityOut);
+ done();
+ },
+ interactConstants.HIDE_PLACEHOLDER + 50
+ );
+ },
+ interactConstants.SHOW_PLACEHOLDER + 50
+ );
+
+ return promise;
+ }
+
+ function editTitle(letter, attr, text) {
+ return new Promise(function(resolve) {
+ gd.once("plotly_relayout", function(eventData) {
+ expect(eventData[attr]).toEqual(text, [letter, attr, eventData]);
+ setTimeout(resolve, 10);
+ });
+
+ var textNode = document.querySelector("." + letter + "title");
+ textNode.dispatchEvent(new window.MouseEvent("click"));
+
+ var editNode = document.querySelector(".plugin-editable.editable");
+ editNode.dispatchEvent(new window.FocusEvent("focus"));
+ editNode.textContent = text;
+ editNode.dispatchEvent(new window.FocusEvent("focus"));
+ editNode.dispatchEvent(new window.FocusEvent("blur"));
});
-
- function checkTitle(letter, text, opacityOut, opacityIn) {
- var titleEl = d3.select('.' + letter + 'title');
- expect(titleEl.text()).toBe(text);
- expect(+titleEl.style('opacity')).toBe(opacityOut);
-
- var bb = titleEl.node().getBoundingClientRect(),
- xCenter = (bb.left + bb.right) / 2,
- yCenter = (bb.top + bb.bottom) / 2,
- done,
- promise = new Promise(function(resolve) { done = resolve; });
-
- mouseEvent('mouseover', xCenter, yCenter);
- setTimeout(function() {
- expect(+titleEl.style('opacity')).toBe(opacityIn);
-
- mouseEvent('mouseout', xCenter, yCenter);
- setTimeout(function() {
- expect(+titleEl.style('opacity')).toBe(opacityOut);
- done();
- }, interactConstants.HIDE_PLACEHOLDER + 50);
- }, interactConstants.SHOW_PLACEHOLDER + 50);
-
- return promise;
- }
-
- function editTitle(letter, attr, text) {
- return new Promise(function(resolve) {
- gd.once('plotly_relayout', function(eventData) {
- expect(eventData[attr]).toEqual(text, [letter, attr, eventData]);
- setTimeout(resolve, 10);
- });
-
- var textNode = document.querySelector('.' + letter + 'title');
- textNode.dispatchEvent(new window.MouseEvent('click'));
-
- var editNode = document.querySelector('.plugin-editable.editable');
- editNode.dispatchEvent(new window.FocusEvent('focus'));
- editNode.textContent = text;
- editNode.dispatchEvent(new window.FocusEvent('focus'));
- editNode.dispatchEvent(new window.FocusEvent('blur'));
- });
- }
-
- it('shows default titles semi-opaque with no hover effects', function(done) {
- Plotly.plot(gd, data, {}, {editable: true})
- .then(function() {
- return Promise.all([
- // Check all three titles in parallel. This only works because
- // we're using synthetic events, not a real mouse. It's a big
- // win though because the test takes 1.2 seconds with the
- // animations...
- checkTitle('x', 'Click to enter X axis title', 0.2, 0.2),
- checkTitle('y', 'Click to enter Y axis title', 0.2, 0.2),
- checkTitle('g', 'Click to enter Plot title', 0.2, 0.2)
- ]);
- })
- .then(done);
- });
-
- it('has hover effects for blank titles', function(done) {
- Plotly.plot(gd, data, {
- xaxis: {title: ''},
- yaxis: {title: ''},
- title: ''
- }, {editable: true})
- .then(function() {
- return Promise.all([
- checkTitle('x', 'Click to enter X axis title', 0, 1),
- checkTitle('y', 'Click to enter Y axis title', 0, 1),
- checkTitle('g', 'Click to enter Plot title', 0, 1)
- ]);
- })
- .then(done);
- });
-
- it('has no hover effects for titles that used to be blank', function(done) {
- Plotly.plot(gd, data, {
- xaxis: {title: ''},
- yaxis: {title: ''},
- title: ''
- }, {editable: true})
- .then(function() {
- return editTitle('x', 'xaxis.title', 'XXX');
- })
- .then(function() {
- return editTitle('y', 'yaxis.title', 'YYY');
- })
- .then(function() {
- return editTitle('g', 'title', 'TTT');
- })
- .then(function() {
- return Promise.all([
- checkTitle('x', 'XXX', 1, 1),
- checkTitle('y', 'YYY', 1, 1),
- checkTitle('g', 'TTT', 1, 1)
- ]);
- })
- .then(done);
- });
-
+ }
+
+ it("shows default titles semi-opaque with no hover effects", function(done) {
+ Plotly.plot(gd, data, {}, { editable: true })
+ .then(function() {
+ return Promise.all([
+ // Check all three titles in parallel. This only works because
+ // we're using synthetic events, not a real mouse. It's a big
+ // win though because the test takes 1.2 seconds with the
+ // animations...
+ checkTitle("x", "Click to enter X axis title", 0.2, 0.2),
+ checkTitle("y", "Click to enter Y axis title", 0.2, 0.2),
+ checkTitle("g", "Click to enter Plot title", 0.2, 0.2)
+ ]);
+ })
+ .then(done);
+ });
+
+ it("has hover effects for blank titles", function(done) {
+ Plotly.plot(
+ gd,
+ data,
+ { xaxis: { title: "" }, yaxis: { title: "" }, title: "" },
+ { editable: true }
+ )
+ .then(function() {
+ return Promise.all([
+ checkTitle("x", "Click to enter X axis title", 0, 1),
+ checkTitle("y", "Click to enter Y axis title", 0, 1),
+ checkTitle("g", "Click to enter Plot title", 0, 1)
+ ]);
+ })
+ .then(done);
+ });
+
+ it("has no hover effects for titles that used to be blank", function(done) {
+ Plotly.plot(
+ gd,
+ data,
+ { xaxis: { title: "" }, yaxis: { title: "" }, title: "" },
+ { editable: true }
+ )
+ .then(function() {
+ return editTitle("x", "xaxis.title", "XXX");
+ })
+ .then(function() {
+ return editTitle("y", "yaxis.title", "YYY");
+ })
+ .then(function() {
+ return editTitle("g", "title", "TTT");
+ })
+ .then(function() {
+ return Promise.all([
+ checkTitle("x", "XXX", 1, 1),
+ checkTitle("y", "YYY", 1, 1),
+ checkTitle("g", "TTT", 1, 1)
+ ]);
+ })
+ .then(done);
+ });
});
diff --git a/test/jasmine/tests/toimage_test.js b/test/jasmine/tests/toimage_test.js
index 6cde6567067..1e79ebdf4bf 100644
--- a/test/jasmine/tests/toimage_test.js
+++ b/test/jasmine/tests/toimage_test.js
@@ -1,122 +1,131 @@
// move toimage to plot_api_test.js
// once established and confirmed?
-var Plotly = require('@lib/index');
-
-var d3 = require('d3');
-var createGraphDiv = require('../assets/create_graph_div');
-var subplotMock = require('@mocks/multiple_subplots.json');
-
-
-describe('Plotly.toImage', function() {
- 'use strict';
-
- var gd;
-
- beforeEach(function() {
- gd = createGraphDiv();
- });
-
- afterEach(function() {
-
- // make sure ALL graph divs are deleted,
- // even the ones generated by Plotly.toImage
- d3.selectAll('.js-plotly-plot').remove();
- d3.selectAll('#graph').remove();
- });
-
- it('should be attached to Plotly', function() {
- expect(Plotly.toImage).toBeDefined();
- });
-
- it('should return a promise', function(done) {
- function isPromise(x) {
- return !!x.then && typeof x.then === 'function';
- }
-
- var returnValue = Plotly.plot(gd, subplotMock.data, subplotMock.layout)
- .then(Plotly.toImage);
-
- expect(isPromise(returnValue)).toBe(true);
-
- returnValue.then(done);
+var Plotly = require("@lib/index");
+
+var d3 = require("d3");
+var createGraphDiv = require("../assets/create_graph_div");
+var subplotMock = require("@mocks/multiple_subplots.json");
+
+describe("Plotly.toImage", function() {
+ "use strict";
+ var gd;
+
+ beforeEach(function() {
+ gd = createGraphDiv();
+ });
+
+ afterEach(function() {
+ // make sure ALL graph divs are deleted,
+ // even the ones generated by Plotly.toImage
+ d3.selectAll(".js-plotly-plot").remove();
+ d3.selectAll("#graph").remove();
+ });
+
+ it("should be attached to Plotly", function() {
+ expect(Plotly.toImage).toBeDefined();
+ });
+
+ it("should return a promise", function(done) {
+ function isPromise(x) {
+ return !!x.then && typeof x.then === "function";
+ }
+
+ var returnValue = Plotly.plot(
+ gd,
+ subplotMock.data,
+ subplotMock.layout
+ ).then(Plotly.toImage);
+
+ expect(isPromise(returnValue)).toBe(true);
+
+ returnValue.then(done);
+ });
+
+ it("should throw error with unsupported file type", function(done) {
+ // error should actually come in the svgToImg step
+ Plotly.plot(gd, subplotMock.data, subplotMock.layout).then(function(gd) {
+ Plotly.toImage(gd, { format: "x" }).catch(function(err) {
+ expect(err.message).toEqual("Image format is not jpeg, png or svg");
+ done();
+ });
});
-
- it('should throw error with unsupported file type', function(done) {
- // error should actually come in the svgToImg step
-
- Plotly.plot(gd, subplotMock.data, subplotMock.layout)
- .then(function(gd) {
- Plotly.toImage(gd, {format: 'x'}).catch(function(err) {
- expect(err.message).toEqual('Image format is not jpeg, png or svg');
- done();
- });
- });
-
- });
-
- it('should throw error with height and/or width < 1', function(done) {
- // let user know that Plotly expects pixel values
- Plotly.plot(gd, subplotMock.data, subplotMock.layout)
- .then(function(gd) {
- return Plotly.toImage(gd, {height: 0.5}).catch(function(err) {
- expect(err.message).toEqual('Height and width should be pixel values.');
- });
- }).then(function() {
- Plotly.toImage(gd, {width: 0.5}).catch(function(err) {
- expect(err.message).toEqual('Height and width should be pixel values.');
- done();
- });
- });
- });
-
- it('should create img with proper height and width', function(done) {
- var img = document.createElement('img');
-
- // specify height and width
- subplotMock.layout.height = 600;
- subplotMock.layout.width = 700;
-
- Plotly.plot(gd, subplotMock.data, subplotMock.layout).then(function(gd) {
- expect(gd.layout.height).toBe(600);
- expect(gd.layout.width).toBe(700);
- return Plotly.toImage(gd);
- }).then(function(url) {
- return new Promise(function(resolve) {
- img.src = url;
- img.onload = function() {
- expect(img.height).toBe(600);
- expect(img.width).toBe(700);
- };
- // now provide height and width in opts
- resolve(Plotly.toImage(gd, {height: 400, width: 400}));
- });
- }).then(function(url) {
- img.src = url;
- img.onload = function() {
- expect(img.height).toBe(400);
- expect(img.width).toBe(400);
- done();
- };
+ });
+
+ it("should throw error with height and/or width < 1", function(done) {
+ // let user know that Plotly expects pixel values
+ Plotly.plot(gd, subplotMock.data, subplotMock.layout)
+ .then(function(gd) {
+ return Plotly.toImage(gd, { height: 0.5 }).catch(function(err) {
+ expect(err.message).toEqual(
+ "Height and width should be pixel values."
+ );
});
- });
-
- it('should create proper file type', function(done) {
- var plot = Plotly.plot(gd, subplotMock.data, subplotMock.layout);
-
- plot.then(function(gd) {
- return Plotly.toImage(gd, {format: 'png'});
- }).then(function(url) {
- expect(url.split('png')[0]).toBe('data:image/');
- // now do jpeg
- return Plotly.toImage(gd, {format: 'jpeg'});
- }).then(function(url) {
- expect(url.split('jpeg')[0]).toBe('data:image/');
- // now do svg
- return Plotly.toImage(gd, {format: 'svg'});
- }).then(function(url) {
- expect(url.split('svg')[0]).toBe('data:image/');
- done();
+ })
+ .then(function() {
+ Plotly.toImage(gd, { width: 0.5 }).catch(function(err) {
+ expect(err.message).toEqual(
+ "Height and width should be pixel values."
+ );
+ done();
});
- });
+ });
+ });
+
+ it("should create img with proper height and width", function(done) {
+ var img = document.createElement("img");
+
+ // specify height and width
+ subplotMock.layout.height = 600;
+ subplotMock.layout.width = 700;
+
+ Plotly.plot(gd, subplotMock.data, subplotMock.layout)
+ .then(function(gd) {
+ expect(gd.layout.height).toBe(600);
+ expect(gd.layout.width).toBe(700);
+ return Plotly.toImage(gd);
+ })
+ .then(function(url) {
+ return new Promise(function(resolve) {
+ img.src = url;
+ img.onload = function() {
+ expect(img.height).toBe(600);
+ expect(img.width).toBe(700);
+ };
+ // now provide height and width in opts
+ resolve(Plotly.toImage(gd, { height: 400, width: 400 }));
+ });
+ })
+ .then(function(url) {
+ img.src = url;
+ img.onload = function() {
+ expect(img.height).toBe(400);
+ expect(img.width).toBe(400);
+ done();
+ };
+ });
+ });
+
+ it("should create proper file type", function(done) {
+ var plot = Plotly.plot(gd, subplotMock.data, subplotMock.layout);
+
+ plot
+ .then(function(gd) {
+ return Plotly.toImage(gd, { format: "png" });
+ })
+ .then(function(url) {
+ expect(url.split("png")[0]).toBe("data:image/");
+ // now do jpeg
+ return Plotly.toImage(gd, { format: "jpeg" });
+ })
+ .then(function(url) {
+ expect(url.split("jpeg")[0]).toBe("data:image/");
+ // now do svg
+ return Plotly.toImage(gd, { format: "svg" });
+ })
+ .then(function(url) {
+ expect(url.split("svg")[0]).toBe("data:image/");
+ done();
+ });
+ });
});
diff --git a/test/jasmine/tests/transform_filter_test.js b/test/jasmine/tests/transform_filter_test.js
index 9bbea9678c6..c41036ed1f8 100644
--- a/test/jasmine/tests/transform_filter_test.js
+++ b/test/jasmine/tests/transform_filter_test.js
@@ -1,1074 +1,1122 @@
-var Plotly = require('@lib/index');
-var Filter = require('@lib/filter');
+var Plotly = require("@lib/index");
+var Filter = require("@lib/filter");
+
+var Plots = require("@src/plots/plots");
+var Lib = require("@src/lib");
+
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var assertDims = require("../assets/assert_dims");
+var assertStyle = require("../assets/assert_style");
+var customMatchers = require("../assets/custom_matchers");
+
+describe("filter transforms defaults:", function() {
+ var fullLayout = { _transformModules: [] };
+
+ var traceIn, traceOut;
+
+ it("supplyTraceDefaults should coerce all attributes", function() {
+ traceIn = { x: [1, 2, 3], transforms: [{ type: "filter", value: 0 }] };
+
+ traceOut = Plots.supplyTraceDefaults(traceIn, 0, fullLayout);
+
+ expect(traceOut.transforms).toEqual([
+ {
+ type: "filter",
+ enabled: true,
+ operation: "=",
+ value: 0,
+ target: "x",
+ _module: Filter
+ }
+ ]);
+ });
+
+ it(
+ "supplyTraceDefaults should not coerce attributes if enabled: false",
+ function() {
+ traceIn = {
+ x: [1, 2, 3],
+ transforms: [{ enabled: false, type: "filter", value: 0 }]
+ };
+
+ traceOut = Plots.supplyTraceDefaults(traceIn, 0, fullLayout);
+
+ expect(traceOut.transforms).toEqual([
+ { type: "filter", enabled: false, _module: Filter }
+ ]);
+ }
+ );
+
+ it(
+ "supplyTraceDefaults should coerce *target* as a strict / noBlank string",
+ function() {
+ traceIn = {
+ x: [1, 2, 3],
+ transforms: [
+ { type: "filter" },
+ { type: "filter", target: 0 },
+ { type: "filter", target: "" },
+ { type: "filter", target: "marker.color" }
+ ]
+ };
+
+ traceOut = Plots.supplyTraceDefaults(traceIn, 0, fullLayout);
+
+ expect(traceOut.transforms[0].target).toEqual("x");
+ expect(traceOut.transforms[1].target).toEqual("x");
+ expect(traceOut.transforms[2].target).toEqual("x");
+ expect(traceOut.transforms[3].target).toEqual("marker.color");
+ }
+ );
+});
-var Plots = require('@src/plots/plots');
-var Lib = require('@src/lib');
+describe("filter transforms calc:", function() {
+ "use strict";
+ function calcDatatoTrace(calcTrace) {
+ return calcTrace[0].trace;
+ }
+
+ function _transform(data, layout) {
+ var gd = { data: data, layout: layout || {} };
+
+ Plots.supplyDefaults(gd);
+ Plots.doCalcdata(gd);
+
+ return gd.calcdata.map(calcDatatoTrace);
+ }
+
+ var base = {
+ x: [-2, -1, -2, 0, 1, 2, 3],
+ y: [1, 2, 3, 1, 2, 3, 1],
+ ids: ["n0", "n1", "n2", "z", "p1", "p2", "p3"],
+ marker: { color: [0.1, 0.2, 0.3, 0.1, 0.2, 0.3, 0.4], size: 20 },
+ transforms: [{ type: "filter" }]
+ };
+
+ it("filters should skip if *target* isn't present in trace", function() {
+ var out = _transform([
+ Lib.extendDeep({}, base, {
+ transforms: [{ type: "filter", operation: ">", value: 0, target: "z" }]
+ })
+ ]);
+
+ expect(out[0].x).toEqual(base.x);
+ expect(out[0].y).toEqual(base.y);
+ });
+
+ it("filters should handle 3D *z* data", function() {
+ var out = _transform([
+ Lib.extendDeep({}, base, {
+ type: "scatter3d",
+ z: [
+ "2015-07-20",
+ "2016-08-01",
+ "2016-09-01",
+ "2016-10-21",
+ "2016-12-02"
+ ],
+ transforms: [
+ { type: "filter", operation: ">", value: "2016-10-01", target: "z" }
+ ]
+ })
+ ]);
+
+ expect(out[0].x).toEqual([0, 1]);
+ expect(out[0].y).toEqual([1, 2]);
+ expect(out[0].z).toEqual(["2016-10-21", "2016-12-02"]);
+ });
+
+ it(
+ "should use the calendar from the target attribute if target is a string",
+ function() {
+ // this is the same data as in "filters should handle 3D *z* data"
+ // but with different calendars
+ var out = _transform([
+ Lib.extendDeep({}, base, {
+ type: "scatter3d",
+ // the same array as above but in nanakshahi dates
+ z: [
+ "0547-05-05",
+ "0548-05-17",
+ "0548-06-17",
+ "0548-08-07",
+ "0548-09-19"
+ ],
+ zcalendar: "nanakshahi",
+ transforms: [
+ {
+ type: "filter",
+ operation: ">",
+ value: "5776-06-28",
+ valuecalendar: "hebrew",
+ target: "z",
+ // targetcalendar is ignored!
+ targetcalendar: "taiwan"
+ }
+ ]
+ })
+ ]);
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var assertDims = require('../assets/assert_dims');
-var assertStyle = require('../assets/assert_style');
-var customMatchers = require('../assets/custom_matchers');
+ expect(out[0].x).toEqual([0, 1]);
+ expect(out[0].y).toEqual([1, 2]);
+ expect(out[0].z).toEqual(["0548-08-07", "0548-09-19"]);
+ }
+ );
+
+ it(
+ "should use targetcalendar anyway if there is no matching calendar attribute",
+ function() {
+ // this is the same data as in "filters should handle 3D *z* data"
+ // but with different calendars
+ var out = _transform([
+ Lib.extendDeep({}, base, {
+ type: "scatter",
+ // the same array as above but in taiwanese dates
+ text: [
+ "0104-07-20",
+ "0105-08-01",
+ "0105-09-01",
+ "0105-10-21",
+ "0105-12-02"
+ ],
+ transforms: [
+ {
+ type: "filter",
+ operation: ">",
+ value: "5776-06-28",
+ valuecalendar: "hebrew",
+ target: "text",
+ targetcalendar: "taiwan"
+ }
+ ]
+ })
+ ]);
-describe('filter transforms defaults:', function() {
+ expect(out[0].x).toEqual([0, 1]);
+ expect(out[0].y).toEqual([1, 2]);
+ expect(out[0].text).toEqual(["0105-10-21", "0105-12-02"]);
+ }
+ );
+
+ it("should use targetcalendar if target is an array", function() {
+ // this is the same data as in "filters should handle 3D *z* data"
+ // but with different calendars
+ var out = _transform([
+ Lib.extendDeep({}, base, {
+ type: "scatter3d",
+ // the same array as above but in nanakshahi dates
+ z: [
+ "0547-05-05",
+ "0548-05-17",
+ "0548-06-17",
+ "0548-08-07",
+ "0548-09-19"
+ ],
+ zcalendar: "nanakshahi",
+ transforms: [
+ {
+ type: "filter",
+ operation: ">",
+ value: "5776-06-28",
+ valuecalendar: "hebrew",
+ target: [
+ "0104-07-20",
+ "0105-08-01",
+ "0105-09-01",
+ "0105-10-21",
+ "0105-12-02"
+ ],
+ targetcalendar: "taiwan"
+ }
+ ]
+ })
+ ]);
+
+ expect(out[0].x).toEqual([0, 1]);
+ expect(out[0].y).toEqual([1, 2]);
+ expect(out[0].z).toEqual(["0548-08-07", "0548-09-19"]);
+ });
+
+ it("filters should handle geographical *lon* data", function() {
+ var trace0 = {
+ type: "scattergeo",
+ lon: [-90, -40, 100, 120, 130],
+ lat: [-50, -40, 10, 20, 30],
+ transforms: [{ type: "filter", operation: ">", value: 0, target: "lon" }]
+ };
- var fullLayout = { _transformModules: [] };
+ var trace1 = {
+ type: "scattermapbox",
+ lon: [-90, -40, 100, 120, 130],
+ lat: [-50, -40, 10, 20, 30],
+ transforms: [{ type: "filter", operation: "<", value: 0, target: "lat" }]
+ };
- var traceIn, traceOut;
+ var out = _transform([trace0, trace1]);
+
+ expect(out[0].lon).toEqual([100, 120, 130]);
+ expect(out[0].lat).toEqual([10, 20, 30]);
+
+ expect(out[1].lon).toEqual([-90, -40]);
+ expect(out[1].lat).toEqual([-50, -40]);
+ });
+
+ it("filters should handle nested attributes", function() {
+ var out = _transform([
+ Lib.extendDeep({}, base, {
+ transforms: [
+ { type: "filter", operation: ">", value: 0.2, target: "marker.color" }
+ ]
+ })
+ ]);
+
+ expect(out[0].x).toEqual([-2, 2, 3]);
+ expect(out[0].y).toEqual([3, 3, 1]);
+ expect(out[0].marker.color).toEqual([0.3, 0.3, 0.4]);
+ });
+
+ it("filters should skip if *enabled* is false", function() {
+ var out = _transform([
+ Lib.extendDeep({}, base, {
+ transforms: [
+ {
+ type: "filter",
+ enabled: false,
+ operation: ">",
+ value: 0,
+ target: "x"
+ }
+ ]
+ })
+ ]);
+
+ expect(out[0].x).toEqual(base.x);
+ expect(out[0].y).toEqual(base.y);
+ });
+
+ it("filters should chain as AND (case 1)", function() {
+ var out = _transform([
+ Lib.extendDeep({}, base, {
+ transforms: [
+ { type: "filter", operation: ">", value: 0, target: "x" },
+ { type: "filter", operation: "<", value: 3, target: "x" }
+ ]
+ })
+ ]);
+
+ expect(out[0].x).toEqual([1, 2]);
+ expect(out[0].y).toEqual([2, 3]);
+ });
+
+ it("filters should chain as AND (case 2)", function() {
+ var out = _transform([
+ Lib.extendDeep({}, base, {
+ transforms: [
+ { type: "filter", operation: ">", value: 0, target: "x" },
+ {
+ type: "filter",
+ enabled: false,
+ operation: ">",
+ value: 2,
+ target: "y"
+ },
+ { type: "filter", operation: "<", value: 2, target: "y" }
+ ]
+ })
+ ]);
+
+ expect(out[0].x).toEqual([3]);
+ expect(out[0].y).toEqual([1]);
+ });
+
+ describe("filters should handle numeric values", function() {
+ var _base = Lib.extendDeep({}, base);
+
+ function _assert(out, x, y, markerColor) {
+ expect(out[0].x).toEqual(x, "- x coords");
+ expect(out[0].y).toEqual(y, "- y coords");
+ expect(out[0].marker.color).toEqual(
+ markerColor,
+ "- marker.color arrayOk"
+ );
+ expect(out[0].marker.size).toEqual(20, "- marker.size style");
+ }
- it('supplyTraceDefaults should coerce all attributes', function() {
- traceIn = {
- x: [1, 2, 3],
- transforms: [{
- type: 'filter',
- value: 0
- }]
- };
+ it("with operation *[]*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "[]", value: [-1, 1], target: "x" }]
+ })
+ ]);
- traceOut = Plots.supplyTraceDefaults(traceIn, 0, fullLayout);
+ _assert(out, [-1, 0, 1], [2, 1, 2], [0.2, 0.1, 0.2]);
+ });
- expect(traceOut.transforms).toEqual([{
- type: 'filter',
- enabled: true,
- operation: '=',
- value: 0,
- target: 'x',
- _module: Filter
- }]);
+ it("with operation *[)*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "[)", value: [-1, 1], target: "x" }]
+ })
+ ]);
+
+ _assert(out, [-1, 0], [2, 1], [0.2, 0.1]);
});
- it('supplyTraceDefaults should not coerce attributes if enabled: false', function() {
- traceIn = {
- x: [1, 2, 3],
- transforms: [{
- enabled: false,
- type: 'filter',
- value: 0
- }]
- };
+ it("with operation *(]*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "(]", value: [-1, 1], target: "x" }]
+ })
+ ]);
- traceOut = Plots.supplyTraceDefaults(traceIn, 0, fullLayout);
+ _assert(out, [0, 1], [1, 2], [0.1, 0.2]);
+ });
- expect(traceOut.transforms).toEqual([{
- type: 'filter',
- enabled: false,
- _module: Filter
- }]);
+ it("with operation *()*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "()", value: [-1, 1], target: "x" }]
+ })
+ ]);
+
+ _assert(out, [0], [1], [0.1]);
});
- it('supplyTraceDefaults should coerce *target* as a strict / noBlank string', function() {
- traceIn = {
- x: [1, 2, 3],
- transforms: [{
- type: 'filter',
- }, {
- type: 'filter',
- target: 0
- }, {
- type: 'filter',
- target: ''
- }, {
- type: 'filter',
- target: 'marker.color'
- }]
- };
-
- traceOut = Plots.supplyTraceDefaults(traceIn, 0, fullLayout);
-
- expect(traceOut.transforms[0].target).toEqual('x');
- expect(traceOut.transforms[1].target).toEqual('x');
- expect(traceOut.transforms[2].target).toEqual('x');
- expect(traceOut.transforms[3].target).toEqual('marker.color');
+ it("with operation *)(*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: ")(", value: [-1, 1], target: "x" }]
+ })
+ ]);
+
+ _assert(out, [-2, -2, 2, 3], [1, 3, 3, 1], [0.1, 0.3, 0.3, 0.4]);
+ });
+
+ it("with operation *)[*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: ")[", value: [-1, 1], target: "x" }]
+ })
+ ]);
+
+ _assert(out, [-2, -2, 1, 2, 3], [1, 3, 2, 3, 1], [
+ 0.1,
+ 0.3,
+ 0.2,
+ 0.3,
+ 0.4
+ ]);
});
-});
-describe('filter transforms calc:', function() {
- 'use strict';
+ it("with operation *](*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "](", value: [-1, 1], target: "x" }]
+ })
+ ]);
+
+ _assert(out, [-2, -1, -2, 2, 3], [1, 2, 3, 3, 1], [
+ 0.1,
+ 0.2,
+ 0.3,
+ 0.3,
+ 0.4
+ ]);
+ });
- function calcDatatoTrace(calcTrace) {
- return calcTrace[0].trace;
- }
+ it("with operation *][*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "][", value: [-1, 1], target: "x" }]
+ })
+ ]);
+
+ _assert(out, [-2, -1, -2, 1, 2, 3], [1, 2, 3, 2, 3, 1], [
+ 0.1,
+ 0.2,
+ 0.3,
+ 0.2,
+ 0.3,
+ 0.4
+ ]);
+ });
- function _transform(data, layout) {
- var gd = {
- data: data,
- layout: layout || {}
- };
+ it("with operation *{}*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "{}", value: [-2, 0], target: "x" }]
+ })
+ ]);
- Plots.supplyDefaults(gd);
- Plots.doCalcdata(gd);
+ _assert(out, [-2, -2, 0], [1, 3, 1], [0.1, 0.3, 0.1]);
+ });
- return gd.calcdata.map(calcDatatoTrace);
- }
+ it("with operation *}{*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "}{", value: [-2, 0], target: "x" }]
+ })
+ ]);
- var base = {
- x: [-2, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1],
- ids: ['n0', 'n1', 'n2', 'z', 'p1', 'p2', 'p3'],
- marker: {
- color: [0.1, 0.2, 0.3, 0.1, 0.2, 0.3, 0.4],
- size: 20
- },
- transforms: [{ type: 'filter' }]
- };
+ _assert(out, [-1, 1, 2, 3], [2, 2, 3, 1], [0.2, 0.2, 0.3, 0.4]);
+ });
- it('filters should skip if *target* isn\'t present in trace', function() {
- var out = _transform([Lib.extendDeep({}, base, {
- transforms: [{
- type: 'filter',
- operation: '>',
- value: 0,
- target: 'z'
- }]
- })]);
-
- expect(out[0].x).toEqual(base.x);
- expect(out[0].y).toEqual(base.y);
+ it("should honored set axis type", function() {
+ var out = _transform(
+ [
+ Lib.extendDeep({}, _base, {
+ x: [1, 2, 3, 0, -1, -2, -3],
+ transforms: [{ operation: ">", value: -1, target: "x" }]
+ })
+ ],
+ { xaxis: { type: "category" } }
+ );
+
+ _assert(out, [-2, -3], [3, 1], [0.3, 0.4]);
});
+ });
+
+ describe("filters should handle categories", function() {
+ var _base = {
+ x: ["a", "b", "c", "d"],
+ y: [1, 2, 3, 4],
+ marker: { color: "red", size: ["0", "1", "2", "0"] },
+ transforms: [{ type: "filter" }]
+ };
+
+ function _assert(out, x, y, markerSize) {
+ expect(out[0].x).toEqual(x, "- x coords");
+ expect(out[0].y).toEqual(y, "- y coords");
+ expect(out[0].marker.size).toEqual(markerSize, "- marker.size arrayOk");
+ expect(out[0].marker.color).toEqual("red", "- marker.color style");
+ }
- it('filters should handle 3D *z* data', function() {
- var out = _transform([Lib.extendDeep({}, base, {
- type: 'scatter3d',
- z: ['2015-07-20', '2016-08-01', '2016-09-01', '2016-10-21', '2016-12-02'],
- transforms: [{
- type: 'filter',
- operation: '>',
- value: '2016-10-01',
- target: 'z'
- }]
- })]);
-
- expect(out[0].x).toEqual([0, 1]);
- expect(out[0].y).toEqual([1, 2]);
- expect(out[0].z).toEqual(['2016-10-21', '2016-12-02']);
+ it("with operation *()*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "()", value: ["a", "c"], target: "x" }]
+ })
+ ]);
+
+ _assert(out, ["b"], [2], ["1"]);
});
- it('should use the calendar from the target attribute if target is a string', function() {
- // this is the same data as in "filters should handle 3D *z* data"
- // but with different calendars
- var out = _transform([Lib.extendDeep({}, base, {
- type: 'scatter3d',
- // the same array as above but in nanakshahi dates
- z: ['0547-05-05', '0548-05-17', '0548-06-17', '0548-08-07', '0548-09-19'],
- zcalendar: 'nanakshahi',
- transforms: [{
- type: 'filter',
- operation: '>',
- value: '5776-06-28',
- valuecalendar: 'hebrew',
- target: 'z',
- // targetcalendar is ignored!
- targetcalendar: 'taiwan'
- }]
- })]);
-
- expect(out[0].x).toEqual([0, 1]);
- expect(out[0].y).toEqual([1, 2]);
- expect(out[0].z).toEqual(['0548-08-07', '0548-09-19']);
+ it("with operation *)(*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: ")(", value: ["a", "c"], target: "x" }]
+ })
+ ]);
+
+ _assert(out, ["d"], [4], ["0"]);
});
- it('should use targetcalendar anyway if there is no matching calendar attribute', function() {
- // this is the same data as in "filters should handle 3D *z* data"
- // but with different calendars
- var out = _transform([Lib.extendDeep({}, base, {
- type: 'scatter',
- // the same array as above but in taiwanese dates
- text: ['0104-07-20', '0105-08-01', '0105-09-01', '0105-10-21', '0105-12-02'],
- transforms: [{
- type: 'filter',
- operation: '>',
- value: '5776-06-28',
- valuecalendar: 'hebrew',
- target: 'text',
- targetcalendar: 'taiwan'
- }]
- })]);
-
- expect(out[0].x).toEqual([0, 1]);
- expect(out[0].y).toEqual([1, 2]);
- expect(out[0].text).toEqual(['0105-10-21', '0105-12-02']);
+ it("with operation *{}*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "{}", value: ["b", "d"], target: "x" }]
+ })
+ ]);
+
+ _assert(out, ["b", "d"], [2, 4], ["1", "0"]);
});
- it('should use targetcalendar if target is an array', function() {
- // this is the same data as in "filters should handle 3D *z* data"
- // but with different calendars
- var out = _transform([Lib.extendDeep({}, base, {
- type: 'scatter3d',
- // the same array as above but in nanakshahi dates
- z: ['0547-05-05', '0548-05-17', '0548-06-17', '0548-08-07', '0548-09-19'],
- zcalendar: 'nanakshahi',
- transforms: [{
- type: 'filter',
- operation: '>',
- value: '5776-06-28',
- valuecalendar: 'hebrew',
- target: ['0104-07-20', '0105-08-01', '0105-09-01', '0105-10-21', '0105-12-02'],
- targetcalendar: 'taiwan'
- }]
- })]);
-
- expect(out[0].x).toEqual([0, 1]);
- expect(out[0].y).toEqual([1, 2]);
- expect(out[0].z).toEqual(['0548-08-07', '0548-09-19']);
+ it("with operation *}{*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "}{", value: ["b", "d"], target: "x" }]
+ })
+ ]);
+
+ _assert(out, ["a", "c"], [1, 3], ["0", "2"]);
});
+ });
+
+ describe("filters should handle dates", function() {
+ var _base = {
+ x: ["2015-07-20", "2016-08-01", "2016-09-01", "2016-10-21", "2016-12-02"],
+ y: [1, 2, 3, 1, 5],
+ marker: { line: { color: [0.1, 0.2, 0.3, 0.1, 0.2], width: 2.5 } },
+ transforms: [{ type: "filter" }]
+ };
+
+ function _assert(out, x, y, markerLineColor) {
+ expect(out[0].x).toEqual(x, "- x coords");
+ expect(out[0].y).toEqual(y, "- y coords");
+ expect(out[0].marker.line.color).toEqual(
+ markerLineColor,
+ "- marker.line.color arrayOk"
+ );
+ expect(out[0].marker.line.width).toEqual(
+ 2.5,
+ "- marker.line.width style"
+ );
+ }
+
+ it("with operation *=*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "=", value: ["2015-07-20"], target: "x" }]
+ })
+ ]);
- it('filters should handle geographical *lon* data', function() {
- var trace0 = {
- type: 'scattergeo',
- lon: [-90, -40, 100, 120, 130],
- lat: [-50, -40, 10, 20, 30],
- transforms: [{
- type: 'filter',
- operation: '>',
- value: 0,
- target: 'lon'
- }]
- };
-
- var trace1 = {
- type: 'scattermapbox',
- lon: [-90, -40, 100, 120, 130],
- lat: [-50, -40, 10, 20, 30],
- transforms: [{
- type: 'filter',
- operation: '<',
- value: 0,
- target: 'lat'
- }]
- };
-
- var out = _transform([trace0, trace1]);
-
- expect(out[0].lon).toEqual([100, 120, 130]);
- expect(out[0].lat).toEqual([10, 20, 30]);
-
- expect(out[1].lon).toEqual([-90, -40]);
- expect(out[1].lat).toEqual([-50, -40]);
+ _assert(out, ["2015-07-20"], [1], [0.1]);
});
- it('filters should handle nested attributes', function() {
- var out = _transform([Lib.extendDeep({}, base, {
- transforms: [{
- type: 'filter',
- operation: '>',
- value: 0.2,
- target: 'marker.color'
- }]
- })]);
-
- expect(out[0].x).toEqual([-2, 2, 3]);
- expect(out[0].y).toEqual([3, 3, 1]);
- expect(out[0].marker.color).toEqual([0.3, 0.3, 0.4]);
+ it("with operation *<*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "<", value: "2016-01-01", target: "x" }]
+ })
+ ]);
+
+ _assert(out, ["2015-07-20"], [1], [0.1]);
});
- it('filters should skip if *enabled* is false', function() {
- var out = _transform([Lib.extendDeep({}, base, {
- transforms: [{
- type: 'filter',
- enabled: false,
- operation: '>',
- value: 0,
- target: 'x'
- }]
- })]);
-
- expect(out[0].x).toEqual(base.x);
- expect(out[0].y).toEqual(base.y);
+ it("with operation *>*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: ">=", value: "2016-08-01", target: "x" }]
+ })
+ ]);
+
+ _assert(
+ out,
+ ["2016-08-01", "2016-09-01", "2016-10-21", "2016-12-02"],
+ [2, 3, 1, 5],
+ [0.2, 0.3, 0.1, 0.2]
+ );
});
- it('filters should chain as AND (case 1)', function() {
- var out = _transform([Lib.extendDeep({}, base, {
- transforms: [{
- type: 'filter',
- operation: '>',
- value: 0,
- target: 'x'
- }, {
- type: 'filter',
- operation: '<',
- value: 3,
- target: 'x'
- }]
- })]);
-
- expect(out[0].x).toEqual([1, 2]);
- expect(out[0].y).toEqual([2, 3]);
+ it("with operation *[]*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [
+ {
+ operation: "[]",
+ value: ["2016-08-01", "2016-10-01"],
+ target: "x"
+ }
+ ]
+ })
+ ]);
+
+ _assert(out, ["2016-08-01", "2016-09-01"], [2, 3], [0.2, 0.3]);
});
- it('filters should chain as AND (case 2)', function() {
- var out = _transform([Lib.extendDeep({}, base, {
- transforms: [{
- type: 'filter',
- operation: '>',
- value: 0,
- target: 'x'
- }, {
- type: 'filter',
- enabled: false,
- operation: '>',
- value: 2,
- target: 'y'
- }, {
- type: 'filter',
- operation: '<',
- value: 2,
- target: 'y'
- }]
- })]);
-
- expect(out[0].x).toEqual([3]);
- expect(out[0].y).toEqual([1]);
+ it("with operation *)(*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [
+ {
+ operation: ")(",
+ value: ["2016-08-01", "2016-10-01"],
+ target: "x"
+ }
+ ]
+ })
+ ]);
+
+ _assert(out, ["2015-07-20", "2016-10-21", "2016-12-02"], [1, 1, 5], [
+ 0.1,
+ 0.1,
+ 0.2
+ ]);
});
- describe('filters should handle numeric values', function() {
- var _base = Lib.extendDeep({}, base);
+ it("with operation *{}*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [{ operation: "{}", value: "2015-07-20", target: "x" }]
+ })
+ ]);
- function _assert(out, x, y, markerColor) {
- expect(out[0].x).toEqual(x, '- x coords');
- expect(out[0].y).toEqual(y, '- y coords');
- expect(out[0].marker.color).toEqual(markerColor, '- marker.color arrayOk');
- expect(out[0].marker.size).toEqual(20, '- marker.size style');
- }
+ _assert(out, ["2015-07-20"], [1], [0.1]);
+ });
- it('with operation *[]*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '[]',
- value: [-1, 1],
- target: 'x'
- }]
- })]);
-
- _assert(out,
- [-1, 0, 1],
- [2, 1, 2],
- [0.2, 0.1, 0.2]
- );
- });
-
- it('with operation *[)*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '[)',
- value: [-1, 1],
- target: 'x'
- }]
- })]);
-
- _assert(out, [-1, 0], [2, 1], [0.2, 0.1]);
- });
-
- it('with operation *(]*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '(]',
- value: [-1, 1],
- target: 'x'
- }]
- })]);
-
- _assert(out, [0, 1], [1, 2], [0.1, 0.2]);
- });
-
- it('with operation *()*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '()',
- value: [-1, 1],
- target: 'x'
- }]
- })]);
-
- _assert(out, [0], [1], [0.1]);
- });
-
- it('with operation *)(*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: ')(',
- value: [-1, 1],
- target: 'x'
- }]
- })]);
-
- _assert(out,
- [-2, -2, 2, 3],
- [1, 3, 3, 1],
- [0.1, 0.3, 0.3, 0.4]
- );
- });
-
- it('with operation *)[*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: ')[',
- value: [-1, 1],
- target: 'x'
- }]
- })]);
-
- _assert(out,
- [-2, -2, 1, 2, 3],
- [1, 3, 2, 3, 1],
- [0.1, 0.3, 0.2, 0.3, 0.4]
- );
- });
-
- it('with operation *](*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '](',
- value: [-1, 1],
- target: 'x'
- }]
- })]);
-
- _assert(out,
- [-2, -1, -2, 2, 3],
- [1, 2, 3, 3, 1],
- [0.1, 0.2, 0.3, 0.3, 0.4]
- );
- });
-
- it('with operation *][*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '][',
- value: [-1, 1],
- target: 'x'
- }]
- })]);
-
- _assert(out,
- [-2, -1, -2, 1, 2, 3],
- [1, 2, 3, 2, 3, 1],
- [0.1, 0.2, 0.3, 0.2, 0.3, 0.4]
- );
- });
-
- it('with operation *{}*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '{}',
- value: [-2, 0],
- target: 'x'
- }]
- })]);
-
- _assert(out,
- [-2, -2, 0],
- [1, 3, 1],
- [0.1, 0.3, 0.1]
- );
- });
-
- it('with operation *}{*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '}{',
- value: [-2, 0],
- target: 'x'
- }]
- })]);
-
- _assert(out,
- [-1, 1, 2, 3],
- [2, 2, 3, 1],
- [0.2, 0.2, 0.3, 0.4]
- );
- });
-
- it('should honored set axis type', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- x: [1, 2, 3, 0, -1, -2, -3],
- transforms: [{
- operation: '>',
- value: -1,
- target: 'x'
- }]
- })], {
- xaxis: { type: 'category' }
- });
-
- _assert(out, [-2, -3], [3, 1], [0.3, 0.4]);
- });
+ it("with operation *}{*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [
+ {
+ operation: "}{",
+ value: ["2016-08-01", "2016-09-01", "2016-10-21", "2016-12-02"],
+ target: "x"
+ }
+ ]
+ })
+ ]);
+ _assert(out, ["2015-07-20"], [1], [0.1]);
});
+ });
+
+ it("filters should handle ids", function() {
+ var out = _transform([
+ Lib.extendDeep({}, base, {
+ transforms: [
+ { operation: "{}", value: ["p1", "p2", "n1"], target: "ids" }
+ ]
+ })
+ ]);
+
+ expect(out[0].x).toEqual([-1, 1, 2]);
+ expect(out[0].y).toEqual([2, 2, 3]);
+ expect(out[0].ids).toEqual(["n1", "p1", "p2"]);
+ });
+
+ describe("filters should handle array *target* values", function() {
+ var _base = Lib.extendDeep({}, base);
+
+ function _assert(out, x, y, markerColor) {
+ expect(out[0].x).toEqual(x, "- x coords");
+ expect(out[0].y).toEqual(y, "- y coords");
+ expect(out[0].marker.color).toEqual(
+ markerColor,
+ "- marker.color arrayOk"
+ );
+ expect(out[0].marker.size).toEqual(20, "- marker.size style");
+ }
- describe('filters should handle categories', function() {
- var _base = {
- x: ['a', 'b', 'c', 'd'],
- y: [1, 2, 3, 4],
- marker: {
- color: 'red',
- size: ['0', '1', '2', '0']
- },
- transforms: [{ type: 'filter' }]
- };
-
- function _assert(out, x, y, markerSize) {
- expect(out[0].x).toEqual(x, '- x coords');
- expect(out[0].y).toEqual(y, '- y coords');
- expect(out[0].marker.size).toEqual(markerSize, '- marker.size arrayOk');
- expect(out[0].marker.color).toEqual('red', '- marker.color style');
- }
+ it("with numeric items", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [
+ { target: [1, 1, 0, 0, 1, 0, 1], operation: "{}", value: 0 }
+ ]
+ })
+ ]);
- it('with operation *()*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '()',
- value: ['a', 'c'],
- target: 'x'
- }]
- })]);
-
- _assert(out, ['b'], [2], ['1']);
- });
-
- it('with operation *)(*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: ')(',
- value: ['a', 'c'],
- target: 'x'
- }]
- })]);
-
- _assert(out, ['d'], [4], ['0']);
- });
-
- it('with operation *{}*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '{}',
- value: ['b', 'd'],
- target: 'x'
- }]
- })]);
-
- _assert(out, ['b', 'd'], [2, 4], ['1', '0']);
- });
-
- it('with operation *}{*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '}{',
- value: ['b', 'd'],
- target: 'x'
- }]
- })]);
-
- _assert(out, ['a', 'c'], [1, 3], ['0', '2']);
- });
+ _assert(out, [-2, 0, 2], [3, 1, 3], [0.3, 0.1, 0.3]);
+ expect(out[0].transforms[0].target).toEqual([0, 0, 0]);
+ });
+
+ it("with categorical items and *{}*", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [
+ {
+ target: ["a", "a", "b", "b", "a", "b", "a"],
+ operation: "{}",
+ value: "b"
+ }
+ ]
+ })
+ ]);
+ _assert(out, [-2, 0, 2], [3, 1, 3], [0.3, 0.1, 0.3]);
+ expect(out[0].transforms[0].target).toEqual(["b", "b", "b"]);
});
- describe('filters should handle dates', function() {
- var _base = {
- x: ['2015-07-20', '2016-08-01', '2016-09-01', '2016-10-21', '2016-12-02'],
- y: [1, 2, 3, 1, 5],
- marker: {
- line: {
- color: [0.1, 0.2, 0.3, 0.1, 0.2],
- width: 2.5
- }
- },
- transforms: [{ type: 'filter' }]
- };
-
- function _assert(out, x, y, markerLineColor) {
- expect(out[0].x).toEqual(x, '- x coords');
- expect(out[0].y).toEqual(y, '- y coords');
- expect(out[0].marker.line.color).toEqual(markerLineColor, '- marker.line.color arrayOk');
- expect(out[0].marker.line.width).toEqual(2.5, '- marker.line.width style');
+ it("with categorical items and *<* and *>=*", function() {
+ var out = _transform([
+ {
+ x: [1, 2, 3],
+ y: [10, 20, 30],
+ transforms: [
+ {
+ type: "filter",
+ operation: "<",
+ target: ["a", "b", "c"],
+ value: "c"
+ }
+ ]
+ },
+ {
+ x: [1, 2, 3],
+ y: [30, 20, 10],
+ transforms: [
+ {
+ type: "filter",
+ operation: ">=",
+ target: ["a", "b", "c"],
+ value: "b"
+ }
+ ]
}
+ ]);
- it('with operation *=*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '=',
- value: ['2015-07-20'],
- target: 'x'
- }]
- })]);
-
- _assert(out, ['2015-07-20'], [1], [0.1]);
- });
-
- it('with operation *<*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '<',
- value: '2016-01-01',
- target: 'x'
- }]
- })]);
-
- _assert(out, ['2015-07-20'], [1], [0.1]);
- });
-
- it('with operation *>*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '>=',
- value: '2016-08-01',
- target: 'x'
- }]
- })]);
-
- _assert(out,
- ['2016-08-01', '2016-09-01', '2016-10-21', '2016-12-02'],
- [2, 3, 1, 5],
- [0.2, 0.3, 0.1, 0.2]
- );
- });
-
- it('with operation *[]*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '[]',
- value: ['2016-08-01', '2016-10-01'],
- target: 'x'
- }]
- })]);
-
- _assert(out, ['2016-08-01', '2016-09-01'], [2, 3], [0.2, 0.3]);
- });
-
- it('with operation *)(*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: ')(',
- value: ['2016-08-01', '2016-10-01'],
- target: 'x'
- }]
- })]);
-
- _assert(out, ['2015-07-20', '2016-10-21', '2016-12-02'], [1, 1, 5], [0.1, 0.1, 0.2]);
- });
-
- it('with operation *{}*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '{}',
- value: '2015-07-20',
- target: 'x'
- }]
- })]);
-
- _assert(out, ['2015-07-20'], [1], [0.1]);
- });
-
- it('with operation *}{*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- operation: '}{',
- value: ['2016-08-01', '2016-09-01', '2016-10-21', '2016-12-02'],
- target: 'x'
- }]
- })]);
-
- _assert(out, ['2015-07-20'], [1], [0.1]);
- });
+ expect(out[0].x).toEqual([1, 2]);
+ expect(out[0].y).toEqual([10, 20]);
+ expect(out[0].transforms[0].target).toEqual(["a", "b"]);
+ expect(out[1].x).toEqual([2, 3]);
+ expect(out[1].y).toEqual([20, 10]);
+ expect(out[1].transforms[0].target).toEqual(["b", "c"]);
});
- it('filters should handle ids', function() {
- var out = _transform([Lib.extendDeep({}, base, {
- transforms: [{
- operation: '{}',
- value: ['p1', 'p2', 'n1'],
- target: 'ids'
- }]
- })]);
-
- expect(out[0].x).toEqual([-1, 1, 2]);
- expect(out[0].y).toEqual([2, 2, 3]);
- expect(out[0].ids).toEqual(['n1', 'p1', 'p2']);
- });
+ it("with categorical items and *[]*, *][*, *()* and *)(*", function() {
+ var out = _transform([
+ {
+ x: [1, 2, 3],
+ y: [10, 20, 30],
+ transforms: [
+ {
+ type: "filter",
+ operation: "[]",
+ target: ["a", "b", "c"],
+ value: ["a", "b"]
+ }
+ ]
+ },
+ {
+ x: [1, 2, 3],
+ y: [10, 20, 30],
+ transforms: [
+ {
+ type: "filter",
+ operation: "()",
+ target: ["a", "b", "c"],
+ value: ["a", "b"]
+ }
+ ]
+ },
+ {
+ x: [1, 2, 3],
+ y: [30, 20, 10],
+ transforms: [
+ {
+ type: "filter",
+ operation: "][",
+ target: ["a", "b", "c"],
+ value: ["a", "b"]
+ }
+ ]
+ },
+ {
+ x: [1, 2, 3],
+ y: [30, 20, 10],
+ transforms: [
+ {
+ type: "filter",
+ operation: ")(",
+ target: ["a", "b", "c"],
+ value: ["a", "b"]
+ }
+ ]
+ }
+ ]);
- describe('filters should handle array *target* values', function() {
- var _base = Lib.extendDeep({}, base);
+ expect(out[0].x).toEqual([1, 2]);
+ expect(out[0].y).toEqual([10, 20]);
+ expect(out[0].transforms[0].target).toEqual(["a", "b"]);
- function _assert(out, x, y, markerColor) {
- expect(out[0].x).toEqual(x, '- x coords');
- expect(out[0].y).toEqual(y, '- y coords');
- expect(out[0].marker.color).toEqual(markerColor, '- marker.color arrayOk');
- expect(out[0].marker.size).toEqual(20, '- marker.size style');
- }
+ expect(out[1].x).toEqual([]);
+ expect(out[1].y).toEqual([]);
+ expect(out[1].transforms[0].target).toEqual([]);
- it('with numeric items', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- target: [1, 1, 0, 0, 1, 0, 1],
- operation: '{}',
- value: 0
- }]
- })]);
-
- _assert(out, [-2, 0, 2], [3, 1, 3], [0.3, 0.1, 0.3]);
- expect(out[0].transforms[0].target).toEqual([0, 0, 0]);
- });
-
- it('with categorical items and *{}*', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- target: ['a', 'a', 'b', 'b', 'a', 'b', 'a'],
- operation: '{}',
- value: 'b'
- }]
- })]);
-
- _assert(out, [-2, 0, 2], [3, 1, 3], [0.3, 0.1, 0.3]);
- expect(out[0].transforms[0].target).toEqual(['b', 'b', 'b']);
- });
-
- it('with categorical items and *<* and *>=*', function() {
- var out = _transform([{
- x: [1, 2, 3],
- y: [10, 20, 30],
- transforms: [{
- type: 'filter',
- operation: '<',
- target: ['a', 'b', 'c'],
- value: 'c'
- }]
- }, {
- x: [1, 2, 3],
- y: [30, 20, 10],
- transforms: [{
- type: 'filter',
- operation: '>=',
- target: ['a', 'b', 'c'],
- value: 'b'
- }]
- }]);
-
- expect(out[0].x).toEqual([1, 2]);
- expect(out[0].y).toEqual([10, 20]);
- expect(out[0].transforms[0].target).toEqual(['a', 'b']);
-
- expect(out[1].x).toEqual([2, 3]);
- expect(out[1].y).toEqual([20, 10]);
- expect(out[1].transforms[0].target).toEqual(['b', 'c']);
- });
-
- it('with categorical items and *[]*, *][*, *()* and *)(*', function() {
- var out = _transform([{
- x: [1, 2, 3],
- y: [10, 20, 30],
- transforms: [{
- type: 'filter',
- operation: '[]',
- target: ['a', 'b', 'c'],
- value: ['a', 'b']
- }]
- }, {
- x: [1, 2, 3],
- y: [10, 20, 30],
- transforms: [{
- type: 'filter',
- operation: '()',
- target: ['a', 'b', 'c'],
- value: ['a', 'b']
- }]
- }, {
- x: [1, 2, 3],
- y: [30, 20, 10],
- transforms: [{
- type: 'filter',
- operation: '][',
- target: ['a', 'b', 'c'],
- value: ['a', 'b']
- }]
- }, {
- x: [1, 2, 3],
- y: [30, 20, 10],
- transforms: [{
- type: 'filter',
- operation: ')(',
- target: ['a', 'b', 'c'],
- value: ['a', 'b']
- }]
- }]);
-
- expect(out[0].x).toEqual([1, 2]);
- expect(out[0].y).toEqual([10, 20]);
- expect(out[0].transforms[0].target).toEqual(['a', 'b']);
-
- expect(out[1].x).toEqual([]);
- expect(out[1].y).toEqual([]);
- expect(out[1].transforms[0].target).toEqual([]);
-
- expect(out[2].x).toEqual([1, 2, 3]);
- expect(out[2].y).toEqual([30, 20, 10]);
- expect(out[2].transforms[0].target).toEqual(['a', 'b', 'c']);
-
- expect(out[3].x).toEqual([3]);
- expect(out[3].y).toEqual([10]);
- expect(out[3].transforms[0].target).toEqual(['c']);
- });
-
- it('with dates items', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- target: ['2015-07-20', '2016-08-01', '2016-09-01', '2016-10-21', '2016-12-02'],
- operation: '<',
- value: '2016-01-01'
- }]
- })]);
-
- _assert(out, [-2], [1], [0.1]);
- expect(out[0].transforms[0].target).toEqual(['2015-07-20']);
- });
-
- it('with multiple transforms (dates) ', function() {
- var out = _transform([Lib.extendDeep({}, _base, {
- transforms: [{
- target: ['2015-07-20', '2016-08-01', '2016-09-01', '2016-10-21', '2016-12-02'],
- operation: '>',
- value: '2016-01-01'
- }, {
- type: 'filter',
- target: ['2015-07-20', '2016-08-01', '2016-09-01', '2016-10-21', '2016-12-02'],
- operation: '<',
- value: '2016-09-01'
- }]
- })]);
-
- _assert(out, [-1], [2], [0.2]);
- expect(out[0].transforms[0].target).toEqual(['2016-08-01']);
- });
+ expect(out[2].x).toEqual([1, 2, 3]);
+ expect(out[2].y).toEqual([30, 20, 10]);
+ expect(out[2].transforms[0].target).toEqual(["a", "b", "c"]);
+
+ expect(out[3].x).toEqual([3]);
+ expect(out[3].y).toEqual([10]);
+ expect(out[3].transforms[0].target).toEqual(["c"]);
});
-});
-describe('filter transforms interactions', function() {
- 'use strict';
+ it("with dates items", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [
+ {
+ target: [
+ "2015-07-20",
+ "2016-08-01",
+ "2016-09-01",
+ "2016-10-21",
+ "2016-12-02"
+ ],
+ operation: "<",
+ value: "2016-01-01"
+ }
+ ]
+ })
+ ]);
- beforeAll(function() {
- jasmine.addMatchers(customMatchers);
+ _assert(out, [-2], [1], [0.1]);
+ expect(out[0].transforms[0].target).toEqual(["2015-07-20"]);
});
- var mockData0 = [{
- x: [-2, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1],
- text: ['a', 'b', 'c', 'd', 'e', 'f', 'g'],
- transforms: [{
- type: 'filter',
- operation: '>'
- }]
- }];
-
- var mockData1 = [Lib.extendDeep({}, mockData0[0]), {
- x: [20, 11, 12, 0, 1, 2, 3],
- y: [1, 2, 3, 2, 5, 2, 0],
- text: ['A', 'B', 'C', 'D', 'E', 'F', 'G'],
- transforms: [{
- type: 'filter',
- operation: '<',
- value: 10
- }]
- }];
-
- afterEach(destroyGraphDiv);
-
- it('Plotly.plot should plot the transform trace', function(done) {
- var data = Lib.extendDeep([], mockData0);
-
- Plotly.plot(createGraphDiv(), data).then(function(gd) {
- assertDims([3]);
-
- var uid = data[0].uid;
- expect(gd._fullData[0].uid).toEqual(uid + '0');
-
- done();
- });
+ it("with multiple transforms (dates) ", function() {
+ var out = _transform([
+ Lib.extendDeep({}, _base, {
+ transforms: [
+ {
+ target: [
+ "2015-07-20",
+ "2016-08-01",
+ "2016-09-01",
+ "2016-10-21",
+ "2016-12-02"
+ ],
+ operation: ">",
+ value: "2016-01-01"
+ },
+ {
+ type: "filter",
+ target: [
+ "2015-07-20",
+ "2016-08-01",
+ "2016-09-01",
+ "2016-10-21",
+ "2016-12-02"
+ ],
+ operation: "<",
+ value: "2016-09-01"
+ }
+ ]
+ })
+ ]);
+
+ _assert(out, [-1], [2], [0.2]);
+ expect(out[0].transforms[0].target).toEqual(["2016-08-01"]);
});
+ });
+});
- it('Plotly.restyle should work', function(done) {
- var data = Lib.extendDeep([], mockData0);
- data[0].marker = { color: 'red' };
+describe("filter transforms interactions", function() {
+ "use strict";
+ beforeAll(function() {
+ jasmine.addMatchers(customMatchers);
+ });
+
+ var mockData0 = [
+ {
+ x: [-2, -1, -2, 0, 1, 2, 3],
+ y: [1, 2, 3, 1, 2, 3, 1],
+ text: ["a", "b", "c", "d", "e", "f", "g"],
+ transforms: [{ type: "filter", operation: ">" }]
+ }
+ ];
+
+ var mockData1 = [
+ Lib.extendDeep({}, mockData0[0]),
+ {
+ x: [20, 11, 12, 0, 1, 2, 3],
+ y: [1, 2, 3, 2, 5, 2, 0],
+ text: ["A", "B", "C", "D", "E", "F", "G"],
+ transforms: [{ type: "filter", operation: "<", value: 10 }]
+ }
+ ];
- var gd = createGraphDiv();
- var dims = [3];
+ afterEach(destroyGraphDiv);
- var uid;
- function assertUid(gd) {
- expect(gd._fullData[0].uid)
- .toEqual(uid + '0', 'should preserve uid on restyle');
- }
+ it("Plotly.plot should plot the transform trace", function(done) {
+ var data = Lib.extendDeep([], mockData0);
- Plotly.plot(gd, data).then(function() {
- uid = gd.data[0].uid;
+ Plotly.plot(createGraphDiv(), data).then(function(gd) {
+ assertDims([3]);
- expect(gd._fullData[0].marker.color).toEqual('red');
- assertUid(gd);
- assertStyle(dims, ['rgb(255, 0, 0)'], [1]);
+ var uid = data[0].uid;
+ expect(gd._fullData[0].uid).toEqual(uid + "0");
- expect(gd._fullLayout.xaxis.range).toBeCloseToArray([0.87, 3.13]);
- expect(gd._fullLayout.yaxis.range).toBeCloseToArray([0.85, 3.15]);
+ done();
+ });
+ });
- return Plotly.restyle(gd, 'marker.color', 'blue');
- }).then(function() {
- expect(gd._fullData[0].marker.color).toEqual('blue');
- assertUid(gd);
- assertStyle(dims, ['rgb(0, 0, 255)'], [1]);
+ it("Plotly.restyle should work", function(done) {
+ var data = Lib.extendDeep([], mockData0);
+ data[0].marker = { color: "red" };
- return Plotly.restyle(gd, 'marker.color', 'red');
- }).then(function() {
- expect(gd._fullData[0].marker.color).toEqual('red');
- assertUid(gd);
- assertStyle(dims, ['rgb(255, 0, 0)'], [1]);
+ var gd = createGraphDiv();
+ var dims = [3];
- return Plotly.restyle(gd, 'transforms[0].value', 2.5);
- }).then(function() {
- assertUid(gd);
- assertStyle([1], ['rgb(255, 0, 0)'], [1]);
+ var uid;
+ function assertUid(gd) {
+ expect(gd._fullData[0].uid).toEqual(
+ uid + "0",
+ "should preserve uid on restyle"
+ );
+ }
- expect(gd._fullLayout.xaxis.range).toBeCloseToArray([2, 4]);
- expect(gd._fullLayout.yaxis.range).toBeCloseToArray([0, 2]);
+ Plotly.plot(gd, data)
+ .then(function() {
+ uid = gd.data[0].uid;
- done();
- });
- });
+ expect(gd._fullData[0].marker.color).toEqual("red");
+ assertUid(gd);
+ assertStyle(dims, ["rgb(255, 0, 0)"], [1]);
- it('Plotly.extendTraces should work', function(done) {
- var data = Lib.extendDeep([], mockData0);
+ expect(gd._fullLayout.xaxis.range).toBeCloseToArray([0.87, 3.13]);
+ expect(gd._fullLayout.yaxis.range).toBeCloseToArray([0.85, 3.15]);
- var gd = createGraphDiv();
+ return Plotly.restyle(gd, "marker.color", "blue");
+ })
+ .then(function() {
+ expect(gd._fullData[0].marker.color).toEqual("blue");
+ assertUid(gd);
+ assertStyle(dims, ["rgb(0, 0, 255)"], [1]);
- Plotly.plot(gd, data).then(function() {
- expect(gd.data[0].x.length).toEqual(7);
- expect(gd._fullData[0].x.length).toEqual(3);
+ return Plotly.restyle(gd, "marker.color", "red");
+ })
+ .then(function() {
+ expect(gd._fullData[0].marker.color).toEqual("red");
+ assertUid(gd);
+ assertStyle(dims, ["rgb(255, 0, 0)"], [1]);
- assertDims([3]);
+ return Plotly.restyle(gd, "transforms[0].value", 2.5);
+ })
+ .then(function() {
+ assertUid(gd);
+ assertStyle([1], ["rgb(255, 0, 0)"], [1]);
- return Plotly.extendTraces(gd, {
- x: [ [-3, 4, 5] ],
- y: [ [1, -2, 3] ]
- }, [0]);
- }).then(function() {
- expect(gd.data[0].x.length).toEqual(10);
- expect(gd._fullData[0].x.length).toEqual(5);
+ expect(gd._fullLayout.xaxis.range).toBeCloseToArray([2, 4]);
+ expect(gd._fullLayout.yaxis.range).toBeCloseToArray([0, 2]);
- assertDims([5]);
+ done();
+ });
+ });
- done();
- });
- });
+ it("Plotly.extendTraces should work", function(done) {
+ var data = Lib.extendDeep([], mockData0);
- it('Plotly.deleteTraces should work', function(done) {
- var data = Lib.extendDeep([], mockData1);
+ var gd = createGraphDiv();
- var gd = createGraphDiv();
+ Plotly.plot(gd, data)
+ .then(function() {
+ expect(gd.data[0].x.length).toEqual(7);
+ expect(gd._fullData[0].x.length).toEqual(3);
- Plotly.plot(gd, data).then(function() {
- assertDims([3, 4]);
+ assertDims([3]);
- return Plotly.deleteTraces(gd, [1]);
- }).then(function() {
- assertDims([3]);
+ return Plotly.extendTraces(gd, { x: [[-3, 4, 5]], y: [[1, -2, 3]] }, [
+ 0
+ ]);
+ })
+ .then(function() {
+ expect(gd.data[0].x.length).toEqual(10);
+ expect(gd._fullData[0].x.length).toEqual(5);
- return Plotly.deleteTraces(gd, [0]);
- }).then(function() {
- assertDims([]);
+ assertDims([5]);
- done();
- });
+ done();
+ });
+ });
- });
+ it("Plotly.deleteTraces should work", function(done) {
+ var data = Lib.extendDeep([], mockData1);
- it('toggling trace visibility should work', function(done) {
- var data = Lib.extendDeep([], mockData1);
+ var gd = createGraphDiv();
- var gd = createGraphDiv();
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertDims([3, 4]);
- Plotly.plot(gd, data).then(function() {
- assertDims([3, 4]);
+ return Plotly.deleteTraces(gd, [1]);
+ })
+ .then(function() {
+ assertDims([3]);
- return Plotly.restyle(gd, 'visible', 'legendonly', [1]);
- }).then(function() {
- assertDims([3]);
+ return Plotly.deleteTraces(gd, [0]);
+ })
+ .then(function() {
+ assertDims([]);
- return Plotly.restyle(gd, 'visible', false, [0]);
- }).then(function() {
- assertDims([]);
+ done();
+ });
+ });
- return Plotly.restyle(gd, 'visible', [true, true], [0, 1]);
- }).then(function() {
- assertDims([3, 4]);
+ it("toggling trace visibility should work", function(done) {
+ var data = Lib.extendDeep([], mockData1);
- done();
- });
- });
+ var gd = createGraphDiv();
- it('zooming in/out should not change filtered data', function(done) {
- var data = Lib.extendDeep([], mockData1);
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertDims([3, 4]);
- var gd = createGraphDiv();
+ return Plotly.restyle(gd, "visible", "legendonly", [1]);
+ })
+ .then(function() {
+ assertDims([3]);
- function getTx(p) { return p.tx; }
+ return Plotly.restyle(gd, "visible", false, [0]);
+ })
+ .then(function() {
+ assertDims([]);
- Plotly.plot(gd, data).then(function() {
- expect(gd.calcdata[0].map(getTx)).toEqual(['e', 'f', 'g']);
- expect(gd.calcdata[1].map(getTx)).toEqual(['D', 'E', 'F', 'G']);
+ return Plotly.restyle(gd, "visible", [true, true], [0, 1]);
+ })
+ .then(function() {
+ assertDims([3, 4]);
- return Plotly.relayout(gd, 'xaxis.range', [-1, 1]);
- })
- .then(function() {
- expect(gd.calcdata[0].map(getTx)).toEqual(['e', 'f', 'g']);
- expect(gd.calcdata[1].map(getTx)).toEqual(['D', 'E', 'F', 'G']);
+ done();
+ });
+ });
- return Plotly.relayout(gd, 'xaxis.autorange', true);
- })
- .then(function() {
- expect(gd.calcdata[0].map(getTx)).toEqual(['e', 'f', 'g']);
- expect(gd.calcdata[1].map(getTx)).toEqual(['D', 'E', 'F', 'G']);
- })
- .then(done);
- });
+ it("zooming in/out should not change filtered data", function(done) {
+ var data = Lib.extendDeep([], mockData1);
- it('should update axis categories', function(done) {
- var data = [{
- type: 'bar',
- x: ['a', 'b', 'c', 'd', 'e', 'f', 'g'],
- y: [1, 10, 100, 25, 50, -25, 100],
- transforms: [{
- type: 'filter',
- operation: '<',
- value: 10,
- target: [1, 10, 100, 25, 50, -25, 100]
- }]
- }];
-
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- expect(gd._fullLayout.xaxis._categories).toEqual(['a', 'f']);
- expect(gd._fullLayout.yaxis._categories).toEqual([]);
-
- return Plotly.addTraces(gd, [{
- type: 'bar',
- x: ['h', 'i'],
- y: [2, 1],
- transforms: [{
- type: 'filter',
- operation: '=',
- value: 'i'
- }]
- }]);
- })
- .then(function() {
- expect(gd._fullLayout.xaxis._categories).toEqual(['a', 'f', 'i']);
- expect(gd._fullLayout.yaxis._categories).toEqual([]);
+ var gd = createGraphDiv();
- return Plotly.deleteTraces(gd, [0]);
- })
- .then(function() {
- expect(gd._fullLayout.xaxis._categories).toEqual(['i']);
- expect(gd._fullLayout.yaxis._categories).toEqual([]);
- })
- .then(done);
- });
+ function getTx(p) {
+ return p.tx;
+ }
+ Plotly.plot(gd, data)
+ .then(function() {
+ expect(gd.calcdata[0].map(getTx)).toEqual(["e", "f", "g"]);
+ expect(gd.calcdata[1].map(getTx)).toEqual(["D", "E", "F", "G"]);
+
+ return Plotly.relayout(gd, "xaxis.range", [-1, 1]);
+ })
+ .then(function() {
+ expect(gd.calcdata[0].map(getTx)).toEqual(["e", "f", "g"]);
+ expect(gd.calcdata[1].map(getTx)).toEqual(["D", "E", "F", "G"]);
+
+ return Plotly.relayout(gd, "xaxis.autorange", true);
+ })
+ .then(function() {
+ expect(gd.calcdata[0].map(getTx)).toEqual(["e", "f", "g"]);
+ expect(gd.calcdata[1].map(getTx)).toEqual(["D", "E", "F", "G"]);
+ })
+ .then(done);
+ });
+
+ it("should update axis categories", function(done) {
+ var data = [
+ {
+ type: "bar",
+ x: ["a", "b", "c", "d", "e", "f", "g"],
+ y: [1, 10, 100, 25, 50, -25, 100],
+ transforms: [
+ {
+ type: "filter",
+ operation: "<",
+ value: 10,
+ target: [1, 10, 100, 25, 50, -25, 100]
+ }
+ ]
+ }
+ ];
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data)
+ .then(function() {
+ expect(gd._fullLayout.xaxis._categories).toEqual(["a", "f"]);
+ expect(gd._fullLayout.yaxis._categories).toEqual([]);
+
+ return Plotly.addTraces(gd, [
+ {
+ type: "bar",
+ x: ["h", "i"],
+ y: [2, 1],
+ transforms: [{ type: "filter", operation: "=", value: "i" }]
+ }
+ ]);
+ })
+ .then(function() {
+ expect(gd._fullLayout.xaxis._categories).toEqual(["a", "f", "i"]);
+ expect(gd._fullLayout.yaxis._categories).toEqual([]);
+
+ return Plotly.deleteTraces(gd, [0]);
+ })
+ .then(function() {
+ expect(gd._fullLayout.xaxis._categories).toEqual(["i"]);
+ expect(gd._fullLayout.yaxis._categories).toEqual([]);
+ })
+ .then(done);
+ });
});
diff --git a/test/jasmine/tests/transform_groupby_test.js b/test/jasmine/tests/transform_groupby_test.js
index bb2ea0f607e..02ecff850a3 100644
--- a/test/jasmine/tests/transform_groupby_test.js
+++ b/test/jasmine/tests/transform_groupby_test.js
@@ -1,586 +1,708 @@
-var Plotly = require('@lib/index');
-var Lib = require('@src/lib');
-
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var assertDims = require('../assets/assert_dims');
-var assertStyle = require('../assets/assert_style');
-
-
-describe('groupby', function() {
-
- describe('one-to-many transforms:', function() {
- 'use strict';
-
- var mockData0 = [{
- mode: 'markers',
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1],
- transforms: [{
- type: 'groupby',
- groups: ['a', 'a', 'b', 'a', 'b', 'b', 'a'],
- style: { a: {marker: {color: 'red'}}, b: {marker: {color: 'blue'}} }
- }]
- }];
-
- var mockData1 = [Lib.extendDeep({}, mockData0[0]), {
- mode: 'markers',
- x: [20, 11, 12, 0, 1, 2, 3],
- y: [1, 2, 3, 2, 5, 2, 0],
- transforms: [{
- type: 'groupby',
- groups: ['b', 'a', 'b', 'b', 'b', 'a', 'a'],
- style: { a: {marker: {color: 'green'}}, b: {marker: {color: 'black'}} }
- }]
- }];
-
- afterEach(destroyGraphDiv);
-
- it('Plotly.plot should plot the transform traces', function(done) {
- var data = Lib.extendDeep([], mockData0);
-
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- expect(gd.data.length).toEqual(1);
- expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
-
- expect(gd._fullData.length).toEqual(2);
- expect(gd._fullData[0].x).toEqual([1, -1, 0, 3]);
- expect(gd._fullData[0].y).toEqual([1, 2, 1, 1]);
- expect(gd._fullData[1].x).toEqual([-2, 1, 2]);
- expect(gd._fullData[1].y).toEqual([3, 2, 3]);
-
- assertDims([4, 3]);
-
- done();
- });
- });
-
- it('Plotly.restyle should work', function(done) {
- var data = Lib.extendDeep([], mockData0);
- data[0].marker = { size: 20 };
-
- var gd = createGraphDiv();
- var dims = [4, 3];
-
- Plotly.plot(gd, data).then(function() {
- assertStyle(dims,
- ['rgb(255, 0, 0)', 'rgb(0, 0, 255)'],
- [1, 1]
- );
-
- return Plotly.restyle(gd, 'marker.opacity', 0.4);
- }).then(function() {
- assertStyle(dims,
- ['rgb(255, 0, 0)', 'rgb(0, 0, 255)'],
- [0.4, 0.4]
- );
-
- expect(gd._fullData[0].marker.opacity).toEqual(0.4);
- expect(gd._fullData[1].marker.opacity).toEqual(0.4);
-
- return Plotly.restyle(gd, 'marker.opacity', 1);
- }).then(function() {
- assertStyle(dims,
- ['rgb(255, 0, 0)', 'rgb(0, 0, 255)'],
- [1, 1]
- );
-
- expect(gd._fullData[0].marker.opacity).toEqual(1);
- expect(gd._fullData[1].marker.opacity).toEqual(1);
-
- return Plotly.restyle(gd, {
- 'transforms[0].style': { a: {marker: {color: 'green'}}, b: {marker: {color: 'red'}} },
- 'marker.opacity': 0.4
- });
- }).then(function() {
- assertStyle(dims,
- ['rgb(0, 128, 0)', 'rgb(255, 0, 0)'],
- [0.4, 0.4]
- );
-
- done();
- });
- });
-
- it('Plotly.extendTraces should work', function(done) {
- var data = Lib.extendDeep([], mockData0);
-
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- expect(gd.data[0].x.length).toEqual(7);
- expect(gd._fullData[0].x.length).toEqual(4);
- expect(gd._fullData[1].x.length).toEqual(3);
-
- assertDims([4, 3]);
+var Plotly = require("@lib/index");
+var Lib = require("@src/lib");
+
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var assertDims = require("../assets/assert_dims");
+var assertStyle = require("../assets/assert_style");
+
+describe("groupby", function() {
+ describe("one-to-many transforms:", function() {
+ "use strict";
+ var mockData0 = [
+ {
+ mode: "markers",
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [1, 2, 3, 1, 2, 3, 1],
+ transforms: [
+ {
+ type: "groupby",
+ groups: ["a", "a", "b", "a", "b", "b", "a"],
+ style: {
+ a: { marker: { color: "red" } },
+ b: { marker: { color: "blue" } }
+ }
+ }
+ ]
+ }
+ ];
+
+ var mockData1 = [
+ Lib.extendDeep({}, mockData0[0]),
+ {
+ mode: "markers",
+ x: [20, 11, 12, 0, 1, 2, 3],
+ y: [1, 2, 3, 2, 5, 2, 0],
+ transforms: [
+ {
+ type: "groupby",
+ groups: ["b", "a", "b", "b", "b", "a", "a"],
+ style: {
+ a: { marker: { color: "green" } },
+ b: { marker: { color: "black" } }
+ }
+ }
+ ]
+ }
+ ];
+
+ afterEach(destroyGraphDiv);
+
+ it("Plotly.plot should plot the transform traces", function(done) {
+ var data = Lib.extendDeep([], mockData0);
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data).then(function() {
+ expect(gd.data.length).toEqual(1);
+ expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
+
+ expect(gd._fullData.length).toEqual(2);
+ expect(gd._fullData[0].x).toEqual([1, -1, 0, 3]);
+ expect(gd._fullData[0].y).toEqual([1, 2, 1, 1]);
+ expect(gd._fullData[1].x).toEqual([-2, 1, 2]);
+ expect(gd._fullData[1].y).toEqual([3, 2, 3]);
+
+ assertDims([4, 3]);
+
+ done();
+ });
+ });
- return Plotly.extendTraces(gd, {
- x: [ [-3, 4, 5] ],
- y: [ [1, -2, 3] ],
- 'transforms[0].groups': [ ['b', 'a', 'b'] ]
- }, [0]);
- }).then(function() {
- expect(gd.data[0].x.length).toEqual(10);
- expect(gd._fullData[0].x.length).toEqual(5);
- expect(gd._fullData[1].x.length).toEqual(5);
+ it("Plotly.restyle should work", function(done) {
+ var data = Lib.extendDeep([], mockData0);
+ data[0].marker = { size: 20 };
- assertDims([5, 5]);
+ var gd = createGraphDiv();
+ var dims = [4, 3];
- done();
- });
- });
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertStyle(dims, ["rgb(255, 0, 0)", "rgb(0, 0, 255)"], [1, 1]);
- it('Plotly.deleteTraces should work', function(done) {
- var data = Lib.extendDeep([], mockData1);
+ return Plotly.restyle(gd, "marker.opacity", 0.4);
+ })
+ .then(function() {
+ assertStyle(dims, ["rgb(255, 0, 0)", "rgb(0, 0, 255)"], [0.4, 0.4]);
- var gd = createGraphDiv();
+ expect(gd._fullData[0].marker.opacity).toEqual(0.4);
+ expect(gd._fullData[1].marker.opacity).toEqual(0.4);
- Plotly.plot(gd, data).then(function() {
- assertDims([4, 3, 4, 3]);
+ return Plotly.restyle(gd, "marker.opacity", 1);
+ })
+ .then(function() {
+ assertStyle(dims, ["rgb(255, 0, 0)", "rgb(0, 0, 255)"], [1, 1]);
- return Plotly.deleteTraces(gd, [1]);
- }).then(function() {
- assertDims([4, 3]);
+ expect(gd._fullData[0].marker.opacity).toEqual(1);
+ expect(gd._fullData[1].marker.opacity).toEqual(1);
- return Plotly.deleteTraces(gd, [0]);
- }).then(function() {
- assertDims([]);
+ return Plotly.restyle(gd, {
+ "transforms[0].style": {
+ a: { marker: { color: "green" } },
+ b: { marker: { color: "red" } }
+ },
+ "marker.opacity": 0.4
+ });
+ })
+ .then(function() {
+ assertStyle(dims, ["rgb(0, 128, 0)", "rgb(255, 0, 0)"], [0.4, 0.4]);
- done();
- });
+ done();
});
+ });
- it('toggling trace visibility should work', function(done) {
- var data = Lib.extendDeep([], mockData1);
+ it("Plotly.extendTraces should work", function(done) {
+ var data = Lib.extendDeep([], mockData0);
- var gd = createGraphDiv();
+ var gd = createGraphDiv();
- Plotly.plot(gd, data).then(function() {
- assertDims([4, 3, 4, 3]);
+ Plotly.plot(gd, data)
+ .then(function() {
+ expect(gd.data[0].x.length).toEqual(7);
+ expect(gd._fullData[0].x.length).toEqual(4);
+ expect(gd._fullData[1].x.length).toEqual(3);
- return Plotly.restyle(gd, 'visible', 'legendonly', [1]);
- }).then(function() {
- assertDims([4, 3]);
+ assertDims([4, 3]);
- return Plotly.restyle(gd, 'visible', false, [0]);
- }).then(function() {
- assertDims([]);
+ return Plotly.extendTraces(
+ gd,
+ {
+ x: [[-3, 4, 5]],
+ y: [[1, -2, 3]],
+ "transforms[0].groups": [["b", "a", "b"]]
+ },
+ [0]
+ );
+ })
+ .then(function() {
+ expect(gd.data[0].x.length).toEqual(10);
+ expect(gd._fullData[0].x.length).toEqual(5);
+ expect(gd._fullData[1].x.length).toEqual(5);
- return Plotly.restyle(gd, 'visible', [true, true], [0, 1]);
- }).then(function() {
- assertDims([4, 3, 4, 3]);
+ assertDims([5, 5]);
- done();
- });
+ done();
});
-
});
- // these tests can be shortened, once the meaning of edge cases gets clarified
- describe('symmetry/degeneracy testing of one-to-many transforms on arbitrary arrays where there is no grouping (implicit 1):', function() {
- 'use strict';
-
- var mockData = [{
- mode: 'markers',
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1],
-
- // everything is present:
- transforms: [{
- type: 'groupby',
- groups: ['a', 'a', 'b', 'a', 'b', 'b', 'a'],
- style: { a: {marker: {color: 'red'}}, b: {marker: {color: 'blue'}} }
- }]
- }];
-
- var mockData0 = [{
- mode: 'markers',
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1],
-
- // groups, styles not present
- transforms: [{
- type: 'groupby'
- // groups not present
- // styles not present
- }]
- }];
-
- // transform attribute with empty list
- var mockData1 = [{
- mode: 'markers',
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1],
-
- // transforms is present but there are no items in it
- transforms: [ /* list is empty */ ]
- }];
-
- // transform attribute with null value
- var mockData2 = [{
- mode: 'markers',
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1],
- transforms: null
- }];
-
- // no transform is present at all
- var mockData3 = [{
- mode: 'markers',
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1]
- }];
-
- afterEach(destroyGraphDiv);
-
- it('Plotly.plot should plot the transform traces', function(done) {
- var data = Lib.extendDeep([], mockData);
-
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- expect(gd.data.length).toEqual(1);
- expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
-
- expect(gd._fullData.length).toEqual(2); // two groups
- expect(gd._fullData[0].x).toEqual([1, -1, 0, 3]);
- expect(gd._fullData[0].y).toEqual([1, 2, 1, 1]);
- expect(gd._fullData[1].x).toEqual([-2, 1, 2]);
- expect(gd._fullData[1].y).toEqual([3, 2, 3]);
-
- assertDims([4, 3]);
-
- done();
- });
- });
+ it("Plotly.deleteTraces should work", function(done) {
+ var data = Lib.extendDeep([], mockData1);
- it('Plotly.plot should plot the transform traces', function(done) {
- var data = Lib.extendDeep([], mockData0);
+ var gd = createGraphDiv();
- var gd = createGraphDiv();
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertDims([4, 3, 4, 3]);
- Plotly.plot(gd, data).then(function() {
- expect(gd.data.length).toEqual(1);
- expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
+ return Plotly.deleteTraces(gd, [1]);
+ })
+ .then(function() {
+ assertDims([4, 3]);
- expect(gd._fullData.length).toEqual(1);
- assertDims([7]);
+ return Plotly.deleteTraces(gd, [0]);
+ })
+ .then(function() {
+ assertDims([]);
- done();
- });
- });
-
- it('Plotly.plot should plot the transform traces', function(done) {
- var data = Lib.extendDeep([], mockData1);
-
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- expect(gd.data.length).toEqual(1);
- expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
-
- expect(gd._fullData.length).toEqual(1);
- expect(gd._fullData[0].x).toEqual([ 1, -1, -2, 0, 1, 2, 3 ]);
- expect(gd._fullData[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
-
- assertDims([7]);
-
- done();
- });
+ done();
});
+ });
- it('Plotly.plot should plot the transform traces', function(done) {
- var data = Lib.extendDeep([], mockData2);
+ it("toggling trace visibility should work", function(done) {
+ var data = Lib.extendDeep([], mockData1);
- var gd = createGraphDiv();
+ var gd = createGraphDiv();
- Plotly.plot(gd, data).then(function() {
- expect(gd.data.length).toEqual(1);
- expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertDims([4, 3, 4, 3]);
- expect(gd._fullData.length).toEqual(1);
+ return Plotly.restyle(gd, "visible", "legendonly", [1]);
+ })
+ .then(function() {
+ assertDims([4, 3]);
- expect(gd._fullData[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd._fullData[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
+ return Plotly.restyle(gd, "visible", false, [0]);
+ })
+ .then(function() {
+ assertDims([]);
- assertDims([7]);
+ return Plotly.restyle(gd, "visible", [true, true], [0, 1]);
+ })
+ .then(function() {
+ assertDims([4, 3, 4, 3]);
- done();
- });
+ done();
});
+ });
+ });
+
+ // these tests can be shortened, once the meaning of edge cases gets clarified
+ describe(
+ "symmetry/degeneracy testing of one-to-many transforms on arbitrary arrays where there is no grouping (implicit 1):",
+ function() {
+ "use strict";
+ var mockData = [
+ {
+ mode: "markers",
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [1, 2, 3, 1, 2, 3, 1],
+ // everything is present:
+ transforms: [
+ {
+ type: "groupby",
+ groups: ["a", "a", "b", "a", "b", "b", "a"],
+ style: {
+ a: { marker: { color: "red" } },
+ b: { marker: { color: "blue" } }
+ }
+ }
+ ]
+ }
+ ];
+
+ var mockData0 = [
+ {
+ mode: "markers",
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [1, 2, 3, 1, 2, 3, 1],
+ // groups, styles not present
+ transforms: [
+ {
+ // groups not present
+ // styles not present
+ type: "groupby"
+ }
+ ]
+ }
+ ];
+
+ // transform attribute with empty list
+ var mockData1 = [
+ {
+ mode: "markers",
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [1, 2, 3, 1, 2, 3, 1],
+ // transforms is present but there are no items in it
+ transforms: []
+ }
+ ];
+
+ // transform attribute with null value
+ var mockData2 = [
+ {
+ mode: "markers",
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [1, 2, 3, 1, 2, 3, 1],
+ transforms: null
+ }
+ ];
+
+ // no transform is present at all
+ var mockData3 = [
+ {
+ mode: "markers",
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [1, 2, 3, 1, 2, 3, 1]
+ }
+ ];
- it('Plotly.plot should plot the transform traces', function(done) {
- var data = Lib.extendDeep([], mockData3);
+ afterEach(destroyGraphDiv);
- var gd = createGraphDiv();
+ it("Plotly.plot should plot the transform traces", function(done) {
+ var data = Lib.extendDeep([], mockData);
- Plotly.plot(gd, data).then(function() {
- expect(gd.data.length).toEqual(1);
- expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
+ var gd = createGraphDiv();
- expect(gd._fullData.length).toEqual(1);
+ Plotly.plot(gd, data).then(function() {
+ expect(gd.data.length).toEqual(1);
+ expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
- expect(gd._fullData[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd._fullData[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
+ expect(gd._fullData.length).toEqual(2);
+ // two groups
+ expect(gd._fullData[0].x).toEqual([1, -1, 0, 3]);
+ expect(gd._fullData[0].y).toEqual([1, 2, 1, 1]);
+ expect(gd._fullData[1].x).toEqual([-2, 1, 2]);
+ expect(gd._fullData[1].y).toEqual([3, 2, 3]);
- assertDims([7]);
+ assertDims([4, 3]);
- done();
- });
+ done();
});
- });
-
- describe('grouping with basic, heterogenous and overridden attributes', function() {
- 'use strict';
+ });
- afterEach(destroyGraphDiv);
+ it("Plotly.plot should plot the transform traces", function(done) {
+ var data = Lib.extendDeep([], mockData0);
- function test(mockData) {
+ var gd = createGraphDiv();
- return function(done) {
- var data = Lib.extendDeep([], mockData);
+ Plotly.plot(gd, data).then(function() {
+ expect(gd.data.length).toEqual(1);
+ expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
- var gd = createGraphDiv();
+ expect(gd._fullData.length).toEqual(1);
+ assertDims([7]);
- Plotly.plot(gd, data).then(function() {
-
- expect(gd.data.length).toEqual(1);
- expect(gd.data[0].ids).toEqual(['q', 'w', 'r', 't', 'y', 'u', 'i']);
- expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd.data[0].y).toEqual([0, 1, 2, 3, 5, 4, 6]);
- expect(gd.data[0].marker.line.width).toEqual([4, 2, 4, 2, 2, 3, 3]);
+ done();
+ });
+ });
- expect(gd._fullData.length).toEqual(2);
+ it("Plotly.plot should plot the transform traces", function(done) {
+ var data = Lib.extendDeep([], mockData1);
- expect(gd._fullData[0].ids).toEqual(['q', 'w', 't', 'i']);
- expect(gd._fullData[0].x).toEqual([1, -1, 0, 3]);
- expect(gd._fullData[0].y).toEqual([0, 1, 3, 6]);
- expect(gd._fullData[0].marker.line.width).toEqual([4, 2, 2, 3]);
+ var gd = createGraphDiv();
- expect(gd._fullData[1].ids).toEqual(['r', 'y', 'u']);
- expect(gd._fullData[1].x).toEqual([-2, 1, 2]);
- expect(gd._fullData[1].y).toEqual([2, 5, 4]);
- expect(gd._fullData[1].marker.line.width).toEqual([4, 2, 3]);
+ Plotly.plot(gd, data).then(function() {
+ expect(gd.data.length).toEqual(1);
+ expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
- assertDims([4, 3]);
+ expect(gd._fullData.length).toEqual(1);
+ expect(gd._fullData[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd._fullData[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
- done();
- });
- };
- }
+ assertDims([7]);
- // basic test
- var mockData1 = [{
- mode: 'markers',
- ids: ['q', 'w', 'r', 't', 'y', 'u', 'i'],
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [0, 1, 2, 3, 5, 4, 6],
- marker: {line: {width: [4, 2, 4, 2, 2, 3, 3]}},
- transforms: [{
- type: 'groupby',
- groups: ['a', 'a', 'b', 'a', 'b', 'b', 'a'],
- style: { a: {marker: {color: 'red'}}, b: {marker: {color: 'blue'}} }
- }]
- }];
-
- // heterogenously present attributes
- var mockData2 = [{
- mode: 'markers',
- ids: ['q', 'w', 'r', 't', 'y', 'u', 'i'],
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [0, 1, 2, 3, 5, 4, 6],
- marker: {line: {width: [4, 2, 4, 2, 2, 3, 3]}},
- transforms: [{
- type: 'groupby',
- groups: ['a', 'a', 'b', 'a', 'b', 'b', 'a'],
- style: {
- a: {
- marker: {
- color: 'orange',
- size: 20,
- line: {
- color: 'red'
- }
- }
- },
- b: {
- mode: 'markers+lines', // heterogeonos attributes are OK: group 'a' doesn't need to define this
- marker: {
- color: 'cyan',
- size: 15,
- line: {
- color: 'purple'
- },
- opacity: 0.5,
- symbol: 'triangle-up'
- },
- line: {
- color: 'purple'
- }
- }
- }
- }]
- }];
-
- // attributes set at top level and partially overridden in the group item level
- var mockData3 = [{
- mode: 'markers+lines',
- ids: ['q', 'w', 'r', 't', 'y', 'u', 'i'],
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [0, 1, 2, 3, 5, 4, 6],
- marker: {
- color: 'darkred', // general 'default' color
- line: {
- width: [4, 2, 4, 2, 2, 3, 3],
- color: ['orange', 'red', 'green', 'cyan', 'magenta', 'blue', 'pink']
- }
- },
- line: {color: 'red'},
- transforms: [{
- type: 'groupby',
- groups: ['a', 'a', 'b', 'a', 'b', 'b', 'a'],
- style: {
- a: {marker: {size: 30}},
- // override general color:
- b: {marker: {size: 15, line: {color: 'yellow'}}, line: {color: 'purple'}}
- }
- }]
- }];
-
- var mockData4 = [{
- mode: 'markers+lines',
- ids: ['q', 'w', 'r', 't', 'y', 'u', 'i'],
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [0, 1, 2, 3, 5, 4, 6],
- marker: {line: {width: [4, 2, 4, 2, 2, 3, 3]}},
- transforms: [{
- type: 'groupby',
- groups: ['a', 'a', 'b', 'a', 'b', 'b', 'a'],
- style: {/* can be empty, or of partial group id coverage */}
- }]
- }];
-
- var mockData5 = [{
- mode: 'markers+lines',
- ids: ['q', 'w', 'r', 't', 'y', 'u', 'i'],
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [0, 1, 2, 3, 5, 4, 6],
- marker: {
- line: {width: [4, 2, 4, 2, 2, 3, 3]},
- size: 10,
- color: ['red', '#eee', 'lightgreen', 'blue', 'red', '#eee', 'lightgreen']
- },
- transforms: [{
- type: 'groupby',
- groups: ['a', 'a', 'b', 'a', 'b', 'b', 'a']
- }]
- }];
-
- it('`data` preserves user supplied input but `gd._fullData` reflects the grouping', test(mockData1));
-
- it('passes with lots of attributes and heterogenous attrib presence', test(mockData2));
-
- it('passes with group styles partially overriding top level aesthetics', test(mockData3));
- it('passes extended tests with group styles partially overriding top level aesthetics', function(done) {
- var data = Lib.extendDeep([], mockData3);
- var gd = createGraphDiv();
- Plotly.plot(gd, data).then(function() {
- expect(gd._fullData[0].marker.line.color).toEqual(['orange', 'red', 'cyan', 'pink']);
- expect(gd._fullData[1].marker.line.color).toEqual('yellow');
- done();
- });
+ done();
});
+ });
- it('passes with no explicit styling for the individual group', test(mockData4));
+ it("Plotly.plot should plot the transform traces", function(done) {
+ var data = Lib.extendDeep([], mockData2);
- it('passes with no explicit styling in the group transform at all', test(mockData5));
+ var gd = createGraphDiv();
- });
+ Plotly.plot(gd, data).then(function() {
+ expect(gd.data.length).toEqual(1);
+ expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
- describe('passes with no `groups`', function() {
- 'use strict';
+ expect(gd._fullData.length).toEqual(1);
- afterEach(destroyGraphDiv);
+ expect(gd._fullData[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd._fullData[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
- function test(mockData) {
+ assertDims([7]);
- return function(done) {
- var data = Lib.extendDeep([], mockData);
+ done();
+ });
+ });
- var gd = createGraphDiv();
+ it("Plotly.plot should plot the transform traces", function(done) {
+ var data = Lib.extendDeep([], mockData3);
- Plotly.plot(gd, data).then(function() {
+ var gd = createGraphDiv();
- expect(gd.data.length).toEqual(1);
- expect(gd.data[0].ids).toEqual(['q', 'w', 'r', 't', 'y', 'u', 'i']);
- expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd.data[0].y).toEqual([0, 1, 2, 3, 5, 4, 6]);
- expect(gd.data[0].marker.line.width).toEqual([4, 2, 4, 2, 2, 3, 3]);
+ Plotly.plot(gd, data).then(function() {
+ expect(gd.data.length).toEqual(1);
+ expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
- expect(gd._fullData.length).toEqual(1);
+ expect(gd._fullData.length).toEqual(1);
- expect(gd._fullData[0].ids).toEqual(['q', 'w', 'r', 't', 'y', 'u', 'i']);
- expect(gd._fullData[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd._fullData[0].y).toEqual([0, 1, 2, 3, 5, 4, 6]);
- expect(gd._fullData[0].marker.line.width).toEqual([4, 2, 4, 2, 2, 3, 3]);
+ expect(gd._fullData[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd._fullData[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
- assertDims([7]);
+ assertDims([7]);
- done();
- });
- };
+ done();
+ });
+ });
+ }
+ );
+
+ describe(
+ "grouping with basic, heterogenous and overridden attributes",
+ function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
+
+ function test(mockData) {
+ return function(done) {
+ var data = Lib.extendDeep([], mockData);
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data).then(function() {
+ expect(gd.data.length).toEqual(1);
+ expect(gd.data[0].ids).toEqual(["q", "w", "r", "t", "y", "u", "i"]);
+ expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd.data[0].y).toEqual([0, 1, 2, 3, 5, 4, 6]);
+ expect(gd.data[0].marker.line.width).toEqual([4, 2, 4, 2, 2, 3, 3]);
+
+ expect(gd._fullData.length).toEqual(2);
+
+ expect(gd._fullData[0].ids).toEqual(["q", "w", "t", "i"]);
+ expect(gd._fullData[0].x).toEqual([1, -1, 0, 3]);
+ expect(gd._fullData[0].y).toEqual([0, 1, 3, 6]);
+ expect(gd._fullData[0].marker.line.width).toEqual([4, 2, 2, 3]);
+
+ expect(gd._fullData[1].ids).toEqual(["r", "y", "u"]);
+ expect(gd._fullData[1].x).toEqual([-2, 1, 2]);
+ expect(gd._fullData[1].y).toEqual([2, 5, 4]);
+ expect(gd._fullData[1].marker.line.width).toEqual([4, 2, 3]);
+
+ assertDims([4, 3]);
+
+ done();
+ });
+ };
+ }
+
+ // basic test
+ var mockData1 = [
+ {
+ mode: "markers",
+ ids: ["q", "w", "r", "t", "y", "u", "i"],
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [0, 1, 2, 3, 5, 4, 6],
+ marker: { line: { width: [4, 2, 4, 2, 2, 3, 3] } },
+ transforms: [
+ {
+ type: "groupby",
+ groups: ["a", "a", "b", "a", "b", "b", "a"],
+ style: {
+ a: { marker: { color: "red" } },
+ b: { marker: { color: "blue" } }
+ }
+ }
+ ]
}
-
- var mockData0 = [{
- mode: 'markers+lines',
- ids: ['q', 'w', 'r', 't', 'y', 'u', 'i'],
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [0, 1, 2, 3, 5, 4, 6],
- marker: {size: 20, line: {width: [4, 2, 4, 2, 2, 3, 3]}},
- transforms: [{
- type: 'groupby',
- // groups: ['a', 'a', 'b', 'a', 'b', 'b', 'a'],
- style: { a: {marker: {color: 'red'}}, b: {marker: {color: 'blue'}} }
- }]
- }];
-
- var mockData1 = [{
- mode: 'markers+lines',
- ids: ['q', 'w', 'r', 't', 'y', 'u', 'i'],
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [0, 1, 2, 3, 5, 4, 6],
- marker: {size: 20, line: {width: [4, 2, 4, 2, 2, 3, 3]}},
- transforms: [{
- type: 'groupby',
- groups: [],
- style: { a: {marker: {color: 'red'}}, b: {marker: {color: 'blue'}} }
- }]
- }];
-
- var mockData2 = [{
- mode: 'markers+lines',
- ids: ['q', 'w', 'r', 't', 'y', 'u', 'i'],
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [0, 1, 2, 3, 5, 4, 6],
- marker: {size: 20, line: {width: [4, 2, 4, 2, 2, 3, 3]}},
- transforms: [{
- type: 'groupby',
- groups: null,
- style: { a: {marker: {color: 'red'}}, b: {marker: {color: 'blue'}} }
- }]
- }];
-
- it('passes with no groups', test(mockData0));
- it('passes with empty groups', test(mockData1));
- it('passes with falsey groups', test(mockData2));
-
- });
+ ];
+
+ // heterogenously present attributes
+ var mockData2 = [
+ {
+ mode: "markers",
+ ids: ["q", "w", "r", "t", "y", "u", "i"],
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [0, 1, 2, 3, 5, 4, 6],
+ marker: { line: { width: [4, 2, 4, 2, 2, 3, 3] } },
+ transforms: [
+ {
+ type: "groupby",
+ groups: ["a", "a", "b", "a", "b", "b", "a"],
+ style: {
+ a: {
+ marker: { color: "orange", size: 20, line: { color: "red" } }
+ },
+ b: {
+ mode: "markers+lines",
+ // heterogeonos attributes are OK: group 'a' doesn't need to define this
+ marker: {
+ color: "cyan",
+ size: 15,
+ line: { color: "purple" },
+ opacity: 0.5,
+ symbol: "triangle-up"
+ },
+ line: { color: "purple" }
+ }
+ }
+ }
+ ]
+ }
+ ];
+
+ // attributes set at top level and partially overridden in the group item level
+ var mockData3 = [
+ {
+ mode: "markers+lines",
+ ids: ["q", "w", "r", "t", "y", "u", "i"],
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [0, 1, 2, 3, 5, 4, 6],
+ marker: {
+ color: "darkred",
+ // general 'default' color
+ line: {
+ width: [4, 2, 4, 2, 2, 3, 3],
+ color: [
+ "orange",
+ "red",
+ "green",
+ "cyan",
+ "magenta",
+ "blue",
+ "pink"
+ ]
+ }
+ },
+ line: { color: "red" },
+ transforms: [
+ {
+ type: "groupby",
+ groups: ["a", "a", "b", "a", "b", "b", "a"],
+ style: {
+ a: { marker: { size: 30 } },
+ // override general color:
+ b: {
+ marker: { size: 15, line: { color: "yellow" } },
+ line: { color: "purple" }
+ }
+ }
+ }
+ ]
+ }
+ ];
+
+ var mockData4 = [
+ {
+ mode: "markers+lines",
+ ids: ["q", "w", "r", "t", "y", "u", "i"],
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [0, 1, 2, 3, 5, 4, 6],
+ marker: { line: { width: [4, 2, 4, 2, 2, 3, 3] } },
+ transforms: [
+ {
+ type: "groupby",
+ groups: ["a", "a", "b", "a", "b", "b", "a"],
+ style: {}
+ }
+ ]
+ }
+ ];
+
+ var mockData5 = [
+ {
+ mode: "markers+lines",
+ ids: ["q", "w", "r", "t", "y", "u", "i"],
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [0, 1, 2, 3, 5, 4, 6],
+ marker: {
+ line: { width: [4, 2, 4, 2, 2, 3, 3] },
+ size: 10,
+ color: [
+ "red",
+ "#eee",
+ "lightgreen",
+ "blue",
+ "red",
+ "#eee",
+ "lightgreen"
+ ]
+ },
+ transforms: [
+ { type: "groupby", groups: ["a", "a", "b", "a", "b", "b", "a"] }
+ ]
+ }
+ ];
+
+ it(
+ "`data` preserves user supplied input but `gd._fullData` reflects the grouping",
+ test(mockData1)
+ );
+
+ it(
+ "passes with lots of attributes and heterogenous attrib presence",
+ test(mockData2)
+ );
+
+ it(
+ "passes with group styles partially overriding top level aesthetics",
+ test(mockData3)
+ );
+ it(
+ "passes extended tests with group styles partially overriding top level aesthetics",
+ function(done) {
+ var data = Lib.extendDeep([], mockData3);
+ var gd = createGraphDiv();
+ Plotly.plot(gd, data).then(function() {
+ expect(gd._fullData[0].marker.line.color).toEqual([
+ "orange",
+ "red",
+ "cyan",
+ "pink"
+ ]);
+ expect(gd._fullData[1].marker.line.color).toEqual("yellow");
+ done();
+ });
+ }
+ );
+
+ it(
+ "passes with no explicit styling for the individual group",
+ test(mockData4)
+ );
+
+ it(
+ "passes with no explicit styling in the group transform at all",
+ test(mockData5)
+ );
+ }
+ );
+
+ describe("passes with no `groups`", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
+
+ function test(mockData) {
+ return function(done) {
+ var data = Lib.extendDeep([], mockData);
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data).then(function() {
+ expect(gd.data.length).toEqual(1);
+ expect(gd.data[0].ids).toEqual(["q", "w", "r", "t", "y", "u", "i"]);
+ expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd.data[0].y).toEqual([0, 1, 2, 3, 5, 4, 6]);
+ expect(gd.data[0].marker.line.width).toEqual([4, 2, 4, 2, 2, 3, 3]);
+
+ expect(gd._fullData.length).toEqual(1);
+
+ expect(gd._fullData[0].ids).toEqual([
+ "q",
+ "w",
+ "r",
+ "t",
+ "y",
+ "u",
+ "i"
+ ]);
+ expect(gd._fullData[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd._fullData[0].y).toEqual([0, 1, 2, 3, 5, 4, 6]);
+ expect(gd._fullData[0].marker.line.width).toEqual([
+ 4,
+ 2,
+ 4,
+ 2,
+ 2,
+ 3,
+ 3
+ ]);
+
+ assertDims([7]);
+
+ done();
+ });
+ };
+ }
+
+ var mockData0 = [
+ {
+ mode: "markers+lines",
+ ids: ["q", "w", "r", "t", "y", "u", "i"],
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [0, 1, 2, 3, 5, 4, 6],
+ marker: { size: 20, line: { width: [4, 2, 4, 2, 2, 3, 3] } },
+ transforms: [
+ {
+ type: "groupby",
+ // groups: ['a', 'a', 'b', 'a', 'b', 'b', 'a'],
+ style: {
+ a: { marker: { color: "red" } },
+ b: { marker: { color: "blue" } }
+ }
+ }
+ ]
+ }
+ ];
+
+ var mockData1 = [
+ {
+ mode: "markers+lines",
+ ids: ["q", "w", "r", "t", "y", "u", "i"],
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [0, 1, 2, 3, 5, 4, 6],
+ marker: { size: 20, line: { width: [4, 2, 4, 2, 2, 3, 3] } },
+ transforms: [
+ {
+ type: "groupby",
+ groups: [],
+ style: {
+ a: { marker: { color: "red" } },
+ b: { marker: { color: "blue" } }
+ }
+ }
+ ]
+ }
+ ];
+
+ var mockData2 = [
+ {
+ mode: "markers+lines",
+ ids: ["q", "w", "r", "t", "y", "u", "i"],
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [0, 1, 2, 3, 5, 4, 6],
+ marker: { size: 20, line: { width: [4, 2, 4, 2, 2, 3, 3] } },
+ transforms: [
+ {
+ type: "groupby",
+ groups: null,
+ style: {
+ a: { marker: { color: "red" } },
+ b: { marker: { color: "blue" } }
+ }
+ }
+ ]
+ }
+ ];
+
+ it("passes with no groups", test(mockData0));
+ it("passes with empty groups", test(mockData1));
+ it("passes with falsey groups", test(mockData2));
+ });
});
diff --git a/test/jasmine/tests/transform_multi_test.js b/test/jasmine/tests/transform_multi_test.js
index 6930effbd8e..15c17750a39 100644
--- a/test/jasmine/tests/transform_multi_test.js
+++ b/test/jasmine/tests/transform_multi_test.js
@@ -1,665 +1,702 @@
-var Plotly = require('@lib/index');
-var Filter = require('@lib/filter');
-
-var Plots = require('@src/plots/plots');
-var Lib = require('@src/lib');
-
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var assertDims = require('../assets/assert_dims');
-var assertStyle = require('../assets/assert_style');
-
-
-describe('general transforms:', function() {
- 'use strict';
-
- var fullLayout = { _transformModules: [] };
-
- var traceIn, traceOut;
-
- it('supplyTraceDefaults should supply the transform defaults', function() {
- traceIn = {
- y: [2, 1, 2],
- transforms: [{ type: 'filter' }]
- };
-
- traceOut = Plots.supplyTraceDefaults(traceIn, 0, fullLayout);
-
- expect(traceOut.transforms).toEqual([{
- type: 'filter',
- enabled: true,
- operation: '=',
- value: 0,
- target: 'x',
- _module: Filter
- }]);
- });
-
- it('supplyTraceDefaults should not bail if transform module is not found', function() {
- traceIn = {
- y: [2, 1, 2],
- transforms: [{ type: 'invalid' }]
- };
-
- traceOut = Plots.supplyTraceDefaults(traceIn, 0, fullLayout);
-
- expect(traceOut.y).toBe(traceIn.y);
- });
-
- it('supplyTraceDefaults should honored global transforms', function() {
- traceIn = {
- y: [2, 1, 2],
- transforms: [{
- type: 'filter',
- operation: '>',
- value: 0,
- target: 'x'
- }]
- };
-
- var layout = {
- _transformModules: [],
- _globalTransforms: [{
- type: 'filter'
- }]
- };
-
- traceOut = Plots.supplyTraceDefaults(traceIn, 0, layout);
-
- expect(traceOut.transforms[0]).toEqual({
- type: 'filter',
- enabled: true,
- operation: '=',
- value: 0,
- target: 'x',
- _module: Filter
- }, '- global first');
-
- expect(traceOut.transforms[1]).toEqual({
- type: 'filter',
- enabled: true,
- operation: '>',
- value: 0,
- target: 'x',
- _module: Filter
- }, '- trace second');
-
- expect(layout._transformModules).toEqual([Filter]);
- });
-
- it('supplyDataDefaults should apply the transform while', function() {
- var dataIn = [{
- x: [-2, -2, 1, 2, 3],
- y: [1, 2, 2, 3, 1]
- }, {
- x: [-2, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1],
- transforms: [{
- type: 'filter',
- operation: '>',
- value: 0,
- target: 'x'
- }]
- }];
-
- var dataOut = [];
- Plots.supplyDataDefaults(dataIn, dataOut, {}, []);
-
- var msg;
-
- msg = 'does not mutate user data';
- expect(dataIn[1].x).toEqual([-2, -1, -2, 0, 1, 2, 3], msg);
- expect(dataIn[1].y).toEqual([1, 2, 3, 1, 2, 3, 1], msg);
- expect(dataIn[1].transforms).toEqual([{
- type: 'filter',
- operation: '>',
- value: 0,
- target: 'x'
- }], msg);
-
- msg = 'supplying the transform defaults';
- expect(dataOut[1].transforms[0]).toEqual({
- type: 'filter',
- enabled: true,
- operation: '>',
- value: 0,
- target: 'x',
- _module: Filter
- }, msg);
-
- msg = 'keeping refs to user data';
- expect(dataOut[1]._input.x).toEqual([-2, -1, -2, 0, 1, 2, 3], msg);
- expect(dataOut[1]._input.y).toEqual([1, 2, 3, 1, 2, 3, 1], msg);
- expect(dataOut[1]._input.transforms).toEqual([{
- type: 'filter',
- operation: '>',
- value: 0,
- target: 'x',
- }], msg);
-
- msg = 'keeping refs to full transforms array';
- expect(dataOut[1]._fullInput.transforms).toEqual([{
- type: 'filter',
- enabled: true,
- operation: '>',
- value: 0,
- target: 'x',
- _module: Filter
- }], msg);
-
- msg = 'setting index w.r.t user data';
- expect(dataOut[0].index).toEqual(0, msg);
- expect(dataOut[1].index).toEqual(1, msg);
-
- msg = 'setting _expandedIndex w.r.t full data';
- expect(dataOut[0]._expandedIndex).toEqual(0, msg);
- expect(dataOut[1]._expandedIndex).toEqual(1, msg);
- });
-
-});
-
-describe('user-defined transforms:', function() {
- 'use strict';
-
- it('should pass correctly arguments to transform methods', function() {
- var transformIn = { type: 'fake' };
- var transformOut = {};
-
- var dataIn = [{
- transforms: [transformIn]
- }];
-
- var fullData = [],
- layout = {},
- fullLayout = { _has: function() {} },
- transitionData = {};
-
- function assertSupplyDefaultsArgs(_transformIn, traceOut, _layout) {
- expect(_transformIn).toBe(transformIn);
- expect(_layout).toBe(fullLayout);
-
- return transformOut;
- }
-
- function assertTransformArgs(dataOut, opts) {
- expect(dataOut[0]._input).toBe(dataIn[0]);
- expect(opts.transform).toBe(transformOut);
- expect(opts.fullTrace._input).toBe(dataIn[0]);
- expect(opts.layout).toBe(layout);
- expect(opts.fullLayout).toBe(fullLayout);
-
- return dataOut;
- }
-
- function assertSupplyLayoutDefaultsArgs(_layout, _fullLayout, _fullData, _transitionData) {
- expect(_layout).toBe(layout);
- expect(_fullLayout).toBe(fullLayout);
- expect(_fullData).toBe(fullData);
- expect(_transitionData).toBe(transitionData);
+var Plotly = require("@lib/index");
+var Filter = require("@lib/filter");
+
+var Plots = require("@src/plots/plots");
+var Lib = require("@src/lib");
+
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var assertDims = require("../assets/assert_dims");
+var assertStyle = require("../assets/assert_style");
+
+describe("general transforms:", function() {
+ "use strict";
+ var fullLayout = { _transformModules: [] };
+
+ var traceIn, traceOut;
+
+ it("supplyTraceDefaults should supply the transform defaults", function() {
+ traceIn = { y: [2, 1, 2], transforms: [{ type: "filter" }] };
+
+ traceOut = Plots.supplyTraceDefaults(traceIn, 0, fullLayout);
+
+ expect(traceOut.transforms).toEqual([
+ {
+ type: "filter",
+ enabled: true,
+ operation: "=",
+ value: 0,
+ target: "x",
+ _module: Filter
+ }
+ ]);
+ });
+
+ it(
+ "supplyTraceDefaults should not bail if transform module is not found",
+ function() {
+ traceIn = { y: [2, 1, 2], transforms: [{ type: "invalid" }] };
+
+ traceOut = Plots.supplyTraceDefaults(traceIn, 0, fullLayout);
+
+ expect(traceOut.y).toBe(traceIn.y);
+ }
+ );
+
+ it("supplyTraceDefaults should honored global transforms", function() {
+ traceIn = {
+ y: [2, 1, 2],
+ transforms: [{ type: "filter", operation: ">", value: 0, target: "x" }]
+ };
+
+ var layout = {
+ _transformModules: [],
+ _globalTransforms: [{ type: "filter" }]
+ };
+
+ traceOut = Plots.supplyTraceDefaults(traceIn, 0, layout);
+
+ expect(traceOut.transforms[0]).toEqual(
+ {
+ type: "filter",
+ enabled: true,
+ operation: "=",
+ value: 0,
+ target: "x",
+ _module: Filter
+ },
+ "- global first"
+ );
+
+ expect(traceOut.transforms[1]).toEqual(
+ {
+ type: "filter",
+ enabled: true,
+ operation: ">",
+ value: 0,
+ target: "x",
+ _module: Filter
+ },
+ "- trace second"
+ );
+
+ expect(layout._transformModules).toEqual([Filter]);
+ });
+
+ it("supplyDataDefaults should apply the transform while", function() {
+ var dataIn = [
+ { x: [-2, -2, 1, 2, 3], y: [1, 2, 2, 3, 1] },
+ {
+ x: [-2, -1, -2, 0, 1, 2, 3],
+ y: [1, 2, 3, 1, 2, 3, 1],
+ transforms: [{ type: "filter", operation: ">", value: 0, target: "x" }]
+ }
+ ];
+
+ var dataOut = [];
+ Plots.supplyDataDefaults(dataIn, dataOut, {}, []);
+
+ var msg;
+
+ msg = "does not mutate user data";
+ expect(dataIn[1].x).toEqual([-2, -1, -2, 0, 1, 2, 3], msg);
+ expect(dataIn[1].y).toEqual([1, 2, 3, 1, 2, 3, 1], msg);
+ expect(dataIn[1].transforms).toEqual(
+ [{ type: "filter", operation: ">", value: 0, target: "x" }],
+ msg
+ );
+
+ msg = "supplying the transform defaults";
+ expect(dataOut[1].transforms[0]).toEqual(
+ {
+ type: "filter",
+ enabled: true,
+ operation: ">",
+ value: 0,
+ target: "x",
+ _module: Filter
+ },
+ msg
+ );
+
+ msg = "keeping refs to user data";
+ expect(dataOut[1]._input.x).toEqual([-2, -1, -2, 0, 1, 2, 3], msg);
+ expect(dataOut[1]._input.y).toEqual([1, 2, 3, 1, 2, 3, 1], msg);
+ expect(dataOut[1]._input.transforms).toEqual(
+ [{ type: "filter", operation: ">", value: 0, target: "x" }],
+ msg
+ );
+
+ msg = "keeping refs to full transforms array";
+ expect(dataOut[1]._fullInput.transforms).toEqual(
+ [
+ {
+ type: "filter",
+ enabled: true,
+ operation: ">",
+ value: 0,
+ target: "x",
+ _module: Filter
}
-
- var fakeTransformModule = {
- moduleType: 'transform',
- name: 'fake',
- attributes: {},
- supplyDefaults: assertSupplyDefaultsArgs,
- transform: assertTransformArgs,
- supplyLayoutDefaults: assertSupplyLayoutDefaultsArgs
- };
-
- Plotly.register(fakeTransformModule);
- Plots.supplyDataDefaults(dataIn, fullData, layout, fullLayout);
- Plots.supplyLayoutModuleDefaults(layout, fullLayout, fullData, transitionData);
- delete Plots.transformsRegistry.fake;
- });
-
+ ],
+ msg
+ );
+
+ msg = "setting index w.r.t user data";
+ expect(dataOut[0].index).toEqual(0, msg);
+ expect(dataOut[1].index).toEqual(1, msg);
+
+ msg = "setting _expandedIndex w.r.t full data";
+ expect(dataOut[0]._expandedIndex).toEqual(0, msg);
+ expect(dataOut[1]._expandedIndex).toEqual(1, msg);
+ });
});
-describe('multiple transforms:', function() {
- 'use strict';
-
- var mockData0 = [{
- mode: 'markers',
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1],
- transforms: [{
- type: 'groupby',
- groups: ['a', 'a', 'b', 'a', 'b', 'b', 'a'],
- style: { a: {marker: {color: 'red'}}, b: {marker: {color: 'blue'}} }
- }, {
- type: 'filter',
- operation: '>'
- }]
- }];
-
- var mockData1 = [Lib.extendDeep({}, mockData0[0]), {
- mode: 'markers',
- x: [20, 11, 12, 0, 1, 2, 3],
- y: [1, 2, 3, 2, 5, 2, 0],
- transforms: [{
- type: 'groupby',
- groups: ['b', 'a', 'b', 'b', 'b', 'a', 'a'],
- style: { a: {marker: {color: 'green'}}, b: {marker: {color: 'black'}} }
- }, {
- type: 'filter',
- operation: '<',
- value: 10
- }]
- }];
-
- afterEach(destroyGraphDiv);
-
- it('Plotly.plot should plot the transform traces', function(done) {
- var data = Lib.extendDeep([], mockData0);
-
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- expect(gd.data.length).toEqual(1);
- expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
-
- expect(gd._fullData.length).toEqual(2);
- expect(gd._fullData[0].x).toEqual([1, 3]);
- expect(gd._fullData[0].y).toEqual([1, 1]);
- expect(gd._fullData[1].x).toEqual([1, 2]);
- expect(gd._fullData[1].y).toEqual([2, 3]);
-
- assertDims([2, 2]);
-
- done();
- });
- });
-
- it('Plotly.plot should plot the transform traces (reverse case)', function(done) {
- var data = Lib.extendDeep([], mockData0);
-
- data[0].transforms.slice().reverse();
-
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- expect(gd.data.length).toEqual(1);
- expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
-
- expect(gd._fullData.length).toEqual(2);
- expect(gd._fullData[0].x).toEqual([1, 3]);
- expect(gd._fullData[0].y).toEqual([1, 1]);
- expect(gd._fullData[1].x).toEqual([1, 2]);
- expect(gd._fullData[1].y).toEqual([2, 3]);
-
- assertDims([2, 2]);
-
- done();
- });
- });
+describe("user-defined transforms:", function() {
+ "use strict";
+ it("should pass correctly arguments to transform methods", function() {
+ var transformIn = { type: "fake" };
+ var transformOut = {};
+
+ var dataIn = [{ transforms: [transformIn] }];
+
+ var fullData = [],
+ layout = {},
+ fullLayout = {
+ _has: function() {}
+ },
+ transitionData = {};
+
+ function assertSupplyDefaultsArgs(_transformIn, traceOut, _layout) {
+ expect(_transformIn).toBe(transformIn);
+ expect(_layout).toBe(fullLayout);
+
+ return transformOut;
+ }
+
+ function assertTransformArgs(dataOut, opts) {
+ expect(dataOut[0]._input).toBe(dataIn[0]);
+ expect(opts.transform).toBe(transformOut);
+ expect(opts.fullTrace._input).toBe(dataIn[0]);
+ expect(opts.layout).toBe(layout);
+ expect(opts.fullLayout).toBe(fullLayout);
+
+ return dataOut;
+ }
+
+ function assertSupplyLayoutDefaultsArgs(
+ _layout,
+ _fullLayout,
+ _fullData,
+ _transitionData
+ ) {
+ expect(_layout).toBe(layout);
+ expect(_fullLayout).toBe(fullLayout);
+ expect(_fullData).toBe(fullData);
+ expect(_transitionData).toBe(transitionData);
+ }
+
+ var fakeTransformModule = {
+ moduleType: "transform",
+ name: "fake",
+ attributes: {},
+ supplyDefaults: assertSupplyDefaultsArgs,
+ transform: assertTransformArgs,
+ supplyLayoutDefaults: assertSupplyLayoutDefaultsArgs
+ };
+
+ Plotly.register(fakeTransformModule);
+ Plots.supplyDataDefaults(dataIn, fullData, layout, fullLayout);
+ Plots.supplyLayoutModuleDefaults(
+ layout,
+ fullLayout,
+ fullData,
+ transitionData
+ );
+ delete Plots.transformsRegistry.fake;
+ });
+});
- it('Plotly.restyle should work', function(done) {
- var data = Lib.extendDeep([], mockData0);
- data[0].marker = { size: 20 };
-
- var gd = createGraphDiv();
- var dims = [2, 2];
-
- Plotly.plot(gd, data).then(function() {
- assertStyle(dims,
- ['rgb(255, 0, 0)', 'rgb(0, 0, 255)'],
- [1, 1]
- );
-
- return Plotly.restyle(gd, 'marker.opacity', 0.4);
- }).then(function() {
- assertStyle(dims,
- ['rgb(255, 0, 0)', 'rgb(0, 0, 255)'],
- [0.4, 0.4]
- );
-
- expect(gd._fullData[0].marker.opacity).toEqual(0.4);
- expect(gd._fullData[1].marker.opacity).toEqual(0.4);
-
- return Plotly.restyle(gd, 'marker.opacity', 1);
- }).then(function() {
- assertStyle(dims,
- ['rgb(255, 0, 0)', 'rgb(0, 0, 255)'],
- [1, 1]
- );
-
- expect(gd._fullData[0].marker.opacity).toEqual(1);
- expect(gd._fullData[1].marker.opacity).toEqual(1);
-
- return Plotly.restyle(gd, {
- 'transforms[0].style': { a: {marker: {color: 'green'}}, b: {marker: {color: 'red'}} },
- 'marker.opacity': 0.4
- });
- }).then(function() {
- assertStyle(dims,
- ['rgb(0, 128, 0)', 'rgb(255, 0, 0)'],
- [0.4, 0.4]
- );
-
- done();
- });
+describe("multiple transforms:", function() {
+ "use strict";
+ var mockData0 = [
+ {
+ mode: "markers",
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [1, 2, 3, 1, 2, 3, 1],
+ transforms: [
+ {
+ type: "groupby",
+ groups: ["a", "a", "b", "a", "b", "b", "a"],
+ style: {
+ a: { marker: { color: "red" } },
+ b: { marker: { color: "blue" } }
+ }
+ },
+ { type: "filter", operation: ">" }
+ ]
+ }
+ ];
+
+ var mockData1 = [
+ Lib.extendDeep({}, mockData0[0]),
+ {
+ mode: "markers",
+ x: [20, 11, 12, 0, 1, 2, 3],
+ y: [1, 2, 3, 2, 5, 2, 0],
+ transforms: [
+ {
+ type: "groupby",
+ groups: ["b", "a", "b", "b", "b", "a", "a"],
+ style: {
+ a: { marker: { color: "green" } },
+ b: { marker: { color: "black" } }
+ }
+ },
+ { type: "filter", operation: "<", value: 10 }
+ ]
+ }
+ ];
+
+ afterEach(destroyGraphDiv);
+
+ it("Plotly.plot should plot the transform traces", function(done) {
+ var data = Lib.extendDeep([], mockData0);
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data).then(function() {
+ expect(gd.data.length).toEqual(1);
+ expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
+
+ expect(gd._fullData.length).toEqual(2);
+ expect(gd._fullData[0].x).toEqual([1, 3]);
+ expect(gd._fullData[0].y).toEqual([1, 1]);
+ expect(gd._fullData[1].x).toEqual([1, 2]);
+ expect(gd._fullData[1].y).toEqual([2, 3]);
+
+ assertDims([2, 2]);
+
+ done();
});
+ });
- it('Plotly.extendTraces should work', function(done) {
- var data = Lib.extendDeep([], mockData0);
+ it("Plotly.plot should plot the transform traces (reverse case)", function(
+ done
+ ) {
+ var data = Lib.extendDeep([], mockData0);
- var gd = createGraphDiv();
+ data[0].transforms.slice().reverse();
- Plotly.plot(gd, data).then(function() {
- expect(gd.data[0].x.length).toEqual(7);
- expect(gd._fullData[0].x.length).toEqual(2);
- expect(gd._fullData[1].x.length).toEqual(2);
+ var gd = createGraphDiv();
- assertDims([2, 2]);
+ Plotly.plot(gd, data).then(function() {
+ expect(gd.data.length).toEqual(1);
+ expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
- return Plotly.extendTraces(gd, {
- x: [ [-3, 4, 5] ],
- y: [ [1, -2, 3] ],
- 'transforms[0].groups': [ ['b', 'a', 'b'] ]
- }, [0]);
- }).then(function() {
- expect(gd.data[0].x.length).toEqual(10);
- expect(gd._fullData[0].x.length).toEqual(3);
- expect(gd._fullData[1].x.length).toEqual(3);
+ expect(gd._fullData.length).toEqual(2);
+ expect(gd._fullData[0].x).toEqual([1, 3]);
+ expect(gd._fullData[0].y).toEqual([1, 1]);
+ expect(gd._fullData[1].x).toEqual([1, 2]);
+ expect(gd._fullData[1].y).toEqual([2, 3]);
- assertDims([3, 3]);
+ assertDims([2, 2]);
- done();
- });
+ done();
});
+ });
- it('Plotly.deleteTraces should work', function(done) {
- var data = Lib.extendDeep([], mockData1);
+ it("Plotly.restyle should work", function(done) {
+ var data = Lib.extendDeep([], mockData0);
+ data[0].marker = { size: 20 };
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- assertDims([2, 2, 2, 2]);
-
- return Plotly.deleteTraces(gd, [1]);
- }).then(function() {
- assertDims([2, 2]);
-
- return Plotly.deleteTraces(gd, [0]);
- }).then(function() {
- assertDims([]);
-
- done();
- });
- });
+ var gd = createGraphDiv();
+ var dims = [2, 2];
- it('toggling trace visibility should work', function(done) {
- var data = Lib.extendDeep([], mockData1);
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertStyle(dims, ["rgb(255, 0, 0)", "rgb(0, 0, 255)"], [1, 1]);
- var gd = createGraphDiv();
+ return Plotly.restyle(gd, "marker.opacity", 0.4);
+ })
+ .then(function() {
+ assertStyle(dims, ["rgb(255, 0, 0)", "rgb(0, 0, 255)"], [0.4, 0.4]);
- Plotly.plot(gd, data).then(function() {
- assertDims([2, 2, 2, 2]);
+ expect(gd._fullData[0].marker.opacity).toEqual(0.4);
+ expect(gd._fullData[1].marker.opacity).toEqual(0.4);
- return Plotly.restyle(gd, 'visible', 'legendonly', [1]);
- }).then(function() {
- assertDims([2, 2]);
+ return Plotly.restyle(gd, "marker.opacity", 1);
+ })
+ .then(function() {
+ assertStyle(dims, ["rgb(255, 0, 0)", "rgb(0, 0, 255)"], [1, 1]);
- return Plotly.restyle(gd, 'visible', false, [0]);
- }).then(function() {
- assertDims([]);
+ expect(gd._fullData[0].marker.opacity).toEqual(1);
+ expect(gd._fullData[1].marker.opacity).toEqual(1);
- return Plotly.restyle(gd, 'visible', [true, true]);
- }).then(function() {
- assertDims([2, 2, 2, 2]);
-
- done();
+ return Plotly.restyle(gd, {
+ "transforms[0].style": {
+ a: { marker: { color: "green" } },
+ b: { marker: { color: "red" } }
+ },
+ "marker.opacity": 0.4
});
- });
-
+ })
+ .then(function() {
+ assertStyle(dims, ["rgb(0, 128, 0)", "rgb(255, 0, 0)"], [0.4, 0.4]);
+
+ done();
+ });
+ });
+
+ it("Plotly.extendTraces should work", function(done) {
+ var data = Lib.extendDeep([], mockData0);
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data)
+ .then(function() {
+ expect(gd.data[0].x.length).toEqual(7);
+ expect(gd._fullData[0].x.length).toEqual(2);
+ expect(gd._fullData[1].x.length).toEqual(2);
+
+ assertDims([2, 2]);
+
+ return Plotly.extendTraces(
+ gd,
+ {
+ x: [[-3, 4, 5]],
+ y: [[1, -2, 3]],
+ "transforms[0].groups": [["b", "a", "b"]]
+ },
+ [0]
+ );
+ })
+ .then(function() {
+ expect(gd.data[0].x.length).toEqual(10);
+ expect(gd._fullData[0].x.length).toEqual(3);
+ expect(gd._fullData[1].x.length).toEqual(3);
+
+ assertDims([3, 3]);
+
+ done();
+ });
+ });
+
+ it("Plotly.deleteTraces should work", function(done) {
+ var data = Lib.extendDeep([], mockData1);
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertDims([2, 2, 2, 2]);
+
+ return Plotly.deleteTraces(gd, [1]);
+ })
+ .then(function() {
+ assertDims([2, 2]);
+
+ return Plotly.deleteTraces(gd, [0]);
+ })
+ .then(function() {
+ assertDims([]);
+
+ done();
+ });
+ });
+
+ it("toggling trace visibility should work", function(done) {
+ var data = Lib.extendDeep([], mockData1);
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertDims([2, 2, 2, 2]);
+
+ return Plotly.restyle(gd, "visible", "legendonly", [1]);
+ })
+ .then(function() {
+ assertDims([2, 2]);
+
+ return Plotly.restyle(gd, "visible", false, [0]);
+ })
+ .then(function() {
+ assertDims([]);
+
+ return Plotly.restyle(gd, "visible", [true, true]);
+ })
+ .then(function() {
+ assertDims([2, 2, 2, 2]);
+
+ done();
+ });
+ });
});
-describe('multiple traces with transforms:', function() {
- 'use strict';
-
- var mockData0 = [{
- mode: 'markers',
- x: [1, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1],
- marker: { color: 'green' },
- name: 'filtered',
- transforms: [{
- type: 'filter',
- operation: '>',
- value: 1
- }]
- }, {
- mode: 'markers',
- x: [20, 11, 12, 0, 1, 2, 3],
- y: [1, 2, 3, 2, 5, 2, 0],
- transforms: [{
- type: 'groupby',
- groups: ['a', 'a', 'b', 'a', 'b', 'b', 'a'],
- style: { a: {marker: {color: 'red'}}, b: {marker: {color: 'blue'}} }
- }, {
- type: 'filter',
- operation: '>'
- }]
- }];
-
- afterEach(destroyGraphDiv);
-
- it('Plotly.plot should plot the transform traces', function(done) {
- var data = Lib.extendDeep([], mockData0);
-
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- expect(gd.data.length).toEqual(2);
- expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
- expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
- expect(gd.data[1].x).toEqual([20, 11, 12, 0, 1, 2, 3]);
- expect(gd.data[1].y).toEqual([1, 2, 3, 2, 5, 2, 0]);
-
- expect(gd._fullData.length).toEqual(3);
- expect(gd._fullData[0].x).toEqual([2, 3]);
- expect(gd._fullData[0].y).toEqual([3, 1]);
- expect(gd._fullData[1].x).toEqual([20, 11, 3]);
- expect(gd._fullData[1].y).toEqual([1, 2, 0]);
- expect(gd._fullData[2].x).toEqual([12, 1, 2]);
- expect(gd._fullData[2].y).toEqual([3, 5, 2]);
-
- assertDims([2, 3, 3]);
-
- done();
- });
+describe("multiple traces with transforms:", function() {
+ "use strict";
+ var mockData0 = [
+ {
+ mode: "markers",
+ x: [1, -1, -2, 0, 1, 2, 3],
+ y: [1, 2, 3, 1, 2, 3, 1],
+ marker: { color: "green" },
+ name: "filtered",
+ transforms: [{ type: "filter", operation: ">", value: 1 }]
+ },
+ {
+ mode: "markers",
+ x: [20, 11, 12, 0, 1, 2, 3],
+ y: [1, 2, 3, 2, 5, 2, 0],
+ transforms: [
+ {
+ type: "groupby",
+ groups: ["a", "a", "b", "a", "b", "b", "a"],
+ style: {
+ a: { marker: { color: "red" } },
+ b: { marker: { color: "blue" } }
+ }
+ },
+ { type: "filter", operation: ">" }
+ ]
+ }
+ ];
+
+ afterEach(destroyGraphDiv);
+
+ it("Plotly.plot should plot the transform traces", function(done) {
+ var data = Lib.extendDeep([], mockData0);
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data).then(function() {
+ expect(gd.data.length).toEqual(2);
+ expect(gd.data[0].x).toEqual([1, -1, -2, 0, 1, 2, 3]);
+ expect(gd.data[0].y).toEqual([1, 2, 3, 1, 2, 3, 1]);
+ expect(gd.data[1].x).toEqual([20, 11, 12, 0, 1, 2, 3]);
+ expect(gd.data[1].y).toEqual([1, 2, 3, 2, 5, 2, 0]);
+
+ expect(gd._fullData.length).toEqual(3);
+ expect(gd._fullData[0].x).toEqual([2, 3]);
+ expect(gd._fullData[0].y).toEqual([3, 1]);
+ expect(gd._fullData[1].x).toEqual([20, 11, 3]);
+ expect(gd._fullData[1].y).toEqual([1, 2, 0]);
+ expect(gd._fullData[2].x).toEqual([12, 1, 2]);
+ expect(gd._fullData[2].y).toEqual([3, 5, 2]);
+
+ assertDims([2, 3, 3]);
+
+ done();
});
-
- it('Plotly.restyle should work', function(done) {
- var data = Lib.extendDeep([], mockData0);
- data[0].marker.size = 20;
-
- var gd = createGraphDiv();
- var dims = [2, 3, 3];
-
- Plotly.plot(gd, data).then(function() {
- assertStyle(dims,
- ['rgb(0, 128, 0)', 'rgb(255, 0, 0)', 'rgb(0, 0, 255)'],
- [1, 1, 1]
- );
-
- return Plotly.restyle(gd, 'marker.opacity', 0.4);
- }).then(function() {
- assertStyle(dims,
- ['rgb(0, 128, 0)', 'rgb(255, 0, 0)', 'rgb(0, 0, 255)'],
- [0.4, 0.4, 0.4]
- );
-
- gd._fullData.forEach(function(trace) {
- expect(trace.marker.opacity).toEqual(0.4);
- });
-
- return Plotly.restyle(gd, 'marker.opacity', 1);
- }).then(function() {
- assertStyle(dims,
- ['rgb(0, 128, 0)', 'rgb(255, 0, 0)', 'rgb(0, 0, 255)'],
- [1, 1, 1]
- );
-
- gd._fullData.forEach(function(trace) {
- expect(trace.marker.opacity).toEqual(1);
- });
-
- return Plotly.restyle(gd, {
- 'transforms[0].style': { a: {marker: {color: 'green'}}, b: {marker: {color: 'red'}} },
- 'marker.opacity': [0.4, 0.6]
- });
- }).then(function() {
- assertStyle(dims,
- ['rgb(0, 128, 0)', 'rgb(0, 128, 0)', 'rgb(255, 0, 0)'],
- [0.4, 0.6, 0.6]
- );
-
- done();
+ });
+
+ it("Plotly.restyle should work", function(done) {
+ var data = Lib.extendDeep([], mockData0);
+ data[0].marker.size = 20;
+
+ var gd = createGraphDiv();
+ var dims = [2, 3, 3];
+
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertStyle(
+ dims,
+ ["rgb(0, 128, 0)", "rgb(255, 0, 0)", "rgb(0, 0, 255)"],
+ [1, 1, 1]
+ );
+
+ return Plotly.restyle(gd, "marker.opacity", 0.4);
+ })
+ .then(function() {
+ assertStyle(
+ dims,
+ ["rgb(0, 128, 0)", "rgb(255, 0, 0)", "rgb(0, 0, 255)"],
+ [0.4, 0.4, 0.4]
+ );
+
+ gd._fullData.forEach(function(trace) {
+ expect(trace.marker.opacity).toEqual(0.4);
});
- });
-
- it('Plotly.extendTraces should work', function(done) {
- var data = Lib.extendDeep([], mockData0);
-
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- assertDims([2, 3, 3]);
- return Plotly.extendTraces(gd, {
- x: [ [-3, 4, 5] ],
- y: [ [1, -2, 3] ],
- 'transforms[0].groups': [ ['b', 'a', 'b'] ]
- }, [1]);
- }).then(function() {
- assertDims([2, 4, 4]);
-
- return Plotly.extendTraces(gd, {
- x: [ [5, 7, 10] ],
- y: [ [1, -2, 3] ]
- }, [0]);
- }).then(function() {
- assertDims([5, 4, 4]);
-
- done();
+ return Plotly.restyle(gd, "marker.opacity", 1);
+ })
+ .then(function() {
+ assertStyle(
+ dims,
+ ["rgb(0, 128, 0)", "rgb(255, 0, 0)", "rgb(0, 0, 255)"],
+ [1, 1, 1]
+ );
+
+ gd._fullData.forEach(function(trace) {
+ expect(trace.marker.opacity).toEqual(1);
});
- });
-
- it('Plotly.deleteTraces should work', function(done) {
- var data = Lib.extendDeep([], mockData0);
-
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- assertDims([2, 3, 3]);
-
- return Plotly.deleteTraces(gd, [1]);
- }).then(function() {
- assertDims([2]);
-
- return Plotly.deleteTraces(gd, [0]);
- }).then(function() {
- assertDims([]);
-
- done();
- });
- });
- it('toggling trace visibility should work', function(done) {
- var data = Lib.extendDeep([], mockData0);
-
- var gd = createGraphDiv();
-
- Plotly.plot(gd, data).then(function() {
- assertDims([2, 3, 3]);
-
- return Plotly.restyle(gd, 'visible', 'legendonly', [1]);
- }).then(function() {
- assertDims([2]);
-
- return Plotly.restyle(gd, 'visible', false, [0]);
- }).then(function() {
- assertDims([]);
-
- return Plotly.restyle(gd, 'visible', [true, true]);
- }).then(function() {
- assertDims([2, 3, 3]);
-
- return Plotly.restyle(gd, 'visible', 'legendonly', [0]);
- }).then(function() {
- assertDims([3, 3]);
-
- done();
+ return Plotly.restyle(gd, {
+ "transforms[0].style": {
+ a: { marker: { color: "green" } },
+ b: { marker: { color: "red" } }
+ },
+ "marker.opacity": [0.4, 0.6]
});
- });
+ })
+ .then(function() {
+ assertStyle(
+ dims,
+ ["rgb(0, 128, 0)", "rgb(0, 128, 0)", "rgb(255, 0, 0)"],
+ [0.4, 0.6, 0.6]
+ );
+
+ done();
+ });
+ });
+
+ it("Plotly.extendTraces should work", function(done) {
+ var data = Lib.extendDeep([], mockData0);
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertDims([2, 3, 3]);
+
+ return Plotly.extendTraces(
+ gd,
+ {
+ x: [[-3, 4, 5]],
+ y: [[1, -2, 3]],
+ "transforms[0].groups": [["b", "a", "b"]]
+ },
+ [1]
+ );
+ })
+ .then(function() {
+ assertDims([2, 4, 4]);
+
+ return Plotly.extendTraces(gd, { x: [[5, 7, 10]], y: [[1, -2, 3]] }, [
+ 0
+ ]);
+ })
+ .then(function() {
+ assertDims([5, 4, 4]);
+
+ done();
+ });
+ });
+
+ it("Plotly.deleteTraces should work", function(done) {
+ var data = Lib.extendDeep([], mockData0);
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertDims([2, 3, 3]);
+
+ return Plotly.deleteTraces(gd, [1]);
+ })
+ .then(function() {
+ assertDims([2]);
+
+ return Plotly.deleteTraces(gd, [0]);
+ })
+ .then(function() {
+ assertDims([]);
+
+ done();
+ });
+ });
+
+ it("toggling trace visibility should work", function(done) {
+ var data = Lib.extendDeep([], mockData0);
+
+ var gd = createGraphDiv();
+
+ Plotly.plot(gd, data)
+ .then(function() {
+ assertDims([2, 3, 3]);
+
+ return Plotly.restyle(gd, "visible", "legendonly", [1]);
+ })
+ .then(function() {
+ assertDims([2]);
+
+ return Plotly.restyle(gd, "visible", false, [0]);
+ })
+ .then(function() {
+ assertDims([]);
+
+ return Plotly.restyle(gd, "visible", [true, true]);
+ })
+ .then(function() {
+ assertDims([2, 3, 3]);
+
+ return Plotly.restyle(gd, "visible", "legendonly", [0]);
+ })
+ .then(function() {
+ assertDims([3, 3]);
+
+ done();
+ });
+ });
});
-describe('restyle applied on transforms:', function() {
- 'use strict';
-
- afterEach(destroyGraphDiv);
+describe("restyle applied on transforms:", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
- it('should be able', function(done) {
- var gd = createGraphDiv();
+ it("should be able", function(done) {
+ var gd = createGraphDiv();
- var data = [{ y: [2, 1, 2] }];
+ var data = [{ y: [2, 1, 2] }];
- var transform0 = {
- type: 'filter',
- target: 'y',
- operation: '>',
- value: 1
- };
+ var transform0 = { type: "filter", target: "y", operation: ">", value: 1 };
- var transform1 = {
- type: 'groupby',
- groups: ['a', 'b', 'b']
- };
+ var transform1 = { type: "groupby", groups: ["a", "b", "b"] };
- Plotly.plot(gd, data).then(function() {
- expect(gd.data.transforms).toBeUndefined();
+ Plotly.plot(gd, data)
+ .then(function() {
+ expect(gd.data.transforms).toBeUndefined();
- return Plotly.restyle(gd, 'transforms[0]', transform0);
- })
- .then(function() {
- var msg = 'to generate blank transform objects';
+ return Plotly.restyle(gd, "transforms[0]", transform0);
+ })
+ .then(function() {
+ var msg = "to generate blank transform objects";
- expect(gd.data[0].transforms[0]).toBe(transform0, msg);
+ expect(gd.data[0].transforms[0]).toBe(transform0, msg);
- // make sure transform actually works
- expect(gd._fullData[0].y).toEqual([2, 2], msg);
+ // make sure transform actually works
+ expect(gd._fullData[0].y).toEqual([2, 2], msg);
- return Plotly.restyle(gd, 'transforms[1]', transform1);
- })
- .then(function() {
- var msg = 'to generate blank transform objects (2)';
+ return Plotly.restyle(gd, "transforms[1]", transform1);
+ })
+ .then(function() {
+ var msg = "to generate blank transform objects (2)";
- expect(gd.data[0].transforms[0]).toBe(transform0, msg);
- expect(gd.data[0].transforms[1]).toBe(transform1, msg);
- expect(gd._fullData[0].y).toEqual([2], msg);
+ expect(gd.data[0].transforms[0]).toBe(transform0, msg);
+ expect(gd.data[0].transforms[1]).toBe(transform1, msg);
+ expect(gd._fullData[0].y).toEqual([2], msg);
- return Plotly.restyle(gd, 'transforms[0]', null);
- })
- .then(function() {
- var msg = 'to remove transform objects';
+ return Plotly.restyle(gd, "transforms[0]", null);
+ })
+ .then(function() {
+ var msg = "to remove transform objects";
- expect(gd.data[0].transforms[0]).toBe(transform1, msg);
- expect(gd.data[0].transforms[1]).toBeUndefined(msg);
- expect(gd._fullData[0].y).toEqual([2], msg);
- expect(gd._fullData[1].y).toEqual([1, 2], msg);
+ expect(gd.data[0].transforms[0]).toBe(transform1, msg);
+ expect(gd.data[0].transforms[1]).toBeUndefined(msg);
+ expect(gd._fullData[0].y).toEqual([2], msg);
+ expect(gd._fullData[1].y).toEqual([1, 2], msg);
- return Plotly.restyle(gd, 'transforms', null);
- })
- .then(function() {
- var msg = 'to remove all transform objects';
-
- expect(gd.data[0].transforms).toBeUndefined(msg);
- expect(gd._fullData[0].y).toEqual([2, 1, 2], msg);
- })
- .then(done);
- });
+ return Plotly.restyle(gd, "transforms", null);
+ })
+ .then(function() {
+ var msg = "to remove all transform objects";
+ expect(gd.data[0].transforms).toBeUndefined(msg);
+ expect(gd._fullData[0].y).toEqual([2, 1, 2], msg);
+ })
+ .then(done);
+ });
});
diff --git a/test/jasmine/tests/transition_test.js b/test/jasmine/tests/transition_test.js
index 949aaaa14c3..a76f082ceef 100644
--- a/test/jasmine/tests/transition_test.js
+++ b/test/jasmine/tests/transition_test.js
@@ -1,268 +1,350 @@
-var Plotly = require('@lib/index');
-var Lib = require('@src/lib');
+var Plotly = require("@lib/index");
+var Lib = require("@src/lib");
var Plots = Plotly.Plots;
-var plotApiHelpers = require('@src/plot_api/helpers');
+var plotApiHelpers = require("@src/plot_api/helpers");
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
-var fail = require('../assets/fail_test');
-var delay = require('../assets/delay');
-var mock = require('@mocks/animation');
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
+var fail = require("../assets/fail_test");
+var delay = require("../assets/delay");
+var mock = require("@mocks/animation");
function runTests(transitionDuration) {
- describe('Plots.transition (duration = ' + transitionDuration + ')', function() {
- 'use strict';
-
- var gd;
-
- beforeEach(function(done) {
- gd = createGraphDiv();
-
- var mockCopy = Lib.extendDeep({}, mock);
-
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
- });
-
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
-
- it('resolves only once the transition has completed', function(done) {
- var t1 = Date.now();
- var traces = plotApiHelpers.coerceTraceIndices(gd, null);
-
- Plots.transition(gd, null, {'xaxis.range': [0.2, 0.3]}, traces, {redraw: true}, {duration: transitionDuration, easing: 'cubic-in-out'})
- .then(delay(20))
- .then(function() {
- expect(Date.now() - t1).toBeGreaterThan(transitionDuration);
- }).catch(fail).then(done);
+ describe(
+ "Plots.transition (duration = " + transitionDuration + ")",
+ function() {
+ "use strict";
+ var gd;
+
+ beforeEach(function(done) {
+ gd = createGraphDiv();
+
+ var mockCopy = Lib.extendDeep({}, mock);
+
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
+
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
+
+ it("resolves only once the transition has completed", function(done) {
+ var t1 = Date.now();
+ var traces = plotApiHelpers.coerceTraceIndices(gd, null);
+
+ Plots.transition(
+ gd,
+ null,
+ { "xaxis.range": [0.2, 0.3] },
+ traces,
+ { redraw: true },
+ { duration: transitionDuration, easing: "cubic-in-out" }
+ )
+ .then(delay(20))
+ .then(function() {
+ expect(Date.now() - t1).toBeGreaterThan(transitionDuration);
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ it("emits plotly_transitioning on transition start", function(done) {
+ var beginTransitionCnt = 0;
+ var traces = plotApiHelpers.coerceTraceIndices(gd, null);
+
+ gd.on("plotly_transitioning", function() {
+ beginTransitionCnt++;
});
- it('emits plotly_transitioning on transition start', function(done) {
- var beginTransitionCnt = 0;
- var traces = plotApiHelpers.coerceTraceIndices(gd, null);
-
- gd.on('plotly_transitioning', function() { beginTransitionCnt++; });
-
- Plots.transition(gd, null, {'xaxis.range': [0.2, 0.3]}, traces, {redraw: true}, {duration: transitionDuration, easing: 'cubic-in-out'})
- .then(delay(20))
- .then(function() {
- expect(beginTransitionCnt).toBe(1);
- }).catch(fail).then(done);
+ Plots.transition(
+ gd,
+ null,
+ { "xaxis.range": [0.2, 0.3] },
+ traces,
+ { redraw: true },
+ { duration: transitionDuration, easing: "cubic-in-out" }
+ )
+ .then(delay(20))
+ .then(function() {
+ expect(beginTransitionCnt).toBe(1);
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ it("emits plotly_transitioned on transition end", function(done) {
+ var trEndCnt = 0;
+ var traces = plotApiHelpers.coerceTraceIndices(gd, null);
+
+ gd.on("plotly_transitioned", function() {
+ trEndCnt++;
});
- it('emits plotly_transitioned on transition end', function(done) {
- var trEndCnt = 0;
- var traces = plotApiHelpers.coerceTraceIndices(gd, null);
-
- gd.on('plotly_transitioned', function() { trEndCnt++; });
-
- Plots.transition(gd, null, {'xaxis.range': [0.2, 0.3]}, traces, {redraw: true}, {duration: transitionDuration, easing: 'cubic-in-out'})
- .then(delay(20))
- .then(function() {
- expect(trEndCnt).toEqual(1);
- }).catch(fail).then(done);
- });
-
- it('transitions an annotation', function(done) {
- function annotationPosition() {
- var g = gd._fullLayout._infolayer.select('.annotation').select('.annotation-text-g');
- var bBox = g.node().getBoundingClientRect();
- return [bBox.left, bBox.top];
+ Plots.transition(
+ gd,
+ null,
+ { "xaxis.range": [0.2, 0.3] },
+ traces,
+ { redraw: true },
+ { duration: transitionDuration, easing: "cubic-in-out" }
+ )
+ .then(delay(20))
+ .then(function() {
+ expect(trEndCnt).toEqual(1);
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ it("transitions an annotation", function(done) {
+ function annotationPosition() {
+ var g = gd._fullLayout._infolayer
+ .select(".annotation")
+ .select(".annotation-text-g");
+ var bBox = g.node().getBoundingClientRect();
+ return [bBox.left, bBox.top];
+ }
+ var p1, p2;
+
+ Plotly.relayout(gd, { annotations: [{ x: 0, y: 0, text: "test" }] })
+ .then(function() {
+ p1 = annotationPosition();
+
+ return Plots.transition(
+ gd,
+ null,
+ { "annotations[0].x": 1, "annotations[0].y": 1 },
+ [],
+ { redraw: true, duration: transitionDuration },
+ { duration: transitionDuration, easing: "cubic-in-out" }
+ );
+ })
+ .then(function() {
+ p2 = annotationPosition();
+
+ // Ensure both coordinates have moved, i.e. that the annotation has transitioned:
+ expect(p1[0]).not.toEqual(p2[0]);
+ expect(p1[1]).not.toEqual(p2[1]);
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ it("transitions an image", function(done) {
+ var jsLogo = "https://images.plot.ly/language-icons/api-home/js-logo.png";
+ var pythonLogo = "https://images.plot.ly/language-icons/api-home/python-logo.png";
+
+ function imageel() {
+ return gd._fullLayout._imageUpperLayer.select("image").node();
+ }
+ function imagesrc() {
+ return imageel().getAttribute("href");
+ }
+ var p1, p2, e1, e2;
+
+ Plotly.relayout(gd, { images: [{ x: 0, y: 0, source: jsLogo }] })
+ .then(function() {
+ p1 = imagesrc();
+ e1 = imageel();
+
+ return Plots.transition(
+ gd,
+ null,
+ { "images[0].source": pythonLogo },
+ [],
+ { redraw: true, duration: transitionDuration },
+ { duration: transitionDuration, easing: "cubic-in-out" }
+ );
+ })
+ .then(function() {
+ p2 = imagesrc();
+ e2 = imageel();
+
+ // Test that the image src has changed:
+ expect(p1).not.toEqual(p2);
+
+ // Test that the image element identity has not:
+ expect(e1).toBe(e2);
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ it("transitions a shape", function(done) {
+ function getPath() {
+ return gd._fullLayout._shapeUpperLayer.select("path").node();
+ }
+ var p1, p2, p3, d1, d2, d3, s1, s2, s3;
+
+ Plotly.relayout(gd, {
+ shapes: [
+ {
+ type: "circle",
+ xref: "x",
+ yref: "y",
+ x0: 0,
+ y0: 0,
+ x1: 2,
+ y1: 2,
+ opacity: 0.2,
+ fillcolor: "blue",
+ line: { color: "blue" }
}
- var p1, p2;
-
- Plotly.relayout(gd, {annotations: [{x: 0, y: 0, text: 'test'}]}).then(function() {
- p1 = annotationPosition();
-
- return Plots.transition(gd, null, {
- 'annotations[0].x': 1,
- 'annotations[0].y': 1
- }, [],
- {redraw: true, duration: transitionDuration},
- {duration: transitionDuration, easing: 'cubic-in-out'}
- );
- }).then(function() {
- p2 = annotationPosition();
-
- // Ensure both coordinates have moved, i.e. that the annotation has transitioned:
- expect(p1[0]).not.toEqual(p2[0]);
- expect(p1[1]).not.toEqual(p2[1]);
-
- }).catch(fail).then(done);
- });
-
- it('transitions an image', function(done) {
- var jsLogo = 'https://images.plot.ly/language-icons/api-home/js-logo.png';
- var pythonLogo = 'https://images.plot.ly/language-icons/api-home/python-logo.png';
-
- function imageel() {
- return gd._fullLayout._imageUpperLayer.select('image').node();
+ ]
+ })
+ .then(function() {
+ p1 = getPath();
+ d1 = p1.getAttribute("d");
+ s1 = p1.getAttribute("style");
+
+ return Plots.transition(
+ gd,
+ null,
+ { "shapes[0].x0": 1, "shapes[0].y0": 1 },
+ [],
+ { redraw: true, duration: transitionDuration },
+ { duration: transitionDuration, easing: "cubic-in-out" }
+ );
+ })
+ .then(function() {
+ p2 = getPath();
+ d2 = p2.getAttribute("d");
+ s2 = p2.getAttribute("style");
+
+ // If object constancy is implemented, this will then be *equal*:
+ expect(p1).not.toBe(p2);
+ expect(d1).not.toEqual(d2);
+ expect(s1).toEqual(s2);
+
+ return Plots.transition(
+ gd,
+ null,
+ { "shapes[0].color": "red" },
+ [],
+ { redraw: true, duration: transitionDuration },
+ { duration: transitionDuration, easing: "cubic-in-out" }
+ );
+ })
+ .then(function() {
+ p3 = getPath();
+ d3 = p3.getAttribute("d");
+ s3 = p3.getAttribute("d");
+
+ expect(d3).toEqual(d2);
+ expect(s3).not.toEqual(s2);
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ it("transitions a transform", function(done) {
+ Plotly.restyle(
+ gd,
+ {
+ "transforms[0]": {
+ enabled: true,
+ type: "filter",
+ operation: "<",
+ target: "x",
+ value: 10
}
- function imagesrc() {
- return imageel().getAttribute('href');
- }
- var p1, p2, e1, e2;
-
- Plotly.relayout(gd, {images: [{x: 0, y: 0, source: jsLogo}]}).then(function() {
- p1 = imagesrc();
- e1 = imageel();
-
- return Plots.transition(gd, null, {
- 'images[0].source': pythonLogo,
- }, [],
- {redraw: true, duration: transitionDuration},
- {duration: transitionDuration, easing: 'cubic-in-out'}
- );
- }).then(function() {
- p2 = imagesrc();
- e2 = imageel();
-
- // Test that the image src has changed:
- expect(p1).not.toEqual(p2);
-
- // Test that the image element identity has not:
- expect(e1).toBe(e2);
-
- }).catch(fail).then(done);
+ },
+ [0]
+ )
+ .then(function() {
+ expect(gd._fullData[0].transforms).toEqual([
+ jasmine.objectContaining({
+ enabled: true,
+ type: "filter",
+ operation: "<",
+ target: "x",
+ value: 10
+ })
+ ]);
+
+ return Plots.transition(
+ gd,
+ [{ "transforms[0].operation": ">" }],
+ null,
+ [0],
+ { redraw: true, duration: transitionDuration },
+ { duration: transitionDuration, easing: "cubic-in-out" }
+ );
+ })
+ .then(function() {
+ expect(gd._fullData[0].transforms).toEqual([
+ jasmine.objectContaining({
+ enabled: true,
+ type: "filter",
+ operation: ">",
+ target: "x",
+ value: 10
+ })
+ ]);
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ // This doesn't really test anything that the above tests don't cover, but it combines
+ // the behavior and attempts to ensure chaining and events happen in the correct order.
+ it("transitions may be chained", function(done) {
+ var currentlyRunning = 0;
+ var beginCnt = 0;
+ var endCnt = 0;
+
+ gd.on("plotly_transitioning", function() {
+ currentlyRunning++;
+ beginCnt++;
});
+ gd.on("plotly_transitioned", function() {
+ currentlyRunning--;
- it('transitions a shape', function(done) {
- function getPath() {
- return gd._fullLayout._shapeUpperLayer.select('path').node();
- }
- var p1, p2, p3, d1, d2, d3, s1, s2, s3;
-
- Plotly.relayout(gd, {
- shapes: [{
- type: 'circle',
- xref: 'x',
- yref: 'y',
- x0: 0,
- y0: 0,
- x1: 2,
- y1: 2,
- opacity: 0.2,
- fillcolor: 'blue',
- line: {color: 'blue'}
- }]
- }).then(function() {
- p1 = getPath();
- d1 = p1.getAttribute('d');
- s1 = p1.getAttribute('style');
-
- return Plots.transition(gd, null, {
- 'shapes[0].x0': 1,
- 'shapes[0].y0': 1,
- }, [],
- {redraw: true, duration: transitionDuration},
- {duration: transitionDuration, easing: 'cubic-in-out'}
- );
- }).then(function() {
- p2 = getPath();
- d2 = p2.getAttribute('d');
- s2 = p2.getAttribute('style');
-
- // If object constancy is implemented, this will then be *equal*:
- expect(p1).not.toBe(p2);
- expect(d1).not.toEqual(d2);
- expect(s1).toEqual(s2);
-
- return Plots.transition(gd, null, {
- 'shapes[0].color': 'red'
- }, [],
- {redraw: true, duration: transitionDuration},
- {duration: transitionDuration, easing: 'cubic-in-out'}
- );
- }).then(function() {
- p3 = getPath();
- d3 = p3.getAttribute('d');
- s3 = p3.getAttribute('d');
-
- expect(d3).toEqual(d2);
- expect(s3).not.toEqual(s2);
- }).catch(fail).then(done);
+ endCnt++;
});
-
- it('transitions a transform', function(done) {
- Plotly.restyle(gd, {
- 'transforms[0]': {
- enabled: true,
- type: 'filter',
- operation: '<',
- target: 'x',
- value: 10
- }
- }, [0]).then(function() {
- expect(gd._fullData[0].transforms).toEqual([jasmine.objectContaining({
- enabled: true,
- type: 'filter',
- operation: '<',
- target: 'x',
- value: 10
- })]);
-
- return Plots.transition(gd, [{
- 'transforms[0].operation': '>'
- }], null, [0],
- {redraw: true, duration: transitionDuration},
- {duration: transitionDuration, easing: 'cubic-in-out'}
- );
- }).then(function() {
- expect(gd._fullData[0].transforms).toEqual([jasmine.objectContaining({
- enabled: true,
- type: 'filter',
- operation: '>',
- target: 'x',
- value: 10
- })]);
- }).catch(fail).then(done);
- });
-
- // This doesn't really test anything that the above tests don't cover, but it combines
- // the behavior and attempts to ensure chaining and events happen in the correct order.
- it('transitions may be chained', function(done) {
- var currentlyRunning = 0;
- var beginCnt = 0;
- var endCnt = 0;
-
- gd.on('plotly_transitioning', function() { currentlyRunning++; beginCnt++; });
- gd.on('plotly_transitioned', function() { currentlyRunning--; endCnt++; });
-
- function doTransition() {
- var traces = plotApiHelpers.coerceTraceIndices(gd, null);
- return Plots.transition(gd, [{x: [1, 2]}], null, traces, {redraw: true}, {duration: transitionDuration, easing: 'cubic-in-out'});
- }
-
- function checkNoneRunning() {
- expect(currentlyRunning).toEqual(0);
- }
-
- doTransition()
- .then(checkNoneRunning)
- .then(doTransition)
- .then(checkNoneRunning)
- .then(doTransition)
- .then(checkNoneRunning)
- .then(delay(10))
- .then(function() {
- expect(beginCnt).toEqual(3);
- expect(endCnt).toEqual(3);
- })
- .then(checkNoneRunning)
- .catch(fail).then(done);
- });
- });
+ function doTransition() {
+ var traces = plotApiHelpers.coerceTraceIndices(gd, null);
+ return Plots.transition(
+ gd,
+ [{ x: [1, 2] }],
+ null,
+ traces,
+ { redraw: true },
+ { duration: transitionDuration, easing: "cubic-in-out" }
+ );
+ }
+
+ function checkNoneRunning() {
+ expect(currentlyRunning).toEqual(0);
+ }
+
+ doTransition()
+ .then(checkNoneRunning)
+ .then(doTransition)
+ .then(checkNoneRunning)
+ .then(doTransition)
+ .then(checkNoneRunning)
+ .then(delay(10))
+ .then(function() {
+ expect(beginCnt).toEqual(3);
+ expect(endCnt).toEqual(3);
+ })
+ .then(checkNoneRunning)
+ .catch(fail)
+ .then(done);
+ });
+ }
+ );
}
-for(var i = 0; i < 2; i++) {
- var duration = i * 20;
- // Run the whole set of tests twice: once with zero duration and once with
- // nonzero duration since the behavior should be identical, but there's a
- // very real possibility of race conditions or other timing issues.
- //
- // And of course, remember to put the async loop in a closure:
- runTests(duration);
+for (var i = 0; i < 2; i++) {
+ var duration = i * 20;
+ // Run the whole set of tests twice: once with zero duration and once with
+ // nonzero duration since the behavior should be identical, but there's a
+ // very real possibility of race conditions or other timing issues.
+ //
+ // And of course, remember to put the async loop in a closure:
+ runTests(duration);
}
diff --git a/test/jasmine/tests/updatemenus_test.js b/test/jasmine/tests/updatemenus_test.js
index f57635e0d3f..f08ef7844bd 100644
--- a/test/jasmine/tests/updatemenus_test.js
+++ b/test/jasmine/tests/updatemenus_test.js
@@ -1,1207 +1,1248 @@
-var UpdateMenus = require('@src/components/updatemenus');
-var constants = require('@src/components/updatemenus/constants');
-
-var d3 = require('d3');
-var Plotly = require('@lib');
-var Lib = require('@src/lib');
-var Events = require('@src/lib/events');
-var Drawing = require('@src/components/drawing');
-var createGraphDiv = require('../assets/create_graph_div');
-var destroyGraphDiv = require('../assets/destroy_graph_div');
+var UpdateMenus = require("@src/components/updatemenus");
+var constants = require("@src/components/updatemenus/constants");
+
+var d3 = require("d3");
+var Plotly = require("@lib");
+var Lib = require("@src/lib");
+var Events = require("@src/lib/events");
+var Drawing = require("@src/components/drawing");
+var createGraphDiv = require("../assets/create_graph_div");
+var destroyGraphDiv = require("../assets/destroy_graph_div");
var TRANSITION_DELAY = 100;
-var fail = require('../assets/fail_test');
-var getBBox = require('../assets/get_bbox');
+var fail = require("../assets/fail_test");
+var getBBox = require("../assets/get_bbox");
-describe('update menus defaults', function() {
- 'use strict';
+describe("update menus defaults", function() {
+ "use strict";
+ var supply = UpdateMenus.supplyLayoutDefaults;
- var supply = UpdateMenus.supplyLayoutDefaults;
+ var layoutIn, layoutOut;
- var layoutIn, layoutOut;
+ beforeEach(function() {
+ layoutIn = {};
+ layoutOut = {};
+ });
- beforeEach(function() {
- layoutIn = {};
- layoutOut = {};
- });
-
- it('should skip non-array containers', function() {
- [null, undefined, {}, 'str', 0, false, true].forEach(function(cont) {
- var msg = '- ' + JSON.stringify(cont);
+ it("should skip non-array containers", function() {
+ [null, undefined, {}, "str", 0, false, true].forEach(function(cont) {
+ var msg = "- " + JSON.stringify(cont);
- layoutIn = { updatemenus: cont };
- layoutOut = {};
- supply(layoutIn, layoutOut);
+ layoutIn = { updatemenus: cont };
+ layoutOut = {};
+ supply(layoutIn, layoutOut);
- expect(layoutIn.updatemenus).toBe(cont, msg);
- expect(layoutOut.updatemenus).toEqual([], msg);
- });
+ expect(layoutIn.updatemenus).toBe(cont, msg);
+ expect(layoutOut.updatemenus).toEqual([], msg);
});
+ });
- it('should make non-object item visible: false', function() {
- var updatemenus = [null, undefined, [], 'str', 0, false, true];
+ it("should make non-object item visible: false", function() {
+ var updatemenus = [null, undefined, [], "str", 0, false, true];
- layoutIn = { updatemenus: updatemenus };
- layoutOut = {};
- supply(layoutIn, layoutOut);
+ layoutIn = { updatemenus: updatemenus };
+ layoutOut = {};
+ supply(layoutIn, layoutOut);
- expect(layoutIn.updatemenus).toEqual(updatemenus);
-
- layoutOut.updatemenus.forEach(function(item, i) {
- expect(item).toEqual({
- visible: false,
- buttons: [],
- _input: {},
- _index: i
- });
- });
- });
+ expect(layoutIn.updatemenus).toEqual(updatemenus);
- it('should set \'visible\' to false when no buttons are present', function() {
- layoutIn.updatemenus = [{
- buttons: [{
- method: 'relayout',
- args: ['title', 'Hello World']
- }, {
- method: 'update',
- args: [ { 'marker.size': 20 }, { 'xaxis.range': [0, 10] }, [0, 1] ]
- }, {
- method: 'animate',
- args: [ 'frame1', { transition: { duration: 500, ease: 'cubic-in-out' }}]
- }]
- }, {
- bgcolor: 'red'
- }, {
- visible: false,
- buttons: [{
- method: 'relayout',
- args: ['title', 'Hello World']
- }]
- }];
-
- supply(layoutIn, layoutOut);
-
- expect(layoutOut.updatemenus[0].visible).toBe(true);
- expect(layoutOut.updatemenus[0].active).toEqual(0);
- expect(layoutOut.updatemenus[0].buttons[0].args.length).toEqual(2);
- expect(layoutOut.updatemenus[0].buttons[1].args.length).toEqual(3);
- expect(layoutOut.updatemenus[0].buttons[2].args.length).toEqual(2);
-
- expect(layoutOut.updatemenus[1].visible).toBe(false);
- expect(layoutOut.updatemenus[1].active).toBeUndefined();
-
- expect(layoutOut.updatemenus[2].visible).toBe(false);
- expect(layoutOut.updatemenus[2].active).toBeUndefined();
+ layoutOut.updatemenus.forEach(function(item, i) {
+ expect(item).toEqual({
+ visible: false,
+ buttons: [],
+ _input: {},
+ _index: i
+ });
});
-
- it('should skip over non-object buttons', function() {
- layoutIn.updatemenus = [{
- buttons: [
- null,
- {
- method: 'relayout',
- args: ['title', 'Hello World']
- },
- 'remove'
+ });
+
+ it("should set 'visible' to false when no buttons are present", function() {
+ layoutIn.updatemenus = [
+ {
+ buttons: [
+ { method: "relayout", args: ["title", "Hello World"] },
+ {
+ method: "update",
+ args: [{ "marker.size": 20 }, { "xaxis.range": [0, 10] }, [0, 1]]
+ },
+ {
+ method: "animate",
+ args: [
+ "frame1",
+ { transition: { duration: 500, ease: "cubic-in-out" } }
]
- }];
-
- supply(layoutIn, layoutOut);
-
- expect(layoutOut.updatemenus[0].buttons.length).toEqual(1);
- expect(layoutOut.updatemenus[0].buttons[0]).toEqual({
- method: 'relayout',
- args: ['title', 'Hello World'],
- label: '',
- _index: 1
- });
+ }
+ ]
+ },
+ { bgcolor: "red" },
+ {
+ visible: false,
+ buttons: [{ method: "relayout", args: ["title", "Hello World"] }]
+ }
+ ];
+
+ supply(layoutIn, layoutOut);
+
+ expect(layoutOut.updatemenus[0].visible).toBe(true);
+ expect(layoutOut.updatemenus[0].active).toEqual(0);
+ expect(layoutOut.updatemenus[0].buttons[0].args.length).toEqual(2);
+ expect(layoutOut.updatemenus[0].buttons[1].args.length).toEqual(3);
+ expect(layoutOut.updatemenus[0].buttons[2].args.length).toEqual(2);
+
+ expect(layoutOut.updatemenus[1].visible).toBe(false);
+ expect(layoutOut.updatemenus[1].active).toBeUndefined();
+
+ expect(layoutOut.updatemenus[2].visible).toBe(false);
+ expect(layoutOut.updatemenus[2].active).toBeUndefined();
+ });
+
+ it("should skip over non-object buttons", function() {
+ layoutIn.updatemenus = [
+ {
+ buttons: [
+ null,
+ { method: "relayout", args: ["title", "Hello World"] },
+ "remove"
+ ]
+ }
+ ];
+
+ supply(layoutIn, layoutOut);
+
+ expect(layoutOut.updatemenus[0].buttons.length).toEqual(1);
+ expect(layoutOut.updatemenus[0].buttons[0]).toEqual({
+ method: "relayout",
+ args: ["title", "Hello World"],
+ label: "",
+ _index: 1
});
-
- it('should skip over buttons with array \'args\' field', function() {
- layoutIn.updatemenus = [{
- buttons: [{
- method: 'restyle',
- }, {
- method: 'relayout',
- args: ['title', 'Hello World']
- }, {
- method: 'relayout',
- args: null
- }, {}]
- }];
-
- supply(layoutIn, layoutOut);
-
- expect(layoutOut.updatemenus[0].buttons.length).toEqual(1);
- expect(layoutOut.updatemenus[0].buttons[0]).toEqual({
- method: 'relayout',
- args: ['title', 'Hello World'],
- label: '',
- _index: 1
- });
+ });
+
+ it("should skip over buttons with array 'args' field", function() {
+ layoutIn.updatemenus = [
+ {
+ buttons: [
+ { method: "restyle" },
+ { method: "relayout", args: ["title", "Hello World"] },
+ { method: "relayout", args: null },
+ {}
+ ]
+ }
+ ];
+
+ supply(layoutIn, layoutOut);
+
+ expect(layoutOut.updatemenus[0].buttons.length).toEqual(1);
+ expect(layoutOut.updatemenus[0].buttons[0]).toEqual({
+ method: "relayout",
+ args: ["title", "Hello World"],
+ label: "",
+ _index: 1
});
+ });
- it('should keep ref to input update menu container', function() {
- layoutIn.updatemenus = [{
- buttons: [{
- method: 'relayout',
- args: ['title', 'Hello World']
- }]
- }, {
- bgcolor: 'red'
- }, {
- visible: false,
- buttons: [{
- method: 'relayout',
- args: ['title', 'Hello World']
- }]
- }];
-
- supply(layoutIn, layoutOut);
-
- expect(layoutOut.updatemenus[0]._input).toBe(layoutIn.updatemenus[0]);
- expect(layoutOut.updatemenus[1]._input).toBe(layoutIn.updatemenus[1]);
- expect(layoutOut.updatemenus[2]._input).toBe(layoutIn.updatemenus[2]);
- });
+ it("should keep ref to input update menu container", function() {
+ layoutIn.updatemenus = [
+ { buttons: [{ method: "relayout", args: ["title", "Hello World"] }] },
+ { bgcolor: "red" },
+ {
+ visible: false,
+ buttons: [{ method: "relayout", args: ["title", "Hello World"] }]
+ }
+ ];
- it('should default \'bgcolor\' to layout \'paper_bgcolor\'', function() {
- var buttons = [{
- method: 'relayout',
- args: ['title', 'Hello World']
- }];
+ supply(layoutIn, layoutOut);
- layoutIn.updatemenus = [{
- buttons: buttons,
- }, {
- bgcolor: 'red',
- buttons: buttons
- }];
+ expect(layoutOut.updatemenus[0]._input).toBe(layoutIn.updatemenus[0]);
+ expect(layoutOut.updatemenus[1]._input).toBe(layoutIn.updatemenus[1]);
+ expect(layoutOut.updatemenus[2]._input).toBe(layoutIn.updatemenus[2]);
+ });
- layoutOut.paper_bgcolor = 'blue';
+ it("should default 'bgcolor' to layout 'paper_bgcolor'", function() {
+ var buttons = [{ method: "relayout", args: ["title", "Hello World"] }];
- supply(layoutIn, layoutOut);
+ layoutIn.updatemenus = [
+ { buttons: buttons },
+ { bgcolor: "red", buttons: buttons }
+ ];
- expect(layoutOut.updatemenus[0].bgcolor).toEqual('blue');
- expect(layoutOut.updatemenus[1].bgcolor).toEqual('red');
- });
+ layoutOut.paper_bgcolor = "blue";
- it('should default \'type\' to \'dropdown\'', function() {
- layoutIn.updatemenus = [{
- buttons: [{method: 'relayout', args: ['title', 'Hello World']}]
- }];
+ supply(layoutIn, layoutOut);
- supply(layoutIn, layoutOut);
+ expect(layoutOut.updatemenus[0].bgcolor).toEqual("blue");
+ expect(layoutOut.updatemenus[1].bgcolor).toEqual("red");
+ });
- expect(layoutOut.updatemenus[0].type).toEqual('dropdown');
- });
+ it("should default 'type' to 'dropdown'", function() {
+ layoutIn.updatemenus = [
+ { buttons: [{ method: "relayout", args: ["title", "Hello World"] }] }
+ ];
- it('should default \'direction\' to \'down\'', function() {
- layoutIn.updatemenus = [{
- buttons: [{method: 'relayout', args: ['title', 'Hello World']}]
- }];
+ supply(layoutIn, layoutOut);
- supply(layoutIn, layoutOut);
+ expect(layoutOut.updatemenus[0].type).toEqual("dropdown");
+ });
- expect(layoutOut.updatemenus[0].direction).toEqual('down');
- });
+ it("should default 'direction' to 'down'", function() {
+ layoutIn.updatemenus = [
+ { buttons: [{ method: "relayout", args: ["title", "Hello World"] }] }
+ ];
- it('should default \'showactive\' to true', function() {
- layoutIn.updatemenus = [{
- buttons: [{method: 'relayout', args: ['title', 'Hello World']}]
- }];
+ supply(layoutIn, layoutOut);
- supply(layoutIn, layoutOut);
+ expect(layoutOut.updatemenus[0].direction).toEqual("down");
+ });
- expect(layoutOut.updatemenus[0].showactive).toEqual(true);
- });
-});
+ it("should default 'showactive' to true", function() {
+ layoutIn.updatemenus = [
+ { buttons: [{ method: "relayout", args: ["title", "Hello World"] }] }
+ ];
-describe('update menus buttons', function() {
- var mock = require('@mocks/updatemenus_positioning.json');
- var gd;
- var allMenus, buttonMenus, dropdownMenus;
+ supply(layoutIn, layoutOut);
- beforeEach(function(done) {
- gd = createGraphDiv();
+ expect(layoutOut.updatemenus[0].showactive).toEqual(true);
+ });
+});
- // bump event max listeners to remove console warnings
- Events.init(gd);
- gd._internalEv.setMaxListeners(20);
+describe("update menus buttons", function() {
+ var mock = require("@mocks/updatemenus_positioning.json");
+ var gd;
+ var allMenus, buttonMenus, dropdownMenus;
- // move update menu #2 to click on them separately
- var mockCopy = Lib.extendDeep({}, mock);
- mockCopy.layout.updatemenus[1].x = 1;
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- allMenus = mockCopy.layout.updatemenus;
- buttonMenus = allMenus.filter(function(opts) { return opts.type === 'buttons'; });
- dropdownMenus = allMenus.filter(function(opts) { return opts.type !== 'buttons'; });
+ // bump event max listeners to remove console warnings
+ Events.init(gd);
+ gd._internalEv.setMaxListeners(20);
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
- });
+ // move update menu #2 to click on them separately
+ var mockCopy = Lib.extendDeep({}, mock);
+ mockCopy.layout.updatemenus[1].x = 1;
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
+ allMenus = mockCopy.layout.updatemenus;
+ buttonMenus = allMenus.filter(function(opts) {
+ return opts.type === "buttons";
+ });
+ dropdownMenus = allMenus.filter(function(opts) {
+ return opts.type !== "buttons";
});
- it('creates button menus', function(done) {
- assertNodeCount('.' + constants.containerClassName, 1);
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
- // 12 menus, but button menus don't have headers, so there are only six headers:
- assertNodeCount('.' + constants.headerClassName, dropdownMenus.length);
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
- // Count the *total* number of buttons we expect for this mock:
- var buttonCount = 0;
- buttonMenus.forEach(function(menu) { buttonCount += menu.buttons.length; });
+ it("creates button menus", function(done) {
+ assertNodeCount("." + constants.containerClassName, 1);
- assertNodeCount('.' + constants.buttonClassName, buttonCount);
+ // 12 menus, but button menus don't have headers, so there are only six headers:
+ assertNodeCount("." + constants.headerClassName, dropdownMenus.length);
- done();
+ // Count the *total* number of buttons we expect for this mock:
+ var buttonCount = 0;
+ buttonMenus.forEach(function(menu) {
+ buttonCount += menu.buttons.length;
});
- function assertNodeCount(query, cnt) {
- expect(d3.selectAll(query).size()).toEqual(cnt);
- }
-});
-
-describe('update menus initialization', function() {
- 'use strict';
- var gd;
-
- beforeEach(function(done) {
- gd = createGraphDiv();
-
- Plotly.plot(gd, [{x: [1, 2, 3]}], {
- updatemenus: [{
- buttons: [
- {method: 'restyle', args: [], label: 'first'},
- {method: 'restyle', args: [], label: 'second'},
- ]
- }]
- }).then(done);
- });
+ assertNodeCount("." + constants.buttonClassName, buttonCount);
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
+ done();
+ });
- it('does not set active on initial plot', function() {
- expect(gd.layout.updatemenus[0].active).toBeUndefined();
- });
+ function assertNodeCount(query, cnt) {
+ expect(d3.selectAll(query).size()).toEqual(cnt);
+ }
});
-describe('update menus interactions', function() {
- 'use strict';
-
- var mock = require('@mocks/updatemenus.json'),
- bgColor = 'rgb(255, 255, 255)',
- activeColor = 'rgb(244, 250, 255)';
+describe("update menus initialization", function() {
+ "use strict";
+ var gd;
- var gd;
+ beforeEach(function(done) {
+ gd = createGraphDiv();
- beforeEach(function(done) {
- gd = createGraphDiv();
-
- // move update menu #2 to click on them separately
- var mockCopy = Lib.extendDeep({}, mock);
- mockCopy.layout.updatemenus[1].x = 1;
-
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
- });
-
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
+ Plotly.plot(gd, [{ x: [1, 2, 3] }], {
+ updatemenus: [
+ {
+ buttons: [
+ { method: "restyle", args: [], label: "first" },
+ { method: "restyle", args: [], label: "second" }
+ ]
+ }
+ ]
+ }).then(done);
+ });
+
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
+
+ it("does not set active on initial plot", function() {
+ expect(gd.layout.updatemenus[0].active).toBeUndefined();
+ });
+});
- it('should draw only visible menus', function(done) {
+describe("update menus interactions", function() {
+ "use strict";
+ var mock = require("@mocks/updatemenus.json"),
+ bgColor = "rgb(255, 255, 255)",
+ activeColor = "rgb(244, 250, 255)";
+
+ var gd;
+
+ beforeEach(function(done) {
+ gd = createGraphDiv();
+
+ // move update menu #2 to click on them separately
+ var mockCopy = Lib.extendDeep({}, mock);
+ mockCopy.layout.updatemenus[1].x = 1;
+
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(done);
+ });
+
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
+
+ it("should draw only visible menus", function(done) {
+ assertMenus([0, 0]);
+ expect(gd._fullLayout._pushmargin["updatemenu-0"]).toBeDefined();
+ expect(gd._fullLayout._pushmargin["updatemenu-1"]).toBeDefined();
+
+ Plotly.relayout(gd, "updatemenus[0].visible", false)
+ .then(function() {
+ assertMenus([0]);
+ expect(gd._fullLayout._pushmargin["updatemenu-0"]).toBeUndefined();
+ expect(gd._fullLayout._pushmargin["updatemenu-1"]).toBeDefined();
+
+ return Plotly.relayout(gd, "updatemenus[1]", null);
+ })
+ .then(function() {
+ assertNodeCount("." + constants.containerClassName, 0);
+ expect(gd._fullLayout._pushmargin["updatemenu-0"]).toBeUndefined();
+ expect(gd._fullLayout._pushmargin["updatemenu-1"]).toBeUndefined();
+
+ return Plotly.relayout(gd, {
+ "updatemenus[0].visible": true,
+ "updatemenus[1].visible": true
+ });
+ })
+ .then(function() {
assertMenus([0, 0]);
- expect(gd._fullLayout._pushmargin['updatemenu-0']).toBeDefined();
- expect(gd._fullLayout._pushmargin['updatemenu-1']).toBeDefined();
-
- Plotly.relayout(gd, 'updatemenus[0].visible', false).then(function() {
- assertMenus([0]);
- expect(gd._fullLayout._pushmargin['updatemenu-0']).toBeUndefined();
- expect(gd._fullLayout._pushmargin['updatemenu-1']).toBeDefined();
-
- return Plotly.relayout(gd, 'updatemenus[1]', null);
- })
- .then(function() {
- assertNodeCount('.' + constants.containerClassName, 0);
- expect(gd._fullLayout._pushmargin['updatemenu-0']).toBeUndefined();
- expect(gd._fullLayout._pushmargin['updatemenu-1']).toBeUndefined();
-
- return Plotly.relayout(gd, {
- 'updatemenus[0].visible': true,
- 'updatemenus[1].visible': true
- });
- })
- .then(function() {
- assertMenus([0, 0]);
- expect(gd._fullLayout._pushmargin['updatemenu-0']).toBeDefined();
- expect(gd._fullLayout._pushmargin['updatemenu-1']).toBeDefined();
-
- return Plotly.relayout(gd, {
- 'updatemenus[0].visible': false,
- 'updatemenus[1].visible': false
- });
- })
- .then(function() {
- assertNodeCount('.' + constants.containerClassName, 0);
- expect(gd._fullLayout._pushmargin['updatemenu-0']).toBeUndefined();
- expect(gd._fullLayout._pushmargin['updatemenu-1']).toBeUndefined();
-
- return Plotly.relayout(gd, {
- 'updatemenus[2]': {
- buttons: [{
- method: 'relayout',
- args: ['title', 'new title']
- }]
- }
- });
- })
- .then(function() {
- assertMenus([0]);
- expect(gd._fullLayout._pushmargin['updatemenu-0']).toBeUndefined();
- expect(gd._fullLayout._pushmargin['updatemenu-1']).toBeUndefined();
- expect(gd._fullLayout._pushmargin['updatemenu-2']).toBeDefined();
-
- return Plotly.relayout(gd, 'updatemenus[0].visible', true);
- })
- .then(function() {
- assertMenus([0, 0]);
- expect(gd._fullLayout._pushmargin['updatemenu-0']).toBeDefined();
- expect(gd._fullLayout._pushmargin['updatemenu-1']).toBeUndefined();
- expect(gd._fullLayout._pushmargin['updatemenu-2']).toBeDefined();
- expect(gd.layout.updatemenus.length).toEqual(3);
-
- return Plotly.relayout(gd, 'updatemenus[0]', null);
- })
- .then(function() {
- assertMenus([0]);
- expect(gd.layout.updatemenus.length).toEqual(2);
-
- return Plotly.relayout(gd, 'updatemenus', null);
- })
- .then(function() {
- expect(gd.layout.updatemenus).toBeUndefined();
-
- })
- .then(done);
- });
+ expect(gd._fullLayout._pushmargin["updatemenu-0"]).toBeDefined();
+ expect(gd._fullLayout._pushmargin["updatemenu-1"]).toBeDefined();
- it('should drop/fold buttons when clicking on header', function(done) {
- var header0 = selectHeader(0),
- header1 = selectHeader(1);
-
- click(header0).then(function() {
- assertMenus([3, 0]);
- return click(header0);
- }).then(function() {
- assertMenus([0, 0]);
- return click(header1);
- }).then(function() {
- assertMenus([0, 4]);
- return click(header1);
- }).then(function() {
- assertMenus([0, 0]);
- return click(header0);
- }).then(function() {
- assertMenus([3, 0]);
- return click(header1);
- }).then(function() {
- assertMenus([0, 4]);
- return click(header0);
- }).then(function() {
- assertMenus([3, 0]);
- done();
+ return Plotly.relayout(gd, {
+ "updatemenus[0].visible": false,
+ "updatemenus[1].visible": false
});
- });
-
- it('should emit an event on button click', function(done) {
- var clickCnt = 0;
- var data = [];
- gd.on('plotly_buttonclicked', function(datum) {
- data.push(datum);
- clickCnt++;
+ })
+ .then(function() {
+ assertNodeCount("." + constants.containerClassName, 0);
+ expect(gd._fullLayout._pushmargin["updatemenu-0"]).toBeUndefined();
+ expect(gd._fullLayout._pushmargin["updatemenu-1"]).toBeUndefined();
+
+ return Plotly.relayout(gd, {
+ "updatemenus[2]": {
+ buttons: [{ method: "relayout", args: ["title", "new title"] }]
+ }
});
-
- click(selectHeader(0)).then(function() {
- expect(clickCnt).toEqual(0);
-
- return click(selectButton(2));
- }).then(function() {
- expect(clickCnt).toEqual(1);
- expect(data.length).toEqual(1);
- expect(data[0].active).toEqual(2);
-
- return click(selectButton(1));
- }).then(function() {
- expect(clickCnt).toEqual(2);
- expect(data.length).toEqual(2);
- expect(data[1].active).toEqual(1);
- }).catch(fail).then(done);
+ })
+ .then(function() {
+ assertMenus([0]);
+ expect(gd._fullLayout._pushmargin["updatemenu-0"]).toBeUndefined();
+ expect(gd._fullLayout._pushmargin["updatemenu-1"]).toBeUndefined();
+ expect(gd._fullLayout._pushmargin["updatemenu-2"]).toBeDefined();
+
+ return Plotly.relayout(gd, "updatemenus[0].visible", true);
+ })
+ .then(function() {
+ assertMenus([0, 0]);
+ expect(gd._fullLayout._pushmargin["updatemenu-0"]).toBeDefined();
+ expect(gd._fullLayout._pushmargin["updatemenu-1"]).toBeUndefined();
+ expect(gd._fullLayout._pushmargin["updatemenu-2"]).toBeDefined();
+ expect(gd.layout.updatemenus.length).toEqual(3);
+
+ return Plotly.relayout(gd, "updatemenus[0]", null);
+ })
+ .then(function() {
+ assertMenus([0]);
+ expect(gd.layout.updatemenus.length).toEqual(2);
+
+ return Plotly.relayout(gd, "updatemenus", null);
+ })
+ .then(function() {
+ expect(gd.layout.updatemenus).toBeUndefined();
+ })
+ .then(done);
+ });
+
+ it("should drop/fold buttons when clicking on header", function(done) {
+ var header0 = selectHeader(0), header1 = selectHeader(1);
+
+ click(header0)
+ .then(function() {
+ assertMenus([3, 0]);
+ return click(header0);
+ })
+ .then(function() {
+ assertMenus([0, 0]);
+ return click(header1);
+ })
+ .then(function() {
+ assertMenus([0, 4]);
+ return click(header1);
+ })
+ .then(function() {
+ assertMenus([0, 0]);
+ return click(header0);
+ })
+ .then(function() {
+ assertMenus([3, 0]);
+ return click(header1);
+ })
+ .then(function() {
+ assertMenus([0, 4]);
+ return click(header0);
+ })
+ .then(function() {
+ assertMenus([3, 0]);
+ done();
+ });
+ });
+
+ it("should emit an event on button click", function(done) {
+ var clickCnt = 0;
+ var data = [];
+ gd.on("plotly_buttonclicked", function(datum) {
+ data.push(datum);
+ clickCnt++;
});
- it('should apply update on button click', function(done) {
- var header0 = selectHeader(0),
- header1 = selectHeader(1);
+ click(selectHeader(0))
+ .then(function() {
+ expect(clickCnt).toEqual(0);
+
+ return click(selectButton(2));
+ })
+ .then(function() {
+ expect(clickCnt).toEqual(1);
+ expect(data.length).toEqual(1);
+ expect(data[0].active).toEqual(2);
+
+ return click(selectButton(1));
+ })
+ .then(function() {
+ expect(clickCnt).toEqual(2);
+ expect(data.length).toEqual(2);
+ expect(data[1].active).toEqual(1);
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ it("should apply update on button click", function(done) {
+ var header0 = selectHeader(0), header1 = selectHeader(1);
+
+ assertActive(gd, [1, 2]);
+
+ click(header0)
+ .then(function() {
+ assertItemColor(selectButton(1), activeColor);
+
+ return click(selectButton(0));
+ })
+ .then(function() {
+ assertActive(gd, [0, 2]);
+
+ return click(header1);
+ })
+ .then(function() {
+ assertItemColor(selectButton(2), activeColor);
+
+ return click(selectButton(0));
+ })
+ .then(function() {
+ assertActive(gd, [0, 0]);
- assertActive(gd, [1, 2]);
-
- click(header0).then(function() {
- assertItemColor(selectButton(1), activeColor);
-
- return click(selectButton(0));
- }).then(function() {
- assertActive(gd, [0, 2]);
+ done();
+ });
+ });
+
+ it("should update correctly on failed binding comparisons", function(done) {
+ // See https://github.com/plotly/plotly.js/issues/1169
+ // for more info.
+ var data = [
+ { y: [1, 2, 3], visible: true },
+ { y: [2, 3, 1], visible: false },
+ { y: [3, 1, 2], visible: false }
+ ];
+
+ var layout = {
+ updatemenus: [
+ {
+ buttons: [
+ {
+ label: "a",
+ method: "restyle",
+ args: ["visible", [true, false, false]]
+ },
+ {
+ label: "b",
+ method: "restyle",
+ args: ["visible", [false, true, false]]
+ },
+ {
+ label: "c",
+ method: "restyle",
+ args: ["visible", [false, false, true]]
+ }
+ ]
+ }
+ ]
+ };
- return click(header1);
- }).then(function() {
- assertItemColor(selectButton(2), activeColor);
+ Plotly.newPlot(gd, data, layout)
+ .then(function() {
+ return click(selectHeader(0));
+ })
+ .then(function() {
+ return click(selectButton(1));
+ })
+ .then(function() {
+ assertActive(gd, [1]);
+ })
+ .then(done);
+ });
+
+ it("should change color on mouse over", function(done) {
+ var INDEX_0 = 2, INDEX_1 = gd.layout.updatemenus[1].active;
+
+ var header0 = selectHeader(0);
+
+ assertItemColor(header0, bgColor);
+ mouseEvent("mouseover", header0);
+ assertItemColor(header0, activeColor);
+ mouseEvent("mouseout", header0);
+ assertItemColor(header0, bgColor);
+
+ click(header0)
+ .then(function() {
+ var button = selectButton(INDEX_0);
+
+ assertItemColor(button, bgColor);
+ mouseEvent("mouseover", button);
+ assertItemColor(button, activeColor);
+ mouseEvent("mouseout", button);
+ assertItemColor(button, bgColor);
+
+ return click(selectHeader(1));
+ })
+ .then(function() {
+ var button = selectButton(INDEX_1);
+
+ assertItemColor(button, activeColor);
+ mouseEvent("mouseover", button);
+ assertItemColor(button, activeColor);
+ mouseEvent("mouseout", button);
+ assertItemColor(button, activeColor);
- return click(selectButton(0));
- }).then(function() {
- assertActive(gd, [0, 0]);
+ done();
+ });
+ });
+
+ it("should relayout", function(done) {
+ assertItemColor(selectHeader(0), "rgb(255, 255, 255)");
+ assertItemDims(selectHeader(1), 95, 33);
+
+ Plotly.relayout(gd, "updatemenus[0].bgcolor", "red")
+ .then(function() {
+ assertItemColor(selectHeader(0), "rgb(255, 0, 0)");
+
+ return click(selectHeader(0));
+ })
+ .then(function() {
+ assertMenus([3, 0]);
+
+ return Plotly.relayout(gd, "updatemenus[0].bgcolor", "blue");
+ })
+ .then(function() {
+ // and keep menu dropped
+ assertMenus([3, 0]);
+ assertItemColor(selectHeader(0), "rgb(0, 0, 255)");
+
+ return Plotly.relayout(
+ gd,
+ "updatemenus[1].buttons[1].label",
+ "a looooooooooooong
label"
+ );
+ })
+ .then(function() {
+ assertItemDims(selectHeader(1), 179, 35);
+
+ return click(selectHeader(1));
+ })
+ .then(function() {
+ assertMenus([0, 4]);
+
+ return Plotly.relayout(gd, "updatemenus[1].visible", false);
+ })
+ .then(function() {
+ // and delete buttons
+ assertMenus([0]);
+
+ return click(selectHeader(0));
+ })
+ .then(function() {
+ assertMenus([3]);
+
+ return Plotly.relayout(gd, "updatemenus[1].visible", true);
+ })
+ .then(function() {
+ // fold up buttons whenever new menus are added
+ assertMenus([0, 0]);
- done();
+ return Plotly.relayout(gd, {
+ "updatemenus[0].bgcolor": null,
+ paper_bgcolor: "black"
});
- });
+ })
+ .then(function() {
+ assertItemColor(selectHeader(0), "rgb(0, 0, 0)");
+ assertItemColor(selectHeader(1), "rgb(0, 0, 0)");
- it('should update correctly on failed binding comparisons', function(done) {
-
- // See https://github.com/plotly/plotly.js/issues/1169
- // for more info.
-
- var data = [{
- y: [1, 2, 3],
- visible: true
- }, {
- y: [2, 3, 1],
- visible: false
- }, {
- y: [3, 1, 2],
- visible: false
- }];
-
- var layout = {
- updatemenus: [{
- buttons: [{
- label: 'a',
- method: 'restyle',
- args: ['visible', [true, false, false]]
- }, {
- label: 'b',
- method: 'restyle',
- args: ['visible', [false, true, false]]
- }, {
- label: 'c',
- method: 'restyle',
- args: ['visible', [false, false, true]]
- }]
- }]
- };
-
- Plotly.newPlot(gd, data, layout).then(function() {
- return click(selectHeader(0));
- })
- .then(function() {
- return click(selectButton(1));
- })
- .then(function() {
- assertActive(gd, [1]);
- })
- .then(done);
- });
-
- it('should change color on mouse over', function(done) {
- var INDEX_0 = 2,
- INDEX_1 = gd.layout.updatemenus[1].active;
-
- var header0 = selectHeader(0);
-
- assertItemColor(header0, bgColor);
- mouseEvent('mouseover', header0);
- assertItemColor(header0, activeColor);
- mouseEvent('mouseout', header0);
- assertItemColor(header0, bgColor);
-
- click(header0).then(function() {
- var button = selectButton(INDEX_0);
-
- assertItemColor(button, bgColor);
- mouseEvent('mouseover', button);
- assertItemColor(button, activeColor);
- mouseEvent('mouseout', button);
- assertItemColor(button, bgColor);
-
- return click(selectHeader(1));
- }).then(function() {
- var button = selectButton(INDEX_1);
-
- assertItemColor(button, activeColor);
- mouseEvent('mouseover', button);
- assertItemColor(button, activeColor);
- mouseEvent('mouseout', button);
- assertItemColor(button, activeColor);
-
- done();
+ done();
+ });
+ });
+
+ it("applies padding on all sides", function(done) {
+ var xy1, xy2;
+ var firstMenu = d3.select("." + constants.headerGroupClassName);
+ var xpad = 80;
+ var ypad = 60;
+
+ // Position it center-anchored and in the middle of the plot:
+ Plotly.relayout(gd, {
+ "updatemenus[0].x": 0.2,
+ "updatemenus[0].y": 0.5,
+ "updatemenus[0].xanchor": "center",
+ "updatemenus[0].yanchor": "middle"
+ })
+ .then(function() {
+ // Convert to xy:
+ xy1 = firstMenu
+ .attr("transform")
+ .match(/translate\(([^,]*),\s*([^\)]*)\)/)
+ .slice(1)
+ .map(parseFloat);
+
+ // Set three of four paddings. This should move it.
+ return Plotly.relayout(gd, {
+ "updatemenus[0].pad.t": ypad,
+ "updatemenus[0].pad.r": xpad,
+ "updatemenus[0].pad.b": ypad,
+ "updatemenus[0].pad.l": xpad
});
+ })
+ .then(function() {
+ xy2 = firstMenu
+ .attr("transform")
+ .match(/translate\(([^,]*),\s*([^\)]*)\)/)
+ .slice(1)
+ .map(parseFloat);
+
+ expect(xy1[0] - xy2[0]).toEqual(xpad);
+ expect(xy1[1] - xy2[1]).toEqual(ypad);
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ it("applies y padding on relayout", function(done) {
+ var x1, x2;
+ var firstMenu = d3.select("." + constants.headerGroupClassName);
+ var padShift = 40;
+
+ // Position the menu in the center of the plot horizontal so that
+ // we can test padding updates without worrying about margin pushing.
+ Plotly.relayout(gd, { "updatemenus[0].x": 0.5, "updatemenus[0].pad.r": 0 })
+ .then(function() {
+ // Extract the x-component of the translation:
+ x1 = parseInt(
+ firstMenu.attr("transform").match(/translate\(([^,]*).*/)[1]
+ );
+
+ return Plotly.relayout(gd, "updatemenus[0].pad.r", 40);
+ })
+ .then(function() {
+ // Extract the x-component of the translation:
+ x2 = parseInt(
+ firstMenu.attr("transform").match(/translate\(([^,]*).*/)[1]
+ );
+
+ expect(x1 - x2).toBeCloseTo(padShift, 1);
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ function assertNodeCount(query, cnt) {
+ expect(d3.selectAll(query).size()).toEqual(cnt);
+ }
+
+ // call assertMenus([0, 3]); to check that the 2nd update menu is dropped
+ // and showing 3 buttons.
+ function assertMenus(expectedMenus) {
+ assertNodeCount("." + constants.containerClassName, 1);
+ assertNodeCount("." + constants.headerClassName, expectedMenus.length);
+
+ var gButton = d3.select("." + constants.dropdownButtonGroupClassName),
+ actualActiveIndex = +gButton.attr(constants.menuIndexAttrName),
+ hasActive = false;
+
+ expectedMenus.forEach(function(expected, i) {
+ if (expected) {
+ expect(actualActiveIndex).toEqual(i);
+ assertNodeCount("." + constants.dropdownButtonClassName, expected);
+ hasActive = true;
+ }
});
- it('should relayout', function(done) {
- assertItemColor(selectHeader(0), 'rgb(255, 255, 255)');
- assertItemDims(selectHeader(1), 95, 33);
-
- Plotly.relayout(gd, 'updatemenus[0].bgcolor', 'red').then(function() {
- assertItemColor(selectHeader(0), 'rgb(255, 0, 0)');
-
- return click(selectHeader(0));
- }).then(function() {
- assertMenus([3, 0]);
-
- return Plotly.relayout(gd, 'updatemenus[0].bgcolor', 'blue');
- }).then(function() {
- // and keep menu dropped
- assertMenus([3, 0]);
- assertItemColor(selectHeader(0), 'rgb(0, 0, 255)');
-
- return Plotly.relayout(gd, 'updatemenus[1].buttons[1].label', 'a looooooooooooong
label');
- }).then(function() {
- assertItemDims(selectHeader(1), 179, 35);
-
- return click(selectHeader(1));
- }).then(function() {
- assertMenus([0, 4]);
-
- return Plotly.relayout(gd, 'updatemenus[1].visible', false);
- }).then(function() {
- // and delete buttons
- assertMenus([0]);
-
- return click(selectHeader(0));
- }).then(function() {
- assertMenus([3]);
-
- return Plotly.relayout(gd, 'updatemenus[1].visible', true);
- }).then(function() {
- // fold up buttons whenever new menus are added
- assertMenus([0, 0]);
-
- return Plotly.relayout(gd, {
- 'updatemenus[0].bgcolor': null,
- 'paper_bgcolor': 'black'
- });
- }).then(function() {
- assertItemColor(selectHeader(0), 'rgb(0, 0, 0)');
- assertItemColor(selectHeader(1), 'rgb(0, 0, 0)');
-
- done();
- });
- });
+ if (!hasActive) {
+ expect(actualActiveIndex).toEqual(-1);
+ assertNodeCount("." + constants.dropdownButtonClassName, 0);
+ }
+ }
- it('applies padding on all sides', function(done) {
- var xy1, xy2;
- var firstMenu = d3.select('.' + constants.headerGroupClassName);
- var xpad = 80;
- var ypad = 60;
-
- // Position it center-anchored and in the middle of the plot:
- Plotly.relayout(gd, {
- 'updatemenus[0].x': 0.2,
- 'updatemenus[0].y': 0.5,
- 'updatemenus[0].xanchor': 'center',
- 'updatemenus[0].yanchor': 'middle',
- }).then(function() {
- // Convert to xy:
- xy1 = firstMenu.attr('transform').match(/translate\(([^,]*),\s*([^\)]*)\)/).slice(1).map(parseFloat);
-
- // Set three of four paddings. This should move it.
- return Plotly.relayout(gd, {
- 'updatemenus[0].pad.t': ypad,
- 'updatemenus[0].pad.r': xpad,
- 'updatemenus[0].pad.b': ypad,
- 'updatemenus[0].pad.l': xpad,
- });
- }).then(function() {
- xy2 = firstMenu.attr('transform').match(/translate\(([^,]*),\s*([^\)]*)\)/).slice(1).map(parseFloat);
-
- expect(xy1[0] - xy2[0]).toEqual(xpad);
- expect(xy1[1] - xy2[1]).toEqual(ypad);
- }).catch(fail).then(done);
+ function assertActive(gd, expectedMenus) {
+ expectedMenus.forEach(function(expected, i) {
+ expect(gd.layout.updatemenus[i].active).toEqual(expected);
+ expect(gd._fullLayout.updatemenus[i].active).toEqual(expected);
});
-
- it('applies y padding on relayout', function(done) {
- var x1, x2;
- var firstMenu = d3.select('.' + constants.headerGroupClassName);
- var padShift = 40;
-
- // Position the menu in the center of the plot horizontal so that
- // we can test padding updates without worrying about margin pushing.
- Plotly.relayout(gd, {
- 'updatemenus[0].x': 0.5,
- 'updatemenus[0].pad.r': 0,
- }).then(function() {
- // Extract the x-component of the translation:
- x1 = parseInt(firstMenu.attr('transform').match(/translate\(([^,]*).*/)[1]);
-
- return Plotly.relayout(gd, 'updatemenus[0].pad.r', 40);
- }).then(function() {
- // Extract the x-component of the translation:
- x2 = parseInt(firstMenu.attr('transform').match(/translate\(([^,]*).*/)[1]);
-
- expect(x1 - x2).toBeCloseTo(padShift, 1);
- }).catch(fail).then(done);
+ }
+
+ function assertItemColor(node, color) {
+ var rect = node.select("rect");
+ expect(rect.style("fill")).toEqual(color);
+ }
+
+ function assertItemDims(node, width, height) {
+ var rect = node.select("rect"), actualWidth = +rect.attr("width");
+
+ // must compare with a tolerance as the exact result
+ // is browser/font dependent (via getBBox)
+ expect(Math.abs(actualWidth - width)).toBeLessThan(16);
+
+ // height is determined by 'fontsize',
+ // so no such tolerance is needed
+ expect(+rect.attr("height")).toEqual(height);
+ }
+
+ function click(selection) {
+ return new Promise(function(resolve) {
+ setTimeout(
+ function() {
+ mouseEvent("click", selection);
+ resolve();
+ },
+ TRANSITION_DELAY
+ );
});
+ }
+
+ // For some reason, ../assets/mouse_event.js fails
+ // to detect the button elements in FF38 (like on CircleCI 2016/08/02),
+ // so dispatch the mouse event directly about the nodes instead.
+ function mouseEvent(type, selection) {
+ var ev = new window.MouseEvent(type, { bubbles: true });
+ selection.node().dispatchEvent(ev);
+ }
+
+ function selectHeader(menuIndex) {
+ var headers = d3.selectAll("." + constants.headerClassName),
+ header = d3.select(headers[0][menuIndex]);
+ return header;
+ }
+
+ function selectButton(buttonIndex) {
+ var buttons = d3.selectAll("." + constants.dropdownButtonClassName),
+ button = d3.select(buttons[0][buttonIndex]);
+ return button;
+ }
+});
- function assertNodeCount(query, cnt) {
- expect(d3.selectAll(query).size()).toEqual(cnt);
- }
-
- // call assertMenus([0, 3]); to check that the 2nd update menu is dropped
- // and showing 3 buttons.
- function assertMenus(expectedMenus) {
- assertNodeCount('.' + constants.containerClassName, 1);
- assertNodeCount('.' + constants.headerClassName, expectedMenus.length);
-
- var gButton = d3.select('.' + constants.dropdownButtonGroupClassName),
- actualActiveIndex = +gButton.attr(constants.menuIndexAttrName),
- hasActive = false;
-
- expectedMenus.forEach(function(expected, i) {
- if(expected) {
- expect(actualActiveIndex).toEqual(i);
- assertNodeCount('.' + constants.dropdownButtonClassName, expected);
- hasActive = true;
+describe("update menus interaction with other components:", function() {
+ "use strict";
+ afterEach(destroyGraphDiv);
+
+ it("buttons show be drawn above sliders", function(done) {
+ Plotly.plot(createGraphDiv(), [{ x: [1, 2, 3], y: [1, 2, 1] }], {
+ sliders: [
+ {
+ xanchor: "right",
+ x: -0.05,
+ y: 0.9,
+ len: 0.3,
+ steps: [
+ {
+ label: "red",
+ method: "restyle",
+ args: [{ "line.color": "red" }]
+ },
+ {
+ label: "orange",
+ method: "restyle",
+ args: [{ "line.color": "orange" }]
+ },
+ {
+ label: "yellow",
+ method: "restyle",
+ args: [{ "line.color": "yellow" }]
}
- });
-
- if(!hasActive) {
- expect(actualActiveIndex).toEqual(-1);
- assertNodeCount('.' + constants.dropdownButtonClassName, 0);
+ ]
}
- }
-
- function assertActive(gd, expectedMenus) {
- expectedMenus.forEach(function(expected, i) {
- expect(gd.layout.updatemenus[i].active).toEqual(expected);
- expect(gd._fullLayout.updatemenus[i].active).toEqual(expected);
- });
- }
-
- function assertItemColor(node, color) {
- var rect = node.select('rect');
- expect(rect.style('fill')).toEqual(color);
- }
-
- function assertItemDims(node, width, height) {
- var rect = node.select('rect'),
- actualWidth = +rect.attr('width');
-
- // must compare with a tolerance as the exact result
- // is browser/font dependent (via getBBox)
- expect(Math.abs(actualWidth - width)).toBeLessThan(16);
-
- // height is determined by 'fontsize',
- // so no such tolerance is needed
- expect(+rect.attr('height')).toEqual(height);
- }
-
- function click(selection) {
- return new Promise(function(resolve) {
- setTimeout(function() {
- mouseEvent('click', selection);
- resolve();
- }, TRANSITION_DELAY);
+ ],
+ updatemenus: [
+ {
+ buttons: [
+ {
+ label: "markers and lines",
+ method: "restyle",
+ args: [{ mode: "markers+lines" }]
+ },
+ {
+ label: "markers",
+ method: "restyle",
+ args: [{ mode: "markers" }]
+ },
+ { label: "lines", method: "restyle", args: [{ mode: "lines" }] }
+ ]
+ }
+ ]
+ })
+ .then(function() {
+ var infoLayer = d3.select("g.infolayer");
+ var containerClassNames = ["slider-container", "updatemenu-container"];
+ var list = [];
+
+ infoLayer.selectAll("*").each(function() {
+ var className = d3.select(this).attr("class");
+
+ if (containerClassNames.indexOf(className) !== -1) {
+ list.push(className);
+ }
});
- }
-
- // For some reason, ../assets/mouse_event.js fails
- // to detect the button elements in FF38 (like on CircleCI 2016/08/02),
- // so dispatch the mouse event directly about the nodes instead.
- function mouseEvent(type, selection) {
- var ev = new window.MouseEvent(type, { bubbles: true });
- selection.node().dispatchEvent(ev);
- }
-
- function selectHeader(menuIndex) {
- var headers = d3.selectAll('.' + constants.headerClassName),
- header = d3.select(headers[0][menuIndex]);
- return header;
- }
- function selectButton(buttonIndex) {
- var buttons = d3.selectAll('.' + constants.dropdownButtonClassName),
- button = d3.select(buttons[0][buttonIndex]);
- return button;
- }
-});
-
-
-describe('update menus interaction with other components:', function() {
- 'use strict';
-
- afterEach(destroyGraphDiv);
-
- it('buttons show be drawn above sliders', function(done) {
-
- Plotly.plot(createGraphDiv(), [{
- x: [1, 2, 3],
- y: [1, 2, 1]
- }], {
- sliders: [{
- xanchor: 'right',
- x: -0.05,
- y: 0.9,
- len: 0.3,
- steps: [{
- label: 'red',
- method: 'restyle',
- args: [{'line.color': 'red'}]
- }, {
- label: 'orange',
- method: 'restyle',
- args: [{'line.color': 'orange'}]
- }, {
- label: 'yellow',
- method: 'restyle',
- args: [{'line.color': 'yellow'}]
- }]
- }],
- updatemenus: [{
- buttons: [{
- label: 'markers and lines',
- method: 'restyle',
- args: [{ 'mode': 'markers+lines' }]
- }, {
- label: 'markers',
- method: 'restyle',
- args: [{ 'mode': 'markers' }]
- }, {
- label: 'lines',
- method: 'restyle',
- args: [{ 'mode': 'lines' }]
- }]
- }]
- })
- .then(function() {
- var infoLayer = d3.select('g.infolayer');
- var containerClassNames = ['slider-container', 'updatemenu-container'];
- var list = [];
-
- infoLayer.selectAll('*').each(function() {
- var className = d3.select(this).attr('class');
-
- if(containerClassNames.indexOf(className) !== -1) {
- list.push(className);
- }
- });
-
- expect(list).toEqual(containerClassNames);
- })
- .then(done);
- });
+ expect(list).toEqual(containerClassNames);
+ })
+ .then(done);
+ });
});
-
-describe('update menus interaction with scrollbox:', function() {
- 'use strict';
-
- var gd,
- mock,
- menuDown,
- menuLeft,
- menuRight,
- menuUp;
-
- // Adapted from https://github.com/plotly/plotly.js/pull/770#issuecomment-234669383
- mock = {
- data: [],
- layout: {
- width: 1100,
- height: 450,
- updatemenus: [{
- buttons: [{
- method: 'restyle',
- args: ['line.color', 'red'],
- label: 'red'
- }, {
- method: 'restyle',
- args: ['line.color', 'blue'],
- label: 'blue'
- }, {
- method: 'restyle',
- args: ['line.color', 'green'],
- label: 'green'
- }]
- }, {
- x: 0.5,
- xanchor: 'left',
- y: 0.5,
- yanchor: 'top',
- direction: 'down',
- buttons: []
- }, {
- x: 0.5,
- xanchor: 'right',
- y: 0.5,
- yanchor: 'top',
- direction: 'left',
- buttons: []
- }, {
- x: 0.5,
- xanchor: 'left',
- y: 0.5,
- yanchor: 'bottom',
- direction: 'right',
- buttons: []
- }, {
- x: 0.5,
- xanchor: 'right',
- y: 0.5,
- yanchor: 'bottom',
- direction: 'up',
- buttons: []
- }]
- }
- };
-
- for(var i = 0, n = 20; i < n; i++) {
- var j;
-
- var y;
- for(j = 0, y = []; j < 10; j++) y.push(Math.random);
-
- mock.data.push({
- y: y,
- line: {
- shape: 'spline',
- color: 'red'
+describe("update menus interaction with scrollbox:", function() {
+ "use strict";
+ var gd, mock, menuDown, menuLeft, menuRight, menuUp;
+
+ // Adapted from https://github.com/plotly/plotly.js/pull/770#issuecomment-234669383
+ mock = {
+ data: [],
+ layout: {
+ width: 1100,
+ height: 450,
+ updatemenus: [
+ {
+ buttons: [
+ { method: "restyle", args: ["line.color", "red"], label: "red" },
+ {
+ method: "restyle",
+ args: ["line.color", "blue"],
+ label: "blue"
},
- visible: i === 0,
- name: 'Data set ' + i,
- });
-
- var visible;
- for(j = 0, visible = []; j < n; j++) visible.push(i === j);
-
- for(j = 1; j <= 4; j++) {
- mock.layout.updatemenus[j].buttons.push({
- method: 'restyle',
- args: ['visible', visible],
- label: 'Data set ' + i
- });
+ {
+ method: "restyle",
+ args: ["line.color", "green"],
+ label: "green"
+ }
+ ]
+ },
+ {
+ x: 0.5,
+ xanchor: "left",
+ y: 0.5,
+ yanchor: "top",
+ direction: "down",
+ buttons: []
+ },
+ {
+ x: 0.5,
+ xanchor: "right",
+ y: 0.5,
+ yanchor: "top",
+ direction: "left",
+ buttons: []
+ },
+ {
+ x: 0.5,
+ xanchor: "left",
+ y: 0.5,
+ yanchor: "bottom",
+ direction: "right",
+ buttons: []
+ },
+ {
+ x: 0.5,
+ xanchor: "right",
+ y: 0.5,
+ yanchor: "bottom",
+ direction: "up",
+ buttons: []
}
+ ]
}
+ };
- beforeEach(function(done) {
- gd = createGraphDiv();
-
- var mockCopy = Lib.extendDeep({}, mock);
-
- Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() {
- var menus = document.getElementsByClassName('updatemenu-header');
+ for (var i = 0, n = 20; i < n; i++) {
+ var j;
- expect(menus.length).toBe(5);
+ var y;
+ for (j = 0, y = []; j < 10; j++) y.push(Math.random);
- menuDown = menus[1];
- menuLeft = menus[2];
- menuRight = menus[3];
- menuUp = menus[4];
- }).catch(fail).then(done);
+ mock.data.push({
+ y: y,
+ line: { shape: "spline", color: "red" },
+ visible: i === 0,
+ name: "Data set " + i
});
- afterEach(function() {
- Plotly.purge(gd);
- destroyGraphDiv();
- });
-
- it('scrollbox can be dragged', function() {
- var deltaX = -50,
- deltaY = -100,
- scrollBox,
- scrollBar,
- scrollBoxTranslate0,
- scrollBarTranslate0,
- scrollBoxTranslate1,
- scrollBarTranslate1;
-
- scrollBox = getScrollBox();
- expect(scrollBox).toBeDefined();
-
- // down menu
- click(menuDown);
-
- scrollBar = getVerticalScrollBar();
- expect(scrollBar).toBeDefined();
-
- scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
- dragScrollBox(scrollBox, 0, deltaY);
- scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
-
- expect(scrollBoxTranslate1.y).toEqual(scrollBoxTranslate0.y + deltaY);
- expect(scrollBarTranslate1.y).toBeGreaterThan(scrollBarTranslate0.y);
-
- // left menu
- click(menuLeft);
-
- scrollBar = getHorizontalScrollBar();
- expect(scrollBar).toBeDefined();
-
- scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
- dragScrollBox(scrollBox, deltaX, 0);
- scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
-
- expect(scrollBoxTranslate1.x).toEqual(scrollBoxTranslate0.x + deltaX);
- expect(scrollBarTranslate1.x).toBeGreaterThan(scrollBarTranslate0.x);
-
- // right menu
- click(menuRight);
-
- scrollBar = getHorizontalScrollBar();
- expect(scrollBar).toBeDefined();
-
- scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
- dragScrollBox(scrollBox, deltaX, 0);
- scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
-
- expect(scrollBoxTranslate1.x).toEqual(scrollBoxTranslate0.x + deltaX);
- expect(scrollBarTranslate1.x).toBeGreaterThan(scrollBarTranslate0.x);
-
- // up menu
- click(menuUp);
-
- scrollBar = getVerticalScrollBar();
- expect(scrollBar).toBeDefined();
-
- scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
- dragScrollBox(scrollBox, 0, deltaY);
- scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
-
- expect(scrollBoxTranslate1.y).toEqual(scrollBoxTranslate0.y + deltaY);
- expect(scrollBarTranslate1.y).toBeGreaterThan(scrollBarTranslate0.y);
- });
-
- it('scrollbox handles wheel events', function() {
- var deltaY = 100,
- scrollBox,
- scrollBar,
- scrollBoxTranslate0,
- scrollBarTranslate0,
- scrollBoxTranslate1,
- scrollBarTranslate1;
-
- scrollBox = getScrollBox();
- expect(scrollBox).toBeDefined();
+ var visible;
+ for (j = 0, visible = []; j < n; j++) visible.push(i === j);
- // down menu
- click(menuDown);
-
- scrollBar = getVerticalScrollBar();
- expect(scrollBar).toBeDefined();
-
- scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
- wheel(scrollBox, deltaY);
- scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
-
- expect(scrollBoxTranslate1.y).toEqual(scrollBoxTranslate0.y - deltaY);
- expect(scrollBarTranslate1.y).toBeGreaterThan(scrollBarTranslate0.y);
-
- // left menu
- click(menuLeft);
-
- scrollBar = getHorizontalScrollBar();
- expect(scrollBar).toBeDefined();
-
- scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
- wheel(scrollBox, deltaY);
- scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
-
- expect(scrollBoxTranslate1.x).toEqual(scrollBoxTranslate0.x - deltaY);
- expect(scrollBarTranslate1.x).toBeGreaterThan(scrollBarTranslate0.x);
-
- // right menu
- click(menuRight);
-
- scrollBar = getHorizontalScrollBar();
- expect(scrollBar).toBeDefined();
-
- scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
- wheel(scrollBox, deltaY);
- scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
-
- expect(scrollBoxTranslate1.x).toEqual(scrollBoxTranslate0.x - deltaY);
- expect(scrollBarTranslate1.x).toBeGreaterThan(scrollBarTranslate0.x);
-
- // up menu
- click(menuUp);
-
- scrollBar = getVerticalScrollBar();
- expect(scrollBar).toBeDefined();
-
- scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
- wheel(scrollBox, deltaY);
- scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
- scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
-
- expect(scrollBoxTranslate1.y).toEqual(scrollBoxTranslate0.y - deltaY);
- expect(scrollBarTranslate1.y).toBeGreaterThan(scrollBarTranslate0.y);
- });
-
- it('scrollbar can be dragged', function() {
- var deltaX = 20,
- deltaY = 10,
- scrollBox,
- scrollBar,
- scrollBoxPosition0,
- scrollBarPosition0,
- scrollBoxPosition1,
- scrollBarPosition1;
-
- scrollBox = getScrollBox();
- expect(scrollBox).toBeDefined();
-
- // down menu
- click(menuDown);
-
- scrollBar = getVerticalScrollBar();
- expect(scrollBar).toBeDefined();
-
- scrollBoxPosition0 = Drawing.getTranslate(scrollBox);
- scrollBarPosition0 = getScrollBarCenter(scrollBox, scrollBar);
- dragScrollBar(scrollBar, scrollBarPosition0, 0, deltaY);
- scrollBoxPosition1 = Drawing.getTranslate(scrollBox);
- scrollBarPosition1 = getScrollBarCenter(scrollBox, scrollBar);
-
- expect(scrollBoxPosition1.y).toBeLessThan(scrollBoxPosition0.y);
- expect(scrollBarPosition1.y).toEqual(scrollBarPosition0.y + deltaY);
-
- // left menu
- click(menuLeft);
-
- scrollBar = getHorizontalScrollBar();
- expect(scrollBar).toBeDefined();
-
- scrollBoxPosition0 = Drawing.getTranslate(scrollBox);
- scrollBarPosition0 = getScrollBarCenter(scrollBox, scrollBar);
- dragScrollBar(scrollBar, scrollBarPosition0, deltaX, 0);
- scrollBoxPosition1 = Drawing.getTranslate(scrollBox);
- scrollBarPosition1 = getScrollBarCenter(scrollBox, scrollBar);
-
- expect(scrollBoxPosition1.x).toBeLessThan(scrollBoxPosition0.x);
- expect(scrollBarPosition1.x).toEqual(scrollBarPosition0.x + deltaX);
-
- // right menu
- click(menuRight);
-
- scrollBar = getHorizontalScrollBar();
- expect(scrollBar).toBeDefined();
-
- scrollBoxPosition0 = Drawing.getTranslate(scrollBox);
- scrollBarPosition0 = getScrollBarCenter(scrollBox, scrollBar);
- dragScrollBar(scrollBar, scrollBarPosition0, deltaX, 0);
- scrollBoxPosition1 = Drawing.getTranslate(scrollBox);
- scrollBarPosition1 = getScrollBarCenter(scrollBox, scrollBar);
-
- expect(scrollBoxPosition1.x).toBeLessThan(scrollBoxPosition0.x);
- expect(scrollBarPosition1.x).toEqual(scrollBarPosition0.x + deltaX);
-
- // up menu
- click(menuUp);
+ for (j = 1; j <= 4; j++) {
+ mock.layout.updatemenus[j].buttons.push({
+ method: "restyle",
+ args: ["visible", visible],
+ label: "Data set " + i
+ });
+ }
+ }
- scrollBar = getVerticalScrollBar();
- expect(scrollBar).toBeDefined();
+ beforeEach(function(done) {
+ gd = createGraphDiv();
+
+ var mockCopy = Lib.extendDeep({}, mock);
+
+ Plotly.plot(gd, mockCopy.data, mockCopy.layout)
+ .then(function() {
+ var menus = document.getElementsByClassName("updatemenu-header");
+
+ expect(menus.length).toBe(5);
+
+ menuDown = menus[1];
+ menuLeft = menus[2];
+ menuRight = menus[3];
+ menuUp = menus[4];
+ })
+ .catch(fail)
+ .then(done);
+ });
+
+ afterEach(function() {
+ Plotly.purge(gd);
+ destroyGraphDiv();
+ });
+
+ it("scrollbox can be dragged", function() {
+ var deltaX = -50,
+ deltaY = -100,
+ scrollBox,
+ scrollBar,
+ scrollBoxTranslate0,
+ scrollBarTranslate0,
+ scrollBoxTranslate1,
+ scrollBarTranslate1;
+
+ scrollBox = getScrollBox();
+ expect(scrollBox).toBeDefined();
+
+ // down menu
+ click(menuDown);
- scrollBoxPosition0 = Drawing.getTranslate(scrollBox);
- scrollBarPosition0 = getScrollBarCenter(scrollBox, scrollBar);
- dragScrollBar(scrollBar, scrollBarPosition0, 0, deltaY);
- scrollBoxPosition1 = Drawing.getTranslate(scrollBox);
- scrollBarPosition1 = getScrollBarCenter(scrollBox, scrollBar);
+ scrollBar = getVerticalScrollBar();
+ expect(scrollBar).toBeDefined();
- expect(scrollBoxPosition1.y).toBeLessThan(scrollBoxPosition0.y);
- expect(scrollBarPosition1.y).toEqual(scrollBarPosition0.y + deltaY);
- });
+ scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
+ dragScrollBox(scrollBox, 0, deltaY);
+ scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
+
+ expect(scrollBoxTranslate1.y).toEqual(scrollBoxTranslate0.y + deltaY);
+ expect(scrollBarTranslate1.y).toBeGreaterThan(scrollBarTranslate0.y);
- function getScrollBox() {
- return document.getElementsByClassName('updatemenu-dropdown-button-group')[0];
- }
+ // left menu
+ click(menuLeft);
- function getHorizontalScrollBar() {
- return document.getElementsByClassName('scrollbar-horizontal')[0];
- }
+ scrollBar = getHorizontalScrollBar();
+ expect(scrollBar).toBeDefined();
- function getVerticalScrollBar() {
- return document.getElementsByClassName('scrollbar-vertical')[0];
- }
+ scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
+ dragScrollBox(scrollBox, deltaX, 0);
+ scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
- function getCenter(node) {
- var bbox = getBBox(node),
- x = bbox.x + 0.5 * bbox.width,
- y = bbox.y + 0.5 * bbox.height;
+ expect(scrollBoxTranslate1.x).toEqual(scrollBoxTranslate0.x + deltaX);
+ expect(scrollBarTranslate1.x).toBeGreaterThan(scrollBarTranslate0.x);
- return { x: x, y: y };
- }
+ // right menu
+ click(menuRight);
+
+ scrollBar = getHorizontalScrollBar();
+ expect(scrollBar).toBeDefined();
+
+ scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
+ dragScrollBox(scrollBox, deltaX, 0);
+ scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
+
+ expect(scrollBoxTranslate1.x).toEqual(scrollBoxTranslate0.x + deltaX);
+ expect(scrollBarTranslate1.x).toBeGreaterThan(scrollBarTranslate0.x);
+
+ // up menu
+ click(menuUp);
+
+ scrollBar = getVerticalScrollBar();
+ expect(scrollBar).toBeDefined();
+
+ scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
+ dragScrollBox(scrollBox, 0, deltaY);
+ scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
+
+ expect(scrollBoxTranslate1.y).toEqual(scrollBoxTranslate0.y + deltaY);
+ expect(scrollBarTranslate1.y).toBeGreaterThan(scrollBarTranslate0.y);
+ });
+
+ it("scrollbox handles wheel events", function() {
+ var deltaY = 100,
+ scrollBox,
+ scrollBar,
+ scrollBoxTranslate0,
+ scrollBarTranslate0,
+ scrollBoxTranslate1,
+ scrollBarTranslate1;
+
+ scrollBox = getScrollBox();
+ expect(scrollBox).toBeDefined();
+
+ // down menu
+ click(menuDown);
+
+ scrollBar = getVerticalScrollBar();
+ expect(scrollBar).toBeDefined();
+
+ scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
+ wheel(scrollBox, deltaY);
+ scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
+
+ expect(scrollBoxTranslate1.y).toEqual(scrollBoxTranslate0.y - deltaY);
+ expect(scrollBarTranslate1.y).toBeGreaterThan(scrollBarTranslate0.y);
+
+ // left menu
+ click(menuLeft);
+
+ scrollBar = getHorizontalScrollBar();
+ expect(scrollBar).toBeDefined();
- function getScrollBarCenter(scrollBox, scrollBar) {
- var scrollBoxTranslate = Drawing.getTranslate(scrollBox),
- scrollBarTranslate = Drawing.getTranslate(scrollBar),
- translateX = scrollBoxTranslate.x + scrollBarTranslate.x,
- translateY = scrollBoxTranslate.y + scrollBarTranslate.y,
- center = getCenter(scrollBar),
- x = center.x + translateX,
- y = center.y + translateY;
+ scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
+ wheel(scrollBox, deltaY);
+ scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
- return { x: x, y: y };
- }
+ expect(scrollBoxTranslate1.x).toEqual(scrollBoxTranslate0.x - deltaY);
+ expect(scrollBarTranslate1.x).toBeGreaterThan(scrollBarTranslate0.x);
- function click(node) {
- node.dispatchEvent(new MouseEvent('click'), {
- bubbles: true
- });
- }
+ // right menu
+ click(menuRight);
- function drag(node, x, y, deltaX, deltaY) {
- node.dispatchEvent(new MouseEvent('mousedown', {
- bubbles: true,
- clientX: x,
- clientY: y
- }));
- node.dispatchEvent(new MouseEvent('mousemove', {
- bubbles: true,
- clientX: x + deltaX,
- clientY: y + deltaY
- }));
- }
+ scrollBar = getHorizontalScrollBar();
+ expect(scrollBar).toBeDefined();
- function dragScrollBox(node, deltaX, deltaY) {
- var position = getCenter(node);
+ scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
+ wheel(scrollBox, deltaY);
+ scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
- drag(node, position.x, position.y, deltaX, deltaY);
- }
+ expect(scrollBoxTranslate1.x).toEqual(scrollBoxTranslate0.x - deltaY);
+ expect(scrollBarTranslate1.x).toBeGreaterThan(scrollBarTranslate0.x);
- function dragScrollBar(node, position, deltaX, deltaY) {
- drag(node, position.x, position.y, deltaX, deltaY);
- }
+ // up menu
+ click(menuUp);
+
+ scrollBar = getVerticalScrollBar();
+ expect(scrollBar).toBeDefined();
+
+ scrollBoxTranslate0 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate0 = Drawing.getTranslate(scrollBar);
+ wheel(scrollBox, deltaY);
+ scrollBoxTranslate1 = Drawing.getTranslate(scrollBox);
+ scrollBarTranslate1 = Drawing.getTranslate(scrollBar);
- function wheel(node, deltaY) {
- node.dispatchEvent(new WheelEvent('wheel', {
- bubbles: true,
- deltaY: deltaY
- }));
- }
+ expect(scrollBoxTranslate1.y).toEqual(scrollBoxTranslate0.y - deltaY);
+ expect(scrollBarTranslate1.y).toBeGreaterThan(scrollBarTranslate0.y);
+ });
+
+ it("scrollbar can be dragged", function() {
+ var deltaX = 20,
+ deltaY = 10,
+ scrollBox,
+ scrollBar,
+ scrollBoxPosition0,
+ scrollBarPosition0,
+ scrollBoxPosition1,
+ scrollBarPosition1;
+
+ scrollBox = getScrollBox();
+ expect(scrollBox).toBeDefined();
+
+ // down menu
+ click(menuDown);
+
+ scrollBar = getVerticalScrollBar();
+ expect(scrollBar).toBeDefined();
+
+ scrollBoxPosition0 = Drawing.getTranslate(scrollBox);
+ scrollBarPosition0 = getScrollBarCenter(scrollBox, scrollBar);
+ dragScrollBar(scrollBar, scrollBarPosition0, 0, deltaY);
+ scrollBoxPosition1 = Drawing.getTranslate(scrollBox);
+ scrollBarPosition1 = getScrollBarCenter(scrollBox, scrollBar);
+
+ expect(scrollBoxPosition1.y).toBeLessThan(scrollBoxPosition0.y);
+ expect(scrollBarPosition1.y).toEqual(scrollBarPosition0.y + deltaY);
+
+ // left menu
+ click(menuLeft);
+
+ scrollBar = getHorizontalScrollBar();
+ expect(scrollBar).toBeDefined();
+
+ scrollBoxPosition0 = Drawing.getTranslate(scrollBox);
+ scrollBarPosition0 = getScrollBarCenter(scrollBox, scrollBar);
+ dragScrollBar(scrollBar, scrollBarPosition0, deltaX, 0);
+ scrollBoxPosition1 = Drawing.getTranslate(scrollBox);
+ scrollBarPosition1 = getScrollBarCenter(scrollBox, scrollBar);
+
+ expect(scrollBoxPosition1.x).toBeLessThan(scrollBoxPosition0.x);
+ expect(scrollBarPosition1.x).toEqual(scrollBarPosition0.x + deltaX);
+
+ // right menu
+ click(menuRight);
+
+ scrollBar = getHorizontalScrollBar();
+ expect(scrollBar).toBeDefined();
+
+ scrollBoxPosition0 = Drawing.getTranslate(scrollBox);
+ scrollBarPosition0 = getScrollBarCenter(scrollBox, scrollBar);
+ dragScrollBar(scrollBar, scrollBarPosition0, deltaX, 0);
+ scrollBoxPosition1 = Drawing.getTranslate(scrollBox);
+ scrollBarPosition1 = getScrollBarCenter(scrollBox, scrollBar);
+
+ expect(scrollBoxPosition1.x).toBeLessThan(scrollBoxPosition0.x);
+ expect(scrollBarPosition1.x).toEqual(scrollBarPosition0.x + deltaX);
+
+ // up menu
+ click(menuUp);
+
+ scrollBar = getVerticalScrollBar();
+ expect(scrollBar).toBeDefined();
+
+ scrollBoxPosition0 = Drawing.getTranslate(scrollBox);
+ scrollBarPosition0 = getScrollBarCenter(scrollBox, scrollBar);
+ dragScrollBar(scrollBar, scrollBarPosition0, 0, deltaY);
+ scrollBoxPosition1 = Drawing.getTranslate(scrollBox);
+ scrollBarPosition1 = getScrollBarCenter(scrollBox, scrollBar);
+
+ expect(scrollBoxPosition1.y).toBeLessThan(scrollBoxPosition0.y);
+ expect(scrollBarPosition1.y).toEqual(scrollBarPosition0.y + deltaY);
+ });
+
+ function getScrollBox() {
+ return document.getElementsByClassName(
+ "updatemenu-dropdown-button-group"
+ )[0];
+ }
+
+ function getHorizontalScrollBar() {
+ return document.getElementsByClassName("scrollbar-horizontal")[0];
+ }
+
+ function getVerticalScrollBar() {
+ return document.getElementsByClassName("scrollbar-vertical")[0];
+ }
+
+ function getCenter(node) {
+ var bbox = getBBox(node),
+ x = bbox.x + 0.5 * bbox.width,
+ y = bbox.y + 0.5 * bbox.height;
+
+ return { x: x, y: y };
+ }
+
+ function getScrollBarCenter(scrollBox, scrollBar) {
+ var scrollBoxTranslate = Drawing.getTranslate(scrollBox),
+ scrollBarTranslate = Drawing.getTranslate(scrollBar),
+ translateX = scrollBoxTranslate.x + scrollBarTranslate.x,
+ translateY = scrollBoxTranslate.y + scrollBarTranslate.y,
+ center = getCenter(scrollBar),
+ x = center.x + translateX,
+ y = center.y + translateY;
+
+ return { x: x, y: y };
+ }
+
+ function click(node) {
+ node.dispatchEvent(new MouseEvent("click"), { bubbles: true });
+ }
+
+ function drag(node, x, y, deltaX, deltaY) {
+ node.dispatchEvent(new MouseEvent("mousedown", {
+ bubbles: true,
+ clientX: x,
+ clientY: y
+ }));
+ node.dispatchEvent(new MouseEvent("mousemove", {
+ bubbles: true,
+ clientX: x + deltaX,
+ clientY: y + deltaY
+ }));
+ }
+
+ function dragScrollBox(node, deltaX, deltaY) {
+ var position = getCenter(node);
+
+ drag(node, position.x, position.y, deltaX, deltaY);
+ }
+
+ function dragScrollBar(node, position, deltaX, deltaY) {
+ drag(node, position.x, position.y, deltaX, deltaY);
+ }
+
+ function wheel(node, deltaY) {
+ node.dispatchEvent(new WheelEvent("wheel", {
+ bubbles: true,
+ deltaY: deltaY
+ }));
+ }
});
diff --git a/test/jasmine/tests/validate_test.js b/test/jasmine/tests/validate_test.js
index 10771bc154a..e208564e4f3 100644
--- a/test/jasmine/tests/validate_test.js
+++ b/test/jasmine/tests/validate_test.js
@@ -1,367 +1,444 @@
-var Plotly = require('@lib/index');
-var Lib = require('@src/lib');
+var Plotly = require("@lib/index");
+var Lib = require("@src/lib");
+describe("Plotly.validate", function() {
+ function assertErrorContent(obj, code, cont, trace, path, astr, msg) {
+ expect(obj.code).toEqual(code);
+ expect(obj.container).toEqual(cont);
+ expect(obj.trace).toEqual(trace);
+ expect(obj.path).toEqual(path);
+ expect(obj.astr).toEqual(astr);
+ expect(obj.msg).toEqual(msg);
+ }
-describe('Plotly.validate', function() {
-
- function assertErrorContent(obj, code, cont, trace, path, astr, msg) {
- expect(obj.code).toEqual(code);
- expect(obj.container).toEqual(cont);
- expect(obj.trace).toEqual(trace);
- expect(obj.path).toEqual(path);
- expect(obj.astr).toEqual(astr);
- expect(obj.msg).toEqual(msg);
- }
-
- it('should return undefined when no errors are found', function() {
- var out = Plotly.validate([{
- type: 'scatter',
- x: [1, 2, 3]
- }], {
- title: 'my simple graph'
- });
-
- expect(out).toBeUndefined();
+ it("should return undefined when no errors are found", function() {
+ var out = Plotly.validate([{ type: "scatter", x: [1, 2, 3] }], {
+ title: "my simple graph"
});
- it('should report when data is not an array', function() {
- var out = Plotly.validate({
- type: 'scatter',
- x: [1, 2, 3]
- });
+ expect(out).toBeUndefined();
+ });
- expect(out.length).toEqual(1);
- assertErrorContent(
- out[0], 'array', 'data', null, '', '',
- 'The data argument must be linked to an array container'
- );
- });
+ it("should report when data is not an array", function() {
+ var out = Plotly.validate({ type: "scatter", x: [1, 2, 3] });
- it('should report when a data trace is not an object', function() {
- var out = Plotly.validate([{
- type: 'bar',
- x: [1, 2, 3]
- }, [1, 2, 3]]);
+ expect(out.length).toEqual(1);
+ assertErrorContent(
+ out[0],
+ "array",
+ "data",
+ null,
+ "",
+ "",
+ "The data argument must be linked to an array container"
+ );
+ });
- expect(out.length).toEqual(1);
- assertErrorContent(
- out[0], 'object', 'data', 1, '', '',
- 'Trace 1 in the data argument must be linked to an object container'
- );
- });
+ it("should report when a data trace is not an object", function() {
+ var out = Plotly.validate([{ type: "bar", x: [1, 2, 3] }, [1, 2, 3]]);
- it('should report when layout is not an object', function() {
- var out = Plotly.validate([], [1, 2, 3]);
+ expect(out.length).toEqual(1);
+ assertErrorContent(
+ out[0],
+ "object",
+ "data",
+ 1,
+ "",
+ "",
+ "Trace 1 in the data argument must be linked to an object container"
+ );
+ });
- expect(out.length).toEqual(1);
- assertErrorContent(
- out[0], 'object', 'layout', null, '', '',
- 'The layout argument must be linked to an object container'
- );
- });
+ it("should report when layout is not an object", function() {
+ var out = Plotly.validate([], [1, 2, 3]);
- it('should report when trace is defaulted to not be visible', function() {
- var out = Plotly.validate([{
- type: 'scattergeo'
- // missing 'x' and 'y
- }], {});
+ expect(out.length).toEqual(1);
+ assertErrorContent(
+ out[0],
+ "object",
+ "layout",
+ null,
+ "",
+ "",
+ "The layout argument must be linked to an object container"
+ );
+ });
- expect(out.length).toEqual(1);
- assertErrorContent(
- out[0], 'invisible', 'data', 0, '', '',
- 'Trace 0 got defaulted to be not visible'
- );
- });
+ it("should report when trace is defaulted to not be visible", function() {
+ var out = Plotly.validate(
+ [
+ {
+ // missing 'x' and 'y
+ type: "scattergeo"
+ }
+ ],
+ {}
+ );
- it('should report when trace contains keys not part of the schema', function() {
- var out = Plotly.validate([{
- x: [1, 2, 3],
- markerColor: 'blue'
- }], {});
+ expect(out.length).toEqual(1);
+ assertErrorContent(
+ out[0],
+ "invisible",
+ "data",
+ 0,
+ "",
+ "",
+ "Trace 0 got defaulted to be not visible"
+ );
+ });
- expect(out.length).toEqual(1);
- assertErrorContent(
- out[0], 'schema', 'data', 0, ['markerColor'], 'markerColor',
- 'In data trace 0, key markerColor is not part of the schema'
- );
- });
+ it(
+ "should report when trace contains keys not part of the schema",
+ function() {
+ var out = Plotly.validate([{ x: [1, 2, 3], markerColor: "blue" }], {});
- it('should report when trace contains keys that are not coerced', function() {
- var out = Plotly.validate([{
- x: [1, 2, 3],
- mode: 'lines',
- marker: { color: 'blue' }
- }, {
- x: [1, 2, 3],
- mode: 'markers',
- marker: {
- color: 'blue',
- cmin: 10
- }
- }], {});
+ expect(out.length).toEqual(1);
+ assertErrorContent(
+ out[0],
+ "schema",
+ "data",
+ 0,
+ ["markerColor"],
+ "markerColor",
+ "In data trace 0, key markerColor is not part of the schema"
+ );
+ }
+ );
- expect(out.length).toEqual(2);
- assertErrorContent(
- out[0], 'unused', 'data', 0, ['marker'], 'marker',
- 'In data trace 0, container marker did not get coerced'
- );
- assertErrorContent(
- out[1], 'unused', 'data', 1, ['marker', 'cmin'], 'marker.cmin',
- 'In data trace 1, key marker.cmin did not get coerced'
- );
- });
+ it("should report when trace contains keys that are not coerced", function() {
+ var out = Plotly.validate(
+ [
+ { x: [1, 2, 3], mode: "lines", marker: { color: "blue" } },
+ { x: [1, 2, 3], mode: "markers", marker: { color: "blue", cmin: 10 } }
+ ],
+ {}
+ );
- it('should report when trace contains keys set to invalid values', function() {
- var out = Plotly.validate([{
- x: [1, 2, 3],
- mode: 'lines',
- line: { width: 'a big number' }
- }, {
- x: [1, 2, 3],
- mode: 'markers',
- marker: { color: 10 }
- }], {});
+ expect(out.length).toEqual(2);
+ assertErrorContent(
+ out[0],
+ "unused",
+ "data",
+ 0,
+ ["marker"],
+ "marker",
+ "In data trace 0, container marker did not get coerced"
+ );
+ assertErrorContent(
+ out[1],
+ "unused",
+ "data",
+ 1,
+ ["marker", "cmin"],
+ "marker.cmin",
+ "In data trace 1, key marker.cmin did not get coerced"
+ );
+ });
- expect(out.length).toEqual(2);
- assertErrorContent(
- out[0], 'value', 'data', 0, ['line', 'width'], 'line.width',
- 'In data trace 0, key line.width is set to an invalid value (a big number)'
- );
- assertErrorContent(
- out[1], 'value', 'data', 1, ['marker', 'color'], 'marker.color',
- 'In data trace 1, key marker.color is set to an invalid value (10)'
- );
- });
+ it(
+ "should report when trace contains keys set to invalid values",
+ function() {
+ var out = Plotly.validate(
+ [
+ { x: [1, 2, 3], mode: "lines", line: { width: "a big number" } },
+ { x: [1, 2, 3], mode: "markers", marker: { color: 10 } }
+ ],
+ {}
+ );
- it('should work with info arrays', function() {
- var out = Plotly.validate([{
- y: [1, 2, 2]
- }], {
- xaxis: { range: [0, 10] },
- yaxis: { range: 'not-gonna-work' },
- });
+ expect(out.length).toEqual(2);
+ assertErrorContent(
+ out[0],
+ "value",
+ "data",
+ 0,
+ ["line", "width"],
+ "line.width",
+ "In data trace 0, key line.width is set to an invalid value (a big number)"
+ );
+ assertErrorContent(
+ out[1],
+ "value",
+ "data",
+ 1,
+ ["marker", "color"],
+ "marker.color",
+ "In data trace 1, key marker.color is set to an invalid value (10)"
+ );
+ }
+ );
- expect(out.length).toEqual(1);
- assertErrorContent(
- out[0], 'value', 'layout', null, ['yaxis', 'range'], 'yaxis.range',
- 'In layout, key yaxis.range is set to an invalid value (not-gonna-work)'
- );
+ it("should work with info arrays", function() {
+ var out = Plotly.validate([{ y: [1, 2, 2] }], {
+ xaxis: { range: [0, 10] },
+ yaxis: { range: "not-gonna-work" }
});
- it('should work with isLinkedToArray attributes', function() {
- var out = Plotly.validate([], {
- annotations: [{
- text: 'some text'
- }, {
- arrowSymbol: 'cat'
- }, {
- font: { color: 'wont-work' }
- }],
- xaxis: {
- type: 'date',
- rangeselector: {
- buttons: [{
- label: '1 month',
- step: 'all',
- count: 10
- }, 'wont-work', {
- title: '1 month'
- }]
- }
- },
- xaxis2: {
- type: 'date',
- rangeselector: {
- buttons: [{
- title: '1 month'
- }]
- }
- },
- xaxis3: {
- type: 'date',
- rangeselector: {
- buttons: 'wont-work'
- }
- },
- shapes: [{
- opacity: 'none'
- }],
- updatemenus: [{
- buttons: [{
- method: 'restyle',
- args: ['marker.color', 'red']
- }]
- }, 'wont-work', {
- buttons: [{
- method: 'restyle',
- args: null
- }, {
- method: 'relayout',
- args: ['marker.color', 'red'],
- title: 'not-gonna-work'
- }, 'wont-work']
- }]
- });
+ expect(out.length).toEqual(1);
+ assertErrorContent(
+ out[0],
+ "value",
+ "layout",
+ null,
+ ["yaxis", "range"],
+ "yaxis.range",
+ "In layout, key yaxis.range is set to an invalid value (not-gonna-work)"
+ );
+ });
- expect(out.length).toEqual(12);
- assertErrorContent(
- out[0], 'schema', 'layout', null,
- ['annotations', 1, 'arrowSymbol'], 'annotations[1].arrowSymbol',
- 'In layout, key annotations[1].arrowSymbol is not part of the schema'
- );
- assertErrorContent(
- out[1], 'value', 'layout', null,
- ['annotations', 2, 'font', 'color'], 'annotations[2].font.color',
- 'In layout, key annotations[2].font.color is set to an invalid value (wont-work)'
- );
- assertErrorContent(
- out[2], 'unused', 'layout', null,
- ['xaxis', 'rangeselector', 'buttons', 0, 'count'],
- 'xaxis.rangeselector.buttons[0].count',
- 'In layout, key xaxis.rangeselector.buttons[0].count did not get coerced'
- );
- assertErrorContent(
- out[3], 'schema', 'layout', null,
- ['xaxis', 'rangeselector', 'buttons', 2, 'title'],
- 'xaxis.rangeselector.buttons[2].title',
- 'In layout, key xaxis.rangeselector.buttons[2].title is not part of the schema'
- );
- assertErrorContent(
- out[4], 'object', 'layout', null,
- ['xaxis', 'rangeselector', 'buttons', 1],
- 'xaxis.rangeselector.buttons[1]',
- 'In layout, key xaxis.rangeselector.buttons[1] must be linked to an object container'
- );
- assertErrorContent(
- out[5], 'schema', 'layout', null,
- ['xaxis2', 'rangeselector', 'buttons', 0, 'title'],
- 'xaxis2.rangeselector.buttons[0].title',
- 'In layout, key xaxis2.rangeselector.buttons[0].title is not part of the schema'
- );
- assertErrorContent(
- out[6], 'array', 'layout', null,
- ['xaxis3', 'rangeselector', 'buttons'],
- 'xaxis3.rangeselector.buttons',
- 'In layout, key xaxis3.rangeselector.buttons must be linked to an array container'
- );
- assertErrorContent(
- out[7], 'value', 'layout', null,
- ['shapes', 0, 'opacity'], 'shapes[0].opacity',
- 'In layout, key shapes[0].opacity is set to an invalid value (none)'
- );
- assertErrorContent(
- out[8], 'schema', 'layout', null,
- ['updatemenus', 2, 'buttons', 1, 'title'], 'updatemenus[2].buttons[1].title',
- 'In layout, key updatemenus[2].buttons[1].title is not part of the schema'
- );
- assertErrorContent(
- out[9], 'unused', 'layout', null,
- ['updatemenus', 2, 'buttons', 0], 'updatemenus[2].buttons[0]',
- 'In layout, key updatemenus[2].buttons[0] did not get coerced'
- );
- assertErrorContent(
- out[10], 'object', 'layout', null,
- ['updatemenus', 2, 'buttons', 2], 'updatemenus[2].buttons[2]',
- 'In layout, key updatemenus[2].buttons[2] must be linked to an object container'
- );
+ it("should work with isLinkedToArray attributes", function() {
+ var out = Plotly.validate([], {
+ annotations: [
+ { text: "some text" },
+ { arrowSymbol: "cat" },
+ { font: { color: "wont-work" } }
+ ],
+ xaxis: {
+ type: "date",
+ rangeselector: {
+ buttons: [
+ { label: "1 month", step: "all", count: 10 },
+ "wont-work",
+ { title: "1 month" }
+ ]
+ }
+ },
+ xaxis2: {
+ type: "date",
+ rangeselector: { buttons: [{ title: "1 month" }] }
+ },
+ xaxis3: { type: "date", rangeselector: { buttons: "wont-work" } },
+ shapes: [{ opacity: "none" }],
+ updatemenus: [
+ { buttons: [{ method: "restyle", args: ["marker.color", "red"] }] },
+ "wont-work",
+ {
+ buttons: [
+ { method: "restyle", args: null },
+ {
+ method: "relayout",
+ args: ["marker.color", "red"],
+ title: "not-gonna-work"
+ },
+ "wont-work"
+ ]
+ }
+ ]
});
- it('should work with isSubplotObj attributes', function() {
- var out = Plotly.validate([], {
- xaxis2: {
- range: 30
- },
- scene10: {
- bgcolor: 'red'
- },
- geo0: {},
- yaxis5: 'sup'
- });
+ expect(out.length).toEqual(12);
+ assertErrorContent(
+ out[0],
+ "schema",
+ "layout",
+ null,
+ ["annotations", 1, "arrowSymbol"],
+ "annotations[1].arrowSymbol",
+ "In layout, key annotations[1].arrowSymbol is not part of the schema"
+ );
+ assertErrorContent(
+ out[1],
+ "value",
+ "layout",
+ null,
+ ["annotations", 2, "font", "color"],
+ "annotations[2].font.color",
+ "In layout, key annotations[2].font.color is set to an invalid value (wont-work)"
+ );
+ assertErrorContent(
+ out[2],
+ "unused",
+ "layout",
+ null,
+ ["xaxis", "rangeselector", "buttons", 0, "count"],
+ "xaxis.rangeselector.buttons[0].count",
+ "In layout, key xaxis.rangeselector.buttons[0].count did not get coerced"
+ );
+ assertErrorContent(
+ out[3],
+ "schema",
+ "layout",
+ null,
+ ["xaxis", "rangeselector", "buttons", 2, "title"],
+ "xaxis.rangeselector.buttons[2].title",
+ "In layout, key xaxis.rangeselector.buttons[2].title is not part of the schema"
+ );
+ assertErrorContent(
+ out[4],
+ "object",
+ "layout",
+ null,
+ ["xaxis", "rangeselector", "buttons", 1],
+ "xaxis.rangeselector.buttons[1]",
+ "In layout, key xaxis.rangeselector.buttons[1] must be linked to an object container"
+ );
+ assertErrorContent(
+ out[5],
+ "schema",
+ "layout",
+ null,
+ ["xaxis2", "rangeselector", "buttons", 0, "title"],
+ "xaxis2.rangeselector.buttons[0].title",
+ "In layout, key xaxis2.rangeselector.buttons[0].title is not part of the schema"
+ );
+ assertErrorContent(
+ out[6],
+ "array",
+ "layout",
+ null,
+ ["xaxis3", "rangeselector", "buttons"],
+ "xaxis3.rangeselector.buttons",
+ "In layout, key xaxis3.rangeselector.buttons must be linked to an array container"
+ );
+ assertErrorContent(
+ out[7],
+ "value",
+ "layout",
+ null,
+ ["shapes", 0, "opacity"],
+ "shapes[0].opacity",
+ "In layout, key shapes[0].opacity is set to an invalid value (none)"
+ );
+ assertErrorContent(
+ out[8],
+ "schema",
+ "layout",
+ null,
+ ["updatemenus", 2, "buttons", 1, "title"],
+ "updatemenus[2].buttons[1].title",
+ "In layout, key updatemenus[2].buttons[1].title is not part of the schema"
+ );
+ assertErrorContent(
+ out[9],
+ "unused",
+ "layout",
+ null,
+ ["updatemenus", 2, "buttons", 0],
+ "updatemenus[2].buttons[0]",
+ "In layout, key updatemenus[2].buttons[0] did not get coerced"
+ );
+ assertErrorContent(
+ out[10],
+ "object",
+ "layout",
+ null,
+ ["updatemenus", 2, "buttons", 2],
+ "updatemenus[2].buttons[2]",
+ "In layout, key updatemenus[2].buttons[2] must be linked to an object container"
+ );
+ });
- expect(out.length).toEqual(4);
- assertErrorContent(
- out[0], 'value', 'layout', null,
- ['xaxis2', 'range'], 'xaxis2.range',
- 'In layout, key xaxis2.range is set to an invalid value (30)'
- );
- assertErrorContent(
- out[1], 'unused', 'layout', null,
- ['scene10'], 'scene10',
- 'In layout, container scene10 did not get coerced'
- );
- assertErrorContent(
- out[2], 'schema', 'layout', null,
- ['geo0'], 'geo0',
- 'In layout, key geo0 is not part of the schema'
- );
- assertErrorContent(
- out[3], 'object', 'layout', null,
- ['yaxis5'], 'yaxis5',
- 'In layout, key yaxis5 must be linked to an object container'
- );
+ it("should work with isSubplotObj attributes", function() {
+ var out = Plotly.validate([], {
+ xaxis2: { range: 30 },
+ scene10: { bgcolor: "red" },
+ geo0: {},
+ yaxis5: "sup"
});
- it('should work with attributes in registered transforms', function() {
- var base = {
- x: [-2, -1, -2, 0, 1, 2, 3],
- y: [1, 2, 3, 1, 2, 3, 1],
- };
+ expect(out.length).toEqual(4);
+ assertErrorContent(
+ out[0],
+ "value",
+ "layout",
+ null,
+ ["xaxis2", "range"],
+ "xaxis2.range",
+ "In layout, key xaxis2.range is set to an invalid value (30)"
+ );
+ assertErrorContent(
+ out[1],
+ "unused",
+ "layout",
+ null,
+ ["scene10"],
+ "scene10",
+ "In layout, container scene10 did not get coerced"
+ );
+ assertErrorContent(
+ out[2],
+ "schema",
+ "layout",
+ null,
+ ["geo0"],
+ "geo0",
+ "In layout, key geo0 is not part of the schema"
+ );
+ assertErrorContent(
+ out[3],
+ "object",
+ "layout",
+ null,
+ ["yaxis5"],
+ "yaxis5",
+ "In layout, key yaxis5 must be linked to an object container"
+ );
+ });
- var out = Plotly.validate([
- Lib.extendFlat({}, base, {
- transforms: [{
- type: 'filter',
- operation: '='
- }, {
- type: 'filter',
- operation: '=',
- wrongKey: 'sup?'
- }, {
- type: 'filter',
- operation: 'wrongVal'
- },
- 'wont-work'
- ]
- }),
- Lib.extendFlat({}, base, {
- transforms: {
- type: 'filter'
- }
- }),
- Lib.extendFlat({}, base, {
- transforms: [{
- type: 'no gonna work'
- }]
- }),
- ], {
- title: 'my transformed graph'
- });
+ it("should work with attributes in registered transforms", function() {
+ var base = { x: [-2, -1, -2, 0, 1, 2, 3], y: [1, 2, 3, 1, 2, 3, 1] };
- expect(out.length).toEqual(5);
- assertErrorContent(
- out[0], 'schema', 'data', 0,
- ['transforms', 1, 'wrongKey'], 'transforms[1].wrongKey',
- 'In data trace 0, key transforms[1].wrongKey is not part of the schema'
- );
- assertErrorContent(
- out[1], 'value', 'data', 0,
- ['transforms', 2, 'operation'], 'transforms[2].operation',
- 'In data trace 0, key transforms[2].operation is set to an invalid value (wrongVal)'
- );
- assertErrorContent(
- out[2], 'object', 'data', 0,
- ['transforms', 3], 'transforms[3]',
- 'In data trace 0, key transforms[3] must be linked to an object container'
- );
- assertErrorContent(
- out[3], 'array', 'data', 1,
- ['transforms'], 'transforms',
- 'In data trace 1, key transforms must be linked to an array container'
- );
- assertErrorContent(
- out[4], 'value', 'data', 2,
- ['transforms', 0, 'type'], 'transforms[0].type',
- 'In data trace 2, key transforms[0].type is set to an invalid value (no gonna work)'
- );
- });
+ var out = Plotly.validate(
+ [
+ Lib.extendFlat({}, base, {
+ transforms: [
+ { type: "filter", operation: "=" },
+ { type: "filter", operation: "=", wrongKey: "sup?" },
+ { type: "filter", operation: "wrongVal" },
+ "wont-work"
+ ]
+ }),
+ Lib.extendFlat({}, base, { transforms: { type: "filter" } }),
+ Lib.extendFlat({}, base, { transforms: [{ type: "no gonna work" }] })
+ ],
+ { title: "my transformed graph" }
+ );
+
+ expect(out.length).toEqual(5);
+ assertErrorContent(
+ out[0],
+ "schema",
+ "data",
+ 0,
+ ["transforms", 1, "wrongKey"],
+ "transforms[1].wrongKey",
+ "In data trace 0, key transforms[1].wrongKey is not part of the schema"
+ );
+ assertErrorContent(
+ out[1],
+ "value",
+ "data",
+ 0,
+ ["transforms", 2, "operation"],
+ "transforms[2].operation",
+ "In data trace 0, key transforms[2].operation is set to an invalid value (wrongVal)"
+ );
+ assertErrorContent(
+ out[2],
+ "object",
+ "data",
+ 0,
+ ["transforms", 3],
+ "transforms[3]",
+ "In data trace 0, key transforms[3] must be linked to an object container"
+ );
+ assertErrorContent(
+ out[3],
+ "array",
+ "data",
+ 1,
+ ["transforms"],
+ "transforms",
+ "In data trace 1, key transforms must be linked to an array container"
+ );
+ assertErrorContent(
+ out[4],
+ "value",
+ "data",
+ 2,
+ ["transforms", 0, "type"],
+ "transforms[0].type",
+ "In data trace 2, key transforms[0].type is set to an invalid value (no gonna work)"
+ );
+ });
});