feat(widgets): add $$type to widgets definition (#3960)

Adding a type to the `index` widget is necessary to filter it out from the list of the widgets. This is needed to implement the "reset page" behavior to get all the `index`-type children and reset their own page.

I took this opportunity to add a type to all widgets for debugging purpose.

The `$$type` property is not required in TypeScript because once we expose the widget interface, users might not need to mark them.

src/connectors/autocomplete/__tests__/connectAutocomplete-test.js

@@ -15,6 +15,24 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/autocomplet
 `);
   });
 
+  it('is a widget', () => {
+    const render = jest.fn();
+    const unmount = jest.fn();
+
+    const customAutocomplete = connectAutocomplete(render, unmount);
+    const widget = customAutocomplete({});
+
+    expect(widget).toEqual(
+      expect.objectContaining({
+        $$type: 'ais.autocomplete',
+        init: expect.any(Function),
+        render: expect.any(Function),
+        dispose: expect.any(Function),
+        getConfiguration: expect.any(Function),
+      })
+    );
+  });
+
   it('renders during init and render', () => {
     const renderFn = jest.fn();
     const makeWidget = connectAutocomplete(renderFn);

src/connectors/autocomplete/connectAutocomplete.js

@@ -56,6 +56,8 @@ export default function connectAutocomplete(renderFn, unmountFn = noop) {
     }
 
     return {
+      $$type: 'ais.autocomplete',
+
       getConfiguration() {
         const parameters = {
           query: '',

src/connectors/breadcrumb/__tests__/connectBreadcrumb-test.js

@@ -39,6 +39,24 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/breadcrumb/
     });
   });
 
+  it('is a widget', () => {
+    const render = jest.fn();
+    const unmount = jest.fn();
+
+    const customBreadcrumb = connectBreadcrumb(render, unmount);
+    const widget = customBreadcrumb({ attributes: ['category'] });
+
+    expect(widget).toEqual(
+      expect.objectContaining({
+        $$type: 'ais.breadcrumb',
+        init: expect.any(Function),
+        render: expect.any(Function),
+        dispose: expect.any(Function),
+        getConfiguration: expect.any(Function),
+      })
+    );
+  });
+
   describe('getConfiguration', () => {
     beforeEach(() => {
       warning.cache = {};

src/connectors/breadcrumb/connectBreadcrumb.js

@@ -64,6 +64,8 @@ export default function connectBreadcrumb(renderFn, unmountFn = noop) {
     const [hierarchicalFacetName] = attributes;
 
     return {
+      $$type: 'ais.breadcrumb',
+
       getConfiguration: currentConfiguration => {
         if (currentConfiguration.hierarchicalFacets) {
           const isFacetSet = find(

src/connectors/clear-refinements/__tests__/connectClearRefinements-test.js

@@ -27,6 +27,23 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/clear-refin
 See documentation: https://www.algolia.com/doc/api-reference/widgets/clear-refinements/js/#connector"
 `);
     });
