fix(insights): don't reset page (#4655)

* fix(insights): don't reset page

helper.setQueryParameter resets the page, unlike helper.state.setQueryParameter

Also added a new test for the correct state of the page in both cases of setQueryParameter.

see algolia/vue-instantsearch#888 (doesn't fix that issue, but this issue is uncovered there)

* add extra test

* !fixup

src/middlewares/__tests__/createInsightsMiddleware.ts

@@ -176,6 +176,20 @@ describe('insights', () => {
       middleware.subscribe();
       expect(helper.state.clickAnalytics).toBe(true);
     });
+
+    it("doesn't reset page", () => {
+      const {
+        insightsClient,
+        instantSearchInstance,
+        helper,
+      } = createTestEnvironment();
+      const middleware = createInsightsMiddleware({
+        insightsClient,
+      })({ instantSearchInstance });
+      helper.setPage(100);
+      middleware.subscribe();
+      expect(helper.state.page).toBe(100);
+    });
   });
 
   describe('userToken', () => {
@@ -193,6 +207,23 @@ describe('insights', () => {
       expect(getUserToken()).toEqual('abc');
     });
 
+    it('applies userToken before subscribe() without resetting the page', () => {
+      const {
+        insightsClient,
+        instantSearchInstance,
+        getUserToken,
+        helper,
+      } = createTestEnvironment();
+      const middleware = createInsightsMiddleware({
+        insightsClient,
+      })({ instantSearchInstance });
+      insightsClient('setUserToken', 'abc');
+      helper.setPage(100);
+      middleware.subscribe();
+      expect(helper.state.page).toBe(100);
+      expect(getUserToken()).toEqual('abc');
+    });
+
     it('applies userToken which was set after subscribe()', () => {
       const {
         insightsClient,
@@ -207,6 +238,23 @@ describe('insights', () => {
       expect(getUserToken()).toEqual('def');
     });
 
+    it('applies userToken which was set after subscribe() without resetting the page', () => {
+      const {
+        insightsClient,
+        instantSearchInstance,
+        helper,
+        getUserToken,
+      } = createTestEnvironment();
+      const middleware = createInsightsMiddleware({
+        insightsClient,
+      })({ instantSearchInstance });
+      helper.setPage(100);
+      middleware.subscribe();
+      insightsClient('setUserToken', 'def');
+      expect(helper.state.page).toEqual(100);
+      expect(getUserToken()).toEqual('def');
+    });
+
     it('applies userToken from cookie when nothing given', () => {
       const {
         insightsClient,

src/middlewares/createInsightsMiddleware.ts

@@ -79,19 +79,19 @@ export const createInsightsMiddleware: CreateInsightsMiddleware = props => {
     return {
       onStateChange() {},
       subscribe() {
+        // At the time this middleware is subscribed, `mainIndex.init()` is already called.
+        // It means `mainIndex.getHelper()` exists.
+        const helper = instantSearchInstance.mainIndex.getHelper()!;
+
         const setUserTokenToSearch = (userToken?: string) => {
-          // At the time this middleware is subscribed, `mainIndex.init()` is already called.
-          // It means `mainIndex.getHelper()` exists.
           if (userToken) {
-            instantSearchInstance.mainIndex
-              .getHelper()!
-              .setQueryParameter('userToken', userToken);
+            helper.setState(
+              helper.state.setQueryParameter('userToken', userToken)
+            );
           }
         };
 
-        instantSearchInstance.mainIndex
-          .getHelper()!
-          .setQueryParameter('clickAnalytics', true);
+        helper.setState(helper.state.setQueryParameter('clickAnalytics', true));
 
         const anonymousUserToken = getInsightsAnonymousUserTokenInternal();
         if (hasInsightsClient && anonymousUserToken) {