Dogfalo/materialize · error · Error

noUiSlider: 'tooltips' must be passed a formatter or 'false'

Error message

noUiSlider: 'tooltips' must be passed a formatter or 'false'.

What it means

Each element of the tooltips array must be either a boolean (true shows a default tooltip, false hides it) or an object exposing a .to(value) formatter function. The library rejects anything else so that rendering never receives an uncallable value.

Source

Thrown at extras/noUiSlider/nouislider.js:725

            parsed.tooltips = [];

            for ( var i = 0; i < parsed.handles; i++ ) {
                parsed.tooltips.push(true);
            }
        }

        else {

            parsed.tooltips = asArray(entry);

            if ( parsed.tooltips.length !== parsed.handles ) {
                throw new Error("noUiSlider: must pass a formatter for all handles.");
            }

            parsed.tooltips.forEach(function(formatter){
                if ( typeof formatter !== 'boolean' && (typeof formatter !== 'object' || typeof formatter.to !== 'function') ) {
                    throw new Error("noUiSlider: 'tooltips' must be passed a formatter or 'false'.");
                }
            });
        }
    }

    function testFormat ( parsed, entry ) {

        parsed.format = entry;

        // Any object with a to and from method is supported.
        if ( typeof entry.to === 'function' && typeof entry.from === 'function' ) {
            return true;
        }

        throw new Error("noUiSlider: 'format' requires 'to' and 'from' methods.");
    }

    function testCssPrefix ( parsed, entry ) {

View on GitHub (pinned to 824e78248b)

Solutions

  1. Use false to hide a tooltip and true for the default.
  2. Provide a formatter object with a to function: wNumb({ decimals: 0, prefix: '$' }) or { to: v => v + '%' }.
  3. Replace null entries with false.

Example fix

// before
noUiSlider.create(el, { start: [0], range:{min:0,max:100}, tooltips: ['%'] });
// after
noUiSlider.create(el, { start: [0], range:{min:0,max:100}, tooltips: [{ to: v => v + '%' }] });
Defensive patterns

Strategy: type-guard

Validate before calling

function normalizeTooltips(opts) {
  const handles = Array.isArray(opts.start) ? opts.start.length : 1;
  if (opts.tooltips == null) return Array(handles).fill(true);
  return (Array.isArray(opts.tooltips) ? opts.tooltips : [opts.tooltips]).map(t => {
    if (t === false || t === true) return t;
    if (t && typeof t.to === 'function') return t;
    throw new TypeError('each tooltip must be boolean or { to: fn }');
  });
}

Type guard

function isTooltipEntry(t) {
  return typeof t === 'boolean' || (typeof t === 'object' && t !== null && typeof t.to === 'function');
}

Prevention

When it happens

Trigger: Pass tooltips as an array containing a string, number, null, or an object without a .to function. For example tooltips:['%'], tooltips:[null], or tooltips:[{ format: x => x }].

Common situations: Developers pass a CSS/label string instead of a formatter object, pass a wNumb formatter whose .to was renamed, or pass null expecting it to mean 'hidden' (use false instead).

Related errors


AI-assisted analysis of Dogfalo/materialize@824e78248b (2026-08-13). Data as JSON: /api/errors/ee69b50b4902c66d. Report an issue: GitHub.