+
+    it('is a widget', () => {
+      const render = jest.fn();
+      const unmount = jest.fn();
+
+      const customClearRefinements = connectClearRefinements(render, unmount);
+      const widget = customClearRefinements({});
+
+      expect(widget).toEqual(
+        expect.objectContaining({
+          $$type: 'ais.clearRefinements',
+          init: expect.any(Function),
+          render: expect.any(Function),
+          dispose: expect.any(Function),
+        })
+      );
+    });
   });
 
   describe('Lifecycle', () => {

src/connectors/clear-refinements/connectClearRefinements.js

@@ -87,6 +87,8 @@ export default function connectClearRefinements(renderFn, unmountFn = noop) {
     } = widgetParams;
 
     return {
+      $$type: 'ais.clearRefinements',
+
       init({ helper, instantSearchInstance, createURL }) {
         const attributesToClear = getAttributesToClear({
           helper,

src/connectors/configure/__tests__/connectConfigure-test.js

@@ -53,6 +53,24 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/configure/j
     });
   });
 
+  it('is a widget', () => {
+    const render = jest.fn();
+    const unmount = jest.fn();
+
+    const customConfigure = connectConfigure(render, unmount);
+    const widget = customConfigure({ searchParameters: {} });
+
+    expect(widget).toEqual(
+      expect.objectContaining({
+        $$type: 'ais.configure',
+        init: expect.any(Function),
+        render: expect.any(Function),
+        dispose: expect.any(Function),
+        getConfiguration: expect.any(Function),
+      })
+    );
+  });
+
   it('should apply searchParameters', () => {
     const makeWidget = connectConfigure();
     const widget = makeWidget({ searchParameters: { analytics: true } });

src/connectors/configure/connectConfigure.js

@@ -39,6 +39,8 @@ export default function connectConfigure(renderFn = noop, unmountFn = noop) {
     }
 
     return {
+      $$type: 'ais.configure',
+
       getConfiguration() {
         return widgetParams.searchParameters;
       },

src/connectors/current-refinements/__tests__/connectCurrentRefinements-test.js

@@ -17,6 +17,26 @@ describe('connectCurrentRefinements', () => {
 See documentation: https://www.algolia.com/doc/api-reference/widgets/current-refinements/js/#connector"
 `);
     });
+
+    it('is a widget', () => {
+      const render = jest.fn();
+      const unmount = jest.fn();
+
+      const customCurrentRefinements = connectCurrentRefinements(
+        render,
+        unmount
+      );
+      const widget = customCurrentRefinements({});
+
+      expect(widget).toEqual(
+        expect.objectContaining({
+          $$type: 'ais.currentRefinements',
+          init: expect.any(Function),
+          render: expect.any(Function),
+          dispose: expect.any(Function),
+        })
+      );
+    });
   });
 
   describe('Lifecycle', () => {

src/connectors/current-refinements/connectCurrentRefinements.js

@@ -120,6 +120,8 @@ export default function connectCurrentRefinements(renderFn, unmountFn = noop) {
     } = widgetParams;
 
     return {
+      $$type: 'ais.currentRefinements',
+
       init({ helper, createURL, instantSearchInstance }) {
         const items = transformItems(
           getFilteredRefinements({

src/connectors/geo-search/__tests__/connectGeoSearch-test.js

@@ -52,9 +52,10 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/geo-search/
     const unmount = jest.fn();
 
     const customGeoSearch = connectGeoSearch(render, unmount);
-    const widget = customGeoSearch();
+    const widget = customGeoSearch({});
 
     expect(widget).toEqual({
+      $$type: 'ais.geoSearch',
       init: expect.any(Function),
       render: expect.any(Function),
       dispose: expect.any(Function),

src/connectors/geo-search/connectGeoSearch.js

@@ -332,7 +332,10 @@ http://community.algolia.com/instantsearch.js/migration-guide
     };
 
     return {
+      $$type: 'ais.geoSearch',
+
       init,
+
       render,
 
       dispose({ state }) {

src/connectors/hierarchical-menu/__tests__/connectHierarchicalMenu-test.js

@@ -46,6 +46,26 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/hierarchica
 See documentation: https://www.algolia.com/doc/api-reference/widgets/hierarchical-menu/js/#connector"
 `);
     });
+
+    it('is a widget', () => {
+      const render = jest.fn();
+      const unmount = jest.fn();
+
+      const customHierarchicalMenu = connectHierarchicalMenu(render, unmount);
+      const widget = customHierarchicalMenu({ attributes: ['category'] });
+
+      expect(widget).toEqual(
+        expect.objectContaining({
+          $$type: 'ais.hierarchicalMenu',
+          init: expect.any(Function),
+          render: expect.any(Function),
+          dispose: expect.any(Function),
+          getConfiguration: expect.any(Function),
+          getWidgetState: expect.any(Function),
+          getWidgetSearchParameters: expect.any(Function),
+        })
+      );
+    });
   });
 
   describe('getConfiguration', () => {

src/connectors/hierarchical-menu/connectHierarchicalMenu.js

@@ -94,6 +94,8 @@ export default function connectHierarchicalMenu(renderFn, unmountFn = noop) {
     const [hierarchicalFacetName] = attributes;
 
     return {
+      $$type: 'ais.hierarchicalMenu',
+
       isShowingMore: false,
 
       // Provide the same function to the `renderFn` so that way the user

src/connectors/hits-per-page/__tests__/connectHitsPerPage-test.js

@@ -32,6 +32,26 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/hits-per-pa
 See documentation: https://www.algolia.com/doc/api-reference/widgets/hits-per-page/js/#connector"
 `);
     });
+
+    it('is a widget', () => {
+      const render = jest.fn();
+      const unmount = jest.fn();
+
+      const customHitsPerPage = connectHitsPerPage(render, unmount);
+      const widget = customHitsPerPage({ items: [] });
+
+      expect(widget).toEqual(
+        expect.objectContaining({
+          $$type: 'ais.hitsPerPage',
+          init: expect.any(Function),
+          render: expect.any(Function),
+          dispose: expect.any(Function),
+          getConfiguration: expect.any(Function),
+          getWidgetState: expect.any(Function),
+          getWidgetSearchParameters: expect.any(Function),
+        })
+      );
+    });
   });
 
   it('Renders during init and render', () => {

src/connectors/hits-per-page/connectHitsPerPage.js

@@ -118,6 +118,8 @@ export default function connectHitsPerPage(renderFn, unmountFn = noop) {
     const defaultValue = find(userItems, item => item.default === true);
 
     return {
+      $$type: 'ais.hitsPerPage',
+
       getConfiguration() {
         return defaultValues.length > 0
           ? { hitsPerPage: defaultValues[0].value }

src/connectors/hits/__tests__/connectHits-test.js

@@ -20,6 +20,24 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/hits/js/#co
 `);
   });
 
+  it('is a widget', () => {
+    const render = jest.fn();
+    const unmount = jest.fn();
+
+    const customHits = connectHits(render, unmount);
+    const widget = customHits({});
+
+    expect(widget).toEqual(
+      expect.objectContaining({
+        $$type: 'ais.hits',
+        init: expect.any(Function),
+        render: expect.any(Function),
+        dispose: expect.any(Function),
+        getConfiguration: expect.any(Function),
+      })
+    );
+  });
+
   it('Renders during init and render', () => {
     const renderFn = jest.fn();
     const makeWidget = connectHits(renderFn);

src/connectors/hits/connectHits.js

@@ -58,6 +58,8 @@ export default function connectHits(renderFn, unmountFn = noop) {
     const { escapeHTML = true, transformItems = items => items } = widgetParams;
 
     return {
+      $$type: 'ais.hits',
+
       getConfiguration() {
         return escapeHTML ? TAG_PLACEHOLDER : undefined;
       },

src/connectors/infinite-hits/__tests__/connectInfiniteHits-test.ts

@@ -32,6 +32,26 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/infinite-hi
 `);
   });
 
+  it('is a widget', () => {
+    const render = jest.fn();
+    const unmount = jest.fn();
+
+    const customInfiniteHits = connectInfiniteHits(render, unmount);
+    const widget = customInfiniteHits({});
+
+    expect(widget).toEqual(
+      expect.objectContaining({
+        $$type: 'ais.infiniteHits',
+        init: expect.any(Function),
+        render: expect.any(Function),
+        dispose: expect.any(Function),
+        getConfiguration: expect.any(Function),
+        getWidgetState: expect.any(Function),
+        getWidgetSearchParameters: expect.any(Function),
+      })
+    );
+  });
+
   it('Renders during init and render', () => {
     const renderFn = jest.fn();
     const instantSearchInstance = createInstantSearch();

src/connectors/infinite-hits/connectInfiniteHits.ts

@@ -86,6 +86,8 @@ const connectInfiniteHits: InfiniteHitsConnector = (
     };
 
     return {
+      $$type: 'ais.infiniteHits',
+
       getConfiguration() {
         const parameters = {
           page: 0,

src/connectors/menu/__tests__/connectMenu-test.js

@@ -15,7 +15,7 @@ describe('connectMenu', () => {
   });
 
   describe('Usage', () => {
-    it('throws with render function', () => {
+    it('throws without render function', () => {
       expect(() => {
         connectMenu()({});
       }).toThrowErrorMatchingInlineSnapshot(`
@@ -56,6 +56,26 @@ See documentation: https://www.algolia.com/doc/api-reference/widgets/menu/js/#co
     });
   });
 
+  it('is a widget', () => {
+    const render = jest.fn();
+    const unmount = jest.fn();
+
+    const customMenu = connectMenu(render, unmount);
+    const widget = customMenu({ attribute: 'facet' });
+
+    expect(widget).toEqual(
+      expect.objectContaining({
+        $$type: 'ais.menu',
+        init: expect.any(Function),
+        render: expect.any(Function),
+        dispose: expect.any(Function),
+        getConfiguration: expect.any(Function),
+        getWidgetState: expect.any(Function),
+        getWidgetSearchParameters: expect.any(Function),
+      })
+    );
+  });
+
   describe('options configuring the helper', () => {
     it('`attribute`', () => {
       const widget = makeWidget({

src/connectors/menu/connectMenu.js

@@ -115,6 +115,8 @@ export default function connectMenu(renderFn, unmountFn = noop) {
     }
 
     return {
+      $$type: 'ais.menu',
+
       isShowingMore: false,
 
       // Provide the same function to the `renderFn` so that way the user