plotly/plotly.js · warning

Insertion & removal are incompatible with edits to the same

Error message

Insertion & removal are incompatible with edits to the same index.

What it means

In a per-index edit, the '' key is reserved for insertion (add value) or removal (remove value) of the object at that index. If the same index edit object also contains other property keys, Plotly warns that insertion/removal cannot be combined with property edits on the same index, and proceeds (insert/remove wins for '', other keys remain dubious).

Source

Thrown at src/plot_api/manage_arrays.js:134

    var objVal;
    var adding, prefix;

    // first make the add and edit changes
    for(i = 0; i < componentNums.length; i++) {
        componentNum = componentNums[i];
        objEdits = edits[componentNum];
        objKeys = Object.keys(objEdits);
        objVal = objEdits[''],
        adding = isAddVal(objVal);

        if(componentNum < 0 || componentNum > componentArray.length - (adding ? 0 : 1)) {
            Loggers.warn('index out of range', componentType, componentNum);
            continue;
        }

        if(objVal !== undefined) {
            if(objKeys.length > 1) {
                Loggers.warn(
                    'Insertion & removal are incompatible with edits to the same index.',
                    componentType, componentNum);
            }

            if(isRemoveVal(objVal)) {
                deletes.push(componentNum);
            } else if(adding) {
                if(objVal === 'add') objVal = {};
                componentArray.splice(componentNum, 0, objVal);
                if(componentArrayFull) componentArrayFull.splice(componentNum, 0, {});
            } else {
                Loggers.warn('Unrecognized full object edit value',
                    componentType, componentNum, objVal);
            }

            if(firstIndexChange === -1) firstIndexChange = componentNum;
        } else {
            for(j = 0; j < objKeys.length; j++) {

View on GitHub (pinned to 1d090e0b5f)

Solutions

  1. Issue the remove/insert ('' key) and the property edits as separate operations on different indices or separate calls.
  2. If the intent is replacement, either remove then insert, or edit the existing properties without the '' key.
  3. Refactor edit-building code so '' is only present when the operation is purely add/remove.
  4. Log and assert your edit objects in development to catch mixed '' + property payloads early.

Example fix

// before
edits[2] = { '': REMOVE, text: 'x' }; // mixed remove + edit
// after
edits[2] = { '': REMOVE }; // remove only
// separately:
edits[1] = { text: 'x' };
Defensive patterns

Strategy: validation

Validate before calling

function assertNoMixedRemoveEdit(edits) {
  for (const [idx, obj] of Object.entries(edits)) {
    if (obj && '' in obj && Object.keys(obj).length > 1) {
      throw new Error(`Index ${idx}: cannot combine insert/remove with property edits`);
    }
  }
}

Type guard

function isPureAddOrRemove(objEdits) { return objEdits != null && (Object.keys(objEdits).length === 1 && '' in objEdits); }

Prevention

When it happens

Trigger: Building an edit like edits[2] = {'': null, text: 'new'} (remove plus edit) or {'': newObj, x: 5} (insert plus edit) in one relayout/React-style payload.

Common situations: Generic reducers that merge 'set value' and 'remove item' actions for the same array element, or edit builders that always attach the '' slot alongside collected property changes.

Related errors


AI-assisted analysis of plotly/plotly.js@1d090e0b5f (2026-09-02). Data as JSON: /api/errors/0598d5df826c953a. Report an issue: GitHub.