Skip to content

Commit 0fe9157

Browse files
mwczkylebuch8
mwcz
authored and
kylebuch8
committed
Fix umd globals (#122)
* in-progress fix for global branch of umd use case * hide fouc * add fouc prevention to demo pages and add tests * remove all's dep on itself but still run all's tests * fix package-lock * found the magic combo for globals * fix amd case by making modules anonymous * more progress on true UMD support w/ rollup * fix lifecycle-related rh-number attribute change bug * more rollup implementation * rebuild * add rollup to every element * build all the things * rebuild * run prettier after every build * avoid embedding interdependent rhelements in UMD bundle * add module system tests
1 parent 5c9c134 commit 0fe9157

File tree

157 files changed

+2166
-2207
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

157 files changed

+2166
-2207
lines changed

‎elements/all/test/fouc-test.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
66
<script src="/components/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
77
<script src="/components/web-component-tester/browser.js"></script>
8+
89
<script type="module" src="../../rh-card/rh-card.js"></script>
910

1011
<noscript>

‎elements/all/test/index.html‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,11 @@
99
<script>
1010
// Load and run all tests (.html, .js):
1111
WCT.loadSuites([
12-
'fouc-test.html'
12+
'fouc-test.html',
13+
'module-amd-test.html',
14+
'module-esm-test.html',
15+
'module-global-test.html',
1316
]);
1417
</script>
15-
16-
</body></html>
18+
</body>
19+
</html>

‎elements/all/test/module-amd-test.html‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
6+
<script src="/components/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
7+
<script src="/components/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
8+
<script src="/components/web-component-tester/browser.js"></script>
9+
10+
<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.5/require.min.js"></script>
11+
<script></script>
12+
13+
<noscript>
14+
<link href="../../rhelement/rhelement-noscript.min.css" rel="stylesheet">
15+
</noscript>
16+
17+
<link href="../../rhelement/rhelement.min.css" rel="stylesheet">
18+
19+
</head>
20+
<body unresolved>
21+
22+
<rh-card>
23+
<h2 slot="header">Card 1</h2>This is rh-card.
24+
<div slot="footer">Text in footer</div>
25+
</rh-card>
26+
27+
<script>
28+
suite("using RHElements as AMD Modules", () => {
29+
test('it should upgrade', done => {
30+
require(['../../rh-card/rh-card.umd.js'], () => {
31+
assert.instanceOf(
32+
document.querySelector('rh-card'),
33+
customElements.get('rh-card'),
34+
'the <rh-card> should be an instance of RhCard'
35+
);
36+
done();
37+
});
38+
});
39+
});
40+
</script>
41+
</body>
42+
</html>
43+

‎elements/all/test/module-esm-test.html‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
6+
<script src="/components/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
7+
<script src="/components/web-component-tester/browser.js"></script>
8+
9+
<script type="module" src="../../rh-card/rh-card.js"></script>
10+
11+
<noscript>
12+
<link href="../../rhelement/rhelement-noscript.min.css" rel="stylesheet">
13+
</noscript>
14+
15+
<link href="../../rhelement/rhelement.min.css" rel="stylesheet">
16+
17+
</head>
18+
<body unresolved>
19+
20+
<rh-card>
21+
<h2 slot="header">Card 1</h2>This is rh-card.
22+
<div slot="footer">Text in footer</div>
23+
</rh-card>
24+
25+
<script>
26+
suite("using RHElements as ES Modules", () => {
27+
test('it should upgrade', () => {
28+
assert.instanceOf(
29+
document.querySelector('rh-card'),
30+
customElements.get('rh-card'),
31+
'the <rh-card> should be an instance of RhCard'
32+
);
33+
});
34+
});
35+
</script>
36+
</body>
37+
</html>
38+

‎elements/all/test/module-global-test.html‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
6+
<script src="/components/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
7+
<script src="/components/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
8+
<script src="/components/web-component-tester/browser.js"></script>
9+
10+
<script src="../../rhelement/rhelement.umd.js"></script>
11+
<script src="../../rh-card/rh-card.umd.js"></script>
12+
13+
<noscript>
14+
<link href="../../rhelement/rhelement-noscript.min.css" rel="stylesheet">
15+
</noscript>
16+
17+
<link href="../../rhelement/rhelement.min.css" rel="stylesheet">
18+
19+
</head>
20+
<body unresolved>
21+
22+
<rh-card>
23+
<h2 slot="header">Card 1</h2>This is rh-card.
24+
<div slot="footer">Text in footer</div>
25+
</rh-card>
26+
27+
<script>
28+
suite("using RHElements as Global modules", () => {
29+
test('it should upgrade', () => {
30+
assert.instanceOf(
31+
document.querySelector('rh-card'),
32+
customElements.get('rh-card'),
33+
'the <rh-card> should be an instance of RhCard'
34+
);
35+
});
36+
});
37+
</script>
38+
</body>
39+
</html>
40+
41+

‎elements/cp-themeset/cp-themeset.js.map‎

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎elements/cp-themeset/rollup.config.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
// rollup.config.js
2+
import configFactory from "../../scripts/rollup.config.factory.js";
3+
import rhelementPackage from "./package.json";
4+
5+
export default configFactory(rhelementPackage.rhelement);

‎elements/rh-button/.babelrc‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
{
2-
"presets": [
3-
["env", { "modules": "umd" }]
4-
]
2+
"presets": [["env", { "modules": false }]],
3+
"plugins": ["external-helpers"]
54
}

‎elements/rh-button/demo/index.html‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,9 @@
99
<!-- uncomment the es5-adapter if you're using the umd version -->
1010
<script src="/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
1111
<script src="/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
12-
<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.5/require.min.js"></script>
13-
<script>require(['../rh-button.umd.js'])</script>
12+
13+
<script src='../../rhelement/rhelement.umd.js'></script>
14+
<script src='../rh-button.umd.js'></script>
1415

1516
<style>
1617
input {

‎elements/rh-button/gulpfile.js‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,6 @@ const path = require("path");
22
const fs = require("fs");
33

44
const gulp = require("gulp");
5-
const babel = require("gulp-babel");
6-
const uglify = require("gulp-uglify");
75
const rename = require("gulp-rename");
86
const replace = require("gulp-replace");
97
const stripCssComments = require("strip-css-comments");
@@ -20,8 +18,6 @@ gulp.task("compile", () => {
2018
"$1$2.umd$3"
2119
)
2220
)
23-
.pipe(babel())
24-
.pipe(uglify())
2521
.pipe(
2622
rename({
2723
suffix: ".umd"

0 commit comments

Comments
 (0)