Skip to content

Commit f12a328

Browse files
authored
Add tests (#882)
* Remove unused get_widget_class option * Add test for method with underscore * Spelling * Test documentScrollParent * Test checkVerticalScrolling * Test containerScrollParent * Correctly load jquery in test_scroll_container.html * Fix getScrollParentBottom
1 parent 5dbc39b commit f12a328

File tree

7 files changed

+320
-44
lines changed

7 files changed

+320
-44
lines changed

devserver/test_scroll_container.html

Lines changed: 38 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,41 @@
11
<!DOCTYPE html>
22
<html>
3-
<head>
4-
<meta charset="utf-8" />
5-
<title>JqTree devserver</title>
6-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7-
<meta
8-
name="description"
9-
content="JqTree is a jQuery widget for displaying a tree structure in html"
10-
/>
11-
<link rel="stylesheet" href="/jqtree.css" />
12-
<style>
13-
body {
14-
font-size: 20px;
15-
}
16-
ul.jqtree-tree ul.jqtree_common {
17-
margin-left: 128px;
18-
}
19-
#scroll-container {
20-
height: 200px;
21-
width: 400px;
22-
overflow-y: scroll;
23-
user-select: none;
24-
background-color: #eee;
25-
margin: 128px;
26-
padding: 8px;
27-
}
28-
</style>
29-
</head>
30-
<body>
31-
<div id="scroll-container">
32-
<div id="tree1"></div>
33-
</div>
34-
</body>
35-
<script src="/bower_components/jquery/dist/jquery.min.js"></script>
36-
<script src="/tree.jquery.js"></script>
37-
<script src="/example_data.js"></script>
38-
<script src="/devserver_scroll.js"></script>
3+
4+
<head>
5+
<meta charset="utf-8" />
6+
<title>JqTree devserver</title>
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
8+
<meta name="description" content="JqTree is a jQuery widget for displaying a tree structure in html" />
9+
<link rel="stylesheet" href="/jqtree.css" />
10+
<style>
11+
body {
12+
font-size: 20px;
13+
}
14+
15+
ul.jqtree-tree ul.jqtree_common {
16+
margin-left: 128px;
17+
}
18+
19+
#scroll-container {
20+
height: 200px;
21+
width: 400px;
22+
overflow-y: scroll;
23+
user-select: none;
24+
background-color: #eee;
25+
margin: 128px;
26+
padding: 8px;
27+
}
28+
</style>
29+
</head>
30+
31+
<body>
32+
<div id="scroll-container">
33+
<div id="tree1"></div>
34+
</div>
35+
</body>
36+
<script src="/vendor/jquery.min.js"></script>
37+
<script src="/tree.jquery.js"></script>
38+
<script src="/example_data.js"></script>
39+
<script src="/devserver_scroll.js"></script>
40+
3941
</html>

src/scrollHandler/containerScrollParent.ts

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { ScrollParent } from "./types";
22

3-
import { getElementPosition, getOffsetTop } from '../util'
3+
import { getElementPosition, getOffsetTop } from "../util";
44

