Autocompletion: Merging `override` in config


I’m working on an app that uses CodeMirror 6 as a markdown editor. It allows users to load custom CodeMirror 6 plugins.

I’m having trouble with multiple extensions trying to provide completions without enabling completion globally. For example,

// A user-provided extension
const ext1 = [
    // Use override to avoid enabling autocompletion for languages loaded
    // into the editor by the main application:
    autocompletion({ override: [source1] }),

    // Also supply language data for the case where another extension enables
    // languagedata-based autocompletion:
    EditorState.languageData.of(() => [{ autocomplete: source1 }]),

// Another user-provided extension (would be provided in a separate
// file from ext1).
const ext2 = autocomplete({ override: [ source2, source3 ] });

const editorExtensions  = [
    // ...languageData, etc.
    ext1, ext2

// Include editorExtensions in an EditorView.

Currently, this leads to a “merge conflict” error (see demo) when merging completion sources.

I’m wondering what the best way to handle this would be. Ideally, user-provided extensions should (among other things), be able to

  1. Provide autocompletions without enabling languageData-based autocompletion
  2. Optionally enable languageData-based autocomplete
  3. Continue to work if languageData-based autocompletion is enabled by another extension.

One possible solution would be to expose a CodeMirror extension to user plugins that wraps autocompletion. A user-provided CodeMirror extension might then look like this (example with a transactionExtender and Facet implementation):

const { editorCompletionSource, enableLanguageDataAutocomplete } = customCodeMirrorExtensions;
export const userExtension = () => {
  const listCompletion = completeFromList([ "myExtraCompletion1" ])

  return [

This second solution isn’t ideal though:

  • It requires maintaining a wrapper around autocomplete that might already exist.
  • Users might still try to use autocompletion in their extensions and run into unexpected behavior when multiple autocompletions are loaded.


  • Is there a built-in way to merge autocomplete extensions without merge conflict errors?
  • Is there a built-in way to enable/disable completion overrides through CodeMirror Extensions?

Thank you for your time!

Don’t use override. Just provide more sources via language data (you can use EditorState.languageData to provide it globally as well).

No. This extension API is not a sandbox API. It assumes callers know what they are doing.

1 Like