vue-instantsearch 4.7.2 → 4.8.0

package/package.json

@@ -16,7 +16,7 @@
     "autocomplete"
   ],
   "license": "MIT",
-  "version": "4.7.2",
+  "version": "4.8.0",
   "files": [
     "vue2",
     "vue3",
@@ -35,7 +35,7 @@
     "test:exports:vue3": "node ./test/module/vue3/is-es-module.mjs && node ./test/module/vue3/is-cjs-module.cjs"
   },
   "dependencies": {
-    "instantsearch.js": "^4.49.4",
+    "instantsearch.js": "^4.50.0",
     "mitt": "^2.1.0"
   },
   "peerDependencies": {
@@ -60,7 +60,7 @@
     "@vue/test-utils": "1.3.0",
     "@vue/test-utils2": "npm:@vue/test-utils@2.0.0-rc.11",
     "algoliasearch": "4.14.3",
-    "algoliasearch-helper": "3.11.2",
+    "algoliasearch-helper": "3.11.3",
     "instantsearch.css": "8.0.0",
     "rollup": "1.32.1",
     "rollup-plugin-babel": "4.4.0",
@@ -85,5 +85,5 @@
     "vuex": "3.5.1",
     "vuex4": "npm:vuex@4.0.0"
   },
-  "gitHead": "4c473604508a865a2488e064fdd3a415f416d14a"
+  "gitHead": "15adccb907fec9528ab169ee3d7d905ceab5a860"
 }

package/src/__tests__/common.test.js

@@ -0,0 +1,99 @@
+/**
+ * @jest-environment jsdom
+ */
+import {
+  createRefinementListTests,
+  createHierarchicalMenuTests,
+  createMenuTests,
+  createPaginationTests,
+} from '@instantsearch/tests';
+
+import { nextTick, mountApp } from '../../test/utils';
+import { renderCompat } from '../util/vue-compat';
+import {
+  AisInstantSearch,
+  AisRefinementList,
+  AisHierarchicalMenu,
+  AisMenu,
+  AisPagination,
+  createWidgetMixin,
+} from '../instantsearch';
+jest.unmock('instantsearch.js/es');
+
+/**
+ * prevent rethrowing InstantSearch errors, so tests can be asserted.
+ * IRL this isn't needed, as the error doesn't stop execution.
+ */
+const GlobalErrorSwallower = {
+  mixins: [createWidgetMixin({ connector: true })],
+  mounted() {
+    this.instantSearchInstance.on('error', () => {});
+  },
+  render() {
+    return null;
+  },
+};
+
+createRefinementListTests(async ({ instantSearchOptions, widgetParams }) => {
+  mountApp(
+    {
+      render: renderCompat((h) =>
+        h(AisInstantSearch, { props: instantSearchOptions }, [
+          h(AisRefinementList, { props: widgetParams }),
+          h(GlobalErrorSwallower),
+        ])
+      ),
+    },
+    document.body.appendChild(document.createElement('div'))
+  );
+
+  await nextTick();
+});
+
+createHierarchicalMenuTests(async ({ instantSearchOptions, widgetParams }) => {
+  mountApp(
+    {
+      render: renderCompat((h) =>
+        h(AisInstantSearch, { props: instantSearchOptions }, [
+          h(AisHierarchicalMenu, { props: widgetParams }),
+          h(GlobalErrorSwallower),
+        ])
+      ),
+    },
+    document.body.appendChild(document.createElement('div'))
+  );
+
+  await nextTick();
+});
+
+createMenuTests(async ({ instantSearchOptions, widgetParams }) => {
+  mountApp(
+    {
+      render: renderCompat((h) =>
+        h(AisInstantSearch, { props: instantSearchOptions }, [
+          h(AisMenu, { props: widgetParams }),
+          h(GlobalErrorSwallower),
+        ])
+      ),
+    },
+    document.body.appendChild(document.createElement('div'))
+  );
+
+  await nextTick();
+});
+
+createPaginationTests(async ({ instantSearchOptions, widgetParams }) => {
+  mountApp(
+    {
+      render: renderCompat((h) =>
+        h(AisInstantSearch, { props: instantSearchOptions }, [
+          h(AisPagination, { props: widgetParams }),
+          h(GlobalErrorSwallower),
+        ])
+      ),
+    },
+    document.body.appendChild(document.createElement('div'))
+  );
+
+  await nextTick();
+});