55
type HorizontalScrollDirection = "left" | "right";
66
interface Params {
@@ -85,8 +85,9 @@ export default class ContainerScrollParent implements ScrollParent {
8585
pageX: number,
8686
): HorizontalScrollDirection | undefined {
8787
const scrollParentOffset = getElementPosition(this.container);
88+
const containerWidth = this.container.getBoundingClientRect().width;
8889

89-
const rightEdge = scrollParentOffset.left + this.container.clientWidth;
90+
const rightEdge = scrollParentOffset.left + containerWidth;
9091
const leftEdge = scrollParentOffset.left;
9192
const isNearRightEdge = pageX > rightEdge - 20;
9293
const isNearLeftEdge = pageX < leftEdge + 20;
@@ -116,15 +117,18 @@ export default class ContainerScrollParent implements ScrollParent {
116117

117118
private getScrollParentBottom() {
118119
if (this.scrollParentBottom == null) {
119-
this.scrollParentBottom = this.getScrollParentTop() + this.container.clientHeight;
120+
const containerHeight =
121+
this.container.getBoundingClientRect().height;
122+
this.scrollParentBottom =
123+
this.getScrollParentTop() + containerHeight;
120124
}
121125

122126
return this.scrollParentBottom;
123127
}
124128

125129
private getScrollParentTop() {
126130
if (this.scrollParentTop == null) {
127-
this.scrollParentTop = getOffsetTop(this.container)
131+
this.scrollParentTop = getOffsetTop(this.container);
128132
}
129133

130134
return this.scrollParentTop;

src/simple.widget.ts

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -87,11 +87,9 @@ const register = (widgetClass: unknown, widgetName: string): void => {
8787
} else if (typeof argument1 === "string" && argument1[0] !== "_") {
8888
const functionName = argument1;
8989

90-
if (functionName === "destroy") {
90+
if (argument1 === "destroy") {
9191
destroyWidget(this);
9292
return undefined;
93-
} else if (functionName === "get_widget_class") {
94-
return widgetClass;
9593
} else {
9694
return callFunction(this, functionName, args);
9795
}

src/test/jqTree/methods.test.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1535,3 +1535,11 @@ describe("updateNode", () => {
15351535
});
15361536
});
15371537
});
1538+
1539+
it("returns undefined when calling with a string that starts with an underscore", () => {
1540+
const $tree = $("#tree1");
1541+
1542+
const tree = $tree.tree as unknown as (name: string) => undefined;
1543+
const result = tree("_test"); // eslint-disable-line @typescript-eslint/no-confusing-void-expression
1544+
expect(result).toBeUndefined();
1545+
});
Lines changed: 149 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,149 @@
1+
import { mockElementBoundingClientRect } from "jsdom-testing-mocks";
2+
3+
import ContainerScrollParent from "../../scrollHandler/containerScrollParent";
4+
5+
afterEach(() => {
6+
jest.useRealTimers();
7+
});
8+
9+
describe("checkHorizontalScrolling", () => {
10+
it("scrolls to the left when pageX is near the left edge", () => {
11+
jest.useFakeTimers();
12+
13+
const refreshHitAreas = jest.fn();
14+
const container = document.createElement("div");
15+
16+
const scrollBy = jest.fn();
17+
container.scrollBy = scrollBy;
18+
19+
mockElementBoundingClientRect(container, {
20+
height: 100,
21+
width: 100,
22+
x: 10,
23+
y: 10,
24+
});
25+
26+
const containerScrollParent = new ContainerScrollParent({
27+
container,
28+
refreshHitAreas,
29+
});
30+
31+
containerScrollParent.checkHorizontalScrolling(20);
32+
33+
expect(scrollBy).not.toHaveBeenCalled();
34+
jest.advanceTimersByTime(50);
35+
expect(scrollBy).toHaveBeenCalledWith({
36+
behavior: "instant",
37+
left: -20,
38+
top: 0,
39+
});
40+
});
41+
42+
it("stops scrolling when pageX is moved from the left edge", () => {
43+
jest.useFakeTimers();
44+
45+
const refreshHitAreas = jest.fn();
46+
const container = document.createElement("div");
47+
48+
const scrollBy = jest.fn();
49+
container.scrollBy = scrollBy;
50+
51+
mockElementBoundingClientRect(container, {
52+
height: 100,
53+
width: 100,
54+
x: 10,
55+
y: 10,
56+
});
57+
58+
const containerScrollParent = new ContainerScrollParent({
59+
container,
60+
refreshHitAreas,
61+
});
62+
63+
containerScrollParent.checkHorizontalScrolling(20);
64+
65+
expect(scrollBy).not.toHaveBeenCalled();
66+
jest.advanceTimersByTime(50);
67+
expect(scrollBy).toHaveBeenCalledWith({
68+
behavior: "instant",
69+
left: -20,
70+
top: 0,
71+
});
72+
73+
containerScrollParent.checkHorizontalScrolling(50);
74+
jest.advanceTimersByTime(50);
75+
76+
expect(scrollBy).toHaveBeenCalledTimes(1);
77+
});
78+
});
79+
80+
describe("checkVerticalScrolling", () => {
81+
it("scrolls to the top when pageY is near the top edge", () => {
82+
jest.useFakeTimers();
83+
84+
const refreshHitAreas = jest.fn();
85+
const container = document.createElement("div");
86+
87+
const scrollBy = jest.fn();
88+
container.scrollBy = scrollBy;
89+
90+
mockElementBoundingClientRect(container, {
91+
height: 100,
92+
width: 100,
93+
x: 10,
94+
y: 10,
95+
});
96+
97+
const containerScrollParent = new ContainerScrollParent({
98+
container,
99+
refreshHitAreas,
100+
});
101+
102+
containerScrollParent.checkVerticalScrolling(9);
103+
104+
expect(scrollBy).not.toHaveBeenCalled();
105+
jest.advanceTimersByTime(50);
106+
expect(scrollBy).toHaveBeenCalledWith({
107+
behavior: "instant",
108+
left: 0,
109+
top: -20,
110+
});
111+
});
112+
113+
it("stops scrolling when pageX is moved from the left edge", () => {
114+
jest.useFakeTimers();
115+
116+
const refreshHitAreas = jest.fn();
117+
const container = document.createElement("div");
118+
119+
const scrollBy = jest.fn();
120+
container.scrollBy = scrollBy;
121+
122+
mockElementBoundingClientRect(container, {
123+
height: 100,
124+
width: 100,
125+
x: 10,
126+
y: 10,
127+
});
128+
129+
const containerScrollParent = new ContainerScrollParent({
130+
container,
131+
refreshHitAreas,
132+
});
133+
134+
containerScrollParent.checkVerticalScrolling(9);
135+
136+
expect(scrollBy).not.toHaveBeenCalled();
137+
jest.advanceTimersByTime(50);
138+
expect(scrollBy).toHaveBeenCalledWith({
139+
behavior: "instant",
140+
left: 0,
141+
top: -20,
142+
});
143+
144+
containerScrollParent.checkVerticalScrolling(50);
145+
jest.advanceTimersByTime(50);
146+
147+
expect(scrollBy).toHaveBeenCalledTimes(1);
148+
});
149+
});

0 commit comments

Comments
 (0)