codex-team/editor.js · critical · Error

element with ID «${holder}» is missing. Pass correct holder'

Error message

element with ID «${holder}» is missing. Pass correct holder's ID.

What it means

When `holder` is a string it is treated as an element ID and looked up in the DOM; if document.getElementById finds nothing, the constructor throws with the given ID, since the editor has nowhere to render.

Source

Thrown at src/components/core.ts:214

  public get configuration(): EditorConfig {
    return this.config;
  }

  /**
   * Checks for required fields in Editor's config
   */
  public validate(): void {
    const { holderId, holder } = this.config;

    if (holderId && holder) {
      throw Error('«holderId» and «holder» param can\'t assign at the same time.');
    }

    /**
     * Check for a holder element's existence
     */
    if (_.isString(holder) && !$.get(holder)) {
      throw Error(`element with ID «${holder}» is missing. Pass correct holder's ID.`);
    }

    if (holder && _.isObject(holder) && !$.isElement(holder)) {
      throw Error('«holder» value must be an Element node');
    }
  }

  /**
   * Initializes modules:
   *  - make and save instances
   *  - configure
   */
  public init(): void {
    /**
     * Make modules instances and save it to the @property this.moduleInstances
     */
    this.constructModules();

View on GitHub (pinned to 5f45dabbe5)

Solutions

Move initialization after DOM ready (DOMContentLoaded) or to the end of body / use defer
Verify the ID matches: document.getElementById('editorjs') before constructing
Pass the element itself (holder: el) when you already have a reference

Example fix

// before
new EditorJS({ holder: 'editorjs', tools });
// after
document.addEventListener('DOMContentLoaded', () => {
  new EditorJS({ holder: 'editorjs', tools });
});

Defensive patterns

Strategy: validation

Validate before calling

const el = document.getElementById(holderId); if (!el) throw new Error('mount node missing'); new EditorJS({ holder: el });

Type guard

const getHolderEl = (h: string): HTMLElement | null => document.getElementById(h);

Try / catch

try { new EditorJS({ holder: 'editorjs' }); } catch (e) { if (e instanceof Error && e.message.includes("is missing")) { document.addEventListener('DOMContentLoaded', () => new EditorJS({ holder: 'editorjs' })); return; } throw e; }

Prevention

Init on DOMContentLoaded or with defer
Pass the resolved element instead of an ID string

When it happens

Trigger: new EditorJS({ holder: 'editorjs' }) when no element with id="editorjs" exists yet — typically because the script runs before the DOM is ready or the ID is misspelled.

Common situations: Script loaded in <head> without defer or before the element; SSR/hydration timing where the mount node isn't present; typo'd or dynamically-generated IDs that don't match.

Related errors

AI-assisted analysis of codex-team/editor.js@5f45dabbe5 (2026-08-27). Data as JSON: /api/errors/989efec00788b073. Report an issue: GitHub.