Open Web Components provides a set of defaults, recommendations and tools to help facilitate your Web Component.
Branch: master
Clone or download
CircleCI
CircleCI chore: release new versions
 - @open-wc/chai-dom-equals@0.9.16
 - @open-wc/semantic-dom-diff@0.7.10
 - @open-wc/testing-helpers@0.7.15
 - @open-wc/testing-karma-bs@0.2.11
 - @open-wc/testing-karma@0.4.10
 - @open-wc/testing@0.9.18
Latest commit 21955f3 Feb 14, 2019

README.md

🛠 Status: In Development

open-wc is still in an early stage - please review our recommendations and test our tools! We'd love to get your feedback.

Open-wc Logo

Open Web Component Recommendations

Open Web Components provides a set of defaults, recommendations and tools to help facilitate your web component project. Our recommendations include: developing, linting, testing, building, tooling, demoing, publishing and automating.

CircleCI BrowserStack Status Renovate enabled

Usage

npm i -g yo
npm i -g generator-open-wc

# scaffold a complete new component
mkdir my-element
cd my-element
# Default development recommendation
yo open-wc:scaffold-vanilla

# upgrade/align your existing web component with 'open-wc' recommendations
cd existing-web-component
yo open-wc

Homepage

For more details please visit us at open-wc.org.

Packages

Package Version Description
testing-helpers testing-helpers Testing Helpers following open-wc recommendations.
chai-dom-equals chai-dom-equals Chai Plugin to compare dom and shadow dom trees. Part of open-wc recommendations.
semantic-dom-diff semantic-dom-diff To compare dom and shadow dom trees. Part of open-wc recommendations.
testing testing Testing following open-wc recommendations.
testing-karma testing-karma Testing with Karma following open-wc recommendations.
testing-karma-bs testing-karma-bs Testing with Karma using Browserstack following open-wc recommendations.
webpack-import-meta-loader webpack-import-meta-loader Webpack loader plugin to support import.meta.
generator-open-wc generator-open-wc Scaffold web components following open-wc recommendations.
polyfills-loader polyfills-loader Load web component polyfills using dynamic imports.
eslint-config eslint-config Eslint configuration following open-wc recommendations.
testing-wallaby testing-wallaby Testing with wallaby following open-wc recommendations.
prettier-config prettier-config Prettier configuration following open-wc recommendations.
building-webpack building-webpack Default configuration for working with webpack.
storybook storybook Storybook configuration following open-wc recommendations.
owc-dev-server owc-dev-server Development server for modern web apps.

Contact

Feel free to create a github issue for any feedback or questions you might have.

You can also find us on the Polymer slack in the #open-wc channel.

You can join the Polymer slack by visiting this link.

We Proudly Use

Browserstack Logo

Guide

# bootstrap/setup
npm run bootstrap

# linting
npm run lint

# local testing
npm run test

# testing via browserstack
npm run test:bs

# run commands only for a specific scope
lerna run <command> --scope @open-wc/<package-name> --stream