From 78c3e8b9079a8a6ad64de4200f1c4b4e2042cd2e Mon Sep 17 00:00:00 2001 From: Johann-S Date: Fri, 26 Oct 2018 20:44:19 +0200 Subject: [PATCH] feat(testing): add browserstack for cross browser testing --- .travis.yml | 9 ++ README.md | 7 ++ package-lock.json | 219 ++++++++++++++++++++++++++++++++++++++++++++ package.json | 3 + tests/browsers.js | 79 ++++++++++++++++ tests/karma.conf.js | 27 +++++- 6 files changed, 342 insertions(+), 2 deletions(-) create mode 100644 tests/browsers.js diff --git a/.travis.yml b/.travis.yml index ec2ae51..48036d6 100644 --- a/.travis.yml +++ b/.travis.yml @@ -6,6 +6,15 @@ node_js: - "8" after_success: - npm run coveralls +stages: + - test + - name: browser + if: type = push +jobs: + include: + - stage: browser + node_js: 8 + script: if ! git log --format=%B --no-merges -n 1 | grep '\[skip browser\]'; then npm test && npm run browserstack; fi cache: directories: - "$HOME/.npm" diff --git a/README.md b/README.md index c9678c0..250a8fa 100644 --- a/README.md +++ b/README.md @@ -34,6 +34,7 @@ Features: - [How to use it](#how-to-use-it) - [Methods](#methods) - [Support me](#support-me) +- [Thanks](#thanks) - [License](#license) ## Install @@ -175,6 +176,12 @@ Remove stored data relative to your stepper and listeners. If you want to thank me, you can support me and become my [Patron](https://www.patreon.com/jservoire) +## Thanks + +[![BrowserStack Logo](https://www.browserstack.com/images/mail/browserstack-logo-footer.png)](https://www.browserstack.com/) + +Thanks to [BrowserStack](https://www.browserstack.com/) for providing the infrastructure that allows us to test in real browsers! + ## License [MIT](https://github.com/Johann-S/bs-stepper/blob/master/LICENSE) diff --git a/package-lock.json b/package-lock.json index ddde0c7..81e896d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -782,6 +782,24 @@ "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8=", "dev": true }, + "agent-base": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz", + "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc=", + "dev": true, + "requires": { + "extend": "~3.0.0", + "semver": "~5.0.1" + }, + "dependencies": { + "semver": { + "version": "5.0.3", + "resolved": "http://registry.npmjs.org/semver/-/semver-5.0.3.tgz", + "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no=", + "dev": true + } + } + }, "ajv": { "version": "6.5.4", "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.5.4.tgz", @@ -1526,6 +1544,22 @@ "callsite": "1.0.0" } }, + "big-integer": { + "version": "1.6.36", + "resolved": "https://registry.npmjs.org/big-integer/-/big-integer-1.6.36.tgz", + "integrity": "sha512-t70bfa7HYEA1D9idDbmuv7YbsbVkQ+Hp+8KFSul4aE5e/i1bjCNIRYJZlA8Q8p0r9T8cF/RVvwUgRA//FydEyg==", + "dev": true + }, + "binary": { + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/binary/-/binary-0.3.0.tgz", + "integrity": "sha1-n2BVO8XOjDOG87VTz/R0Yq3sqnk=", + "dev": true, + "requires": { + "buffers": "~0.1.1", + "chainsaw": "~0.1.0" + } + }, "binary-extensions": { "version": "1.12.0", "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.12.0.tgz", @@ -1632,6 +1666,46 @@ "node-releases": "^1.0.0-alpha.12" } }, + "browserstack": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/browserstack/-/browserstack-1.5.0.tgz", + "integrity": "sha1-tWVCWtYu1ywQgqHrl51TE8fUdU8=", + "dev": true, + "requires": { + "https-proxy-agent": "1.0.0" + } + }, + "browserstacktunnel-wrapper": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/browserstacktunnel-wrapper/-/browserstacktunnel-wrapper-2.0.4.tgz", + "integrity": "sha512-GCV599FUUxNOCFl3WgPnfc5dcqq9XTmMXoxWpqkvmk0R9TOIoqmjENNU6LY6DtgIL6WfBVbg/jmWtnM5K6UYSg==", + "dev": true, + "requires": { + "https-proxy-agent": "^2.2.1", + "unzipper": "^0.9.3" + }, + "dependencies": { + "agent-base": { + "version": "4.2.1", + "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-4.2.1.tgz", + "integrity": "sha512-JVwXMr9nHYTUXsBFKUqhJwvlcYU/blreOEUkhNR2eXZIvwd+c+o5V4MgDPKWnMS/56awN3TRzIP+KoPn+roQtg==", + "dev": true, + "requires": { + "es6-promisify": "^5.0.0" + } + }, + "https-proxy-agent": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-2.2.1.tgz", + "integrity": "sha512-HPCTS1LW51bcyMYbxUIOO4HEOlQ1/1qRaFWcyxvwaqUS9TY88aoEuHUY33kuAh1YhVVaDQhLZsnPd+XNARWZlQ==", + "dev": true, + "requires": { + "agent-base": "^4.1.0", + "debug": "^3.1.0" + } + } + } + }, "buffer-alloc": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/buffer-alloc/-/buffer-alloc-1.2.0.tgz", @@ -1660,6 +1734,18 @@ "integrity": "sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A==", "dev": true }, + "buffer-indexof-polyfill": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/buffer-indexof-polyfill/-/buffer-indexof-polyfill-1.0.1.tgz", + "integrity": "sha1-qfuAbOgUXVQoUQznLyeLs2OmOL8=", + "dev": true + }, + "buffers": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/buffers/-/buffers-0.1.1.tgz", + "integrity": "sha1-skV5w77U1tOWru5tmorn9Ugqt7s=", + "dev": true + }, "builtin-modules": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz", @@ -1753,6 +1839,15 @@ "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw=", "dev": true }, + "chainsaw": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/chainsaw/-/chainsaw-0.1.0.tgz", + "integrity": "sha1-XqtQsor+WAdNDVgpE4iCi15fvJg=", + "dev": true, + "requires": { + "traverse": ">=0.3.0 <0.4" + } + }, "chalk": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.1.tgz", @@ -2952,6 +3047,15 @@ } } }, + "duplexer2": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz", + "integrity": "sha1-ixLauHjA1p4+eJEFFmKjL8a93ME=", + "dev": true, + "requires": { + "readable-stream": "^2.0.2" + } + }, "ecc-jsbn": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.2.tgz", @@ -3131,6 +3235,21 @@ "integrity": "sha1-wsNYJlYkfDnqEHyx5mUrb58kUjw=", "dev": true }, + "es6-promise": { + "version": "4.2.5", + "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.5.tgz", + "integrity": "sha512-n6wvpdE43VFtJq+lUDYDBFUwV8TZbuGXLV4D6wKafg13ldznKsyEvatubnmUe31zcvelSzOHF+XbaT+Bl9ObDg==", + "dev": true + }, + "es6-promisify": { + "version": "5.0.0", + "resolved": "http://registry.npmjs.org/es6-promisify/-/es6-promisify-5.0.0.tgz", + "integrity": "sha1-UQnWLz5W6pZ8S2NQWu8IKRyKUgM=", + "dev": true, + "requires": { + "es6-promise": "^4.0.3" + } + }, "escape-html": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz", @@ -4681,6 +4800,18 @@ } } }, + "fstream": { + "version": "1.0.11", + "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz", + "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE=", + "dev": true, + "requires": { + "graceful-fs": "^4.1.2", + "inherits": "~2.0.0", + "mkdirp": ">=0.5 0", + "rimraf": "2" + } + }, "function-bind": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", @@ -5274,6 +5405,34 @@ "sshpk": "^1.7.0" } }, + "https-proxy-agent": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-1.0.0.tgz", + "integrity": "sha1-NffabEjOTdv6JkiRrFk+5f+GceY=", + "dev": true, + "requires": { + "agent-base": "2", + "debug": "2", + "extend": "3" + }, + "dependencies": { + "debug": { + "version": "2.6.9", + "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", + "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==", + "dev": true, + "requires": { + "ms": "2.0.0" + } + }, + "ms": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", + "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=", + "dev": true + } + } + }, "humanize-url": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/humanize-url/-/humanize-url-1.0.1.tgz", @@ -5407,6 +5566,12 @@ "integrity": "sha512-wPVv/y/QQ/Uiirj/vh3oP+1Ww+AWehmi1g5fFWGPF6IpCBCDVrhgHRMvrLfdYcwDh3QJbGXDW4JAuzxElLSqKA==", "dev": true }, + "ip": { + "version": "1.1.5", + "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz", + "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo=", + "dev": true + }, "is-accessor-descriptor": { "version": "0.1.6", "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz", @@ -5989,6 +6154,17 @@ } } }, + "karma-browserstack-launcher": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/karma-browserstack-launcher/-/karma-browserstack-launcher-1.3.0.tgz", + "integrity": "sha512-LrPf5sU/GISkEElWyoy06J8x0c8BcOjjOwf61Wqu6M0aWQu0Eoqm9yh3xON64/ByST/CEr0GsWiREQ/EIEMd4Q==", + "dev": true, + "requires": { + "browserstack": "1.5.0", + "browserstacktunnel-wrapper": "~2.0.1", + "q": "~1.5.0" + } + }, "karma-chrome-launcher": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/karma-chrome-launcher/-/karma-chrome-launcher-2.2.0.tgz", @@ -6049,6 +6225,12 @@ "type-check": "~0.3.2" } }, + "listenercount": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/listenercount/-/listenercount-1.0.1.tgz", + "integrity": "sha1-hMinKrWcRyUyFIDJdeZQg0LnCTc=", + "dev": true + }, "load-json-file": { "version": "2.0.0", "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz", @@ -8092,6 +8274,12 @@ } } }, + "setimmediate": { + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz", + "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU=", + "dev": true + }, "setprototypeof": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz", @@ -9127,6 +9315,12 @@ } } }, + "traverse": { + "version": "0.3.9", + "resolved": "https://registry.npmjs.org/traverse/-/traverse-0.3.9.tgz", + "integrity": "sha1-cXuPIgzAu3tE5AUUwisui7xw2Lk=", + "dev": true + }, "trim-newlines": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-2.0.0.tgz", @@ -9354,6 +9548,31 @@ } } }, + "unzipper": { + "version": "0.9.4", + "resolved": "https://registry.npmjs.org/unzipper/-/unzipper-0.9.4.tgz", + "integrity": "sha512-kGrkTaphmXE+0/A5Q7rwcm/xHlDkXDOGEh6wuiN3SUQsyVWd7V51rwqttlNTT91JrLkfn34MoBNf38unF0vhRw==", + "dev": true, + "requires": { + "big-integer": "^1.6.17", + "binary": "~0.3.0", + "bluebird": "~3.4.1", + "buffer-indexof-polyfill": "~1.0.0", + "duplexer2": "~0.1.4", + "fstream": "~1.0.10", + "listenercount": "~1.0.1", + "readable-stream": "~2.3.6", + "setimmediate": "~1.0.4" + }, + "dependencies": { + "bluebird": { + "version": "3.4.7", + "resolved": "http://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz", + "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM=", + "dev": true + } + } + }, "upath": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/upath/-/upath-1.1.0.tgz", diff --git a/package.json b/package.json index 662b37b..e0e5dfa 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "node": ">=8" }, "scripts": { + "browserstack": "npm run build-js:unit && cross-env browser=true karma start tests/karma.conf.js", "build": "npm run build-js && npm run build-css", "build-js": "rollup -c && rollup -c --environment PROD", "build-js:unit": "cross-env NODE_ENV=test rollup -c --environment TEST", @@ -59,8 +60,10 @@ "cross-env": "^5.2.0", "gh-pages": "^2.0.1", "http-server": "^0.11.1", + "ip": "^1.1.5", "jasmine-core": "^3.3.0", "karma": "^3.1.1", + "karma-browserstack-launcher": "^1.3.0", "karma-chrome-launcher": "^2.2.0", "karma-coverage-istanbul-reporter": "^2.0.4", "karma-jasmine": "^1.1.2", diff --git a/tests/browsers.js b/tests/browsers.js new file mode 100644 index 0000000..ae5f33e --- /dev/null +++ b/tests/browsers.js @@ -0,0 +1,79 @@ +const browsers = { + safariMac: { + base: 'BrowserStack', + os: 'OS X', + os_version: 'High Sierra', + browser: 'Safari', + browser_version: 'latest' + }, + chromeMac: { + base: 'BrowserStack', + os: 'OS X', + os_version: 'High Sierra', + browser : 'Chrome', + browser_version : 'latest' + }, + firefoxMac: { + base: 'BrowserStack', + os: 'OS X', + os_version: 'High Sierra', + browser: 'Firefox', + browser_version: 'latest' + }, + edgeWin10: { + base: 'BrowserStack', + os: 'Windows', + os_version: '10', + browser: 'Edge', + browser_version: 'latest' + }, + ie11Win10: { + base: 'BrowserStack', + os: 'Windows', + os_version: '10', + browser: 'IE', + browser_version: '11.0' + }, + chromeWin10: { + base: 'BrowserStack', + os: 'Windows', + os_version: '10', + browser: 'Chrome', + browser_version: 'latest' + }, + firefoxWin10: { + base: 'BrowserStack', + os: 'Windows', + os_version: '10', + browser: 'Firefox', + browser_version: 'latest' + }, + ie10Win8: { + base: 'BrowserStack', + os: 'Windows', + os_version: '8', + browser: 'IE', + browser_version: '10.0' + }, + iphoneX: { + base: 'BrowserStack', + os: 'ios', + os_version: '11.0', + device: 'iPhone X', + real_mobile: true + }, + pixel2: { + base: 'BrowserStack', + os: 'android', + os_version: '8.0', + device: 'Google Pixel 2', + real_mobile: true + } +} + +const browsersKeys = Object.keys(browsers) + +module.exports = { + browsers, + browsersKeys +} diff --git a/tests/karma.conf.js b/tests/karma.conf.js index 1292d09..0aa5002 100644 --- a/tests/karma.conf.js +++ b/tests/karma.conf.js @@ -1,5 +1,11 @@ const path = require('path') +const ip = require('ip') +const { + browsers, + browsersKeys, +} = require('./browsers') const coveragePath = path.resolve(__dirname, 'dist/coverage') +const browserTest = process.env.browser === 'true' module.exports = function(config) { const conf = { @@ -8,7 +14,7 @@ module.exports = function(config) { 'dist/js/*.js', 'units/*.spec.js' ], - reporters: ['dots', 'coverage-istanbul'], + reporters: ['dots'], port: 9876, colors: true, // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG @@ -17,7 +23,24 @@ module.exports = function(config) { browsers: ['ChromeHeadless'], singleRun: true, concurrency: Infinity, - coverageIstanbulReporter: { + } + + if (browserTest) { + conf.hostname = ip.address() + conf.browserStack = { + username: process.env.BROWSER_STACK_USERNAME, + accessKey: process.env.BROWSER_STACK_ACCESS_KEY, + build: `bsStepper-${new Date().toISOString()}`, + project: 'bsStepper', + retryLimit: 1, + } + + conf.customLaunchers = browsers + conf.browsers = browsersKeys + conf.reporters.push('BrowserStack') + } else { + conf.reporters.push('coverage-istanbul') + conf.coverageIstanbulReporter = { dir: coveragePath, reports: ['lcov', 'text-summary'], thresholds: {