Dogfalo/materialize · error · Error

noUiSlider: 'orientation' option is invalid.

Error message

noUiSlider: 'orientation' option is invalid.

What it means

Thrown by the default case of testOrientation's switch. Only the exact strings 'horizontal' and 'vertical' are accepted; this version has no 'ltr'/'rtl' token and no fallback, so an unrecognized or undefined value lands in default and throws.

Source

Thrown at extras/noUiSlider/nouislider.js:589

            connect = entry;
        }

        parsed.connect = connect;
    }

    function testOrientation ( parsed, entry ) {

        // Set orientation to an a numerical value for easy
        // array selection.
        switch ( entry ){
            case 'horizontal':
                parsed.ort = 0;
                break;
            case 'vertical':
                parsed.ort = 1;
                break;
            default:
                throw new Error("noUiSlider: 'orientation' option is invalid.");
        }
    }

    function testMargin ( parsed, entry ) {

        if ( !isNumeric(entry) ){
            throw new Error("noUiSlider: 'margin' option must be numeric.");
        }

        // Issue #582
        if ( entry === 0 ) {
            return;
        }

        parsed.margin = parsed.spectrum.getMargin(entry);

        if ( !parsed.margin ) {
            throw new Error("noUiSlider: 'margin' option is only supported on linear sliders.");

View on GitHub (pinned to 824e78248b)

Solutions

1. Use the exact strings 'horizontal' or 'vertical'.
2. Omit orientation entirely so the default applies (do not pass undefined explicitly).
3. Guard upstream: if (!['horizontal','vertical'].includes(o)) o = 'horizontal'.

Example fix

// before
orientation: 'h'
// after
orientation: 'horizontal'

const VALID = ['horizontal', 'vertical'];
if (opts.orientation != null && !VALID.includes(opts.orientation)) {
  opts.orientation = opts.orientation === undefined ? opts.orientation : 'horizontal';
  if (!VALID.includes(opts.orientation)) throw new Error("orientation must be 'horizontal' or 'vertical'");
}

function isOrientation(v) { return v === 'horizontal' || v === 'vertical'; }

try { noUiSlider.create(el, opts); }
catch (e) { if (/orientation' option is invalid/.test(e.message)) { delete opts.orientation; /* retry with default */ } else throw e; }

When it happens

Trigger: orientation: 'h', orientation: 'vert', orientation: 'top', or explicitly passing orientation: undefined into the test.

Common situations: Abbreviating the string, passing an enum/constant that resolved to undefined, or a version mismatch where code expects newer 'ltr'/'rtl' tokens that this build does not support.

Related errors

• noUiSlider: 'range' contains invalid value.
• noUiSlider: 'range' value isn't numeric.
• noUiSlider: 'limit', 'margin' and 'padding' must be divisibl
• noUiSlider: 'step' is not numeric.
• noUiSlider: 'range' is not an object.

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