Unrecognized extension value in extension set (js).

v6
1

I have some very simple code, causing this error:

Unrecognized extension value in extension set (js). This sometimes happens because multiple instances of @codemirror/state are loaded, breaking instanceof checks.

This is the code:

		createEffect(() => {
			const lang = this.language === 'html' ? htmlLang() : this.language === 'javascript' ? javascript() : this.language

			this.view = new EditorView({
				extensions: [basicSetup, lang],
				parent: this.container,
			})

			createEffect(() => {
				setContent(this.view, this.content)
			})

			onCleanup(() => {
				this.view.destroy()
			})
		})

where createEffect is from Solid.js.

Whenever this.language changes, the onCleanup runs (destroys the current view) and then the effect runs again making a new EditorView with the given lang.

When the lang is javascript(), it works fine. The problem only happens when the lang is html(), just like in this issue:

2

Oops, I thought I was passing html() or javascript() but I was actually passing in the string "js":

		new EditorView({
			extensions: [basicSetup, 'js'], // <------- HERE
			parent: container,
		})

It had nothing to do with multiple state instances (confused me for a minute).

Is this the wrong way to switch languages? Am I supposed to make a compartment for this purpose?