Skip to content

Commit d969796

Browse files
mrginglymusmrginglymus
committed
+angularjs
1 parent 40904ad commit d969796

File tree

8 files changed

+84
-224
lines changed

8 files changed

+84
-224
lines changed

‎libraries/__shared__/tests/src/advanced-tests.js‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -59,45 +59,45 @@ export default function (
5959
describe('events', function () {
6060
it('can declaratively listen to a lowercase DOM event dispatched by a Custom Element', async function () {
6161
this.weight = 2
62-
const { wc, click = wc.click.bind(wc) } = await renderComponentWithDeclarativeEvent.call(this)
62+
const { wc, click = wc.click.bind(wc), root = document } = await renderComponentWithDeclarativeEvent.call(this)
6363
expect(wc).to.exist
64-
let handled = document.querySelector('#lowercase')
64+
let handled = root.querySelector('#lowercase')
6565
expect(handled.textContent).to.eql('false')
6666
await click()
6767
expect(handled.textContent).to.eql('true')
6868
})
6969

7070
it('can declaratively listen to a kebab-case DOM event dispatched by a Custom Element', async function () {
7171
this.weight = 1
72-
const { wc, click = wc.click.bind(wc) } = await renderComponentWithDeclarativeEvent.call(this)
73-
let handled = document.querySelector('#kebab')
72+
const { wc, click = wc.click.bind(wc), root = document } = await renderComponentWithDeclarativeEvent.call(this)
73+
let handled = root.querySelector('#kebab')
7474
expect(handled.textContent).to.eql('false')
7575
await click()
7676
expect(handled.textContent).to.eql('true')
7777
})
7878

7979
it('can declaratively listen to a camelCase DOM event dispatched by a Custom Element', async function () {
8080
this.weight = 1
81-
const { wc, click = wc.click.bind(wc) } = await renderComponentWithDeclarativeEvent.call(this)
82-
let handled = document.querySelector('#camel')
81+
const { wc, click = wc.click.bind(wc), root = document } = await renderComponentWithDeclarativeEvent.call(this)
82+
let handled = root.querySelector('#camel')
8383
expect(handled.textContent).to.eql('false')
8484
await click()
8585
expect(handled.textContent).to.eql('true')
8686
})
8787

8888
it('can declaratively listen to a CAPScase DOM event dispatched by a Custom Element', async function () {
8989
this.weight = 1
90-
const { wc, click = wc.click.bind(wc) } = await renderComponentWithDeclarativeEvent.call(this)
91-
let handled = document.querySelector('#caps')
90+
const { wc, click = wc.click.bind(wc), root = document } = await renderComponentWithDeclarativeEvent.call(this)
91+
let handled = root.querySelector('#caps')
9292
expect(handled.textContent).to.eql('false')
9393
await click()
9494
expect(handled.textContent).to.eql('true')
9595
})
9696

9797
it('can declaratively listen to a PascalCase DOM event dispatched by a Custom Element', async function () {
9898
this.weight = 1
99-
const { wc, click = wc.click.bind(wc) } = await renderComponentWithDeclarativeEvent.call(this)
100-
let handled = document.querySelector('#pascal')
99+
const { wc, click = wc.click.bind(wc), root = document } = await renderComponentWithDeclarativeEvent.call(this)
100+
let handled = root.querySelector('#pascal')
101101
expect(handled.textContent).to.eql('false')
102102
await click()
103103
expect(handled.textContent).to.eql('true')

‎libraries/__shared__/tests/src/basic-tests.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -69,10 +69,10 @@ export default function (
6969

7070
it('can display a Custom Element with children in the Shadow DOM and handle hiding and showing the element', async function () {
7171
this.weight = 3
72-
const { wc, toggle } = await renderComponentWithDifferentViews.call(this);
72+
const { wc, toggle, root = document } = await renderComponentWithDifferentViews.call(this);
7373
expectHasChildren(wc)
7474
await toggle()
75-
const dummy = document.querySelector('#dummy')
75+
const dummy = root.querySelector('#dummy')
7676
expect(dummy).to.exist
7777
expect(dummy.textContent).to.eql('Dummy view')
7878
await toggle()
@@ -106,9 +106,9 @@ export default function (
106106
describe('events', async function () {
107107
it('can imperatively listen to a DOM event dispatched by a Custom Element', async function () {
108108
this.weight = 3
109-
const { wc, click = wc.click.bind(wc) } = await renderComponentWithImperativeEvent.call(this)
109+
const { wc, click = wc.click.bind(wc), root = document } = await renderComponentWithImperativeEvent.call(this)
110110
expect(wc).to.exist
111-
let handled = document.querySelector('#handled')
111+
let handled = root.querySelector('#handled')
112112
expect(handled.textContent).to.eql('false')
113113
await click()
114114
expect(handled.textContent).to.eql('true')

‎libraries/angularjs/karma.conf.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,7 @@ module.exports = function (config) {
6262
extensions: ['.js'],
6363
modules: [
6464
path.resolve(__dirname, '../__shared__/webcomponents/src'),
65+
path.resolve(__dirname, '../__shared__/tests/src'),
6566
path.resolve(__dirname, './node_modules')
6667
]
6768
},

‎libraries/angularjs/src/advanced-tests.js‎

Lines changed: 22 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -1,114 +1,40 @@
1-
import { expect } from "chai";
21
import prodApp from "./app.module";
32

4-
describe("advanced support", () => {
3+
import tests from 'advanced-tests';
54

5+
describe('', function () {
66
beforeEach(angular.mock.module(prodApp));
77

88
let compile;
99
let scope;
1010
let interval;
11+
1112
beforeEach(
1213
inject(($compile, $rootScope, $interval) => {
1314
compile = $compile;
14-
scope = $rootScope.$new();
15+
scope = $rootScope;
1516
interval = $interval;
1617
})
1718
);
1819

19-
describe("attributes and properties", () => {
20-
const prep = el => {
21-
return compile(el)(scope)[0];
20+
function render(component) {
21+
const root = compile(component)(scope)[0];
22+
scope.$apply();
23+
const wc = root.querySelector('#wc');
24+
return { wc, root }
25+
}
26+
27+
tests({
28+
renderComponentWithProperties() {
29+
return render('<comp-with-props>')
30+
},
31+
renderComponentWithDeclarativeEvent() {
32+
const { wc, root } = render('<comp-with-declarative-event>');
33+
function click() {
34+
wc.click();
35+
scope.$digest();
36+
}
37+
return { wc, click, root };
2238
}
23-
24-
it("will pass array data as a property", function() {
25-
this.weight = 2;
26-
let root = prep("<comp-with-props>")
27-
scope.$digest()
28-
let wc = root.querySelector('#wc')
29-
let data = wc.arr;
30-
expect(data).to.eql(['A', 'n', 'g', 'u', 'l', 'a', 'r']);
31-
});
32-
33-
it("will pass object data as a property", function() {
34-
this.weight = 2;
35-
let root = prep("<comp-with-props>")
36-
scope.$digest()
37-
let wc = root.querySelector('#wc')
38-
let data = wc.obj;
39-
expect(data).to.eql({ org: "angular", repo: "angular" });
40-
});
41-
42-
it("will pass object data to a camelCase-named property", function() {
43-
this.weight = 2;
44-
let root = prep("<comp-with-props>")
45-
scope.$digest()
46-
let wc = root.querySelector('#wc')
47-
let data = wc.camelCaseObj;
48-
expect(data).to.eql({ label: "passed" });
49-
});
50-
});
51-
52-
describe("events", () => {
53-
it("can declaratively listen to a lowercase DOM event dispatched by a Custom Element", function() {
54-
this.weight = 2;
55-
const root = compile("<comp-with-declarative-event>")(scope)[0];
56-
scope.$digest();
57-
let wc = root.querySelector("#wc");
58-
let handled = root.querySelector("#lowercase");
59-
expect(handled.textContent).to.eql("false");
60-
wc.click();
61-
scope.$digest();
62-
expect(handled.textContent).to.eql("true");
63-
});
64-
65-
it("can declaratively listen to a kebab-case DOM event dispatched by a Custom Element", function() {
66-
this.weight = 1;
67-
const root = compile("<comp-with-declarative-event>")(scope)[0];
68-
scope.$digest();
69-
let wc = root.querySelector("#wc");
70-
let handled = root.querySelector("#kebab");
71-
expect(handled.textContent).to.eql("false");
72-
wc.click();
73-
scope.$digest();
74-
expect(handled.textContent).to.eql("true");
75-
});
76-
77-
it("can declaratively listen to a camelCase DOM event dispatched by a Custom Element", function() {
78-
this.weight = 1;
79-
const root = compile("<comp-with-declarative-event>")(scope)[0];
80-
scope.$digest();
81-
let wc = root.querySelector("#wc");
82-
let handled = root.querySelector("#camel");
83-
expect(handled.textContent).to.eql("false");
84-
wc.click();
85-
scope.$digest();
86-
expect(handled.textContent).to.eql("true");
87-
});
88-
89-
it("can declaratively listen to a CAPScase DOM event dispatched by a Custom Element", function() {
90-
this.weight = 1;
91-
const root = compile("<comp-with-declarative-event>")(scope)[0];
92-
scope.$digest();
93-
let wc = root.querySelector("#wc");
94-
let handled = root.querySelector("#caps");
95-
expect(handled.textContent).to.eql("false");
96-
wc.click();
97-
scope.$digest();
98-
expect(handled.textContent).to.eql("true");
99-
});
100-
101-
it("can declaratively listen to a PascalCase DOM event dispatched by a Custom Element", function() {
102-
this.weight = 1;
103-
const root = compile("<comp-with-declarative-event>")(scope)[0];
104-
scope.$digest();
105-
let wc = root.querySelector("#wc");
106-
let handled = root.querySelector("#pascal");
107-
expect(handled.textContent).to.eql("false");
108-
wc.click();
109-
scope.$digest();
110-
expect(handled.textContent).to.eql("true");
111-
});
11239
});
113-
11440
});

‎libraries/angularjs/src/basic-tests.js‎

Lines changed: 40 additions & 107 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,15 @@
1-
import { expect } from "chai";
1+
import {expect} from "chai";
22
import prodApp from "./app.module";
33

4-
describe("basic support", () => {
4+
import tests from 'basic-tests';
55

6+
describe('', function () {
67
beforeEach(angular.mock.module(prodApp));
78

89
let compile;
910
let scope;
1011
let interval;
12+
1113
beforeEach(
1214
inject(($compile, $rootScope, $interval) => {
1315
compile = $compile;
@@ -16,115 +18,46 @@ describe("basic support", () => {
1618
})
1719
);
1820

19-
describe("no children", () => {
20-
it("can display a CE with no children", function() {
21-
this.weight = 3;
22-
const comp = compile("<comp-no-children>")(scope);
23-
const wc = comp[0].querySelector("ce-without-children");
24-
expect(wc).to.exist;
25-
});
26-
});
27-
28-
describe("with children", () => {
29-
const prep = el => {
30-
return compile(el)(scope)[0];
31-
};
32-
function expectHasChildren(wc) {
33-
expect(wc).to.exist;
34-
let shadowRoot = wc.shadowRoot;
35-
let heading = shadowRoot.querySelector("h1");
36-
expect(heading).to.exist;
37-
expect(heading.textContent).to.eql("Test h1");
38-
let paragraph = shadowRoot.querySelector("p");
39-
expect(paragraph).to.exist;
40-
expect(paragraph.textContent).to.eql("Test p");
41-
}
42-
43-
it("can display a Custom Element with children in a Shadow Root", function() {
44-
this.weight = 3;
45-
const root = prep("<comp-with-children>");
46-
let wc = root.querySelector("#wc");
47-
expectHasChildren(wc);
48-
});
49-
50-
it("can display a Custom Element with children in a Shadow Root and pass in Light DOM children", function() {
51-
this.weight = 3;
52-
const root = prep("<comp-with-children-rerender>");
21+
function render(component) {
22+
const root = compile(component)(scope)[0];
23+
scope.$apply();
24+
const wc = root.querySelector('#wc');
25+
return { wc, root }
26+
}
27+
28+
tests({
29+
renderComponentWithoutChildren() {
30+
return render('<comp-no-children>')
31+
},
32+
renderComponentWithChildren() {
33+
return render('<comp-with-children>')
34+
},
35+
renderComponentWithChildrenRerender() {
36+
const result = render('<comp-with-children-rerender>');
5337
interval.flush(1000);
54-
let wc = root.querySelector("#wc");
55-
expectHasChildren(wc);
56-
expect(wc.textContent.includes("2")).to.be.true;
57-
});
58-
59-
it("can display a Custom Element with children in a Shadow Root and handle hiding and showing the element", function() {
60-
this.weight = 3;
61-
scope.showWc = true;
62-
const root = prep(`<comp-with-different-views show-wc="showWc">`);
63-
scope.$apply();
64-
let wc = root.querySelector("#wc");
65-
expectHasChildren(wc);
66-
67-
scope.showWc = false;
68-
scope.$apply();
69-
70-
let dummy = root.querySelector("#dummy");
71-
expect(dummy).to.exist;
72-
expect(dummy.textContent).to.eql("Dummy view");
73-
38+
return result;
39+
},
40+
renderComponentWithDifferentViews() {
7441
scope.showWc = true;
75-
scope.$apply();
42+
const { wc, root } = render('<comp-with-different-views show-wc="showWc">');
7643

77-
wc = root.querySelector("#wc");
78-
expectHasChildren(wc);
79-
});
80-
});
81-
82-
describe("attributes and properties", function() {
83-
let wc;
84-
beforeEach(() => {
85-
const comp = compile("<comp-with-props>")(scope);
86-
scope.$digest();
87-
88-
wc = comp[0].querySelector("#wc");
89-
});
90-
91-
it("will pass boolean data as either an attribute or a property", function() {
92-
this.weight = 3;
93-
let data = wc.bool || wc.hasAttribute("bool");
94-
expect(data).to.be.true;
95-
// Extra test to see if AngularJS just left its binding syntax on
96-
// the attribute and didn't actually set anything :P
97-
if (!wc.bool) {
98-
data = wc.getAttribute("bool");
99-
expect(data.includes("{{")).to.be.false;
44+
function toggle() {
45+
scope.showWc = !scope.showWc;
46+
scope.$apply();
10047
}
101-
});
102-
103-
it("will pass numeric data as either an attribute or a property", function() {
104-
this.weight = 3;
105-
let data = wc.num || wc.getAttribute("num");
106-
expect(parseInt(data, 10)).to.eql(42);
107-
});
10848

109-
it("will pass string data as either an attribute or a property", function() {
110-
this.weight = 3;
111-
let data = wc.str || wc.getAttribute("str");
112-
expect(data).to.eql("Angular");
113-
});
114-
});
115-
116-
describe("events", () => {
117-
it("can imperatively listen to a DOM event dispatched by a Custom Element", function() {
118-
this.weight = 3;
119-
const root = compile("<comp-with-imperative-event>")(scope)[0];
120-
scope.$digest();
121-
let wc = root.querySelector("#wc");
122-
let handled = root.querySelector("#handled");
123-
expect(handled.textContent).to.eql("false");
124-
wc.click();
125-
scope.$digest();
126-
expect(handled.textContent).to.eql("true");
127-
});
49+
return { wc, toggle, root }
50+
},
51+
renderComponentWithProperties() {
52+
return render('<comp-with-props>')
53+
},
54+
renderComponentWithImperativeEvent() {
55+
const { wc, root } = render('<comp-with-imperative-event>');
56+
function click() {
57+
wc.click();
58+
scope.$digest();
59+
}
60+
return { wc, click, root };
61+
}
12862
});
129-
13063
});

0 commit comments

Comments
 (0)