feat: disable by default method snippet methods in jsx attributes to not be annoying when passing callbacks for attributes starting with on

Author: zardoy

src/configurationType.ts

@@ -101,11 +101,11 @@ export type Configuration = {
      *  */
     'jsxEmmet.type': 'realEmmet' | 'fakeEmmet' | 'disabled'
     /**
-     * Sorting matters
+     * Note: Sorting matters
      */
     'jsxPseudoEmmet.tags': { [tag: string]: true | string }
     /**
-     * Exclude lowercase / incorrent e.g. suggestions
+     * Exclude lowercase / incorrent suggestions
      * @default true
      */
     'jsxImproveElementsSuggestions.enabled': boolean
@@ -163,6 +163,12 @@ export type Configuration = {
      * @default true
      */
     enableMethodSnippets: boolean
+    /**
+     * Wether to disable our and builtin method snippets within jsx attributes
+     * @default true
+     */
+    // TODO add smart setting
+    'disableMethodSnippets.jsxAttributes': boolean
     /**
      * Support `@ts-diagnostic-disable` top-level comment for disabling spefici semantic diagnostics
      * Example: `// @ts-diagnostic-disable
@@ -181,8 +187,8 @@ export type Configuration = {
      */
     patchOutline: boolean
     /**
-     * Improve JSX completions:
-     * - enable fixes
+     * Improve JSX attribute completions:
+     * - enable builtin jsx attribute completion fix
      * - enable jsxCompletionsMap
      * @default true
      */

typescript/src/completions/isGoodPositionMethodCompletion.ts

@@ -1,7 +1,8 @@
 import type tslib from 'typescript/lib/tsserverlibrary'
+import { GetConfig } from '../types'
 import { findChildContainingPosition, findChildContainingPositionMaxDepth } from '../utils'
 
-export const isGoodPositionBuiltinMethodCompletion = (ts: typeof tslib, sourceFile: tslib.SourceFile, position: number) => {
+export const isGoodPositionBuiltinMethodCompletion = (ts: typeof tslib, sourceFile: tslib.SourceFile, position: number, c: GetConfig) => {
     const importClauseCandidate = findChildContainingPositionMaxDepth(ts, sourceFile, position, 3)
     if (importClauseCandidate && ts.isImportClause(importClauseCandidate)) return false
     const textBeforePos = sourceFile.getFullText().slice(position - 1, position)
@@ -14,6 +15,7 @@ export const isGoodPositionBuiltinMethodCompletion = (ts: typeof tslib, sourceFi
         if (ts.isJsxSelfClosingElement(currentNode) || ts.isJsxOpeningElement(currentNode)) return false
         if (ts.isShorthandPropertyAssignment(currentNode)) currentNode = currentNode.parent
         if (ts.isObjectBindingPattern(currentNode) || ts.isObjectLiteralExpression(currentNode)) return false
+        if (c('disableMethodSnippets.jsxAttributes') && ts.isJsxExpression(currentNode)) return false
     }
     return true
 }
@@ -24,8 +26,9 @@ export const isGoodPositionMethodCompletion = (
     sourceFile: tslib.SourceFile,
     position: number,
     languageService: tslib.LanguageService,
+    c: GetConfig,
 ) => {
-    if (!isGoodPositionBuiltinMethodCompletion(ts, sourceFile, position)) return false
+    if (!isGoodPositionBuiltinMethodCompletion(ts, sourceFile, position, c)) return false
     // const { kind, displayParts } = languageService.getQuickInfoAtPosition(fileName, position) ?? {}
     // console.log('kind', kind, displayParts?.map(({ text }) => text).join(''))
     // switch (kind) {

typescript/src/completionsAtPosition.ts

@@ -229,7 +229,7 @@ export const getCompletionsAtPosition = (
     }
 
     // prevent vscode-builtin wrong insertText with methods snippets enabled
-    if (!isGoodPositionBuiltinMethodCompletion(ts, sourceFile, position - 1)) {
+    if (!isGoodPositionBuiltinMethodCompletion(ts, sourceFile, position - 1, c)) {
         prior.entries = prior.entries.map(item => {
             if (item.isSnippet) return item
             return { ...item, insertText: (item.insertText ?? item.name).replace(/\$/g, '\\$'), isSnippet: true }

typescript/src/index.ts

@@ -94,7 +94,7 @@ export = ({ typescript }: { typescript: typeof ts }) => {
                     )
                 ) {
                     // - 1 to look for possibly previous completing item
-                    let goodPosition = isGoodPositionMethodCompletion(ts, fileName, sourceFile, position - 1, info.languageService)
+                    let goodPosition = isGoodPositionMethodCompletion(ts, fileName, sourceFile, position - 1, info.languageService, c)
                     let rawPartsOverride: ts.SymbolDisplayPart[] | undefined
                     if (goodPosition && prior.kind === ts.ScriptElementKind.alias) {
                         goodPosition =

typescript/test/completions.spec.ts

@@ -66,9 +66,11 @@ test('Builtin method snippet banned positions', () => {
         const {something, met/*|*/} = test()
         ;<Test/*|*/ />
         ;<Test/*|*/></Test>
+        ;<Test test={/*|*/}></Test>
+        ;<Test test={a/*|*/}></Test>
     `)
     for (const [i, pos] of cursorPositions.entries()) {
-        const result = isGoodPositionBuiltinMethodCompletion(ts, getSourceFile(), pos)
+        const result = isGoodPositionBuiltinMethodCompletion(ts, getSourceFile(), pos, defaultConfigFunc)
         expect(result, i.toString()).toBeFalsy()
     }
     const insertTextEscaping = getCompletionsAtPosition(cursorPositions[1]!)!.entries[1]?.insertText!
@@ -86,9 +88,11 @@ test('Additional banned positions for our method snippets', () => {
         })
         ;<Test/*|*/ />
         ;<Test/*|*/></Test>
+        ;<Test test={/*|*/}></Test>
+        ;<Test test={a/*|*/}></Test>
     `)
     for (const [i, pos] of cursorPositions.entries()) {
-        const result = isGoodPositionMethodCompletion(ts, entrypoint, getSourceFile(), pos - 1, languageService)
+        const result = isGoodPositionMethodCompletion(ts, entrypoint, getSourceFile(), pos - 1, languageService, defaultConfigFunc)
         expect(result, i.toString()).toBeFalsy()
     }
 })
@@ -106,7 +110,7 @@ test('Not banned positions for our method snippets', () => {
         test2/*|*/
     `)
     for (const [i, pos] of cursorPositions.entries()) {
-        const result = isGoodPositionMethodCompletion(ts, entrypoint, getSourceFile(), pos - 1, languageService)
+        const result = isGoodPositionMethodCompletion(ts, entrypoint, getSourceFile(), pos - 1, languageService, defaultConfigFunc)
         expect(result, i.toString()).toBeTruthy()
     }
 })