Autocompletion does not trigger on certain characters

Hello again,

Hope you are having a good day. I’ve recently added in dialects to our SQL editor, thanks again for this package for how easy that was to implement. We often use simple table aliases, for example:

SELECT c.something FROM public.characters c

The issue I have discovered is that when using a dialect such as PostgreSQL in this scenario, because the character ‘c’ (and several other single letter characters often used as aliases like ‘a’, ‘g’, ‘k’) are defined as ‘words’ in the dialect, the auto completion does not function. See my minimal reproducible example here:
https://codesandbox.io/p/sandbox/react-16-8-forked-7fkmg4?file=%2Fsrc%2Findex.js

If you put a period ‘.’ after the table alias a, you don’t get any auto completions, but if you swap the alias to ‘b’ then it works as expected.

Given how common single letter aliases are, I was wondering if this is something that would be addressed in a fix, and if not, how might I go about removing all single letter ‘words’ from the dialect to prevent this behaviour?

Many thanks for your time as always,
Pete

This patch removes those from the list of keywords. The list comes from this page, but I’m not actually sure what role those play in the Postgres syntax, and I guess in this context they don’t get tokenized as keywords.

1 Like

Fantastic, thank you for the rapid response and fix.

Hi @marijn, I’ve updated to the latest version of codemirror/lang-sql and all the related codemirror packages, but there seems to be some compatibility issues, see this example on code sandbox here:

https://codesandbox.io/p/sandbox/react-16-forked-34d9kh?file=%2Fsrc%2FApp.js

Are there some packages which need to be on older versions to work together? Many thanks in advance for any time you have to look into this.

Best,
Pete

language.of(sql({})) is now how you use this. Just include sql() in your set of extensions.

@marijn apologies I was adapting a previous example and did not remove the {}, the issue seems to remain though after removing the curly braces. Perhaps because we are on an old version of Node at this point? (v16)

Don’t just remove the {}, but also the language.of(). Consider using TypeScript to catch this kind of bad API uses.

So sorry about that, setting just sql() in the extensions does not resolve the issue though sadly. In fact just importing:

import { sql } from "@codemirror/lang-sql";

Is enough to cause the error, even when I don’t use it.

I have no idea what versions of dependencies codesandbox is installing, since it doesn’t seem to provide any insight there. But when I install the stuff from that package.json locally and import sql, there’s no such error.

Thanks again, I’ll try looking into reproducing it another way and let you know if I am able, thanks so much for your time.