codemirror/lang-javascript
1
0
Fork 0
Code Pull requests Activity

Prevent completions when in JSX nodes #14

Merged
krismuniz merged 1 commit from main into main 2024-11-24 19:44:37 +01:00
Conversation 1 Commits 1 Files changed 1 +1
krismuniz commented 2024-11-23 16:25:53 +01:00 (Migrated from github.com)
Copy link

Hi there 👋

This contribution adds "JSXText", "JSXAttributeValue", "JSXOpenTag", "JSXCloseTag", "JSXSelfClosingTag" to dontComplete to ensure that we do not show JavaScript completions when in a JSX node.

Minimal Repro - Try Codemirror

Examples

export function MyComponent () {
  return <p>func|
/*              ^ cursor
 * I'm inside of a JSXText node, but it would
 * show `function` as a completion, which is
 * not very useful inside of a `JSXText`
 */

export function MyComponent () {
  return <p className="func|
/*                         ^ cursor
 * I'm inside of a JSXAttributeValue node,
 * but it would show `function` as a
 * completion, which is not very useful
 * inside of a `JSXAttributeValue`
 */

Screenshots - Before

CleanShot 2024-11-23 at 10 18 17@2x

CleanShot 2024-11-23 at 10 17 16@2x

Screenshots - After

https://github.com/user-attachments/assets/a2369900-2ce1-461a-b8db-4c240faa7985

Hi there :wave: This contribution adds `"JSXText", "JSXAttributeValue", "JSXOpenTag", "JSXCloseTag", "JSXSelfClosingTag"` to `dontComplete` to ensure that we do not show JavaScript completions when in a JSX node. [Minimal Repro - Try Codemirror](https://codemirror.net/try/?c=aW1wb3J0IHtiYXNpY1NldHVwLCBFZGl0b3JWaWV3fSBmcm9tICJjb2RlbWlycm9yIgppbXBvcnQge2phdmFzY3JpcHR9IGZyb20gIkBjb2RlbWlycm9yL2xhbmctamF2YXNjcmlwdCIKCm5ldyBFZGl0b3JWaWV3KHsKICBkb2M6ICI8ZGl2PkhlbGxvIHN3aVxuIiwKICBleHRlbnNpb25zOiBbYmFzaWNTZXR1cCwgamF2YXNjcmlwdCh7anN4OiB0cnVlfSldLAogIHBhcmVudDogZG9jdW1lbnQuYm9keQp9KQo=) ## Examples ```jsx export function MyComponent () { return <p>func| /* ^ cursor * I'm inside of a JSXText node, but it would * show `function` as a completion, which is * not very useful inside of a `JSXText` */ ``` ```jsx export function MyComponent () { return <p className="func| /* ^ cursor * I'm inside of a JSXAttributeValue node, * but it would show `function` as a * completion, which is not very useful * inside of a `JSXAttributeValue` */ ``` ## Screenshots - Before ![CleanShot 2024-11-23 at 10 18 17@2x](https://github.com/user-attachments/assets/8f68e89c-5cf0-4db7-b750-08ff15aa8d67) ![CleanShot 2024-11-23 at 10 17 16@2x](https://github.com/user-attachments/assets/f7c0f112-067d-488b-b7ae-418b1fabf35f) ## Screenshots - After https://github.com/user-attachments/assets/a2369900-2ce1-461a-b8db-4c240faa7985
marijnh commented 2024-11-24 19:44:46 +01:00 (Migrated from github.com)
Copy link

Thanks, that looks like a good idea.

Thanks, that looks like a good idea.
Sign in to join this conversation.
Reviewers
No reviewers
Labels
Clear labels
No items
No labels
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
codemirror/lang-javascript!14
No description provided.