v2 - hierarchical facets added to state several times when using routing
See original GitHub issueBug 🐞
What is the current behavior?
When using an ais-refinement-list and ais-menu, while also having routing (using historyRouter and simpleMapping) enabled, the hierarchical facets are added multiple times to the search parameters.
A small CodeSandbox showing this behavior:
https://codesandbox.io/s/9324rjjz3p
Upon page load, using the browser’s network activity inspector, the request to Algolia servers shows that categories
has been added to facets
twice.
The bug is especially noticeable when working locally, as every time one changes something in a Vue file and a refresh happens, the duplicated hierarchical facets are duplicated again. Which, due to routing with state mapping being enabled, will result in the app hanging for several seconds or even crashing.
This can best be reproduced by opening components/Facet.vue and adding a line break in the template, so a refresh happens.
What is the expected behavior?
The hierarchicalFacets should only be added once.
Does this happen only in specific situations?
When using ais-menu or ais-refinement-list together with routing enabled.
What is the proposed solution?
Unfortunately I haven’t figured out exactly where the bug is coming from.
What is the version you are using?
2.0.0-beta.1
Issue Analytics
- State:
- Created 5 years ago
- Comments:5 (3 by maintainers)
Top GitHub Comments
Indeed the facet is added multiple times (2 times on the first render). But this should only happens with the hot reload. It should not happen in production because. The issue still persist on production but with a limited impact (it should not have more than 2 duplicates). The issue is not with Vue InstantSearch but with InstantSearch.js. Close in favor of https://github.com/algolia/instantsearch.js/issues/3278.
Thought about that too, yes. The custom connector in the component is doing a search to fetch all ~1000 items to show on the map. I’d have to do that in the v-show part to avoid the issue and put the actual map in the v-if part. I would also need to tell the connector to not fetch results when the map is not visible. So it would indeed be possible to avoid the issue!