feat(ssr): forward vuex instance to findResultsState clone (#864)

Regardless of whether you _need_ to access it, it's commonly done for otherwise prerendered state. Since Vuex is a core plugin, we must support it like this

Author: Haroenv

package.json

@@ -107,7 +107,8 @@
     "vue-server-renderer": "^2.6.11",
     "vue-slider-component": "3.0.15",
     "vue-template-compiler": "2.5.18",
-    "vuetify": "1.5.3"
+    "vuetify": "1.5.3",
+    "vuex": "3.5.1"
   },
   "bundlesize": [
     {

src/util/__tests__/createServerRootMixin.test.js

@@ -2,6 +2,7 @@ import Vue from 'vue';
 import { mount } from '@vue/test-utils';
 import _renderToString from 'vue-server-renderer/basic';
 import Router from 'vue-router';
+import Vuex from 'vuex';
 import { createServerRootMixin } from '../createServerRootMixin';
 import InstantSearchSsr from '../../components/InstantSearchSsr';
 import Configure from '../../components/Configure';
@@ -262,6 +263,54 @@ Array [
 
       await renderToString(wrapper);
     });
+
+    it('forwards vuex', async () => {
+      const searchClient = createFakeClient();
+
+      Vue.use(Vuex);
+
+      const store = new Vuex.Store();
+
+      // there are two renders of App, each with an assertion
+      expect.assertions(2);
+
+      const App = Vue.component('App', {
+        mixins: [
+          forceIsServerMixin,
+          createServerRootMixin({
+            searchClient,
+            indexName: 'hello',
+          }),
+        ],
+        data() {
+          expect(this.$store).toBe(store);
+          return {};
+        },
+        render(h) {
+          return h(InstantSearchSsr, {}, [
+            h(Configure, {
+              attrs: {
+                hitsPerPage: 100,
+              },
+            }),
+            h(SearchBox),
+          ]);
+        },
+        serverPrefetch() {
+          return this.instantsearch.findResultsState(this);
+        },
+      });
+
+      const wrapper = new Vue({
+        mixins: [forceIsServerMixin],
+        store,
+        render(h) {
+          return h(App);
+        },
+      });
+
+      await renderToString(wrapper);
+    });
   });
 
   describe('hydrate', () => {

src/util/createServerRootMixin.js

@@ -75,6 +75,7 @@ function augmentInstantSearch(instantSearchOptions, searchClient, indexName) {
           name: 'ais-ssr-root-component',
           // copy over global Vue APIs
           router: componentInstance.$router,
+          store: componentInstance.$store,
         };
 
         const extended = componentInstance.$vnode

yarn.lock

@@ -15676,6 +15676,11 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/vuetify/-/vuetify-1.5.3.tgz#4bdc0a72ade1cd3521dc0c08a363ea40b914443e"
   integrity sha512-4V3i4HwKdt//1vAEiex3DpHsLwX3oHCIx/gpukSYvBGJUgHILUZ5JOEOAQJ1yvMV1w3P+dsmvlmRdthjci5VRg==
 
+[email protected]:
+  version "3.5.1"
+  resolved "https://registry.yarnpkg.com/vuex/-/vuex-3.5.1.tgz#f1b8dcea649bc25254cf4f4358081dbf5da18b3d"
+  integrity sha512-w7oJzmHQs0FM9LXodfskhw9wgKBiaB+totOdb8sNzbTB2KDCEEwEs29NzBZFh/lmEK1t5tDmM1vtsO7ubG1DFw==
+
 walker@~1.0.5:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/walker/-/walker-1.0.7.tgz#2f7f9b8fd10d677262b18a884e28d19618e028fb"