Function validateCallbacksToLayout

dash/dash-renderer/src/actions/dependencies.js:507–669

(state_, dispatchError)

}

export function validateCallbacksToLayout(state_, dispatchError) {
    const {config, graphs, layout: layout_, paths: paths_} = state_;
    const validateIds = !config.suppress_callback_exceptions;
    let layout, paths;
    if (validateIds && config.validation_layout) {
        layout = config.validation_layout;
        paths = computePaths(layout, [], null, paths_.events);
    } else {
        layout = layout_;
        paths = paths_;
    }
    const {outputMap, inputMap, outputPatterns, inputPatterns} = graphs;

    function tail(callbacks) {
        return (
            'This ID was used in the callback(s) for Output(s):\n  ' +
            callbacks
                .map(({outputs}) => outputs.map(combineIdAndProp).join(', '))
                .join('\n  ')
        );
    }

    function missingId(id, cls, callbacks) {
        dispatchError('ID not found in layout', [
            `Attempting to connect a callback ${cls} item to component:`,
            `  "${stringifyId(id)}"`,
            'but no components with that id exist in the layout.',
            '',
            'If you are assigning callbacks to components that are',
            'generated by other callbacks (and therefore not in the',
            'initial layout), you can suppress this exception by setting',
            '`suppress_callback_exceptions=True`.',
            tail(callbacks)
        ]);
    }

    function validateProp(id, idPath, rawProp, cls, callbacks) {
        const prop = rawProp.split('@')[0];
        const component = path(idPath, layout);
        const element = Registry.resolve(component);

        // note: Flow components do not have propTypes, so we can't validate.
        if (element && element.propTypes && !element.propTypes[prop]) {
            // look for wildcard props (ie data-* etc)
            for (const propName in element.propTypes) {
                const last = propName.length - 1;
                if (
                    propName.charAt(last) === '*' &&
                    prop.substr(0, last) === propName.substr(0, last)
                ) {
                    return;
                }
            }
            const {type, namespace} = component;
            dispatchError('Invalid prop for this component', [
                `Property "${prop}" was used with component ID:`,
                `  ${JSON.stringify(id)}`,
                `in one of the ${cls} items of a callback.`,