Skip to content

Commit 2f8a5b2

Browse files
committed
feat: use generator-open-wc 0.2.0
0 parents  commit 2f8a5b2

24 files changed

+644
-0
lines changed

.circleci/config.yml

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
# Javascript Node CircleCI 2.0 configuration file
2+
#
3+
# Check https://circleci.com/docs/2.0/language-javascript/ for more details
4+
#
5+
version: 2
6+
jobs:
7+
build:
8+
docker:
9+
- image: circleci/node:10.11.0-browsers
10+
working_directory: ~/repo
11+
steps:
12+
- checkout
13+
# Download and cache dependencies
14+
- restore_cache:
15+
keys:
16+
- v1-dependencies-{{ checksum "package.json" }}
17+
# fallback to using the latest cache if no exact match is found
18+
- v1-dependencies-
19+
- run: npm install
20+
- save_cache:
21+
paths:
22+
- node_modules
23+
key: v1-dependencies-{{ checksum "package.json" }}
24+
25+
# run lint
26+
- run: npm run lint
27+
28+
# run tests
29+
- run: npm run test:bs

.editorconfig

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
# EditorConfig helps developers define and maintain consistent
2+
# coding styles between different editors and IDEs
3+
# editorconfig.org
4+
5+
root = true
6+
7+
8+
[*]
9+
10+
# Change these settings to your own preference
11+
indent_style = space
12+
indent_size = 2
13+
14+
# We recommend you to keep these unchanged
15+
end_of_line = lf
16+
charset = utf-8
17+
trim_trailing_whitespace = true
18+
insert_final_newline = true
19+
20+
[*.md]
21+
trim_trailing_whitespace = false
22+
23+
[*.json]
24+
indent_size = 2
25+
26+
[*.{html,js}]
27+
block_comment_start = /**
28+
block_comment = *
29+
block_comment_end = */

.eslintignore

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/node_modules

.eslintrc.js

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
module.exports = {
2+
extends: [
3+
'@open-wc/eslint-config',
4+
].map(require.resolve),
5+
};

.gitignore

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
## editors
2+
/.idea
3+
/.vscode
4+
5+
## system files
6+
.DS_Store
7+
8+
## npm
9+
/node_modules/
10+
/npm-debug.log
11+
12+
## testing
13+
/coverage/
14+
15+
## bower
16+
/bower_components*/
17+
/bower-*.json
18+
19+
## temp folders
20+
/.tmp/
21+
22+
## we don't want lock files for now
23+
yarn.lock
24+
package-lock.json

.storybook/.babelrc

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"plugins": [
3+
"@babel/plugin-syntax-dynamic-import",
4+
"@babel/plugin-proposal-object-rest-spread"
5+
]
6+
}

.storybook/addons.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import '@storybook/addon-storysource/register';
2+
import '@storybook/addon-actions/register';
3+
import '@storybook/addon-backgrounds/register';
4+
import '@storybook/addon-notes/register';
5+
import '@storybook/addon-knobs/register';
6+
import '@storybook/addon-links/register';
7+
import '@storybook/addon-viewport/register';
8+
import '@storybook/addon-options/register';

.storybook/config.js

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { configure } from '@storybook/polymer';
2+
import { setOptions } from '@storybook/addon-options';
3+
4+
setOptions({
5+
hierarchyRootSeparator: /\|/,
6+
});
7+
8+
const req = require.context('../stories', true, /\.stories\.js$/);
9+
function loadStories() {
10+
req.keys().forEach(filename => req(filename));
11+
}
12+
13+
configure(loadStories, module);

.storybook/webpack.config.js

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
const path = require('path');
2+
const webpack = require('webpack');
3+
4+
module.exports = (storybookBaseConfig, configType, defaultConfig) => {
5+
defaultConfig.resolve.modules.push('bower_components');
6+
7+
defaultConfig.module.rules.push({
8+
test: [/\.stories\.js$/, /index\.js$/],
9+
loaders: [require.resolve('@storybook/addon-storysource/loader')],
10+
enforce: 'pre',
11+
});
12+
13+
// TEMP fix: https://github.com/plotly/plotly.js/issues/2466#issuecomment-372924684
14+
defaultConfig.plugins.push(new webpack.IgnorePlugin(/vertx/));
15+
16+
return defaultConfig;
17+
};

