Skip to content

Commit a8183ec

Browse files
author
MatiasWorker
committed
fix: test
1 parent afe1435 commit a8183ec

File tree

13 files changed

+184
-131
lines changed

13 files changed

+184
-131
lines changed

package-lock.json

Lines changed: 5 additions & 12 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { c, useEvent, useRef } from "atomico";
2+
import { useKeyboard } from "../src";
3+
4+
export const Element = c(() => {
5+
const ref = useRef();
6+
const dispatch = useEvent("matchKeys");
7+
useKeyboard(ref, ["KeyA", "KeyQ"], dispatch);
8+
return (
9+
<host>
10+
<input ref={ref} />
11+
</host>
12+
);
13+
});
14+
15+
customElements.define("test-element-use-keyboard-1", Element);
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"extends": "@atomico/tsconfig/base.json",
3+
"include": ["**/*"],
4+
"compilerOptions": {
5+
"outDir": "dist",
6+
"emitDeclarationOnly": false,
7+
"moduleResolution": "Node",
8+
"module": "ESNext"
9+
}
10+
}
Lines changed: 39 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,40 @@
1-
import { it, expect } from "vitest";
2-
import { createHooks } from "atomico/test-hooks";
3-
import { useKeyboard } from "../src/";
4-
5-
it("useKeyboard", () => {
6-
const ref = { current: document };
7-
const hooks = createHooks();
8-
const capture = [];
9-
hooks.load(() => {
10-
useKeyboard(ref, ["KeyA", "KeyQ"], (event) => {
11-
capture.push(event);
12-
});
13-
});
14-
15-
hooks.cleanEffects()()();
16-
17-
ref.current.dispatchEvent(
18-
new KeyboardEvent("keydown", { code: "KeyQ", key: "1" }),
19-
);
20-
21-
ref.current.dispatchEvent(
22-
new KeyboardEvent("keydown", { code: "KeyA", key: "1" }),
23-
);
24-
25-
ref.current.dispatchEvent(
26-
new KeyboardEvent("keyup", { code: "KeyQ", key: "1" }),
27-
);
28-
29-
ref.current.dispatchEvent(
30-
new KeyboardEvent("keyup", { code: "KeyA", key: "1" }),
31-
);
32-
33-
ref.current.dispatchEvent(
34-
new KeyboardEvent("keydown", { code: "KeyA", key: "2" }),
35-
);
36-
ref.current.dispatchEvent(
37-
new KeyboardEvent("keydown", { code: "KeyQ", key: "2" }),
38-
);
39-
40-
expect(capture.length).to.equal(1);
41-
42-
const [event] = capture;
43-
44-
// The captured event defines key as 2, if it is 1 the hook ignores the convination
45-
expect(event.key).to.equal("2");
1+
import { asyncEventListener } from "atomico/test-dom";
2+
import { it } from "vitest";
3+
import { Element } from "./element";
4+
5+
it("useKeyboard", async () => {
6+
const element = new Element();
7+
8+
document.body.append(element);
9+
10+
await element.updated;
11+
12+
const input = element.querySelector("input");
13+
14+
setTimeout(() => {
15+
input.dispatchEvent(
16+
new KeyboardEvent("keydown", { code: "KeyQ", key: "1" }),
17+
);
18+
19+
input.dispatchEvent(
20+
new KeyboardEvent("keydown", { code: "KeyA", key: "1" }),
21+
);
22+
23+
input.dispatchEvent(
24+
new KeyboardEvent("keyup", { code: "KeyQ", key: "1" }),
25+
);
26+
27+
input.dispatchEvent(
28+
new KeyboardEvent("keyup", { code: "KeyA", key: "1" }),
29+
);
30+
31+
input.dispatchEvent(
32+
new KeyboardEvent("keydown", { code: "KeyA", key: "2" }),
33+
);
34+
input.dispatchEvent(
35+
new KeyboardEvent("keydown", { code: "KeyQ", key: "2" }),
36+
);
37+
}, 100);
38+
39+
await asyncEventListener(element, "matchKeys");
4640
});
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { c, useEvent, useRef } from "atomico";
2+
import { useListener } from "../src";
3+
4+
export const Element = c(() => {
5+
const host = useRef();
6+
const dispatch = useEvent("fromUseListener");
7+
useListener(host, "click", dispatch);
8+
return <host ref={host}></host>;
9+
});
10+
11+
customElements.define("test-element-use-listener-1", Element);
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"extends": "@atomico/tsconfig/base.json",
3+
"include": ["**/*"],
4+
"compilerOptions": {
5+
"outDir": "dist",
6+
"emitDeclarationOnly": false,
7+
"moduleResolution": "Node",
8+
"module": "ESNext"
9+
}
10+
}
Lines changed: 13 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,17 @@
1-
import { it, expect } from "vitest";
2-
import { useHost } from "atomico";
3-
import { createHooks } from "atomico/test-hooks";
4-
import { useListener } from "../src";
1+
import { it } from "vitest";
2+
import { Element } from "./element";
3+
import { asyncEventListener } from "atomico/test-dom";
54

6-
it("useListener", () =>
7-
new Promise((done) => {
8-
const host = document.createElement("div");
9-
const hooks = createHooks(null, host);
10-
const eventName = "customEvent";
5+
it("useListener", async () => {
6+
const element = new Element();
117

12-
hooks.load(() => {
13-
const host = useHost();
14-
useListener(host, eventName, (event) => {
15-
expect(event).to.be.instanceof(CustomEvent);
16-
expect(event.type).to.equal(eventName);
17-
done();
18-
});
19-
});
8+
document.body.append(element);
209

21-
hooks.cleanEffects()()();
10+
await element.updated;
2211

23-
host.dispatchEvent(new CustomEvent(eventName));
24-
}));
12+
setTimeout(() => {
13+
element.dispatchEvent(new Event("click"));
14+
}, 100);
15+
16+
await asyncEventListener(element, "fromUseListener");
17+
});
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { c, useRef } from "atomico";
2+
import { useReflectEvent } from "../src";
3+
4+
export const Element = c(() => {
5+
const ref1 = useRef();
6+
const ref2 = useRef();
7+
useReflectEvent(ref1, ref2, "click");
8+
return (
9+
<host>
10+
<button ref={ref1}>1</button>
11+
<button ref={ref2}>2</button>
12+
</host>
13+
);
14+
});
15+
16+
customElements.define("test-element-use-reflect-event-1", Element);
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"extends": "@atomico/tsconfig/base.json",
3+
"include": ["**/*"],
4+
"compilerOptions": {
5+
"outDir": "dist",
6+
"emitDeclarationOnly": false,
7+
"moduleResolution": "Node",
8+
"module": "ESNext"
9+
}
10+
}
Lines changed: 14 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,20 @@
11
import { expect, it } from "vitest";
2-
import { useHost } from "atomico";
3-
import { createHooks } from "atomico/test-hooks";
4-
import { useReflectEvent } from "../src";
2+
import { Element } from "./element";
3+
import { asyncEventListener } from "atomico/test-dom";
54

6-
it("useReflectEvent", () =>
7-
new Promise((done) => {
8-
const host = document.createElement("div");
9-
const hooks = createHooks(null, host);
10-
const refTo = { current: document.createElement("div") };
5+
it("useReflectEvent", async () => {
6+
const element = new Element();
7+
document.body.append(element);
118

12-
hooks.load(() => {
13-
const refFrom = useHost();
14-
useReflectEvent(refFrom, refTo, "click");
15-
});
9+
await element.updated;
1610

17-
hooks.cleanEffects()()();
11+
const [button1, button2] = element.querySelectorAll("button");
1812

19-
refTo.current.addEventListener("click", (event) => {
20-
done();
21-
expect(event).to.be.an.instanceof(Event);
22-
});
13+
setTimeout(() => {
14+
button1.dispatchEvent(new Event("click"));
15+
}, 100);
2316

24-
host.click();
25-
}));
17+
const event = await asyncEventListener(button2, "click");
18+
19+
expect(event.type).toEqual("click");
20+
});

0 commit comments

Comments
 (0)