Nuxt Ais-Hierarchical-Menu SSR problem.

[lacral]

Bug 🐞

What is the current behavior?

if i refresh the search the page that have a ais-hierarchical-menu and nuxt-link

Make a sandbox with the current behavior

https://codesandbox.io/s/nuxt-algolia-ais-hierarchical-menu-ssr-p25jn?file=/pages/search.vue

What is the expected behavior?

Does this happen only in specific situations?

if i remove the following line:
<nuxt-link to="x">Home</nuxt-link>
it start working?

What is the version you are using?

in my myproject:
“algoliasearch”: “^4.5.1”,
“nuxt”: “^2.14.5”,
“vue”: “^2.6.12”,
“vue-instantsearch”: “^3.2.0”,

do i have to use asyncData() for createServerRootMixin ?
it is a good choise to make mixin plugin for createServerRootMixin ?

i did Open Q&A in https://discourse.algolia.com/t/anchor-tag-in-hierarchical-menu/10892/5

Araldo Fidalgo

[Haroenv]

Hi @lacral, what a coincidence, this issue is also solved in the latest version via the PR #863 and in version 3.3.0: https://codesandbox.io/s/nuxt-algolia-ais-hierarchical-menu-ssr-forked-5vysc

[lacral]

Hi @Haroenv

The problem about was solve with version "vue-instantsearch": "^3.3.0"

---

But now with "vue-instantsearch": "^3.4.1"
Another error starts to show.

Error:
Can't access property "length", e.items is undefined
An error occurred while rendering the page. Check developer tools console for details.

TypeError: can't access property "length", e.items is undefined
i HierarchicalMenu.vue:48
handler panel.js:68
VueJS 9
run
flushSchedulerQueue
nextTick
flushCallbacks
promise callback*timerFunc
nextTick
queueWatcher
update
notify

---

With "vue-instantsearch": "^3.3.0"
i installed the nuxt-i18n module
Basic setup
with this line:
<nuxt-link :to="localePath('index')">XX</nuxt-link>
it start to give the error again.
ERROR:
Cannot read property 'data' of undefined
node_modules/instantsearch.js/es/connectors/hierarchical-menu/connectHierarchicalMenu.js:189:
var facetValues = results.getFacetValues(hierarchicalFacetName, {

Araldo Fidalgo

[Haroenv]

Hey @lacral, that issue has been fixed in #876, but gets released next Monday 👍

[lacral]

Hi, @Haroenv

"vue-instantsearch": "^3.4.2",
if i installed the nuxt-i18n module or the vue-i18n plugin
with this line "console.log(this.$i18n.locale);"
i get the error again:
Cannot read property 'data' of undefined
node_modules/instantsearch.js/es/connectors/hierarchical-menu/connectHierarchicalMenu.js:189:
var facetValues = results.getFacetValues(hierarchicalFacetName, {

if i remove the i18n plugin, and use only the store to get info
i get the error:
can't access property "_state", r is undefined

TypeError: can't access property "_state", r is undefined
__forceRender createServerRootMixin.js:159
created widget.js:41
VueJS 9

Araldo Fidalgo

[Haroenv]

can you make a new issue with reproduction please @lacral? We have a starter available here: https://codesandbox.io/s/github/algolia/doc-code-samples/tree/master/Vue%20InstantSearch/server-side-rendering