b26f78a062
- @open-wc/building-rollup@0.22.12 - @open-wc/building-utils@2.16.2 - @open-wc/building-webpack@2.13.11 - @open-wc/create@0.28.2 - @open-wc/dedupe-mixin@1.2.14 - @open-wc/demoing-storybook@1.15.2 - es-dev-server@1.46.1 - @open-wc/karma-esm@2.13.22 - @open-wc/lit-helpers@0.3.6 - @mdjs/core@0.1.8 - polyfills-loader@1.5.3 - @open-wc/rollup-plugin-html@0.3.7 - rollup-plugin-index-html@1.10.5 - @open-wc/rollup-plugin-polyfills-loader@0.5.1 - @open-wc/scoped-elements@1.0.6 - @open-wc/semantic-dom-diff@0.17.6 - storybook-addon-markdown-docs@0.2.3 - storybook-addon-web-components-knobs@0.3.5 - @open-wc/testing-helpers@1.7.0 - @open-wc/testing-karma-bs@1.3.55 - @open-wc/testing-karma@3.3.11 - @open-wc/testing@2.5.9 - @open-wc/webpack-index-html-plugin@1.7.5
Testing via Browserstack
Configuration for setting up browserstack testing with karma.
To make sure your project is production-ready, we recommend running tests in all the browsers you want to support.
If you do not have access to all browsers, we recommend using a service like Browserstack to make sure your project works as intended. Browserstack offers free accounts for open source projects.
The testing-karma-bs configuration helps setting up karma with Browserstack. To set it up you need to use the configuration in your project, and follow the instructions below to set up a user account
Setup
With our project scaffolding you can set up a pre-configured project, or you can upgrade an existing project by choosing Upgrade -> Testing:
npm init @open-wc
Manual
Install:
npm i -D @open-wc/testing-karma-bs deepmerge
Add a karma.conf.bs.js file:
const merge = require('deepmerge');
const { bsSettings } = require('@open-wc/testing-karma-bs');
const createBaseConfig = require('./karma.conf.js');
module.exports = config => {
config.set(
merge.all([
bsSettings(config),
createBaseConfig(config),
{
browserStack: {
project: 'your-name',
},
},
]),
);
return config;
};
Add a script to your package.json:
{
"scripts": {
"test:bs": "karma start karma.conf.bs.js --coverage"
}
}
Setup user + key
- Go to https://www.browserstack.com/accounts/settings
- Look for "Automate" and write down your "Access Key" and "Username"
- Within your terminal or command line write:
# for one-time use only (on mac)
export BROWSER_STACK_USERNAME=xxx
export BROWSER_STACK_ACCESS_KEY=xxx
# or for one-time use only (on windows)
set BROWSER_STACK_USERNAME=xxx
set BROWSER_STACK_ACCESS_KEY=xxx
# or add them to your .bashrc
echo "export BROWSER_STACK_USERNAME=xxx" >> ~/.bashrc
echo "export BROWSER_STACK_ACCESS_KEY=xxx" >> ~/.bashrc
# to verify, run:
echo "User: $BROWSER_STACK_USERNAME"
echo "Key: $BROWSER_STACK_ACCESS_KEY"
Usage
npm run test:bs