vue-instantsearch 4.10.10 → 4.10.11

package/README.md

@@ -1,6 +1,6 @@
 <!-- START doctoc generated TOC please keep comment here to allow auto update -->
 <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
-**Table of Contents**  *generated with [DocToc](https://github.com/thlorenz/doctoc)*
+
 
 - [Vue InstantSearch](#vue-instantsearch)
 - [Documentation](#documentation)
@@ -12,12 +12,7 @@
 
 [![Vue InstantSearch logo][logo]][website]
 
-InstantSearch projects: **Vue InstantSearch**
-| [InstantSearch.js][instantsearch.js-github]
-| [React InstantSearch][react-instantsearch-github]
-| [Angular InstantSearch][angular-instantsearch-github]
-| [InstantSearch Android][instantsearch-android-github]
-| [InstantSearch iOS][instantsearch-ios-github].
+InstantSearch projects: **Vue InstantSearch** | [InstantSearch.js][instantsearch-github] | [React InstantSearch][instantsearch-github] | [Angular InstantSearch][angular-instantsearch-github] | [InstantSearch Android][instantsearch-android-github] | [InstantSearch iOS][instantsearch-ios-github].
 
 ## Vue InstantSearch
 
@@ -51,16 +46,13 @@ Encountering an issue? Before reaching out to support, we recommend heading to o
 
 ## Contributing, dev, release
 
-We welcome all contributors, from casual to regular. You are only
-one command away to start the developer environment,
-[read our CONTRIBUTING guide](CONTRIBUTING.md).
+We welcome all contributors, from casual to regular. You are only one command away to start the developer environment, [read our CONTRIBUTING guide](CONTRIBUTING.md).
 
 [logo]: vue-instantsearch-readme.png
 [website]: https://www.algolia.com/doc/guides/building-search-ui/what-is-instantsearch/vue/
 [getting-started-guide]: https://www.algolia.com/doc/guides/building-search-ui/getting-started/vue/
 [algolia-website]: https://www.algolia.com/
-[instantsearch.js-github]: https://github.com/algolia/instantsearch.js
-[react-instantsearch-github]: https://github.com/algolia/react-instantsearch
+[instantsearch-github]: https://github.com/algolia/instantsearch
 [instantsearch-android-github]: https://github.com/algolia/instantsearch-android
 [instantsearch-ios-github]: https://github.com/algolia/instantsearch-ios
 [angular-instantsearch-github]: https://github.com/algolia/angular-instantsearch

package/package.json

@@ -16,7 +16,7 @@
     "autocomplete"
   ],
   "license": "MIT",
-  "version": "4.10.10",
+  "version": "4.10.11",
   "files": [
     "vue2",
     "vue3",
@@ -25,7 +25,7 @@
   "main": "vue2/cjs",
   "module": "vue2/es",
   "sideEffects": false,
-  "repository": "https://github.com/algolia/instantsearch.js",
+  "repository": "https://github.com/algolia/instantsearch",
   "scripts": {
     "prebuild": "rm -rf vue2 vue3",
     "build": "rollup -c",
@@ -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.56.10",
+    "instantsearch.js": "4.56.11",
     "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.14.0",
+    "algoliasearch-helper": "3.14.1",
     "instantsearch.css": "8.0.0",
     "rollup": "1.32.1",
     "rollup-plugin-babel": "4.4.0",
@@ -87,5 +87,5 @@
     "vuex": "3.5.1",
     "vuex4": "npm:vuex@4.0.0"
   },
-  "gitHead": "90a5e43746613d2f9eb3dc49fa15b1895d45c7bd"
+  "gitHead": "046ba8af4e49a0299d3297337965fc4e717550d6"
 }

package/src/__tests__/common-widgets.test.js

@@ -362,6 +362,41 @@ const testSetups = {
       document.body.appendChild(document.createElement('div'))
     );
 
+    await nextTick();
+  },
+  async createCurrentRefinementsWidgetTests({
+    instantSearchOptions,
+    widgetParams,
+  }) {
+    mountApp(
+      {
+        render: renderCompat((h) =>
+          h('form', {}, [
+            h(AisInstantSearch, { props: instantSearchOptions }, [
+              h(AisSearchBox),
+              h(AisRefinementList, { props: { attribute: 'brand' } }),
+              h(AisRefinementList, {
+                props: { operator: 'and', attribute: 'feature' },
+              }),
+              h(AisHierarchicalMenu, {
+                props: {
+                  attributes: [
+                    'hierarchicalCategories.lvl0',
+                    'hierarchicalCategories.lvl1',
+                    'hierarchicalCategories.lvl2',
+                  ],
+                },
+              }),
+              h(AisRangeInput, { props: { attribute: 'price' } }),
+              h(AisCurrentRefinements, { props: widgetParams }),
+              h(GlobalErrorSwallower),
+            ]),
+          ])
+        ),
+      },
+      document.body.appendChild(document.createElement('div'))
+    );
+
     await nextTick();
   },
 };
