HelloZeroNet/ZeroNet · error · Error

Provide a transitions object to the projectionOptions to do

Error message

Provide a transitions object to the projectionOptions to do animations

What it means

missingTransition is used as a placeholder for transition-related projectionOptions (transitions.enterAnimation, exitAnimation, etc.). When a render/update triggers an animation (entering or exiting DOM nodes) and no transitions object was supplied via projectionOptions, maquette calls this stub which throws. Animations in maquette are opt-in and require an explicit transitions strategy.

Source

Thrown at plugins/UiConfig/media/js/all.js:263

    };
    var appendChildren = function (parentSelector, insertions, main) {
        for (var i = 0; i < insertions.length; i++) {
            var item = insertions[i];
            if (Array.isArray(item)) {
                appendChildren(parentSelector, item, main);
            } else {
                if (item !== null && item !== undefined) {
                    if (!item.hasOwnProperty('vnodeSelector')) {
                        item = toTextVNode(item);
                    }
                    main.push(item);
                }
            }
        }
    };
    // Render helper functions
    var missingTransition = function () {
        throw new Error('Provide a transitions object to the projectionOptions to do animations');
    };
    var DEFAULT_PROJECTION_OPTIONS = {
        namespace: undefined,
        eventHandlerInterceptor: undefined,
        styleApplyer: function (domNode, styleName, value) {
            // Provides a hook to add vendor prefixes for browsers that still need it.
            domNode.style[styleName] = value;
        },
        transitions: {
            enter: missingTransition,
            exit: missingTransition
        }
    };
    var applyDefaultProjectionOptions = function (projectorOptions) {
        return extend(DEFAULT_PROJECTION_OPTIONS, projectorOptions);
    };
    var checkStyleValue = function (styleValue) {
        if (typeof styleValue !== 'string') {

View on GitHub (pinned to 454c0b2e7e)

Solutions

  1. Pass a transitions object: projectionOptions = { transitions: maquette.createCSSTransitionsAnimationHelper() } when calling dom.append/merge/createDom or projector.append.
  2. If you don't need animations, remove the enterAnimation/exitAnimation properties from your vnodes so missingTransition is never invoked.
  3. Use the same projectionOptions object everywhere in a projector so the transitions object is consistently applied.
  4. If a projector was already created, you can modify DEFAULT_PROJECTION_OPTIONS.transions via maquette.setProjectionOptions (or extendProjectionOptions) before first render.

Example fix

// before
var projection = dom.append(container, h('div', { enterAnimation: 'fadeIn' }, ['hi']));
// after
var projectionOptions = { transitions: maquette.createCSSTransitionsAnimationHelper() };
var projection = dom.append(container, h('div', { enterAnimation: 'fadeIn' }, ['hi']), projectionOptions);
Defensive patterns

Strategy: validation

Validate before calling

function assertTransitions(projectionOptions) {
  if (projectionOptions && !projectionOptions.transitions) {
    throw new Error('projectionOptions.transitions is required when using enter/exit animations');
  }
}
// call before dom.append/merge/createDom

Type guard

function hasTransitions(opts) {
  return typeof opts === 'object' && opts !== null && typeof opts.transitions === 'object' && opts.transitions !== null;
}

Try / catch

try {
  projection = dom.append(container, vnode, projectionOptions);
} catch (e) {
  if (e.message.indexOf('transitions object') !== -1) {
    projection = dom.append(container, vnode, Object.assign({ transitions: createCSSTransitionsAnimationHelper() }, projectionOptions));
  } else { throw e; }
}

Prevention

When it happens

Trigger: Calling dom.append/dom.merge/dom.createDom (or projector.append) with vnodes that have enterAnimation/exitAnimation properties set, while the projectionOptions object has no `transitions` key, so the default missingTransition stub is invoked during DOM creation or removal.

Common situations: Developers copy vnodes using CSS-transition helper properties (enterAnimation/exitAnimation) from examples but forget to pass `transitions: createCSSTransitionsAnimationHelper()` (or any object) into projectionOptions; also happens when bundling only part of maquette (e.g. the all.js bundle) where the transitions helper was tree-shaken or the projector was created without projection options.

Related errors


AI-assisted analysis of HelloZeroNet/ZeroNet@454c0b2e7e (2026-09-02). Data as JSON: /api/errors/9f154a05da8efa82. Report an issue: GitHub.