connectRange does not trigger an update when both range bounds are set to undefined

🐛 Bug description

I’m working on a connectRange() implementation with a custom slider library (noUiSlider) and have run into the issue that connectRange will not trigger an update when I call refine([undefined, undefined]). I have tracked down the code that ultimately causes this behaviour, which is this if-statement in the connectRange source code.

I have also found that this issue only occurs when I have an override for the onStateChange method on the InstantSearchOptions object passed to the instantsearch() factory function. If I remove this override everything works as expected.

🔍 Bug reproduction

1. Create and register a connnectRange() widget

2. Have an override of onStateChange() in the configuration passed to the instantsearch() factory function, exactly as the documentation shows:

   {
       onStateChange({ uiState, setUiState })
       {
           setUiState(uiState)
       }
   }
   

3. Restrict one bound of the range (UI updates as expected)

4. Reset that bound to match the corresponding range min/max value. (UI does not update)

Live reproduction:

In this live example perform the following steps:

1. click down the max-value of the price number input, and watch the results count go down

2. click back up the max-value, then the results count should go back up, but it doesn’t. Nor does the hits list update as expected.

3. click on any pagination link, and watch the results count update now.

   Because of the observation in step 3, it looks like it that the bounds are updated internally, because if I have any other interaction afterwards that triggers an update of the search results, the reset bounds do get noticed and my UI updates using the undefined bounds.

4. Comment (disable) the onStateChange override

5. Perform steps 1 to 3 again, and see everything work as expected.

💭 Expected behavior

The refine() documentation states:

You can use undefined to remove a previously set bound or to set an infinite bound.

This makes me expect that when the state is for instance [10, undefined] and then I call refine([undefined, undefined]) that the lower bound 10 is being removed, and then a new search is triggered, regardless of other non-related options such as the onStateChange method.

Environment

• OS: macOS
• Browser: Chrome - Version 87.0.4280.88 (Official Build) (x86_64)
• instantsearch.js version: 4.10.0-experimental-typescript.0

[eunjae-lee]

Hey @JJWesterkamp I just tested it and in https://github.com/algolia/instantsearch.js/pull/4627 it will be fixed as well. I just added a test to make sure it works there 😃

[eunjae-lee]

Hello @JJWesterkamp , this has been released in 4.13.2