@@ -378,6 +413,7 @@ const testOptions = {
   createInstantSearchWidgetTests: undefined,
   createHitsPerPageWidgetTests: undefined,
   createClearRefinementsWidgetTests: undefined,
+  createCurrentRefinementsWidgetTests: undefined,
 };
 
 describe('Common widget tests (Vue InstantSearch)', () => {

package/src/components/CurrentRefinements.vue

@@ -33,13 +33,11 @@
                   <q v-if="refinement.attribute === 'query'">{{
                     refinement.label
                   }}</q>
-                  <template v-else>
-                    {{ refinement.label }}
-                  </template>
-                </span>
-                <button
+                  <template v-else>{{ refinement.label }}</template> </span
+                ><button
                   :class="suit('delete')"
-                  @click="item.refine(refinement)"
+                  type="button"
+                  @click.left.exact="item.refine(refinement)"
                 >
                   ✕
                 </button>

package/src/components/Pagination.vue

@@ -1,5 +1,8 @@
 <template>
-  <div v-if="state" :class="suit()">
+  <div
+    v-if="state"
+    :class="{ [suit()]: true, [suit('', 'noRefinement')]: state.nbPages <= 1 }"
+  >
     <slot
       :refine="refine"
       :createURL="state.createURL"
@@ -14,8 +17,8 @@
         <li
           :class="{
             [suit('item')]: true,
-            [suit('item', 'firstPage')]: true,
             [suit('item', 'disabled')]: state.isFirstPage,
+            [suit('item', 'firstPage')]: true,
           }"
           v-if="showFirst"
         >
@@ -30,7 +33,7 @@
                 :class="suit('link')"
                 aria-label="First"
                 :href="state.createURL(0)"
-                @click.prevent="refine(0)"
+                @click.exact.left.prevent="refine(0)"
                 >‹‹</a
               >
             </template>
@@ -42,8 +45,8 @@
         <li
           :class="{
             [suit('item')]: true,
-            [suit('item', 'previousPage')]: true,
             [suit('item', 'disabled')]: state.isFirstPage,
+            [suit('item', 'previousPage')]: true,
           }"
           v-if="showPrevious"
         >
@@ -58,7 +61,7 @@
                 :class="suit('link')"
                 aria-label="Previous"
                 :href="state.createURL(state.currentRefinement - 1)"
-                @click.prevent="refine(state.currentRefinement - 1)"
+                @click.exact.left.prevent="refine(state.currentRefinement - 1)"
                 >‹</a
               >
             </template>
@@ -89,7 +92,7 @@
               :class="suit('link')"
               :href="state.createURL(page)"
               :aria-label="`Page ${page + 1}`"
-              @click.prevent="refine(page)"
+              @click.exact.left.prevent="refine(page)"
               >{{ page + 1 }}</a
             >
           </slot>
@@ -98,8 +101,8 @@
         <li
           :class="{
             [suit('item')]: true,
-            [suit('item', 'nextPage')]: true,
             [suit('item', 'disabled')]: state.isLastPage,
+            [suit('item', 'nextPage')]: true,
           }"
           v-if="showNext"
         >
@@ -114,7 +117,7 @@
                 :class="suit('link')"
                 aria-label="Next"
                 :href="state.createURL(state.currentRefinement + 1)"
-                @click.prevent="refine(state.currentRefinement + 1)"
+                @click.exact.left.prevent="refine(state.currentRefinement + 1)"
                 >›</a
               >
             </template>