package/src/components/Pagination.vue

@@ -88,6 +88,7 @@
             <a
               :class="suit('link')"
               :href="state.createURL(page)"
+              :aria-label="`Page ${page + 1}`"
               @click.prevent="refine(page)"
               >{{ page + 1 }}</a
             >

package/src/components/__tests__/__snapshots__/Pagination.js.snap

@@ -20,49 +20,56 @@ exports[`renders correctly another page 1`] = `
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 4"
+         class="ais-Pagination-link"
          href="#"
       >
         4
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 5"
+         class="ais-Pagination-link"
          href="#"
       >
         5
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 6"
+         class="ais-Pagination-link"
          href="#"
       >
         6
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page ais-Pagination-item--selected">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 7"
+         class="ais-Pagination-link"
          href="#"
       >
         7
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 8"
+         class="ais-Pagination-link"
          href="#"
       >
         8
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 9"
+         class="ais-Pagination-link"
          href="#"
       >
         9
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 10"
+         class="ais-Pagination-link"
          href="#"
       >
         10
@@ -106,49 +113,56 @@ exports[`renders correctly first page 1`] = `
       </span>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page ais-Pagination-item--selected">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 1"
+         class="ais-Pagination-link"
          href="#"
       >
         1
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 2"
+         class="ais-Pagination-link"
          href="#"
       >
         2
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 3"
+         class="ais-Pagination-link"
          href="#"
       >
         3
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 4"
+         class="ais-Pagination-link"
          href="#"
       >
         4
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 5"
+         class="ais-Pagination-link"
          href="#"
       >
         5
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 6"
+         class="ais-Pagination-link"
          href="#"
       >
         6
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 7"
+         class="ais-Pagination-link"
          href="#"
       >
         7
@@ -194,49 +208,56 @@ exports[`renders correctly last page 1`] = `
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 4"
+         class="ais-Pagination-link"
          href="#"
       >
         4
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 5"
+         class="ais-Pagination-link"
          href="#"
       >
         5
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 6"
+         class="ais-Pagination-link"
          href="#"
       >
         6
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 7"
+         class="ais-Pagination-link"
          href="#"
       >
         7
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 8"
+         class="ais-Pagination-link"
          href="#"
       >
         8
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 9"
+         class="ais-Pagination-link"
          href="#"
       >
         9
       </a>
     </li>
     <li class="ais-Pagination-item ais-Pagination-item--page ais-Pagination-item--selected">
-      <a class="ais-Pagination-link"
+      <a aria-label="Page 10"
+         class="ais-Pagination-link"
          href="#"
       >
         10

package/src/util/__tests__/createServerRootMixin.test.js

@@ -1133,6 +1133,7 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/instantsear
 
       const resultsState = createSerializedState();
       const state = new SearchParameters(resultsState.state);
+      const localState = new SearchParameters({ index: 'lol' });
       const results = new SearchResults(state, resultsState.results);
 
       instantSearchInstance.hydrate({
@@ -1149,18 +1150,13 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/instantsear
 
       const renderArgs = widget.render.mock.calls[0][0];
 
-      expect(renderArgs).toEqual(
-        expect.objectContaining({
-          state,
-          results,
-          scopedResults: [
-            expect.objectContaining({
-              indexId: 'lol',
-              results,
-            }),
-          ],
-        })
-      );
+      // renders with local state, not the one from results
+      expect(renderArgs.state).toEqual(localState);
+      results._state = localState;
+      expect(renderArgs.results).toEqual(results);
+      expect(renderArgs.scopedResults).toHaveLength(1);
+      expect(renderArgs.scopedResults[0].indexId).toEqual('lol');
+      expect(renderArgs.scopedResults[0].results).toEqual(results);
     });
 
     describe('createURL', () => {