Skip to content

Commit 40904ad

Browse files
mrginglymusmrginglymus
committed
+vue
1 parent 1b04f61 commit 40904ad

File tree

6 files changed

+73
-265
lines changed

6 files changed

+73
-265
lines changed

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

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ export default function (
6363
expect(wc).to.exist
6464
let handled = document.querySelector('#lowercase')
6565
expect(handled.textContent).to.eql('false')
66-
click()
66+
await click()
6767
expect(handled.textContent).to.eql('true')
6868
})
6969

@@ -72,7 +72,7 @@ export default function (
7272
const { wc, click = wc.click.bind(wc) } = await renderComponentWithDeclarativeEvent.call(this)
7373
let handled = document.querySelector('#kebab')
7474
expect(handled.textContent).to.eql('false')
75-
click()
75+
await click()
7676
expect(handled.textContent).to.eql('true')
7777
})
7878

@@ -81,7 +81,7 @@ export default function (
8181
const { wc, click = wc.click.bind(wc) } = await renderComponentWithDeclarativeEvent.call(this)
8282
let handled = document.querySelector('#camel')
8383
expect(handled.textContent).to.eql('false')
84-
click()
84+
await click()
8585
expect(handled.textContent).to.eql('true')
8686
})
8787

@@ -90,7 +90,7 @@ export default function (
9090
const { wc, click = wc.click.bind(wc) } = await renderComponentWithDeclarativeEvent.call(this)
9191
let handled = document.querySelector('#caps')
9292
expect(handled.textContent).to.eql('false')
93-
click()
93+
await click()
9494
expect(handled.textContent).to.eql('true')
9595
})
9696

@@ -99,7 +99,7 @@ export default function (
9999
const { wc, click = wc.click.bind(wc) } = await renderComponentWithDeclarativeEvent.call(this)
100100
let handled = document.querySelector('#pascal')
101101
expect(handled.textContent).to.eql('false')
102-
click()
102+
await click()
103103
expect(handled.textContent).to.eql('true')
104104
})
105105
})

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

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -71,11 +71,11 @@ export default function (
7171
this.weight = 3
7272
const { wc, toggle } = await renderComponentWithDifferentViews.call(this);
7373
expectHasChildren(wc)
74-
toggle()
74+
await toggle()
7575
const dummy = document.querySelector('#dummy')
7676
expect(dummy).to.exist
7777
expect(dummy.textContent).to.eql('Dummy view')
78-
toggle()
78+
await toggle()
7979
expectHasChildren(wc)
8080
})
8181
})
@@ -110,7 +110,7 @@ export default function (
110110
expect(wc).to.exist
111111
let handled = document.querySelector('#handled')
112112
expect(handled.textContent).to.eql('false')
113-
click()
113+
await click()
114114
expect(handled.textContent).to.eql('true')
115115
})
116116
})

