{"record":{"id":"74f24ad20584a698","repo":"Dogfalo/materialize","slug":"nouislider-connect-option-doesn-t-match-handle","errorCode":null,"errorMessage":"noUiSlider: 'connect' option doesn't match handle count.","messagePattern":"noUiSlider: 'connect' option doesn't match handle count\\.","errorType":"validation","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"extras/noUiSlider/nouislider.js","lineNumber":567,"sourceCode":"        }\n\n        else if ( entry === 'upper' ) {\n            entry = [false, true];\n        }\n\n        // Handle boolean options\n        if ( entry === true || entry === false ) {\n\n            for ( i = 1; i < parsed.handles; i++ ) {\n                connect.push(entry);\n            }\n\n            connect.push(false);\n        }\n\n        // Reject invalid input\n        else if ( !Array.isArray( entry ) || !entry.length || entry.length !== parsed.handles + 1 ) {\n            throw new Error(\"noUiSlider: 'connect' option doesn't match handle count.\");\n        }\n\n        else {\n            connect = entry;\n        }\n\n        parsed.connect = connect;\n    }\n\n    function testOrientation ( parsed, entry ) {\n\n        // Set orientation to an a numerical value for easy\n        // array selection.\n        switch ( entry ){\n            case 'horizontal':\n                parsed.ort = 0;\n                break;\n            case 'vertical':","sourceCodeStart":549,"sourceCodeEnd":585,"githubUrl":"https://github.com/Dogfalo/materialize/blob/824e78248b3de81e383445e76ffb04cc3264fe7d/extras/noUiSlider/nouislider.js#L549-L585","documentation":"Thrown by testConnect after legacy 'lower'/'upper' mapping and boolean expansion, when connect is not an array of length parsed.handles + 1. The connect array marks which gaps (before, between, and after handles) get a filled bar, so its length must be exactly one more than the number of handles.","triggerScenarios":"Two handles with connect: [true, false] (length 2, need 3). Single handle with connect: [true] (need length 2). connect: 'middle' (unrecognized). Wrong-length array from a different handle-count example.","commonSituations":"Adding or removing a handle without resizing connect, copy-pasting a connect config from a sample with a different handle count, or assuming connect length equals handles (it is handles + 1).","solutions":["Size connect to start.length + 1.","For a uniform fill use a single boolean: connect: true (the library expands it).","Use the legacy 'lower' or 'upper' strings for the common two-handle edge cases."],"exampleFix":"// before\nstart: [10, 90], connect: [true, false]\n// after\nstart: [10, 90], connect: [true, false, true]","handlingStrategy":"validation","validationCode":"const handles = (Array.isArray(opts.start) ? opts.start : [opts.start]).length;\nlet connect = opts.connect;\nif (connect === 'lower') connect = [true, false];\nelse if (connect === 'upper') connect = [false, true];\nif (connect === true || connect === false) connect = [false].concat(new Array(handles - 1).fill(connect), false);\nif (!Array.isArray(connect) || connect.length !== handles + 1) {\n  throw new Error('connect must have length ' + (handles + 1));\n}","typeGuard":null,"tryCatchPattern":"try { noUiSlider.create(el, opts); }\ncatch (e) { if (/connect' option doesn't match/.test(e.message)) { opts.connect = new Array(handles + 1).fill(false); /* retry */ } else throw e; }","preventionTips":["Derive connect length from start.length + 1, never hard-code it.","Prefer the boolean shorthand connect: true for uniform fill.","Recompute connect whenever the handle count changes."],"tags":["config","validation","connect","handles"],"backgroundTag":null,"analyzedSha":"824e78248b3de81e383445e76ffb04cc3264fe7d","analyzedAt":"2026-08-13T04:14:22.506Z","schemaVersion":2},"datasetVersion":"2026-08-13T04:17:16.726Z"}