Skip to content

Commit 74a8a99

Browse files
just-borisjust-boris
committed
add jest dom dependency
1 parent 167acfe commit 74a8a99

20 files changed

+427
-72
lines changed

‎package-lock.json

+333
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
"test:visual": "run-p -r preview test:visual:vitest",
1818
"test:visual:vitest": "vitest run --config vite.e2e-visual.config.js",
1919
"test:visual:update": "UPDATE_SCREENSHOTS=true npm run test:visual",
20-
"pretest": "tsc -p tsconfig.test.json",
20+
"pretest": "tsc -p tsconfig.unit.json && tsc -p tsconfig.e2e.json",
2121
"test": "run-s lint test:unit test:functional",
2222
"preview": "vite preview",
2323
"start": "run-p start:server start:watch:ts start:watch:css",
@@ -64,6 +64,7 @@
6464
"@cloudscape-design/test-utils-converter": "^1.0.0",
6565
"@cloudscape-design/theming-build": "^1",
6666
"@juggle/resize-observer": "^3.4.0",
67+
"@testing-library/jest-dom": "^5.16.5",
6768
"@testing-library/react": "^13.4.0",
6869
"@types/jest-image-snapshot": "^6.1.0",
6970
"@types/lodash": "^4.14.191",

‎pages/pages.ts

-2
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,8 @@ import { lazy } from "react";
55
const pagesRaw = import.meta.glob("./**/*.page.tsx");
66
const pageIdRegex = /([\w-/]+)\.page\.tsx/;
77
const getPage = (path: string) => path.match(pageIdRegex)![1];
8-
const getRoute = (page: string) => `/#${page}`;
98

109
export const pages = Object.keys(pagesRaw).map(getPage);
11-
export const routes = pages.map(getRoute);
1210

1311
type ComponentFactory = Parameters<typeof lazy>[0];
1412

‎src/__tests__/setup.ts

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2+
// SPDX-License-Identifier: Apache-2.0
3+
4+
// type-only import, because in runtime it tries to access Jest globals, which do not exist
5+
/// <reference types="@testing-library/jest-dom" />
6+
import matchers from "@testing-library/jest-dom/matchers";
7+
import { expect } from "vitest";
8+
9+
expect.extend(matchers);

‎src/board/utils/__tests__/layout.test.ts

