Autocompletion Issues when the first character is "@" sign

Hi,

I wrote the AlpineJS extension however I am having some difficulties with the completion AssistantsRegistry… there seem to be a bug with regards to @ sign

It is hard to explain but I will try to do so with an example, the issue seems to be with the first character being @ symbol for type hinting.

To replicate:

  1. Install AlpineJS extension
  2. now create any html tag in the .html file
<p></p>
  1. AlpineJS has event listeners starting with the @ character such as @click etc
<p @c ... ></p>
  1. if you type the @c for example to bring up the “@click” auto suggestion, everything works fine but once you click on the suggestion that is provided, Nova will add the suggestion after the @ instead of deleting or replacing it with the suggestion like in any other instances…
<p @@click="" ></p>

instead of

<p @click ="" ></p>

There is no issue if normal characters are used for autocompletion , or if the user for example types cl to bring up the autocompletion for @click="..."


The APIs the extension is using:

  • The extension is made using the AssistantsRegistry
  • uses insertTextFormat.Snippet
  • the kind is CompletionItemKind.Property

Any suggestions would be really appreciated!
Thanks
Emran


update

I just realise this is also the case for other none standard characters as well such as “:” for example for the “:class” directive in alpineJS , so instead of :class the user will get ::class

Hi Emran,

The default behavior in Nova is to replace the word preceding the cursor with what is defined as the label when instantiating a new CompletionItem object. The problem in this case is that Nova does not consider the @ symbol to be part of the “word”, so it is not replaced when the label text ("@click") is inserted. This results in the additional “@” symbol.

In fact, I suspect the @ symbol is isn’t even a trigger for the autocompletion. In other words, if you type @, no suggestions are provided. And, if you just typed “c” without the @ symbol a suggestion would still be offered.

There are a couple of way you could deal with this issue. The easiest is simply set the “insertText” property (CompletionItem - Nova) of the CompletionItem to “click” and leave the label set to “@click”. This way when the user selects the “@click” suggestion, only “click” will be inserted.

The second, more complex, option would be to set the “range” (CompletionItem - Nova) property so that the additional preceding character (the @ symbol) is also replaced.

Hope this helps! It took me awhile to wrap my head around this, so if I can clarify anything let me know.

Jason

1 Like

As for correctly triggering the autocompletion, I believe this requires passing the “triggerChars” when registering the completion assistant (AssistantsRegistry - Nova). The triggerChars value should be a Charset object.

This is a problem I need to address in the Tailwind extension for the @tailwind, @layer, etc directives. In the small amount of time I have had to spend on it, I don’t think I was able to get it working correctly. :confused:

1 Like

Here is an example of how this is being handled in the Tailwind extension:

1 Like

That is correct; I’m using this mechanism to trigger autocompleting after the “$” variable expansion operator in my finished-anytime-soon-I-swear Fish extension.

3 Likes

Perfect!! Thank you so much for the comprehensive answer!! I really appreciate it. I don’t think I would have had any chance whatsoever figuring this out myself!

Glad its a quick fix at least and not having to pull my hair out sorting it! :sweat_smile:

1 Like

Thanks for confirming Martin!