Skip to content

Commit add49b5

Browse files
acaoacao
authored
address some bugs with hover (#26)
* address some bugs with hover - infer types with parsed data - fallback if error is returned - refactor to make it easier to test and configure * cleanup tests, demo, dom rendering impl
1 parent 19c373f commit add49b5

File tree

12 files changed

+297
-110
lines changed

12 files changed

+297
-110
lines changed

‎dev/index.html‎

Lines changed: 27 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<head>
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6-
<title>codemirror-json-schema example</title>
6+
<title>codemirror-json-schema demo</title>
77
<meta
88
name="description"
99
content="A demo of the codemirror-json-schema package that supports json schema for json4 and json5"
@@ -47,16 +47,36 @@
4747
.cm-editor .cm-diagnostic-error {
4848
padding: 0.5rem;
4949
}
50+
.cm6-json-schema-hover--description {
51+
margin-bottom: 0.5rem;
52+
}
53+
.grid-row {
54+
display: grid;
55+
grid-auto-columns: 50%;
56+
grid-template-areas: "a a";
57+
}
58+
@media screen and (max-width: 768px) {
59+
.grid-row {
60+
grid-auto-columns: 100%;
61+
grid-template-areas: "a" "b";
62+
}
63+
}
5064
</style>
5165
</head>
5266
<body class="replit-ui-theme-root dark">
5367
<h1><code>codemirror-json-schema</code> demo</h1>
54-
<h2><code>package.json</code> demo</h2>
55-
<p>Supports simple completion, linting, hover</p>
56-
<div id="editor"></div>
57-
<h2><code>package.json5</code> demo</h2>
58-
<p>Supports linting, hover</p>
59-
<div id="editor-json5"></div>
68+
<div class="grid-row">
69+
<div>
70+
<h2><code>package.json</code> demo</h2>
71+
<p>Supports simple completion, linting, hover</p>
72+
<div id="editor"></div>
73+
</div>
74+
<div>
75+
<h2><code>package.json5</code> demo</h2>
76+
<p>Supports linting, hover</p>
77+
<div id="editor-json5"></div>
78+
</div>
79+
</div>
6080
<script type="module" src="./index.ts"></script>
6181
</body>
6282
</html>

‎dev/sample-text.ts‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,9 +8,14 @@ export const jsonText = `{
88
}],
99
"type": ""
1010
}`;
11+
1112
export const json5Text = `{
1213
"name": "lexunicon",
13-
'version': "0.0.0",
14-
description: "A lexicon for the unicon programming language",
15-
contributors: false,
14+
"version": "0.0.0",
15+
description: 'A lexicon for the unicon programming language',
16+
contributors: [{
17+
email: "email",
18+
"url": 'h',
19+
}],
20+
'type': '',
1621
}`;

‎docs/modules/index.md‎

Lines changed: 25 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -61,13 +61,13 @@ provides a JSON schema enabled autocomplete extension for codemirror
6161

6262
#### Defined in
6363

64-
[json-completion.ts:820](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/json-completion.ts#L820)
64+
[json-completion.ts:820](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/json-completion.ts#L820)
6565

6666
---
6767

6868
### jsonSchemaHover
6969

70-
▸ **jsonSchemaHover**(`schema`, `options?`): (`view`: `EditorView`, `pos`: `number`, `side`: `1` \| `-1`) => `Promise`<`null` \| `Tooltip`\>
70+
▸ **jsonSchemaHover**(`schema`, `options?`): (`view`: `EditorView`, `pos`: `number`, `side`: `Side`) => `Promise`<`null` \| `Tooltip`\>
7171

7272
provides a JSON schema enabled tooltip extension for codemirror
7373

@@ -90,15 +90,15 @@ provides a JSON schema enabled tooltip extension for codemirror
9090
| :----- | :----------- |
9191
| `view` | `EditorView` |
9292
| `pos` | `number` |
93-
| `side` | `1` \| `-1` |
93+
| `side` | `Side` |
9494

9595
##### Returns
9696

9797
`Promise`<`null` \| `Tooltip`\>
9898

9999
#### Defined in
100100

101-
[json-hover.ts:24](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/json-hover.ts#L24)
101+
[json-hover.ts:39](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/json-hover.ts#L39)
102102

103103
---
104104

@@ -133,7 +133,7 @@ Helper for simpler class instantiaton
133133

134134
#### Defined in
135135

136-
[json-validation.ts:35](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/json-validation.ts#L35)
136+
[json-validation.ts:35](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/json-validation.ts#L35)
137137

138138
## Utilities
139139

@@ -160,7 +160,7 @@ this could be useful for other things later!
160160

161161
#### Defined in
162162

163-
[utils/jsonPointers.ts:37](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/utils/jsonPointers.ts#L37)
163+
[utils/jsonPointers.ts:37](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/utils/jsonPointers.ts#L37)
164164

165165
---
166166

@@ -183,7 +183,7 @@ retrieve a Map of all the json pointers in a document
183183

184184
#### Defined in
185185

186-
[utils/jsonPointers.ts:98](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/utils/jsonPointers.ts#L98)
186+
[utils/jsonPointers.ts:98](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/utils/jsonPointers.ts#L98)
187187

188188
---
189189

@@ -199,7 +199,7 @@ retrieve a JSON pointer for a given position in the editor
199199
| :------ | :------------------------------ | :------------ |
200200
| `state` | `EditorState` | `undefined` |
201201
| `pos` | `number` | `undefined` |
202-
| `side` | `1` \| `-1` | `undefined` |
202+
| `side` | `Side` | `undefined` |
203203
| `mode` | [`JSONMode`](index.md#jsonmode) | `"json4"` |
204204

205205
#### Returns
@@ -208,7 +208,7 @@ retrieve a JSON pointer for a given position in the editor
208208

209209
#### Defined in
210210

211-
[utils/jsonPointers.ts:81](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/utils/jsonPointers.ts#L81)
211+
[utils/jsonPointers.ts:81](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/utils/jsonPointers.ts#L81)
212212

213213
---
214214

@@ -235,7 +235,7 @@ Mimics the behavior of `json-source-map`'s `parseJSONDocument` function using co
235235

236236
#### Defined in
237237

238-
[utils/parseJSONDocument.ts:23](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/utils/parseJSONDocument.ts#L23)
238+
[utils/parseJSONDocument.ts:23](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/utils/parseJSONDocument.ts#L23)
239239

240240
---
241241

@@ -262,7 +262,7 @@ Return parsed data and json pointers for a given codemirror EditorState
262262

263263
#### Defined in
264264

265-
[utils/parseJSONDocument.ts:9](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/utils/parseJSONDocument.ts#L9)
265+
[utils/parseJSONDocument.ts:9](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/utils/parseJSONDocument.ts#L9)
266266

267267
## Type Aliases
268268

@@ -279,7 +279,7 @@ Return parsed data and json pointers for a given codemirror EditorState
279279

280280
#### Defined in
281281

282-
[json-hover.ts:9](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/json-hover.ts#L9)
282+
[json-hover.ts:12](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/json-hover.ts#L12)
283283

284284
---
285285

@@ -289,7 +289,7 @@ Return parsed data and json pointers for a given codemirror EditorState
289289

290290
#### Defined in
291291

292-
[json-hover.ts:11](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/json-hover.ts#L11)
292+
[json-hover.ts:14](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/json-hover.ts#L14)
293293

294294
---
295295

@@ -299,14 +299,16 @@ Return parsed data and json pointers for a given codemirror EditorState
299299

300300
#### Type declaration
301301

302-
| Name | Type |
303-
| :------------- | :----------------------------------------------------------------------- |
304-
| `formatHover?` | (`data`: [`FoundCursorData`](index.md#foundcursordata)) => `HTMLElement` |
305-
| `mode?` | [`JSONMode`](index.md#jsonmode) |
302+
| Name | Type |
303+
| :--------------- | :---------------------------------------------------------------------- |
304+
| `formatHover?` | (`data`: `HoverTexts`) => `HTMLElement` |
305+
| `getHoverTexts?` | (`data`: [`FoundCursorData`](index.md#foundcursordata)) => `HoverTexts` |
306+
| `mode?` | [`JSONMode`](index.md#jsonmode) |
307+
| `parser?` | (`text`: `string`) => `any` |
306308

307309
#### Defined in
308310

309-
[json-hover.ts:13](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/json-hover.ts#L13)
311+
[json-hover.ts:18](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/json-hover.ts#L18)
310312

311313
---
312314

@@ -316,7 +318,7 @@ Return parsed data and json pointers for a given codemirror EditorState
316318

317319
#### Defined in
318320

319-
[utils/jsonPointers.ts:8](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/utils/jsonPointers.ts#L8)
321+
[utils/jsonPointers.ts:8](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/utils/jsonPointers.ts#L8)
320322

321323
---
322324

@@ -333,7 +335,7 @@ Return parsed data and json pointers for a given codemirror EditorState
333335

334336
#### Defined in
335337

336-
[types.ts:4](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/types.ts#L4)
338+
[types.ts:4](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/types.ts#L4)
337339

338340
---
339341

@@ -352,7 +354,7 @@ Return parsed data and json pointers for a given codemirror EditorState
352354

353355
#### Defined in
354356

355-
[types.ts:9](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/types.ts#L9)
357+
[types.ts:9](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/types.ts#L9)
356358

357359
---
358360

@@ -362,7 +364,7 @@ Return parsed data and json pointers for a given codemirror EditorState
362364

363365
#### Defined in
364366

365-
[types.ts:16](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/types.ts#L16)
367+
[types.ts:18](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/types.ts#L18)
366368

367369
---
368370

@@ -379,4 +381,4 @@ Return parsed data and json pointers for a given codemirror EditorState
379381

380382
#### Defined in
381383

382-
[json-validation.ts:24](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/json-validation.ts#L24)
384+
[json-validation.ts:24](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/json-validation.ts#L24)

‎docs/modules/json5.md‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818

1919
### json5SchemaHover
2020

21-
▸ **json5SchemaHover**(`schema`, `options?`): (`view`: `EditorView`, `pos`: `number`, `side`: `1` \| `-1`) => `Promise`<`null` \| `Tooltip`\>
21+
▸ **json5SchemaHover**(`schema`, `options?`): (`view`: `EditorView`, `pos`: `number`, `side`: `Side`) => `Promise`<`null` \| `Tooltip`\>
2222

2323
Instantiates a JSONHover instance with the JSON5 mode
2424

@@ -41,15 +41,15 @@ Instantiates a JSONHover instance with the JSON5 mode
4141
| :----- | :----------- |
4242
| `view` | `EditorView` |
4343
| `pos` | `number` |
44-
| `side` | `1` \| `-1` |
44+
| `side` | `Side` |
4545

4646
##### Returns
4747

4848
`Promise`<`null` \| `Tooltip`\>
4949

5050
#### Defined in
5151

52-
[json5-hover.ts:11](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/json5-hover.ts#L11)
52+
[json5-hover.ts:13](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/json5-hover.ts#L13)
5353

5454
---
5555

@@ -84,7 +84,7 @@ Instantiates a JSONValidation instance with the JSON5 mode
8484

8585
#### Defined in
8686

87-
[json5-validation.ts:10](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/json5-validation.ts#L10)
87+
[json5-validation.ts:10](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/json5-validation.ts#L10)
8888

8989
## Utilities
9090

@@ -111,7 +111,7 @@ Mimics the behavior of `json-source-map`'s `parseJSONDocument` function, for jso
111111

112112
#### Defined in
113113

114-
[utils/parseJSON5Document.ts:28](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/utils/parseJSON5Document.ts#L28)
114+
[utils/parseJSON5Document.ts:28](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/utils/parseJSON5Document.ts#L28)
115115

116116
---
117117

@@ -138,4 +138,4 @@ Return parsed data and json5 pointers for a given codemirror EditorState
138138

139139
#### Defined in
140140

141-
[utils/parseJSON5Document.ts:14](https://github.com/acao/codemirror-json-schema/blob/fea8ea7/src/utils/parseJSON5Document.ts#L14)
141+
[utils/parseJSON5Document.ts:14](https://github.com/acao/codemirror-json-schema/blob/31d3cd5/src/utils/parseJSON5Document.ts#L14)

‎src/__tests__/json-completion.spec.ts‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import { it, describe, expect } from "vitest";
2+
import { JSONCompletion } from "../json-completion";
3+
import { CompletionResult, autocompletion } from "@codemirror/autocomplete";
4+
import { testSchema } from "./__fixtures__/schemas";
5+
import { EditorView } from "@codemirror/view";
6+
import { json, jsonLanguage } from "@codemirror/lang-json";
7+
import { EditorState } from "@codemirror/state";
8+
9+
describe("json-completion", () => {
10+
it("should return completion data for simple types", async () => {
11+
expect(true).toEqual(true);
12+
});
13+
});
14+
15+
// const getCompletionResult = (
16+
// jsonString: string,
17+
// pos: number
18+
// ): Promise<CompletionResult | undefined> => {
19+
// return new Promise((resolve, reject) => {
20+
// console.log("hello1");
21+
// const completionInstance = new JSONCompletion(testSchema);
22+
// const state = EditorState.create({
23+
// doc: jsonString,
24+
// selection: { anchor: pos, head: pos },
25+
// extensions: [
26+
// json(),
27+
// jsonLanguage.data.of({
28+
// autocomplete: () => {
29+
// const result =
30+
// completionInstance.doComplete.bind(completionInstance);
31+
// console.log(result)
32+
// resolve(result);
33+
// return result;
34+
// },
35+
// }),
36+
// ],
37+
// });
38+
// });
39+
// };
40+
41+
// describe("json-completion", () => {
42+
// console.log("hello");
43+
// it("should return completion data for simple types", async () => {
44+
// const completionResult = await getCompletionResult('{ "f }', 5);
45+
// console.log(completionResult);
46+
// expect(completionResult).toEqual(true);
47+
// });
48+
// });

0 commit comments

Comments
 (0)