@@ -126,8 +129,8 @@
         <li
           :class="{
             [suit('item')]: true,
-            [suit('item', 'lastPage')]: true,
             [suit('item', 'disabled')]: state.isLastPage,
+            [suit('item', 'lastPage')]: true,
           }"
           v-if="showLast"
         >
@@ -142,7 +145,7 @@
                 :class="suit('link')"
                 aria-label="Last"
                 :href="state.createURL(state.nbPages - 1)"
-                @click.prevent="refine(state.nbPages - 1)"
+                @click.exact.left.prevent="refine(state.nbPages - 1)"
                 >››</a
               >
             </template>

package/src/components/__tests__/CurrentRefinements.js

@@ -10,216 +10,6 @@ import '../../../test/utils/sortedHtmlSerializer';
 jest.mock('../../mixins/widget');
 jest.mock('../../mixins/panel');
 
-it('renders correctly (empty)', () => {
-  __setState({
-    items: [],
-  });
-  const wrapper = mount(CurrentRefinements);
-  expect(wrapper.html()).toMatchSnapshot();
-});
-
-describe.each([
-  [
-    'facet',
-    [
-      {
-        attribute: 'customFacet',
-        label: 'customFacet',
-        refinements: [
-          {
-            attribute: 'customFacet',
-            type: 'facet',
-            value: 'val1',
-            label: 'val1',
-          },
-        ],
-      },
-    ],
-  ],
-  [
-    'facet exclude',
-    [
-      {
-        attribute: 'customExcludeFacet',
-        label: 'customExcludeFacet',
-        refinements: [
-          {
-            attribute: 'customExcludeFacet',
-            type: 'exclude',
-            value: 'val1',
-            label: 'val1',
-            exclude: true,
-          },
-        ],
-      },
-    ],
-  ],
-  [
-    'disjunctive facet',
-    [
-      {
-        attribute: 'customDisjunctiveFacet',
-        label: 'customDisjunctiveFacet',
-        refinements: [
-          {
-            attribute: 'customDisjunctiveFacet',
-            type: 'disjunctive',
-            value: 'val1',
-            label: 'val1',
-          },
-        ],
-      },
-    ],
-  ],
-  [
-    'hierarchical facet',
-    [
-      {
-        attribute: 'customHierarchicalFacet',
-        label: 'customHierarchicalFacet',
-        refinements: [
-          {
-            attribute: 'customHierarchicalFacet',
-            type: 'hierarchical',
-            value: 'val1',
-            label: 'val1',
-          },
-        ],
-      },
-    ],
-  ],
-  [
-    'numeric filters',
-    [
-      {
-        attribute: 'customNumericFilter',
-        label: 'customNumericFilter',
-        refinements: [
-          {
-            attribute: 'customNumericFilter',
-            type: 'numeric',
-            operator: '=',
-            value: 'val1',
-            label: '= val1',
-          },
-          {
-            attribute: 'customNumericFilter',
-            type: 'numeric',
-            operator: '<=',
-            value: 'val2',
-            label: '≤ val2',
-          },
-          {
-            attribute: 'customNumericFilter',
-            type: 'numeric',
-            operator: '>=',
-            value: 'val3',
-            label: '≥ val3',
-          },
-        ],
-      },
-    ],
-  ],
-  [
-    'tag',
-    [
-      {
-        attribute: '_tags',
-        label: '_tags',
-        refinements: [
-          {
-            attribute: '_tags',
-            type: 'tag',
-            value: 'tag1',
-            label: 'tag1',
-          },
-        ],
-      },
-    ],
-  ],
-  [
-    'query',
-    [
-      {
-        attribute: 'query',
-        label: 'query',
-        refinements: [
-          {
-            attribute: 'query',
-            type: 'query',
-            value: 'search1',
-            label: 'search1',
-          },
-        ],
-      },
-    ],
-  ],
-])('%s', (name, items) => {
-  it('renders correct html', () => {
-    __setState({
-      items,
-    });
-
-    const wrapper = mount(CurrentRefinements);
-
-    if (name === 'query') {
-      // eslint-disable-next-line jest/no-conditional-expect
-      expect(
-        wrapper.find('.ais-CurrentRefinements-categoryLabel q').text()
-      ).toEqual('search1');
-    }
-
-    expect(wrapper.html()).toMatchSnapshot();
-  });
-});
-
-it('calls `refine` with a refinement', async () => {
-  const spies = [jest.fn(), jest.fn()];
-
-  __setState({
-    items: [
-      {
-        attribute: 'brands',
-        label: 'brands',
-        refine: spies[0],
-        refinements: [
-          {
-            attribute: 'brands',
-            type: 'facet',
-            value: 'apple',
-            label: 'apple',
-          },
-        ],
-      },
-      {
-        attribute: 'colors',
-        label: 'colors',
-        refine: spies[1],
-        refinements: [
-          {
-            attribute: 'colors',
-            type: 'facet',
-            value: 'green',
-            label: 'green',
-          },
-        ],
-      },
-    ],
-  });
-
-  const wrapper = mount(CurrentRefinements);
-  await wrapper.find('.ais-CurrentRefinements-delete').trigger('click');
-
-  expect(spies[0]).toHaveBeenLastCalledWith({
-    attribute: 'brands',
-    label: 'apple',
-    type: 'facet',
-    value: 'apple',
-  });
-
-  expect(spies[1]).not.toHaveBeenCalled();
-});
-
 describe('custom render', () => {
   const defaultSlot = `
     <template v-slot="{ refine, items, createURL }">

package/src/components/__tests__/InstantSearch.js

@@ -334,7 +334,7 @@ it.skip('Does not allow a change in `routing`', async () => {
   ).rejects.toMatchInlineSnapshot(`
 [Error: routing configuration can not be changed dynamically at this point.
 
-Please open a new issue: https://github.com/algolia/instantsearch.js/discussions/new?category=ideas&labels=triage%2cLibrary%3A+Vue+InstantSearch&title=Feature%20request%3A%20dynamic%20props]
+Please open a new issue: https://github.com/algolia/instantsearch/discussions/new?category=ideas&labels=triage%2cLibrary%3A+Vue+InstantSearch&title=Feature%20request%3A%20dynamic%20props]
 `);
 });
 

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

@@ -43,168 +43,3 @@ exports[`custom render item slot gives all relevant info to scoped slot 1`] = `
   </ul>
 </div>
 `;
-
-exports[`disjunctive facet renders correct html 1`] = `
-<div class="ais-CurrentRefinements">
-  <ul class="ais-CurrentRefinements-list">
-    <li class="ais-CurrentRefinements-item">
-      <span class="ais-CurrentRefinements-label">
-        CustomDisjunctiveFacet:
-      </span>
-      <span class="ais-CurrentRefinements-category">
-        <span class="ais-CurrentRefinements-categoryLabel">
-          val1
-        </span>
-        <button class="ais-CurrentRefinements-delete">
-          ✕
-        </button>
-      </span>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`facet exclude renders correct html 1`] = `
-<div class="ais-CurrentRefinements">
-  <ul class="ais-CurrentRefinements-list">
-    <li class="ais-CurrentRefinements-item">
-      <span class="ais-CurrentRefinements-label">
-        CustomExcludeFacet:
-      </span>
-      <span class="ais-CurrentRefinements-category">
-        <span class="ais-CurrentRefinements-categoryLabel">
-          val1
-        </span>
-        <button class="ais-CurrentRefinements-delete">
-          ✕
-        </button>
-      </span>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`facet renders correct html 1`] = `
-<div class="ais-CurrentRefinements">
-  <ul class="ais-CurrentRefinements-list">
-    <li class="ais-CurrentRefinements-item">
-      <span class="ais-CurrentRefinements-label">
-        CustomFacet:
-      </span>
-      <span class="ais-CurrentRefinements-category">
-        <span class="ais-CurrentRefinements-categoryLabel">
-          val1
-        </span>
-        <button class="ais-CurrentRefinements-delete">
-          ✕
-        </button>
-      </span>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`hierarchical facet renders correct html 1`] = `
-<div class="ais-CurrentRefinements">
-  <ul class="ais-CurrentRefinements-list">
-    <li class="ais-CurrentRefinements-item">
-      <span class="ais-CurrentRefinements-label">
-        CustomHierarchicalFacet:
-      </span>
-      <span class="ais-CurrentRefinements-category">
-        <span class="ais-CurrentRefinements-categoryLabel">
-          val1
-        </span>
-        <button class="ais-CurrentRefinements-delete">
-          ✕
-        </button>
-      </span>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`numeric filters renders correct html 1`] = `
-<div class="ais-CurrentRefinements">
-  <ul class="ais-CurrentRefinements-list">
-    <li class="ais-CurrentRefinements-item">
-      <span class="ais-CurrentRefinements-label">
-        CustomNumericFilter:
-      </span>
-      <span class="ais-CurrentRefinements-category">
-        <span class="ais-CurrentRefinements-categoryLabel">
-          = val1
-        </span>
-        <button class="ais-CurrentRefinements-delete">
-          ✕
-        </button>
-      </span>
-      <span class="ais-CurrentRefinements-category">
-        <span class="ais-CurrentRefinements-categoryLabel">
-          ≤ val2
-        </span>
-        <button class="ais-CurrentRefinements-delete">
-          ✕
-        </button>
-      </span>
-      <span class="ais-CurrentRefinements-category">
-        <span class="ais-CurrentRefinements-categoryLabel">
-          ≥ val3
-        </span>
-        <button class="ais-CurrentRefinements-delete">
-          ✕
-        </button>
-      </span>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`query renders correct html 1`] = `
-<div class="ais-CurrentRefinements">
-  <ul class="ais-CurrentRefinements-list">
-    <li class="ais-CurrentRefinements-item">
-      <span class="ais-CurrentRefinements-label">
-        Query:
-      </span>
-      <span class="ais-CurrentRefinements-category">
-        <span class="ais-CurrentRefinements-categoryLabel">
-          <q>
-            search1
-          </q>
-        </span>
-        <button class="ais-CurrentRefinements-delete">
-          ✕
-        </button>
-      </span>
-    </li>
-  </ul>
-</div>
-`;
-
-exports[`renders correctly (empty) 1`] = `
-<div class="ais-CurrentRefinements ais-CurrentRefinements--noRefinement">
-  <ul class="ais-CurrentRefinements-list">
-  </ul>
-</div>
-`;
-
-exports[`tag renders correct html 1`] = `
-<div class="ais-CurrentRefinements">
-  <ul class="ais-CurrentRefinements-list">
-    <li class="ais-CurrentRefinements-item">
-      <span class="ais-CurrentRefinements-label">
-        _tags:
-      </span>
-      <span class="ais-CurrentRefinements-category">
-        <span class="ais-CurrentRefinements-categoryLabel">
-          tag1
-        </span>
-        <button class="ais-CurrentRefinements-delete">
-          ✕
-        </button>
-      </span>
-    </li>
-  </ul>
-</div>
-`;

