Instantiating Sliders in a hidden container

Challenge

Sliders use DOM position offsets to calculate value. The initial offsets are calculated at instantiation. If the Slider is instantiated in a hidden container, the initial offsets are stored as NaN, resulting in all further calculations returning NaN.

Solution(s)

There are three methods to create Sliders with functional offset calculations:

1. Don't instantiate the Slider until the container is displayed (preferred)
2. Execute the slider thumb's resetConstraints method and the Slider's setStartSliderState when the container is displayed
3. Patch the Slider's verifyOffset method to account for incorrectly initialized offsets

Each of these approaches has its drawbacks (noted in the code below).

DualSlider additionally needs some code patches to facilitate correcting its reference values (for options #2 and #3).

Caveat: Attempts to getValue or setValue will still fail (return NaN) as long as the Slider is not displayed.

Solution #1: Instantiate on container display

Unhide Container

Slider

Value: (unknown)

DualSlider

Range: (unknown)

Solution #2: Reset internal references on container display

Unhide Container

Slider

Value: (unknown)

DualSlider

Range: (unknown)

Solution #3: Patch Slider's verifyOffset method

Unhide Container

Slider

Value: (unknown)

DualSlider (still broken)

Range: (unknown)