tangled
alpha
login
or
join now
tylur.dev
/
prototypey
prototypey.org - atproto lexicon typescript toolkit - mirror https://github.com/tylersayshi/prototypey
1
fork
atom
overview
issues
pulls
pipelines
fix ui tests
Tyler
3 months ago
7e744630
3f8ba0c9
+102
-25
6 changed files
expand all
collapse all
unified
split
packages
site
package.json
tests
components
Editor.test.tsx
OutputPanel.test.tsx
Playground.test.tsx
setup.ts
pnpm-lock.yaml
+1
packages/site/package.json
···
17
17
"react-dom": "^18.3.1"
18
18
},
19
19
"devDependencies": {
20
20
+
"@testing-library/jest-dom": "^6.9.1",
20
21
"@testing-library/react": "^16.1.0",
21
22
"@testing-library/user-event": "^14.5.2",
22
23
"@types/react": "^18.3.18",
+27
-4
packages/site/tests/components/Editor.test.tsx
···
11
11
onChange={(e) => onChange(e.target.value)}
12
12
/>
13
13
),
14
14
+
loader: {
15
15
+
init: vi.fn(() =>
16
16
+
Promise.resolve({
17
17
+
languages: {
18
18
+
typescript: {
19
19
+
typescriptDefaults: {
20
20
+
setCompilerOptions: vi.fn(),
21
21
+
setDiagnosticsOptions: vi.fn(),
22
22
+
addExtraLib: vi.fn(),
23
23
+
},
24
24
+
ScriptTarget: { ES2020: 7 },
25
25
+
ModuleResolutionKind: { NodeJs: 2 },
26
26
+
ModuleKind: { ESNext: 99 },
27
27
+
},
28
28
+
},
29
29
+
}),
30
30
+
),
31
31
+
},
14
32
}));
15
33
16
34
describe("Editor", () => {
17
17
-
it("renders with input label", () => {
35
35
+
it("renders with input label", async () => {
18
36
const mockOnChange = vi.fn();
19
37
render(<Editor value="" onChange={mockOnChange} />);
20
38
expect(screen.getByText("Input")).toBeInTheDocument();
39
39
+
40
40
+
// Wait for loader to complete
41
41
+
await screen.findByTestId("monaco-editor");
21
42
});
22
43
23
44
it("calls onChange when value changes", async () => {
24
45
const mockOnChange = vi.fn();
25
46
render(<Editor value="" onChange={mockOnChange} />);
26
47
27
27
-
const editor = screen.getByTestId("monaco-editor");
48
48
+
// Wait for loader to complete
49
49
+
const editor = await screen.findByTestId("monaco-editor");
28
50
await userEvent.type(editor, "test");
29
51
30
52
expect(mockOnChange).toHaveBeenCalled();
31
53
});
32
54
33
33
-
it("displays the provided value", () => {
55
55
+
it("displays the provided value", async () => {
34
56
const mockOnChange = vi.fn();
35
57
render(<Editor value="const x = 1" onChange={mockOnChange} />);
36
58
37
37
-
const editor = screen.getByTestId("monaco-editor");
59
59
+
// Wait for loader to complete
60
60
+
const editor = await screen.findByTestId("monaco-editor");
38
61
expect(editor).toHaveValue("const x = 1");
39
62
});
40
63
});
+3
-15
packages/site/tests/components/OutputPanel.test.tsx
···
14
14
error: "",
15
15
};
16
16
17
17
-
it("renders JSON Output tab by default", () => {
17
17
+
it("renders Output header", () => {
18
18
render(<OutputPanel output={mockOutput} />);
19
19
-
expect(screen.getByText("JSON Output")).toBeInTheDocument();
20
20
-
expect(screen.getByText("Type Info")).toBeInTheDocument();
19
19
+
expect(screen.getByText("Output")).toBeInTheDocument();
21
20
});
22
21
23
23
-
it("displays json content by default", () => {
22
22
+
it("displays json content", () => {
24
23
render(<OutputPanel output={mockOutput} />);
25
24
expect(screen.getByText('{"test": "value"}')).toBeInTheDocument();
26
26
-
});
27
27
-
28
28
-
it("switches to Type Info tab when clicked", async () => {
29
29
-
render(<OutputPanel output={mockOutput} />);
30
30
-
31
31
-
const typeInfoTab = screen.getByText("Type Info");
32
32
-
await userEvent.click(typeInfoTab);
33
33
-
34
34
-
expect(
35
35
-
screen.getByText("type Test = { test: string }"),
36
36
-
).toBeInTheDocument();
37
25
});
38
26
39
27
it("displays error message when error exists", () => {
+10
-6
packages/site/tests/components/Playground.test.tsx
···
51
51
render(<Playground />);
52
52
53
53
expect(screen.getByText("Input")).toBeInTheDocument();
54
54
-
expect(screen.getByText("JSON Output")).toBeInTheDocument();
55
55
-
expect(screen.getByText("Type Info")).toBeInTheDocument();
54
54
+
expect(screen.getByText("Output")).toBeInTheDocument();
56
55
});
57
56
58
58
-
it("starts with default code in editor", () => {
57
57
+
it("starts with default code in editor", async () => {
59
58
render(<Playground />);
60
59
60
60
+
// Wait for editors to be ready
61
61
+
await waitFor(() => {
62
62
+
expect(screen.getAllByTestId("monaco-editor").length).toBeGreaterThan(0);
63
63
+
});
64
64
+
61
65
const editors = screen.getAllByTestId("monaco-editor");
62
62
-
const inputEditor = editors[0];
66
66
+
const inputEditor = editors[0] as HTMLTextAreaElement;
63
67
64
64
-
expect(inputEditor).toHaveValue(
65
65
-
expect.stringContaining('lx.namespace("app.bsky.actor.profile"'),
68
68
+
expect(inputEditor.value).toContain(
69
69
+
'lx.namespace("app.bsky.actor.profile"',
66
70
);
67
71
});
68
72
+1
packages/site/tests/setup.ts
···
1
1
import { vi } from "vitest";
2
2
+
import "@testing-library/jest-dom/vitest";
2
3
3
4
global.fetch = vi.fn(
4
5
() =>
+60
pnpm-lock.yaml
···
85
85
specifier: ^18.3.1
86
86
version: 18.3.1(react@18.3.1)
87
87
devDependencies:
88
88
+
'@testing-library/jest-dom':
89
89
+
specifier: ^6.9.1
90
90
+
version: 6.9.1
88
91
'@testing-library/react':
89
92
specifier: ^16.1.0
90
93
version: 16.3.0(@testing-library/dom@10.4.1)(@types/react-dom@18.3.7(@types/react@18.3.26))(@types/react@18.3.26)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
···
114
117
version: 3.2.4(@types/node@24.0.4)(esbuild@0.25.10)(jiti@2.6.1)(jsdom@25.0.1)
115
118
116
119
packages:
120
120
+
121
121
+
'@adobe/css-tools@4.4.4':
122
122
+
resolution: {integrity: sha512-Elp+iwUx5rN5+Y8xLt5/GRoG20WGoDCQ/1Fb+1LiGtvwbDavuSk0jhD/eZdckHAuzcDzccnkv+rEjyWfRx18gg==}
117
123
118
124
'@ark/attest@0.49.0':
119
125
resolution: {integrity: sha512-LYAJe4iwgA4GY+WLcSZ2ObTgr7F9lSwoQm4hR+B5ko0TfB3gqolXv04hA+7UtoP5HrGR1lVS+0DdwtWNnaSGnQ==}
···
671
677
resolution: {integrity: sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg==}
672
678
engines: {node: '>=18'}
673
679
680
680
+
'@testing-library/jest-dom@6.9.1':
681
681
+
resolution: {integrity: sha512-zIcONa+hVtVSSep9UT3jZ5rizo2BsxgyDYU7WFD5eICBE7no3881HGeb/QkGfsJs6JTkY1aQhT7rIPC7e+0nnA==}
682
682
+
engines: {node: '>=14', npm: '>=6', yarn: '>=1'}
683
683
+
674
684
'@testing-library/react@16.3.0':
675
685
resolution: {integrity: sha512-kFSyxiEDwv1WLl2fgsq6pPBbw5aWKrsY2/noi1Id0TK0UParSF62oFQFGHXIyaG4pp2tEub/Zlel+fjjZILDsw==}
676
686
engines: {node: '>=18'}
···
972
982
resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==}
973
983
engines: {node: '>= 8'}
974
984
985
985
+
css.escape@1.5.1:
986
986
+
resolution: {integrity: sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==}
987
987
+
975
988
cssstyle@4.6.0:
976
989
resolution: {integrity: sha512-2z+rWdzbbSZv6/rhtvzvqeZQHrBaqgogqt85sqFNbabZOuFbCVFb8kPeEtZjiKkbrm395irpNKiYeFeLiQnFPg==}
977
990
engines: {node: '>=18'}
···
1024
1037
dom-accessibility-api@0.5.16:
1025
1038
resolution: {integrity: sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==}
1026
1039
1040
1040
+
dom-accessibility-api@0.6.3:
1041
1041
+
resolution: {integrity: sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==}
1042
1042
+
1027
1043
dts-resolver@2.1.2:
1028
1044
resolution: {integrity: sha512-xeXHBQkn2ISSXxbJWD828PFjtyg+/UrMDo7W4Ffcs7+YWCquxU8YjV1KoxuiL+eJ5pg3ll+bC6flVv61L3LKZg==}
1029
1045
engines: {node: '>=20.18.0'}
···
1281
1297
resolution: {integrity: sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==}
1282
1298
engines: {node: '>=0.8.19'}
1283
1299
1300
1300
+
indent-string@4.0.0:
1301
1301
+
resolution: {integrity: sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==}
1302
1302
+
engines: {node: '>=8'}
1303
1303
+
1284
1304
inherits@2.0.4:
1285
1305
resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
1286
1306
···
1484
1504
resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==}
1485
1505
engines: {node: '>= 0.6'}
1486
1506
1507
1507
+
min-indent@1.0.1:
1508
1508
+
resolution: {integrity: sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==}
1509
1509
+
engines: {node: '>=4'}
1510
1510
+
1487
1511
minimatch@3.1.2:
1488
1512
resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}
1489
1513
···
1615
1639
readdirp@4.1.2:
1616
1640
resolution: {integrity: sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==}
1617
1641
engines: {node: '>= 14.18.0'}
1642
1642
+
1643
1643
+
redent@3.0.0:
1644
1644
+
resolution: {integrity: sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==}
1645
1645
+
engines: {node: '>=8'}
1618
1646
1619
1647
require-directory@2.1.1:
1620
1648
resolution: {integrity: sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==}
···
1768
1796
resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==}
1769
1797
engines: {node: '>=8'}
1770
1798
1799
1799
+
strip-indent@3.0.0:
1800
1800
+
resolution: {integrity: sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==}
1801
1801
+
engines: {node: '>=8'}
1802
1802
+
1771
1803
strip-json-comments@3.1.1:
1772
1804
resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
1773
1805
engines: {node: '>=8'}
···
2008
2040
engines: {node: '>=10'}
2009
2041
2010
2042
snapshots:
2043
2043
+
2044
2044
+
'@adobe/css-tools@4.4.4': {}
2011
2045
2012
2046
'@ark/attest@0.49.0(typescript@5.8.3)':
2013
2047
dependencies:
···
2486
2520
picocolors: 1.1.1
2487
2521
pretty-format: 27.5.1
2488
2522
2523
2523
+
'@testing-library/jest-dom@6.9.1':
2524
2524
+
dependencies:
2525
2525
+
'@adobe/css-tools': 4.4.4
2526
2526
+
aria-query: 5.3.0
2527
2527
+
css.escape: 1.5.1
2528
2528
+
dom-accessibility-api: 0.6.3
2529
2529
+
picocolors: 1.1.1
2530
2530
+
redent: 3.0.0
2531
2531
+
2489
2532
'@testing-library/react@16.3.0(@testing-library/dom@10.4.1)(@types/react-dom@18.3.7(@types/react@18.3.26))(@types/react@18.3.26)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
2490
2533
dependencies:
2491
2534
'@babel/runtime': 7.28.4
···
2844
2887
path-key: 3.1.1
2845
2888
shebang-command: 2.0.0
2846
2889
which: 2.0.2
2890
2890
+
2891
2891
+
css.escape@1.5.1: {}
2847
2892
2848
2893
cssstyle@4.6.0:
2849
2894
dependencies:
···
2879
2924
2880
2925
dom-accessibility-api@0.5.16: {}
2881
2926
2927
2927
+
dom-accessibility-api@0.6.3: {}
2928
2928
+
2882
2929
dts-resolver@2.1.2: {}
2883
2930
2884
2931
dunder-proto@1.0.1:
···
3165
3212
3166
3213
imurmurhash@0.1.4: {}
3167
3214
3215
3215
+
indent-string@4.0.0: {}
3216
3216
+
3168
3217
inherits@2.0.4: {}
3169
3218
3170
3219
is-extglob@2.1.1: {}
···
3335
3384
dependencies:
3336
3385
mime-db: 1.52.0
3337
3386
3387
3387
+
min-indent@1.0.1: {}
3388
3388
+
3338
3389
minimatch@3.1.2:
3339
3390
dependencies:
3340
3391
brace-expansion: 1.1.12
···
3442
3493
3443
3494
readdirp@4.1.2: {}
3444
3495
3496
3496
+
redent@3.0.0:
3497
3497
+
dependencies:
3498
3498
+
indent-string: 4.0.0
3499
3499
+
strip-indent: 3.0.0
3500
3500
+
3445
3501
require-directory@2.1.1: {}
3446
3502
3447
3503
resolve-from@4.0.0: {}
···
3583
3639
strip-ansi@6.0.1:
3584
3640
dependencies:
3585
3641
ansi-regex: 5.0.1
3642
3642
+
3643
3643
+
strip-indent@3.0.0:
3644
3644
+
dependencies:
3645
3645
+
min-indent: 1.0.1
3586
3646
3587
3647
strip-json-comments@3.1.1: {}
3588
3648