package/src/util/createInstantSearchComponent.js

@@ -34,14 +34,14 @@ export const createInstantSearchComponent = (component) =>
           throw new Error(
             'routing configuration can not be changed dynamically at this point.' +
               '\n\n' +
-              'Please open a new issue: https://github.com/algolia/instantsearch.js/discussions/new?category=ideas&labels=triage%2cLibrary%3A+Vue+InstantSearch&title=Feature%20request%3A%20dynamic%20props'
+              'Please open a new issue: https://github.com/algolia/instantsearch/discussions/new?category=ideas&labels=triage%2cLibrary%3A+Vue+InstantSearch&title=Feature%20request%3A%20dynamic%20props'
           );
         },
         onStateChange() {
           throw new Error(
             'onStateChange configuration can not be changed dynamically at this point.' +
               '\n\n' +
-              'Please open a new issue: https://github.com/algolia/instantsearch.js/discussions/new?category=ideas&labels=triage%2cLibrary%3A+Vue+InstantSearch&title=Feature%20request%3A%20dynamic%20props'
+              'Please open a new issue: https://github.com/algolia/instantsearch/discussions/new?category=ideas&labels=triage%2cLibrary%3A+Vue+InstantSearch&title=Feature%20request%3A%20dynamic%20props'
           );
         },
         searchFunction(searchFunction) {