-
Notifications
You must be signed in to change notification settings - Fork 1
/
template.config.js
102 lines (78 loc) · 2.27 KB
/
template.config.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
const Case = require('change-case');
const files = {
"modulor.html": (componentName, prefix) =>
`<div>
</div>`,
"css": (componentName, prefix) =>
`${prefix}${componentName} {
}`,
"js": (componentName, prefix) =>
`import { BaseComponent } from 'modulor'
// import BaseComponent from 'components/${prefix}base';
import './${prefix}${componentName}.css';
import template from './${prefix}${componentName}.modulor.html';
class ${Case.pascalCase(componentName)} extends BaseComponent {
connectedCallback() {
super.connectedCallback();
this.render();
}
render() {
template({}, this);
this.bindEvents();
}
bindEvents() {
}
}
customElements.define('${prefix}${componentName}', ${Case.pascalCase(componentName)});
`,
"test.js": (componentName, prefix) =>
`/* eslint-disable */
require('./${prefix}${componentName}');
describe('${Case.titleCase(componentName)}', () => {
let $component;
let $container;
beforeAll(async () => {
const promises = Promise.all([
waitComponentAttached('${prefix}${componentName}'),
]);
// Get Container as per your Test config, for example
// $container = getContainer('<${prefix}${componentName}></${prefix}${componentName}>');
await promises;
// Then query the component, like as follows
// $component = $container.querySelector('${prefix}${componentName}');
});
afterAll(() => {
// Remove Container as per your Test config, for example
// removeContainer($container)
});
test('it renders', () => {
expect($component.refs).not.toBe(undefined);
});
});
`,
"story.js": (componentName, prefix) =>
`/* eslint-disable */
import { storiesOf } from 'modulor-storybook';
const { withReadme } = require('modulor-storybook/addons/readme');
const { withEvents } = require('modulor-storybook/addons/events');
require('./${prefix}${componentName}');
storiesOf('${Case.titleCase(componentName)}')
.addDecorator(withEvents([
{
type: 'click',
extract: ['value']
}
]))
.add('default', () => '<${prefix}${componentName}></${prefix}${componentName}>')
`
};
function ucFirst(string) {
return string.charAt(0).toUpperCase() + string.slice(1);
}
function templatesConfig() {
return {
extensions: Object.keys(files),
files
}
}
module.exports = templatesConfig();