toggleRefinement is not parsed in the UI ( routeToState ) from the URL

Hello everyone!

I am having a big issue with Algolia InstantSearch.

I am having a toggle Refinement (boolean - yes/no) which is either checked or not. What I want, is, that when the user “checks” the box ( yes ) , and refreshes the page, that the filter is still applied on page. I have done the same with the widget refinementList, but I don’t seem to be able to do it with toggleRefinement. What I have done is :

  • including it in the buildQueryParams,
  • returning it in the parseURL , for example : Xtoggle : decodeURIComponent( value )
  • stateToRoute: return it there as well
  • routeToState: returning it there as well

actually I followed exactly the process that I followed in the previous cases of refinementList.
I debugged using console.log and saw that:

  1. buildQueryParams: the state is updated as it should, I am getting:

{ ... , xtoggleParam: true }

  1. parseURL() : after I refresh the value is there, also on the URL above on the page :

{..., xtoggleParam: "true"}, comes as a string, I also tried to pass the Boolean value, but made no difference.

  1. stateToRoute, the state changes immediately when I click the check button (to true) and console logs it as well

{ toggle : {xtoggleParam: true }

  1. routeToState(routeState) : it also returns what I want in the form of

{ ...., xtoggleParam: "true" } , also as a string.

Something else that I noticed, is, when I refresh, my refinementList filters stay intact as they should, but the checked toggleRefinement goes unchecked, although it is still in the URL in form ...&xtoggleParam=true. Then, checking something else in the refinementList, makes the ...&xtoggleParam=true disappear from the URL.

I will also need to include rating, rangeSliders etc … But for now I am stuck in the toggleRefinement. For now only the refinementList works as expected, saving the state and keeping it also after I refresh the page. Any help / documentation welcome please!

adding: it seems like the stateToRoute does not contain the xxtoggleParam : true anymore after I refresh. that is my problem I guess!

Kind Regards,
Antonis