monaco-graphql: handle SDL & high throughput schema changes

(carrying over this discussion with @acao from discord)

We’ve been using monaco-graphql to edit graphql schemas across multiple files, and it seems like the autocomplete (at least at the document level) is actually pretty operation-specific (e.g. suggesting query/mutation/subscription/fragment, as opposed to type/interface/enum/etc):

🖼 Screenshot of autocomplete suggestions

One thing to note is that currently we’re updating the mode schema on each change (debounced), but the SDL passed to the monaco-graphql API could be invalid — this causes some trouble as the graphql autocomplete suggestions come and go as the schema is or isn’t valid. I know the worker should get destroyed and re-created on each schema change, but our setup (and our schema being very large) seems to cause some crashing issues where there are still a number of worker threads hanging around:

🖼 Screenshot of sources tab

Two major issues here:

• inline SDL autocompletion features are not working anymore!!
• High throughput changes to the graphql schema for monaco-graphql cause issues with workers

[acao]

Here’s the video!

https://www.dropbox.com/home/Apps/Jitsi Meet/Recordings?preview=wholeaugustsoptfree+on+2022-02-22+20-13.mp4

[cshaver]

Notes from pairing with @acao today! 🎉

we looked at:

• confirmed on the latest vite example, too many workers is triggered by schema changes
• look at how schema is shared with the worker, since this can change often
  • e.g. innoDB, cache api

found some bugs:

• (monaco-editor) bg missing on autocomplete box - need to create a bug ticket for them!
• repro’d https://github.com/graphql/graphiql/pull/2171/files
• monaco-react webpack example has some bugs that vite doesn’t
  • would be cool to get a basic cypress test (get model markers from monaco), visual diff testing
• (monaco?) lots of logs from monarchCommon on parsing directives
• improve webpack example config, so the web workers output name aren’t hashed
• devx of running examples from root maybe: yarn run example:<example name>