.yo-rc.json

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"generator-open-wc": {
3+
"tagName": "example-vanilla",
4+
"className": "ExampleVanilla"
5+
}
6+
}

ExampleVanilla.js

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import { html, render } from 'lit-html';
2+
3+
export default class ExampleVanilla extends HTMLElement {
4+
constructor() {
5+
super();
6+
this.attachShadow({ mode: 'open' });
7+
this.header = 'My Example';
8+
}
9+
10+
connectedCallback() {
11+
this.update();
12+
}
13+
14+
update() {
15+
render(this.renderShadowDom(), this.shadowRoot);
16+
}
17+
18+
renderShadowDom() {
19+
return html`
20+
<style>
21+
:host {
22+
background: grey;
23+
display: block;
24+
padding: 25px;
25+
}
26+
27+
h1 {
28+
color: white;
29+
font-size: 25px;
30+
margin: 0;
31+
}
32+
33+
:host(.right) {
34+
background: green;
35+
text-align: right;
36+
}
37+
38+
:host(.right) h1 {
39+
color: orange;
40+
text-align: right;
41+
}
42+
43+
:host(.right) div {
44+
text-align: right;
45+
}
46+
</style>
47+
<h1>${this.header}</h1>
48+
<div>
49+
<slot></slot>
50+
</div>
51+
`;
52+
}
53+
}

LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2018 example-vanilla
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

README.md

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
# \<example-vanilla>
2+
3+
This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.
4+
5+
## Installation
6+
```bash
7+
npm i example-vanilla
8+
```
9+
10+
## Usage
11+
```html
12+
<script type="module">
13+
import 'example-vanilla/example-vanilla.js';
14+
</script>
15+
16+
<example-vanilla></example-vanilla>
17+
```
18+
19+
## Testing using karma (if applied by author)
20+
```bash
21+
npm run test
22+
```
23+
24+
## Testing using karma via browserstack (if applied by author)
25+
```bash
26+
npm run test:bs
27+
```
28+
29+
## Demos using storybook (if applied by author)
30+
```bash
31+
npm run storybook:start
32+
```
33+
34+
## Linting using eslint (if applied by author)
35+
```bash
36+
npm run lint:eslint
37+
```

example-vanilla.js

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import ExampleVanilla from './ExampleVanilla.js';
2+
3+
window.customElements.define('example-vanilla', ExampleVanilla);

karma-bs.config.js

+59
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
const originalConfigFn = require('./karma.conf.js');
2+
3+
let originalConfig;
4+
originalConfigFn({ set: (config) => { originalConfig = config; } });
5+
6+
if (!process.env.BROWSER_STACK_USERNAME || !process.env.BROWSER_STACK_ACCESS_KEY) {
7+
throw new Error(`
8+
!!You have to set your Browserstack automate username and key!!
9+
10+
Login and go to https://www.browserstack.com/accounts/settings
11+
then run in your console (or add it to your ~/.bashrc)
12+
13+
export BROWSER_STACK_USERNAME=[username];
14+
export BROWSER_STACK_ACCESS_KEY=[key];
15+
`);
16+
}
17+
18+
module.exports = (config) => {
19+
config.set({
20+
...originalConfig,
21+
22+
browserStack: {
23+
username: process.env.BROWSER_STACK_USERNAME,
24+
accessKey: process.env.BROWSER_STACK_ACCESS_KEY,
25+
project: 'open-wc',
26+
},
27+
28+
browsers: [
29+
'bs_win10_chrome_69',
30+
'bs_win10_firefox_62',
31+
// 'bs_win10_ie_11',
32+
],
33+
34+
// define browsers
35+
customLaunchers: {
36+
bs_win10_chrome_69: {
37+
base: 'BrowserStack',
38+
browser: 'Chrome',
39+
browser_version: '69.0',
40+
os: 'Windows',
41+
os_version: '10',
42+
},
43+
bs_win10_firefox_62: {
44+
base: 'BrowserStack',
45+
browser: 'Firefox',
46+
browser_version: '62.0',
47+
os: 'Windows',
48+
os_version: '10',
49+
},
50+
bs_win10_ie_11: {
51+
base: 'BrowserStack',
52+
browser: 'IE',
53+
browser_version: '11.0',
54+
os: 'Windows',
55+
os_version: '10',
56+
},
57+
},
58+
});
59+
};

0 commit comments

Comments
 (0)