Support jsx tag scopes using tree-sitter queries (#1508)

- Fixes #1478
- Depends on #1507

## Checklist

- [x] Support "every name" while we're here
   - [x] Arg lists
   - [x] Functions in class
   - [x] Assignment statements in function body
   - [x] Assignment statements at top level
   - [x] Properties in class
   - [x] Members of interface
- [x] I have added
[tests](https://www.cursorless.org/docs/contributing/test-case-recorder/)
- [ ] I have updated the
[docs](https://github.com/cursorless-dev/cursorless/tree/main/docs) and
[cheatsheet](https://github.com/cursorless-dev/cursorless/tree/main/cursorless-talon/src/cheatsheet)
- [ ] I have not broken the cheatsheet

---------

Co-authored-by: pre-commit-ci-lite[bot] <117423508+pre-commit-ci-lite[bot]@users.noreply.github.com>

Author: pokey

packages/cursorless-engine/src/languages/typescript.ts

@@ -1,11 +1,11 @@
-import { Selection, SimpleScopeTypeType, TextEditor } from "@cursorless/common";
+import { SimpleScopeTypeType } from "@cursorless/common";
 import type { SyntaxNode } from "web-tree-sitter";
 import {
   NodeMatcher,
   NodeMatcherAlternative,
   SelectionWithEditor,
 } from "../typings/Types";
-import { patternFinder, typedNodeFinder } from "../util/nodeFinders";
+import { patternFinder } from "../util/nodeFinders";
 import {
   argumentMatcher,
   cascadingMatcher,
@@ -20,12 +20,10 @@ import {
   extendForwardPastOptional,
   getNodeInternalRange,
   getNodeRange,
-  jsxFragmentExtractor,
   pairSelectionExtractor,
   selectWithLeadingDelimiter,
   simpleSelectionExtractor,
   unwrapSelectionExtractor,
-  xmlElementExtractor,
 } from "../util/nodeSelectors";
 import { branchMatcher } from "./branchMatcher";
 import { elseExtractor, elseIfExtractor } from "./elseIfExtractor";
@@ -71,42 +69,6 @@ const STATEMENT_TYPES = [
   "with_statement",
 ];
 
-/** Handles jsx fragment start or end tag, eg the `<>` in `<>foo</>` **/
-function getJsxFragmentTag(isStartTag: boolean): NodeMatcher {
-  return matcher(
-    typedNodeFinder("jsx_fragment"),
-    (editor: TextEditor, node: SyntaxNode) => {
-      const [start, end] = isStartTag
-        ? [node.children[0], node.children[1]]
-        : [node.children.at(-3)!, node.children.at(-1)!];
-      return {
-        selection: new Selection(
-          start.startPosition.row,
-          start.startPosition.column,
-          end.endPosition.row,
-          end.endPosition.column,
-        ),
-        context: {},
-      };
-    },
-  );
-}
-
-const getStartTag = cascadingMatcher(
-  patternMatcher("jsx_element.jsx_opening_element!"),
-  getJsxFragmentTag(true),
-);
-const getEndTag = cascadingMatcher(
-  patternMatcher("jsx_element.jsx_closing_element!"),
-  getJsxFragmentTag(false),
-);
-
-const getTags = (selection: SelectionWithEditor, node: SyntaxNode) => {
-  const startTag = getStartTag(selection, node);
-  const endTag = getEndTag(selection, node);
-  return startTag != null && endTag != null ? startTag.concat(endTag) : null;
-};
-
 function typeMatcher(): NodeMatcher {
   const delimiterSelector = selectWithLeadingDelimiter(":");
   return function (selection: SelectionWithEditor, node: SyntaxNode) {
@@ -214,13 +176,6 @@ const nodeMatchers: Partial<
   ),
   ifStatement: "if_statement",
   anonymousFunction: ["arrow_function", "function"],
-  name: [
-    "*[name]",
-    "optional_parameter.identifier!",
-    "required_parameter.identifier!",
-    "augmented_assignment_expression[left]",
-    "assignment_expression[left]",
-  ],
   comment: "comment",
   regularExpression: "regex",
   className: ["class_declaration[name]", "class[name]"],
@@ -337,16 +292,6 @@ const nodeMatchers: Partial<
   argumentOrParameter: argumentMatcher("formal_parameters", "arguments"),
   // XML, JSX
   attribute: ["jsx_attribute"],
-  xmlElement: cascadingMatcher(
-    matcher(
-      typedNodeFinder("jsx_element", "jsx_self_closing_element"),
-      xmlElementExtractor,
-    ),
-    matcher(typedNodeFinder("jsx_fragment"), jsxFragmentExtractor),
-  ),
-  xmlBothTags: getTags,
-  xmlStartTag: getStartTag,
-  xmlEndTag: getEndTag,
 };
 
 export const patternMatchers = createPatternMatchers(nodeMatchers);

packages/cursorless-engine/src/util/nodeSelectors.ts

@@ -427,25 +427,6 @@ export function xmlElementExtractor(
   return selection;
 }
 
-export function jsxFragmentExtractor(
-  editor: TextEditor,
-  node: SyntaxNode,
-): SelectionWithContext {
-  const selection = simpleSelectionExtractor(editor, node);
-
-  // Interior range for an element is found by excluding the start and end nodes.
-  const startPosition = node.children[1].endPosition;
-  const endPosition = node.children.at(-3)!.startPosition;
-  selection.context.interiorRange = new Range(
-    startPosition.row,
-    startPosition.column,
-    endPosition.row,
-    endPosition.column,
-  );
-
-  return selection;
-}
-
 export function getInsertionDelimiter(
   editor: TextEditor,
   leadingDelimiterRange: Range | undefined,

packages/cursorless-vscode-e2e/src/suite/fixtures/recorded/languages/typescript/clearEveryElement.yml

@@ -0,0 +1,32 @@
+languageId: typescriptreact
+command:
+  version: 5
+  spokenForm: clear every element
+  action: {name: clearAndSetSelection}
+  targets:
+    - type: primitive
+      modifiers:
+        - type: everyScope
+          scopeType: {type: xmlElement}
+  usePrePhraseSnapshot: true
+initialState:
+  documentContents: |-
+    <aaa>
+        <bbb>ccc</bbb>
+        <bbb>ddd</bbb>
+    </aaa>
+  selections:
+    - anchor: {line: 1, character: 4}
+      active: {line: 1, character: 4}
+  marks: {}
+finalState:
+  documentContents: |-
+    <aaa>
+        
+        
+    </aaa>
+  selections:
+    - anchor: {line: 1, character: 4}
+      active: {line: 1, character: 4}
+    - anchor: {line: 2, character: 4}
+      active: {line: 2, character: 4}

packages/cursorless-vscode-e2e/src/suite/fixtures/recorded/languages/typescript/clearEveryElement2.yml

@@ -0,0 +1,32 @@
+languageId: typescriptreact
+command:
+  version: 5
+  spokenForm: clear every element
+  action: {name: clearAndSetSelection}
+  targets:
+    - type: primitive
+      modifiers:
+        - type: everyScope
+          scopeType: {type: xmlElement}
+  usePrePhraseSnapshot: true
+initialState:
+  documentContents: |-
+    <>
+        <bbb>ccc</bbb>
+        <bbb>ddd</bbb>
+    </>
+  selections:
+    - anchor: {line: 1, character: 4}
+      active: {line: 1, character: 4}
+  marks: {}
+finalState:
+  documentContents: |-
+    <>
+        
+        
+    </>
+  selections:
+    - anchor: {line: 1, character: 4}
+      active: {line: 1, character: 4}
+    - anchor: {line: 2, character: 4}
+      active: {line: 2, character: 4}

packages/cursorless-vscode-e2e/src/suite/fixtures/recorded/languages/typescript/clearEveryElement3.yml

@@ -0,0 +1,32 @@
+languageId: typescriptreact
+command:
+  version: 5
+  spokenForm: clear every element
+  action: {name: clearAndSetSelection}
+  targets:
+    - type: primitive
+      modifiers:
+        - type: everyScope
+          scopeType: {type: xmlElement}
+  usePrePhraseSnapshot: true
+initialState:
+  documentContents: |-
+    <>
+        <>ccc</>
+        <>ddd</>
+    </>
+  selections:
+    - anchor: {line: 1, character: 4}
+      active: {line: 1, character: 4}
+  marks: {}
+finalState:
+  documentContents: |-
+    <>
+        
+        
+    </>
+  selections:
+    - anchor: {line: 1, character: 4}
+      active: {line: 1, character: 4}
+    - anchor: {line: 2, character: 4}
+      active: {line: 2, character: 4}

packages/cursorless-vscode-e2e/src/suite/fixtures/recorded/languages/typescript/clearEveryElement4.yml

@@ -0,0 +1,32 @@
+languageId: typescriptreact
+command:
+  version: 5
+  spokenForm: clear every element
+  action: {name: clearAndSetSelection}
+  targets:
+    - type: primitive
+      modifiers:
+        - type: everyScope
+          scopeType: {type: xmlElement}
+  usePrePhraseSnapshot: true
+initialState:
+  documentContents: |-
+    <aaa>
+        <>ccc</>
+        <>ddd</>
+    </aaa>
+  selections:
+    - anchor: {line: 1, character: 4}
+      active: {line: 1, character: 4}
+  marks: {}
+finalState:
+  documentContents: |-
+    <aaa>
+        
+        
+    </aaa>
+  selections:
+    - anchor: {line: 1, character: 4}
+      active: {line: 1, character: 4}
+    - anchor: {line: 2, character: 4}
+      active: {line: 2, character: 4}

packages/cursorless-vscode-e2e/src/suite/fixtures/recorded/languages/typescript/clearEveryEndTag.yml

@@ -0,0 +1,32 @@
+languageId: typescriptreact
+command:
+  version: 5
+  spokenForm: clear every end tag
+  action: {name: clearAndSetSelection}
+  targets:
+    - type: primitive
+      modifiers:
+        - type: everyScope
+          scopeType: {type: xmlEndTag}
+  usePrePhraseSnapshot: true
+initialState:
+  documentContents: |-
+    <>
+        <>ccc</>
+        <>ddd</>
+    </>
+  selections:
+    - anchor: {line: 1, character: 4}
+      active: {line: 1, character: 4}
+  marks: {}
+finalState:
+  documentContents: |-
+    <>
+        <>ccc
+        <>ddd
+    </>
+  selections:
+    - anchor: {line: 1, character: 9}
+      active: {line: 1, character: 9}
+    - anchor: {line: 2, character: 9}
+      active: {line: 2, character: 9}

packages/cursorless-vscode-e2e/src/suite/fixtures/recorded/languages/typescript/clearEveryEndTag2.yml

@@ -0,0 +1,32 @@
+languageId: typescriptreact
+command:
+  version: 5
+  spokenForm: clear every end tag
+  action: {name: clearAndSetSelection}
+  targets:
+    - type: primitive
+      modifiers:
+        - type: everyScope
+          scopeType: {type: xmlEndTag}
+  usePrePhraseSnapshot: true
+initialState:
+  documentContents: |-
+    <aaa>
+        <bbb>ccc</bbb>
+        <bbb>ddd</bbb>
+    </aaa>
+  selections:
+    - anchor: {line: 1, character: 4}
+      active: {line: 1, character: 4}
+  marks: {}
+finalState:
+  documentContents: |-
+    <aaa>
+        <bbb>ccc
+        <bbb>ddd
+    </aaa>
+  selections:
+    - anchor: {line: 1, character: 12}
+      active: {line: 1, character: 12}
+    - anchor: {line: 2, character: 12}
+      active: {line: 2, character: 12}

packages/cursorless-vscode-e2e/src/suite/fixtures/recorded/languages/typescript/clearEveryName.yml

@@ -0,0 +1,28 @@
+languageId: typescript
+command:
+  version: 5
+  spokenForm: clear every name
+  action: {name: clearAndSetSelection}
+  targets:
+    - type: primitive
+      modifiers:
+        - type: everyScope
+          scopeType: {type: name}
+  usePrePhraseSnapshot: true
+initialState:
+  documentContents: |-
+    const aaa = "bbb";
+    const ccc = "ddd";
+  selections:
+    - anchor: {line: 1, character: 18}
+      active: {line: 1, character: 18}
+  marks: {}
+finalState:
+  documentContents: |-
+    const  = "bbb";
+    const  = "ddd";
+  selections:
+    - anchor: {line: 0, character: 6}
+      active: {line: 0, character: 6}
+    - anchor: {line: 1, character: 6}
+      active: {line: 1, character: 6}

packages/cursorless-vscode-e2e/src/suite/fixtures/recorded/languages/typescript/clearEveryName2.yml

@@ -0,0 +1,32 @@
+languageId: typescript
+command:
+  version: 5
+  spokenForm: clear every name
+  action: {name: clearAndSetSelection}
+  targets:
+    - type: primitive
+      modifiers:
+        - type: everyScope
+          scopeType: {type: name}
+  usePrePhraseSnapshot: true
+initialState:
+  documentContents: |-
+    function eee() {
+        const aaa = "bbb";
+        const ccc = "ddd";
+    }
+  selections:
+    - anchor: {line: 2, character: 22}
+      active: {line: 2, character: 22}
+  marks: {}
+finalState:
+  documentContents: |-
+    function eee() {
+        const  = "bbb";
+        const  = "ddd";
+    }
+  selections:
+    - anchor: {line: 1, character: 10}
+      active: {line: 1, character: 10}
+    - anchor: {line: 2, character: 10}
+      active: {line: 2, character: 10}