add emmet noise check (#146)

packages/tailwindcss-intellisense/src/extension.ts

@@ -12,6 +12,8 @@ import {
   WorkspaceFolder,
   Uri,
   ConfigurationScope,
+  commands,
+  SymbolInformation,
 } from 'vscode'
 import {
   LanguageClient,
@@ -154,6 +156,7 @@ export function activate(context: ExtensionContext) {
       let emitter = createEmitter(client)
       registerConfigErrorHandler(emitter)
       registerColorDecorator(client, context, emitter)
+
       onMessage(client, 'getConfiguration', async (scope) => {
         return {
           tabSize:
@@ -161,6 +164,15 @@ export function activate(context: ExtensionContext) {
           ...Workspace.getConfiguration('tailwindCSS', scope),
         }
       })
+
+      onMessage(client, 'getDocumentSymbols', async ({ uri }) => {
+        return {
+          symbols: await commands.executeCommand<SymbolInformation[]>(
+            'vscode.executeDocumentSymbolProvider',
+            Uri.parse(uri)
+          ),
+        }
+      })
     })
 
     client.start()

packages/tailwindcss-language-service/src/completionProvider.ts

@@ -767,11 +767,10 @@ async function provideEmmetCompletions(
   let settings = await getDocumentSettings(state, document)
   if (settings.emmetCompletions !== true) return null
 
-  const syntax = isHtmlContext(state, document, position)
-    ? 'html'
-    : isJsContext(state, document, position)
-    ? 'jsx'
-    : null
+  const isHtml = isHtmlContext(state, document, position)
+  const isJs = !isHtml && isJsContext(state, document, position)
+
+  const syntax = isHtml ? 'html' : isJs ? 'jsx' : null
 
   if (syntax === null) {
     return null
@@ -801,6 +800,27 @@ async function provideEmmetCompletions(
     return null
   }
 
+  if (isJs) {
+    const abbreviation: string = extractAbbreviationResults.abbreviation
+    if (abbreviation.startsWith('this.')) {
+      return null
+    }
+    const { symbols } = await state.emitter.emit('getDocumentSymbols', {
+      uri: document.uri,
+    })
+    if (
+      symbols &&
+      symbols.find(
+        (symbol) =>
+          abbreviation === symbol.name ||
+          (abbreviation.startsWith(symbol.name + '.') &&
+            !/>|\*|\+/.test(abbreviation))
+      )
+    ) {
+      return null
+    }
+  }
+
   const emmetItems = emmetHelper.doComplete(document, position, syntax, {})
 
   if (!emmetItems || !emmetItems.items || emmetItems.items.length !== 1) {