diff --git a/.gitignore b/.gitignore index 8d4ae25..97350a6 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,4 @@ bower_components +.idea +backstop_data/bitmaps_test +backstop_data/html_report \ No newline at end of file diff --git a/backstop.json b/backstop.json new file mode 100644 index 0000000..c2d22e4 --- /dev/null +++ b/backstop.json @@ -0,0 +1,42 @@ +{ + "id": "d3-bubble", + "viewports": [ + { + "label": "standard", + "width": 1024, + "height": 768 + } + ], + "scenarios": [ + { + "label": "Simple chart", + "url": "./test/visual/d3-bubble.html", + "selectors": ["d3-bubble"], + "delay": 100, + "selectorExpansion": true, + "misMatchThreshold" : 0.1, + "requireSameDimensions": true + } + ], + "paths": { + "bitmaps_reference": "backstop_data/bitmaps_reference", + "bitmaps_test": "backstop_data/bitmaps_test", + "engine_scripts": "backstop_data/engine_scripts", + "html_report": "backstop_data/html_report", + "ci_report": "backstop_data/ci_report" + }, + "report": ["browser"], + "engine": "chrome", + "engineFlags": [ + "--incognito", + "--disable-web-security", + "--user-data-dir", + "--disable-gpu", + "--force-device-scale-factor=1", + "--disable-infobars=true" + ], + "asyncCaptureLimit": 5, + "asyncCompareLimit": 50, + "debug": false, + "debugWindow": false +} diff --git a/backstop_data/bitmaps_reference/d3-bubble_Simple_chart_0_d3-bubble_0_standard.png b/backstop_data/bitmaps_reference/d3-bubble_Simple_chart_0_d3-bubble_0_standard.png new file mode 100644 index 0000000..f0dcfb9 Binary files /dev/null and b/backstop_data/bitmaps_reference/d3-bubble_Simple_chart_0_d3-bubble_0_standard.png differ diff --git a/backstop_data/bitmaps_reference/d3-bubble_Simple_chart_1_d3-bubble__n1_0_standard.png b/backstop_data/bitmaps_reference/d3-bubble_Simple_chart_1_d3-bubble__n1_0_standard.png new file mode 100644 index 0000000..3b79d9c Binary files /dev/null and b/backstop_data/bitmaps_reference/d3-bubble_Simple_chart_1_d3-bubble__n1_0_standard.png differ diff --git a/backstop_data/bitmaps_reference/d3-bubble_Simple_chart_2_d3-bubble__n2_0_standard.png b/backstop_data/bitmaps_reference/d3-bubble_Simple_chart_2_d3-bubble__n2_0_standard.png new file mode 100644 index 0000000..36e67a7 Binary files /dev/null and b/backstop_data/bitmaps_reference/d3-bubble_Simple_chart_2_d3-bubble__n2_0_standard.png differ diff --git a/backstop_data/engine_scripts/casper/clickAndHoverHelper.js b/backstop_data/engine_scripts/casper/clickAndHoverHelper.js new file mode 100644 index 0000000..4ac9ea1 --- /dev/null +++ b/backstop_data/engine_scripts/casper/clickAndHoverHelper.js @@ -0,0 +1,25 @@ +var WAIT_TIMEOUT = 5000; + +module.exports = function(casper, scenario) { + var waitFor = require('./waitForHelperHelper')(casper, WAIT_TIMEOUT); + var hoverSelector = scenario.hoverSelector, + clickSelector = scenario.clickSelector, + postInteractionWait = scenario.postInteractionWait; + + if (hoverSelector) { + waitFor(hoverSelector); + casper.then(function () { + casper.mouse.move(hoverSelector); + }); + } + + if (clickSelector) { + waitFor(clickSelector); + casper.then(function () { + casper.click(clickSelector); + }); + } + + // TODO: if postInteractionWait === integer then do ==> wait(postInteractionWait) || elsevvv + waitFor(postInteractionWait); +}; diff --git a/backstop_data/engine_scripts/casper/loadCookies.js b/backstop_data/engine_scripts/casper/loadCookies.js new file mode 100644 index 0000000..3c1ad0e --- /dev/null +++ b/backstop_data/engine_scripts/casper/loadCookies.js @@ -0,0 +1,15 @@ +var fs = require('fs'); + +module.exports = function (casper, scenario) { + var cookies = []; + var cookiePath = scenario.cookiePath; + + // READ COOKIES FROM FILE IF EXISTS + if (fs.exists(cookiePath)) { + cookies = JSON.parse(fs.read(cookiePath)); + } + + casper.page.cookies = cookies; + console.log('Cookie state restored with cookies:', JSON.stringify(cookies, null, 2)); + casper.userAgent('Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36'); +}; diff --git a/backstop_data/engine_scripts/casper/onBefore.js b/backstop_data/engine_scripts/casper/onBefore.js new file mode 100644 index 0000000..785c4ec --- /dev/null +++ b/backstop_data/engine_scripts/casper/onBefore.js @@ -0,0 +1,4 @@ +module.exports = function (casper, scenario, vp) { + require('./loadCookies')(casper, scenario); + casper.userAgent('Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36'); +}; diff --git a/backstop_data/engine_scripts/casper/onReady.js b/backstop_data/engine_scripts/casper/onReady.js new file mode 100644 index 0000000..1f89707 --- /dev/null +++ b/backstop_data/engine_scripts/casper/onReady.js @@ -0,0 +1,5 @@ +module.exports = function(casper, scenario, vp) { + console.log('SCENARIO> ' + scenario.label); + require('./clickAndHoverHelper')(casper, scenario); + // add more helpers here... +}; diff --git a/backstop_data/engine_scripts/casper/waitForHelperHelper.js b/backstop_data/engine_scripts/casper/waitForHelperHelper.js new file mode 100644 index 0000000..682eb3b --- /dev/null +++ b/backstop_data/engine_scripts/casper/waitForHelperHelper.js @@ -0,0 +1,18 @@ +var TIMEOUT_DEFAULT = 2000; + +module.exports = function (casper, timeout) { + var TIMEOUT = timeout || TIMEOUT_DEFAULT; + + return function waitFor (selector) { + if (selector) { + casper.waitForSelector( + selector, + function () {}, + function () { + console.error('NOT FOUND > ' + selector); + }, + TIMEOUT + ); + } + }; +}; diff --git a/backstop_data/engine_scripts/chromy/clickAndHoverHelper.js b/backstop_data/engine_scripts/chromy/clickAndHoverHelper.js new file mode 100644 index 0000000..fb87428 --- /dev/null +++ b/backstop_data/engine_scripts/chromy/clickAndHoverHelper.js @@ -0,0 +1,24 @@ +module.exports = function (chromy, scenario) { + var hoverSelector = scenario.hoverSelector; + var clickSelector = scenario.clickSelector; + var postInteractionWait = scenario.postInteractionWait; // selector [str] | ms [int] + + if (hoverSelector) { + chromy + .wait(hoverSelector) + .rect(hoverSelector) + .result(function (rect) { + chromy.mouseMoved(rect.left, rect.top); + }); + } + + if (clickSelector) { + chromy + .wait(clickSelector) + .click(clickSelector); + } + + if (postInteractionWait) { + chromy.wait(postInteractionWait); + } +}; diff --git a/backstop_data/engine_scripts/chromy/loadCookies.js b/backstop_data/engine_scripts/chromy/loadCookies.js new file mode 100644 index 0000000..7d5a165 --- /dev/null +++ b/backstop_data/engine_scripts/chromy/loadCookies.js @@ -0,0 +1,22 @@ +var fs = require('fs'); + +module.exports = function (chromy, scenario) { + var cookies = []; + var cookiePath = scenario.cookiePath; + + // READ COOKIES FROM FILE IF EXISTS + if (fs.existsSync(cookiePath)) { + cookies = JSON.parse(fs.readFileSync(cookiePath)); + } + + // MUNGE COOKIE DOMAIN FOR CHROMY USAGE + cookies = cookies.map(cookie => { + cookie.url = 'https://' + cookie.domain; + delete cookie.domain; + return cookie; + }); + + // SET COOKIES VIA CHROMY + chromy.setCookie(cookies); + console.log('Cookie state restored with:', JSON.stringify(cookies, null, 2)); +}; diff --git a/backstop_data/engine_scripts/chromy/onBefore.js b/backstop_data/engine_scripts/chromy/onBefore.js new file mode 100644 index 0000000..e174ef8 --- /dev/null +++ b/backstop_data/engine_scripts/chromy/onBefore.js @@ -0,0 +1,6 @@ +module.exports = function (chromy, scenario, vp) { + require('./loadCookies')(chromy, scenario); + + // IGNORE ANY CERT WARNINGS + chromy.ignoreCertificateErrors(); +}; diff --git a/backstop_data/engine_scripts/chromy/onReady.js b/backstop_data/engine_scripts/chromy/onReady.js new file mode 100644 index 0000000..6238af8 --- /dev/null +++ b/backstop_data/engine_scripts/chromy/onReady.js @@ -0,0 +1,5 @@ +module.exports = function (chromy, scenario, vp) { + console.log('SCENARIO > ' + scenario.label); + require('./clickAndHoverHelper')(chromy, scenario); + // add more ready handlers here... +}; diff --git a/backstop_data/engine_scripts/cookies.json b/backstop_data/engine_scripts/cookies.json new file mode 100644 index 0000000..b59400d --- /dev/null +++ b/backstop_data/engine_scripts/cookies.json @@ -0,0 +1,14 @@ +[ + { + "domain": ".www.yourdomain.com", + "path": "/", + "name": "yourCookieName", + "value": "yourCookieValue", + "expirationDate": 1798790400, + "hostOnly": false, + "httpOnly": false, + "secure": false, + "session": false, + "sameSite": "no_restriction" + } +] diff --git a/backstop_data/engine_scripts/onBefore.js b/backstop_data/engine_scripts/onBefore.js new file mode 100644 index 0000000..3568945 --- /dev/null +++ b/backstop_data/engine_scripts/onBefore.js @@ -0,0 +1,4 @@ +module.exports = function (engine, scenario, vp) { + // This script runs before your app loads. Edit here to log-in, load cookies or set other states required for your test. + console.log('onBefore.js has run for ' + vp.label + '.'); +}; diff --git a/backstop_data/engine_scripts/onReady.js b/backstop_data/engine_scripts/onReady.js new file mode 100644 index 0000000..5c30216 --- /dev/null +++ b/backstop_data/engine_scripts/onReady.js @@ -0,0 +1,6 @@ +module.exports = function (engine, scenario, vp) { + engine.evaluate(function () { + // Your web-app is now loaded. Edit here to simulate user interacions or other state changes in the browser window context. + }); + console.log('onReady.js has run for: ', vp.label); +}; diff --git a/d3-bubble.html b/d3-bubble.html index 270fe21..35e9ff4 100644 --- a/d3-bubble.html +++ b/d3-bubble.html @@ -14,22 +14,26 @@ --> - diff --git a/test/visual/d3-bubble.html b/test/visual/d3-bubble.html new file mode 100644 index 0000000..b2d7aed --- /dev/null +++ b/test/visual/d3-bubble.html @@ -0,0 +1,90 @@ + + + + + + + + d3-bubble + + + + + + + + +

An example of <d3-bubble>:

+ +
+ + +
+ +
+ + +
+ +
+ + +
+ + + + + +