‎libraries/vue/karma.conf.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@ module.exports = function(config) {
6161
resolve: {
6262
modules: [
6363
path.resolve(__dirname, '../__shared__/webcomponents/src'),
64+
path.resolve(__dirname, '../__shared__/tests/src'),
6465
path.resolve(__dirname, './node_modules')
6566
],
6667
alias: {

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

Lines changed: 19 additions & 109 deletions
Original file line numberDiff line numberDiff line change
@@ -16,17 +16,8 @@
1616
*/
1717

1818
import {createApp, nextTick} from 'vue';
19-
import {
20-
ComponentWithoutChildren,
21-
ComponentWithChildren,
22-
ComponentWithChildrenRerender,
23-
ComponentWithDifferentViews,
24-
ComponentWithProperties,
25-
ComponentWithUnregistered,
26-
ComponentWithImperativeEvent,
27-
ComponentWithDeclarativeEvent
28-
} from "./components";
29-
import { expect } from "chai";
19+
import {ComponentWithDeclarativeEvent, ComponentWithProperties} from "./components";
20+
import tests from 'advanced-tests';
3021

3122
const isCustomElement = (tagName) => {
3223
return window.customElements.get(tagName) !== undefined;
@@ -48,106 +39,25 @@ afterEach(function() {
4839
scratch = null;
4940
});
5041

51-
describe("advanced support", function() {
5242

53-
describe("attributes and properties", function() {
54-
it("will pass array data as a property", function() {
55-
this.weight = 2;
56-
const app = createApp(ComponentWithProperties)
57-
app.config.compilerOptions.isCustomElement = isCustomElement;
58-
app.mount(scratch);
59-
const wc = scratch.querySelector("#wc");
60-
const data = wc.arr;
61-
expect(data).to.eql(["V", "u", "e"]);
62-
});
63-
64-
it("will pass object data as a property", function() {
65-
this.weight = 2;
66-
const app = createApp(ComponentWithProperties)
67-
app.config.compilerOptions.isCustomElement = isCustomElement;
68-
app.mount(scratch);
69-
const wc = scratch.querySelector("#wc");
70-
const data = wc.obj;
71-
expect(data).to.eql({ org: "vuejs", repo: "vue" });
72-
});
73-
74-
it("will pass object data to a camelCase-named property", function() {
75-
this.weight = 2;
76-
const app = createApp(ComponentWithProperties)
77-
app.config.compilerOptions.isCustomElement = isCustomElement;
78-
app.mount(scratch);
79-
const wc = scratch.querySelector("#wc");
80-
const data = wc.camelCaseObj;
81-
expect(data).to.eql({ label: "passed" });
82-
});
83-
84-
});
85-
86-
describe("events", function() {
87-
it("can declaratively listen to a lowercase DOM event dispatched by a Custom Element", async function() {
88-
this.weight = 2;
89-
const app = createApp(ComponentWithDeclarativeEvent)
90-
app.config.compilerOptions.isCustomElement = isCustomElement;
91-
app.mount(scratch);
92-
const wc = scratch.querySelector("#wc");
93-
const handled = scratch.querySelector("#lowercase");
94-
expect(handled.textContent).to.eql("false");
95-
wc.click();
96-
await nextTick();
97-
expect(handled.textContent).to.eql("true");
98-
});
99-
100-
it("can declaratively listen to a kebab-case DOM event dispatched by a Custom Element", async function() {
101-
this.weight = 1;
102-
const app = createApp(ComponentWithDeclarativeEvent)
103-
app.config.compilerOptions.isCustomElement = isCustomElement;
104-
app.mount(scratch);
105-
const wc = scratch.querySelector("#wc");
106-
const handled = scratch.querySelector("#kebab");
107-
expect(handled.textContent).to.eql("false");
108-
wc.click();
109-
await nextTick();
110-
expect(handled.textContent).to.eql("true");
111-
});
112-
113-
it("can declaratively listen to a camelCase DOM event dispatched by a Custom Element", async function() {
114-
this.weight = 1;
115-
const app = createApp(ComponentWithDeclarativeEvent)
116-
app.config.compilerOptions.isCustomElement = isCustomElement;
117-
app.mount(scratch);
118-
const wc = scratch.querySelector("#wc");
119-
const handled = scratch.querySelector("#camel");
120-
expect(handled.textContent).to.eql("false");
121-
wc.click();
122-
await nextTick();
123-
expect(handled.textContent).to.eql("true");
124-
});
125-
126-
it("can declaratively listen to a CAPScase DOM event dispatched by a Custom Element", async function() {
127-
this.weight = 1;
128-
const app = createApp(ComponentWithDeclarativeEvent)
129-
app.config.compilerOptions.isCustomElement = isCustomElement;
130-
app.mount(scratch);
131-
const wc = scratch.querySelector("#wc");
132-
const handled = scratch.querySelector("#caps");
133-
expect(handled.textContent).to.eql("false");
134-
wc.click();
135-
await nextTick();
136-
expect(handled.textContent).to.eql("true");
137-
});
43+
function render(Component) {
44+
const app = createApp(Component)
45+
app.config.compilerOptions.isCustomElement = isCustomElement;
46+
app.mount(scratch);
47+
const wc = scratch.querySelector("#wc");
48+
return {wc}
49+
}
13850

139-
it("can declaratively listen to a PascalCase DOM event dispatched by a Custom Element", async function() {
140-
this.weight = 1;
141-
const app = createApp(ComponentWithDeclarativeEvent)
142-
app.config.compilerOptions.isCustomElement = isCustomElement;
143-
app.mount(scratch);
144-
const wc = scratch.querySelector("#wc");
145-
const handled = scratch.querySelector("#pascal");
146-
expect(handled.textContent).to.eql("false");
51+
tests({
52+
renderComponentWithProperties() {
53+
return render(ComponentWithProperties);
54+
},
55+
renderComponentWithDeclarativeEvent() {
56+
const { wc } = render(ComponentWithDeclarativeEvent);
57+
async function click() {
14758
wc.click();
14859
await nextTick();
149-
expect(handled.textContent).to.eql("true");
150-
});
151-
});
152-
60+
}
61+
return { wc, click }
62+
}
15363
});

0 commit comments

Comments
 (0)