+1
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ function createMockTransition(
1515
): Transition<null> {
1616
return {
1717
operation,
18+
acquiredItem: null,
1819
interactionType: "keyboard",
1920
itemsLayout,
2021
insertionDirection: null,

‎src/board/utils/__tests__/path.test.ts

+3-6
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,7 @@ import { appendMovePath, appendResizePath, normalizeInsertionPath } from "../pat
88

99
describe("normalizeInsertionPath", () => {
1010
test("keeps path unchanged if empty", () => {
11-
const path = [];
12-
expect(normalizeInsertionPath(path, "right", 4, 1)).toEqual(path);
11+
expect(normalizeInsertionPath([], "right", 4, 1)).toEqual([]);
1312
});
1413

1514
test("keeps path unchanged if it has a single step", () => {
@@ -68,9 +67,8 @@ describe("normalizeInsertionPath", () => {
6867

6968
describe("appendMovePath", () => {
7069
test("appends new position as first if the path is empty", () => {
71-
const path = [];
7270
const rect = { left: 1, right: 2, top: 3, bottom: 4 };
73-
expect(appendMovePath(path, rect)).toEqual([new Position({ x: 1, y: 3 })]);
71+
expect(appendMovePath([], rect)).toEqual([new Position({ x: 1, y: 3 })]);
7472
});
7573

7674
test("does not append new position if it is the same as previous", () => {
@@ -100,9 +98,8 @@ describe("appendMovePath", () => {
10098

10199
describe("appendResizePath", () => {
102100
test("appends new position as first if the path is empty", () => {
103-
const path = [];
104101
const rect = { left: 1, right: 2, top: 3, bottom: 4 };
105-
expect(appendResizePath(path, rect)).toEqual([new Position({ x: 2, y: 4 })]);
102+
expect(appendResizePath([], rect)).toEqual([new Position({ x: 2, y: 4 })]);
106103
});
107104

108105
test("does not append new position if it is the same as previous", () => {

‎src/internal/grid/__tests__/grid.test.tsx

+8
Original file line numberDiff line numberDiff line change
@@ -47,10 +47,18 @@ test("annotates data attributes on individual elements", () => {
4747
columnOffset: "1",
4848
rowOffset: "1",
4949
});
50+
expect(items[0]).toHaveStyle({
51+
"grid-row-start": "1",
52+
"grid-row-end": "span 1",
53+
});
5054
expect(items[1].dataset).toMatchObject({
5155
rowSpan: "1",
5256
columnSpan: "2",
5357
columnOffset: "3",
5458
rowOffset: "1",
5559
});
60+
expect(items[0]).toHaveStyle({
61+
"grid-row-start": "1",
62+
"grid-row-end": "span 1",
63+
});
5664
});

‎src/internal/layout-engine/__tests__/engine-chained.test.ts

+8-10
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33

44
import { expect, test } from "vitest";
55
import { fromMatrix, toString } from "../../debug-tools";
6+
import { Position } from "../../utils/position";
67
import { LayoutEngine } from "../engine";
78

89
test("engine operations can be chained", () => {
@@ -13,15 +14,12 @@ test("engine operations can be chained", () => {
1314
]);
1415

1516
const layoutShift = new LayoutEngine(grid)
16-
.insert({ itemId: "X", width: 1, height: 1, path: [{ x: 1, y: 1 }] })
17+
.insert({ itemId: "X", width: 1, height: 1, path: [new Position({ x: 1, y: 1 })] })
1718
.move({
1819
itemId: "X",
19-
path: [
20-
{ x: 1, y: 2 },
21-
{ x: 1, y: 3 },
22-
],
20+
path: [new Position({ x: 1, y: 2 }), new Position({ x: 1, y: 3 })],
2321
})
24-
.resize({ itemId: "X", path: [{ x: 3, y: 4 }] })
22+
.resize({ itemId: "X", path: [new Position({ x: 3, y: 4 })] })
2523
.remove("F")
2624
.refloat()
2725
.getLayoutShift();
@@ -44,13 +42,13 @@ test("engine operations are not chained when executed separately", () => {
4442
const engine = new LayoutEngine(grid);
4543

4644
// These commands are ignored.
47-
engine.insert({ itemId: "X", width: 1, height: 1, path: [{ x: 1, y: 1 }] });
48-
engine.move({ itemId: "A", path: [{ x: 0, y: 1 }] });
49-
engine.resize({ itemId: "A", path: [{ x: 2, y: 1 }] });
45+
engine.insert({ itemId: "X", width: 1, height: 1, path: [new Position({ x: 1, y: 1 })] });
46+
engine.move({ itemId: "A", path: [new Position({ x: 0, y: 1 })] });
47+
engine.resize({ itemId: "A", path: [new Position({ x: 2, y: 1 })] });
5048
engine.remove("A");
5149

5250
// The last command only is reflected in the layoutShift.
53-
engine.move({ itemId: "A", path: [{ x: 1, y: 0 }] });
51+
engine.move({ itemId: "A", path: [new Position({ x: 1, y: 0 })] });
5452

5553
expect(toString(engine.getLayoutShift().next)).toBe(
5654
toString([

‎src/internal/layout-engine/__tests__/engine-immutable.test.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
import { cloneDeep } from "lodash";
55
import { expect, test } from "vitest";
66
import { generateGrid, generateMove, generateResize } from "../../debug-tools";
7+
import { Position } from "../../utils/position";
78
import { LayoutEngine } from "../engine";
89

910
test("input arguments stay unchanged when using engine", () => {
@@ -16,7 +17,7 @@ test("input arguments stay unchanged when using engine", () => {
1617

1718
new LayoutEngine(grid).move(movePath);
1819
new LayoutEngine(grid).resize(resize);
19-
new LayoutEngine(grid).insert({ itemId: "X", width: 1, height: 1, path: [{ x: 0, y: 0 }] });
20+
new LayoutEngine(grid).insert({ itemId: "X", width: 1, height: 1, path: [new Position({ x: 0, y: 0 })] });
2021
new LayoutEngine(grid).remove("A");
2122
new LayoutEngine(grid).refloat();
2223

‎src/internal/layout-engine/__tests__/engine-insert.test.ts

+4-3
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33

44
import { describe, expect, test } from "vitest";
55
import { fromMatrix, generateGrid, generateInsert, toString } from "../../debug-tools";
6+
import { Position } from "../../utils/position";
67
import { LayoutEngine } from "../engine";
78
import { forEachTimes } from "./helpers";
89

@@ -24,7 +25,7 @@ describe("insert scenarios", () => {
2425
["A", "A", "D"],
2526
["E", "E", "D"],
2627
],
27-
{ itemId: "X", width: 1, height: 1, path: [{ x: 0, y: 0 }] },
28+
{ itemId: "X", width: 1, height: 1, path: [new Position({ x: 0, y: 0 })] },
2829
[
2930
["X", "B", "C"],
3031
["A", "A", "D"],
@@ -38,7 +39,7 @@ describe("insert scenarios", () => {
3839
["A", "A", "D"],
3940
["E", "E", "D"],
4041
],
41-
{ itemId: "X", width: 2, height: 2, path: [{ x: 1, y: 1 }] },
42+
{ itemId: "X", width: 2, height: 2, path: [new Position({ x: 1, y: 1 })] },
4243
[
4344
[" ", " ", "B"],
4445
[" ", "X", "X"],
@@ -60,7 +61,7 @@ describe("insert scenarios", () => {
6061
["C", "C"],
6162
["C", "C"],
6263
],
63-
{ itemId: "X", width: 2, height: 4, path: [{ x: 0, y: 0 }] },
64+
{ itemId: "X", width: 2, height: 4, path: [new Position({ x: 0, y: 0 })] },
6465
[
6566
["X", "X"],
6667
["X", "X"],

‎src/internal/layout-engine/__tests__/engine-resize.test.ts

+11-28
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33

44
import { describe, expect, test } from "vitest";
55
import { fromMatrix, generateGrid, generateRandomPath, generateResize, toString } from "../../debug-tools";
6+
import { Position } from "../../utils/position";
67
import { LayoutEngine } from "../engine";
78
import { forEachTimes } from "./helpers";
89

@@ -31,10 +32,10 @@ test("commits no changes if resize path returns to original or smaller", () => {
3132
if (resize.path.length > 0) {
3233
const lastPathItem = resize.path[resize.path.length - 1];
3334
const resizeTarget = grid.items.find((it) => it.id === resize.itemId)!;
34-
const originalSizePath = {
35+
const originalSizePath = new Position({
3536
x: randomPathValue(resizeTarget.x + resizeTarget.width),
3637
y: randomPathValue(resizeTarget.y + resizeTarget.height),
37-
};
38+
});
3839
resize.path = [...resize.path, ...generateRandomPath(lastPathItem, originalSizePath)];
3940
const moves = new LayoutEngine(grid).resize(resize).getLayoutShift().moves;
4041
expect(moves.filter((move) => move.type !== "RESIZE" && move.type !== "FLOAT")).toHaveLength(0);
@@ -57,10 +58,7 @@ describe("resize scenarios", () => {
5758
],
5859
{
5960
itemId: "A",
60-
path: [
61-
{ x: 2, y: 1 },
62-
{ x: 2, y: 2 },
63-
],
61+
path: [new Position({ x: 2, y: 1 }), new Position({ x: 2, y: 2 })],
6462
},
6563
[
6664
["A", "A", "B"],
@@ -77,10 +75,7 @@ describe("resize scenarios", () => {
7775
],
7876
{
7977
itemId: "A",
80-
path: [
81-
{ x: 1, y: 2 },
82-
{ x: 2, y: 2 },
83-
],
78+
path: [new Position({ x: 1, y: 2 }), new Position({ x: 2, y: 2 })],
8479
},
8580
[
8681
["A", "A", "B"],
@@ -97,10 +92,7 @@ describe("resize scenarios", () => {
9792
],
9893
{
9994
itemId: "A",
100-
path: [
101-
{ x: 3, y: 2 },
102-
{ x: 3, y: 1 },
103-
],
95+
path: [new Position({ x: 3, y: 2 }), new Position({ x: 3, y: 1 })],
10496
},
10597
[
10698
["A", "A", "A"],
@@ -118,10 +110,7 @@ describe("resize scenarios", () => {
118110
],
119111
{
120112
itemId: "A",
121-
path: [
122-
{ x: 3, y: 2 },
123-
{ x: 3, y: 3 },
124-
],
113+
path: [new Position({ x: 3, y: 2 }), new Position({ x: 3, y: 3 })],
125114
},
126115
[
127116
["A", "A", "A"],
@@ -140,7 +129,7 @@ describe("resize scenarios", () => {
140129
["C", "D", "D", "E"],
141130
["C", "F", "F", "F"],
142131
],
143-
{ itemId: "B", path: [{ x: 4, y: 3 }] },
132+
{ itemId: "B", path: [new Position({ x: 4, y: 3 })] },
144133
[
145134
["A", "A", "A", " "],
146135
["B", "B", "B", "B"],
@@ -159,10 +148,7 @@ describe("resize scenarios", () => {
159148
],
160149
{
161150
itemId: "B",
162-
path: [
163-
{ x: 4, y: 3 },
164-
{ x: 4, y: 4 },
165-
],
151+
path: [new Position({ x: 4, y: 3 }), new Position({ x: 4, y: 4 })],
166152
},
167153
[
168154
["A", "A", "A", " "],
@@ -183,10 +169,7 @@ describe("resize scenarios", () => {
183169
],
184170
{
185171
itemId: "A",
186-
path: [
187-
{ x: 3, y: 2 },
188-
{ x: 3, y: 3 },
189-
],
172+
path: [new Position({ x: 3, y: 2 }), new Position({ x: 3, y: 3 })],
190173
},
191174
[
192175
["A", "A", "A", " "],
@@ -207,7 +190,7 @@ describe("resize scenarios", () => {
207190
],
208191
{
209192
itemId: "B",
210-
path: [{ x: 2, y: 2 }],
193+
path: [new Position({ x: 2, y: 2 })],
211194
},
212195
[
213196
["A", "B", "C", "D"],

‎src/internal/layout-engine/__tests__/engine-validation.test.ts

+9-14
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33

44
import { expect, test } from "vitest";
55
import { fromMatrix, fromTextPath } from "../../debug-tools";
6+
import { Position } from "../../utils/position";
67
import { LayoutEngine } from "../engine";
78

89
test("throws if grid definition is not valid", () => {
@@ -37,10 +38,10 @@ test("throws if move command is not valid", () => {
3738
["G", "E", "E"],
3839
]);
3940

40-
expect(() => new LayoutEngine(grid).move({ itemId: "X", path: [{ x: 0, y: 0 }] })).toThrowError(
41+
expect(() => new LayoutEngine(grid).move({ itemId: "X", path: [new Position({ x: 0, y: 0 })] })).toThrowError(
4142
'Item with id "X" not found in the grid.'
4243
);
43-
expect(() => new LayoutEngine(grid).move({ itemId: "F", path: [{ x: 3, y: 1 }] })).toThrowError(
44+
expect(() => new LayoutEngine(grid).move({ itemId: "F", path: [new Position({ x: 3, y: 1 })] })).toThrowError(
4445
"Invalid move: outside grid."
4546
);
4647
});
@@ -52,7 +53,7 @@ test("throws if resize command is not valid", () => {
5253
["G", "E", "E"],
5354
]);
5455

55-
expect(() => new LayoutEngine(grid).resize({ itemId: "X", path: [{ x: 1, y: 1 }] })).toThrowError(
56+
expect(() => new LayoutEngine(grid).resize({ itemId: "X", path: [new Position({ x: 1, y: 1 })] })).toThrowError(
5657
'Item with id "X" not found in the grid.'
5758
);
5859

@@ -64,10 +65,7 @@ test("throws if resize command is not valid", () => {
6465
])
6566
).resize({
6667
itemId: "A",
67-
path: [
68-
{ x: 1, y: 2 },
69-
{ x: 0, y: 2 },
70-
],
68+
path: [new Position({ x: 1, y: 2 }), new Position({ x: 0, y: 2 })],
7169
})
7270
).toThrowError("Invalid resize: can't resize to 0.");
7371

@@ -79,10 +77,7 @@ test("throws if resize command is not valid", () => {
7977
])
8078
).resize({
8179
itemId: "A",
82-
path: [
83-
{ x: 2, y: 1 },
84-
{ x: 2, y: 0 },
85-
],
80+
path: [new Position({ x: 2, y: 1 }), new Position({ x: 2, y: 0 })],
8681
})
8782
).toThrowError("Invalid resize: can't resize to 0.");
8883

@@ -92,7 +87,7 @@ test("throws if resize command is not valid", () => {
9287
["A", "A"],
9388
["A", "A"],
9489
])
95-
).resize({ itemId: "A", path: [{ x: 3, y: 2 }] })
90+
).resize({ itemId: "A", path: [new Position({ x: 3, y: 2 })] })
9691
).toThrowError("Invalid resize: outside grid.");
9792
});
9893

@@ -104,10 +99,10 @@ test("throws if insert command is not valid", () => {
10499
]);
105100

106101
expect(() =>
107-
new LayoutEngine(grid).insert({ itemId: "X", width: 2, height: 1, path: [{ x: 2, y: 2 }] })
102+
new LayoutEngine(grid).insert({ itemId: "X", width: 2, height: 1, path: [new Position({ x: 2, y: 2 })] })
108103
).toThrowError("Inserting item is outside the boundaries.");
109104
expect(() =>
110-
new LayoutEngine(grid).insert({ itemId: "X", width: 2, height: 0, path: [{ x: 1, y: 1 }] })
105+
new LayoutEngine(grid).insert({ itemId: "X", width: 2, height: 0, path: [new Position({ x: 1, y: 1 })] })
111106
).toThrowError("Inserting item has invalid size.");
112107
});
113108

‎src/test-utils/tsconfig.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,5 +11,5 @@
1111
"experimentalDecorators": true,
1212
"tsBuildInfoFile": "../../.cache/test-utils.tsbuildinfo"
1313
},
14-
"include": ["./", "../../types"]
14+
"include": ["./", "./types"]
1515
}

‎src/test-utils/types/global.d.ts

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2+
// SPDX-License-Identifier: Apache-2.0
3+
declare module "*.css.js" {
4+
const styles: Record<string, string>;
5+
export default styles;
6+
}
7+
declare module "*.selectors.js" {
8+
const styles: Record<string, string>;
9+
export default styles;
10+
}

0 commit comments

Comments
 (0)