@docsearch/react 3.0.0-alpha.50 → 3.1.1

package/dist/esm/__tests__/api.test.js

@@ -10,13 +10,14 @@ function _asyncToGenerator(fn) { return function () { var self = this, args = ar
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-import { render, fireEvent, waitFor, screen, act } from '@testing-library/react';
+import { render, act, fireEvent, screen } from '@testing-library/react';
 import React from 'react';
 import '@testing-library/jest-dom';
 import { DocSearch as DocSearchComponent } from '../DocSearch';
 
 function DocSearch(props) {
   return /*#__PURE__*/React.createElement(DocSearchComponent, _extends({
+    appId: "woo",
     apiKey: "foo",
     indexName: "bar"
   }, props));
@@ -42,12 +43,19 @@ function noResultSearch(_queries, _requestOptions) {
 }
 
 describe('api', function () {
+  var container;
+  var docSearchSelector = '.DocSearch';
   beforeEach(function () {
-    document.body.innerHTML = '';
+    container = document.createElement('div');
+    document.body.appendChild(container);
+  });
+  afterEach(function () {
+    document.body.removeChild(container);
+    container = null;
   });
   it('renders with minimal parameters', function () {
     render( /*#__PURE__*/React.createElement(DocSearch, null));
-    expect(document.querySelector('.DocSearch')).toBeInTheDocument();
+    expect(document.querySelector(docSearchSelector)).toBeInTheDocument();
   });
   describe('translations', function () {
     it('overrides the default DocSearchButton text', function () {
@@ -59,13 +67,14 @@ describe('api', function () {
           }
         }
       }));
+      expect(document.querySelector(docSearchSelector)).toBeInTheDocument();
       expect(document.querySelector('.DocSearch-Button-Placeholder').innerHTML).toBe('Recherche');
       expect(document.querySelector('.DocSearch-Button').getAttribute('aria-label')).toBe('Recherche');
     });
-    it('overrides the default DocSearchModal startScreen text', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
-      return regeneratorRuntime.wrap(function _callee$(_context) {
+    it('overrides the default DocSearchModal startScreen text', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+      return regeneratorRuntime.wrap(function _callee2$(_context2) {
         while (1) {
-          switch (_context.prev = _context.next) {
+          switch (_context2.prev = _context2.next) {
             case 0:
               render( /*#__PURE__*/React.createElement(DocSearch, {
                 translations: {
@@ -76,25 +85,45 @@ describe('api', function () {
                   }
                 }
               }));
-              _context.next = 3;
-              return waitFor(function () {
-                fireEvent.click(document.querySelector('.DocSearch-Button'));
-              });
+              expect(document.querySelector(docSearchSelector)).toBeInTheDocument();
+              _context2.next = 4;
+              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+                return regeneratorRuntime.wrap(function _callee$(_context) {
+                  while (1) {
+                    switch (_context.prev = _context.next) {
+                      case 0:
+                        _context.t0 = fireEvent;
+                        _context.next = 3;
+                        return screen.findByText('Search');
 
-            case 3:
-              expect(screen.getByText('Pas de recherche récentes')).toBeInTheDocument();
+                      case 3:
+                        _context.t1 = _context.sent;
+
+                        _context.t0.click.call(_context.t0, _context.t1);
+
+                      case 5:
+                      case "end":
+                        return _context.stop();
+                    }
+                  }
+                }, _callee);
+              })));
 
             case 4:
+              expect(document.querySelector('.DocSearch-Modal')).toBeInTheDocument();
+              expect(screen.getByText('Pas de recherche récentes')).toBeInTheDocument();
+
+            case 6:
             case "end":
-              return _context.stop();
+              return _context2.stop();
           }
         }
-      }, _callee);
+      }, _callee2);
     })));
-    it('overrides the default DocSearchModal noResultsScreen text', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
-      return regeneratorRuntime.wrap(function _callee3$(_context3) {
+    it('overrides the default DocSearchModal noResultsScreen text', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
+      return regeneratorRuntime.wrap(function _callee5$(_context5) {
         while (1) {
-          switch (_context3.prev = _context3.next) {
+          switch (_context5.prev = _context5.next) {
             case 0:
               render( /*#__PURE__*/React.createElement(DocSearch, {
                 transformSearchClient: function transformSearchClient(searchClient) {
@@ -115,50 +144,77 @@ describe('api', function () {
                   return 'algolia.com';
                 }
               }));
-              _context3.next = 3;
-              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
-                return regeneratorRuntime.wrap(function _callee2$(_context2) {
+              expect(document.querySelector(docSearchSelector)).toBeInTheDocument();
+              _context5.next = 4;
+              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
+                return regeneratorRuntime.wrap(function _callee3$(_context3) {
                   while (1) {
-                    switch (_context2.prev = _context2.next) {
+                    switch (_context3.prev = _context3.next) {
                       case 0:
-                        _context2.next = 2;
-                        return waitFor(function () {
-                          fireEvent.click(document.querySelector('.DocSearch-Button'));
-                        });
+                        _context3.t0 = fireEvent;
+                        _context3.next = 3;
+                        return screen.findByText('Search');
 
-                      case 2:
-                        fireEvent.input(document.querySelector('.DocSearch-Input'), {
+                      case 3:
+                        _context3.t1 = _context3.sent;
+
+                        _context3.t0.click.call(_context3.t0, _context3.t1);
+
+                      case 5:
+                      case "end":
+                        return _context3.stop();
+                    }
+                  }
+                }, _callee3);
+              })));
+
+            case 4:
+              _context5.next = 6;
+              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4() {
+                return regeneratorRuntime.wrap(function _callee4$(_context4) {
+                  while (1) {
+                    switch (_context4.prev = _context4.next) {
+                      case 0:
+                        _context4.t0 = fireEvent;
+                        _context4.next = 3;
+                        return screen.findByPlaceholderText('Search docs');
+
+                      case 3:
+                        _context4.t1 = _context4.sent;
+                        _context4.t2 = {
                           target: {
                             value: 'q'
                           }
-                        });
+                        };
 
-                      case 3:
+                        _context4.t0.input.call(_context4.t0, _context4.t1, _context4.t2);
+
+                      case 6:
                       case "end":
-                        return _context2.stop();
+                        return _context4.stop();
                     }
                   }
-                }, _callee2);
+                }, _callee4);
               })));
 
-            case 3:
+            case 6:
               expect(screen.getByText(/Pas de résultats pour/)).toBeInTheDocument();
               expect(screen.getByText(/Ouvrez une issue sur docsearch-configs/)).toBeInTheDocument();
               expect(screen.getByRole('link', {
                 name: 'Lien du repo'
               })).toBeInTheDocument();
 
-            case 6:
+            case 9:
             case "end":
-              return _context3.stop();
+              return _context5.stop();
           }
         }
-      }, _callee3);
+      }, _callee5);
     })));
-    it('overrides the default DocSearchModal searchbox text', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4() {
-      return regeneratorRuntime.wrap(function _callee4$(_context4) {
+    it('overrides the default DocSearchModal searchbox text', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee7() {
+      return regeneratorRuntime.wrap(function _callee7$(_context7) {
         while (1) {
-          switch (_context4.prev = _context4.next) {
+          switch (_context7.prev = _context7.next) {
             case 0:
               render( /*#__PURE__*/React.createElement(DocSearch, {
                 translations: {
@@ -172,65 +228,111 @@ describe('api', function () {
                   }
                 }
               }));
-              _context4.next = 3;
-              return waitFor(function () {
-                fireEvent.click(document.querySelector('.DocSearch-Button'));
-              });
+              expect(document.querySelector(docSearchSelector)).toBeInTheDocument();
+              _context7.next = 4;
+              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee6() {
+                return regeneratorRuntime.wrap(function _callee6$(_context6) {
+                  while (1) {
+                    switch (_context6.prev = _context6.next) {
+                      case 0:
+                        _context6.t0 = fireEvent;
+                        _context6.next = 3;
+                        return screen.findByText('Search');
 
-            case 3:
+                      case 3:
+                        _context6.t1 = _context6.sent;
+
+                        _context6.t0.click.call(_context6.t0, _context6.t1);
+
+                      case 5:
+                      case "end":
+                        return _context6.stop();
+                    }
+                  }
+                }, _callee6);
+              })));
+
+            case 4:
               expect(document.querySelector('.DocSearch-Cancel').innerHTML).toBe('Annuler');
               expect(document.querySelector('.DocSearch-Cancel').getAttribute('aria-label')).toBe('Annuler');
               expect(document.querySelector('.DocSearch-Reset').getAttribute('title')).toBe('Effacer');
               expect(document.querySelector('.DocSearch-Reset').getAttribute('aria-label')).toBe('Effacer');
 
-            case 7:
+            case 8:
             case "end":
-              return _context4.stop();
+              return _context7.stop();
           }
         }
-      }, _callee4);
+      }, _callee7);
     })));
-    it('overrides the default DocSearchModal footer text', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
-      return regeneratorRuntime.wrap(function _callee5$(_context5) {
+    it('overrides the default DocSearchModal footer text', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee9() {
+      return regeneratorRuntime.wrap(function _callee9$(_context9) {
         while (1) {
-          switch (_context5.prev = _context5.next) {
+          switch (_context9.prev = _context9.next) {
             case 0:
               render( /*#__PURE__*/React.createElement(DocSearch, {
                 translations: {
                   modal: {
                     footer: {
-                      closeText: 'Fermer',
-                      navigateText: 'Naviguer',
+                      closeText: 'Pour fermer',
+                      closeKeyAriaLabel: "Touche d'échappement",
+                      navigateText: 'Pour naviguer',
+                      navigateUpKeyAriaLabel: 'Flèche vers le haut',
+                      navigateDownKeyAriaLabel: 'Flèche le bas',
                       searchByText: 'Recherche par',
-                      selectText: 'Selectionner'
+                      selectText: 'Pour selectionner',
+                      selectKeyAriaLabel: "Touche d'entrée"
                     }
                   }
                 }
               }));
-              _context5.next = 3;
-              return waitFor(function () {
-                fireEvent.click(document.querySelector('.DocSearch-Button'));
-              });
+              expect(document.querySelector(docSearchSelector)).toBeInTheDocument();
+              _context9.next = 4;
+              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee8() {
+                return regeneratorRuntime.wrap(function _callee8$(_context8) {
+                  while (1) {
+                    switch (_context8.prev = _context8.next) {
+                      case 0:
+                        _context8.t0 = fireEvent;
+                        _context8.next = 3;
+                        return screen.findByText('Search');
 
-            case 3:
+                      case 3:
+                        _context8.t1 = _context8.sent;
+
+                        _context8.t0.click.call(_context8.t0, _context8.t1);
+
+                      case 5:
+                      case "end":
+                        return _context8.stop();
+                    }
+                  }
+                }, _callee8);
+              })));
+
+            case 4:
               expect(screen.getByText('Recherche par')).toBeInTheDocument();
-              expect(screen.getByText('Fermer')).toBeInTheDocument();
-              expect(screen.getByText('Naviguer')).toBeInTheDocument();
-              expect(screen.getByText('Selectionner')).toBeInTheDocument();
+              expect(screen.getByText('Pour fermer')).toBeInTheDocument();
+              expect(screen.getByText('Pour naviguer')).toBeInTheDocument();
+              expect(screen.getByText('Pour selectionner')).toBeInTheDocument();
+              expect(document.querySelector('.DocSearch-Commands-Key > svg[aria-label="Touche d\'échappement"]')).toBeInTheDocument();
+              expect(document.querySelector('.DocSearch-Commands-Key > svg[aria-label="Flèche vers le haut"]')).toBeInTheDocument();
+              expect(document.querySelector('.DocSearch-Commands-Key > svg[aria-label="Flèche le bas"]')).toBeInTheDocument();
+              expect(document.querySelector('.DocSearch-Commands-Key > svg[aria-label="Touche d\'entrée"]')).toBeInTheDocument();
 
-            case 7:
+            case 12:
             case "end":
-              return _context5.stop();
+              return _context9.stop();
           }
         }
-      }, _callee5);
+      }, _callee9);
     })));
   });
   describe('getMissingResultsUrl', function () {
-    it('does not render the link to the repository by default', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee7() {
-      return regeneratorRuntime.wrap(function _callee7$(_context7) {
+    it('does not render the link to the repository by default', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee12() {
+      return regeneratorRuntime.wrap(function _callee12$(_context12) {
         while (1) {
-          switch (_context7.prev = _context7.next) {
+          switch (_context12.prev = _context12.next) {
             case 0:
               render( /*#__PURE__*/React.createElement(DocSearch, {
                 transformSearchClient: function transformSearchClient(searchClient) {
@@ -239,48 +341,75 @@ describe('api', function () {
                   });
                 }
               }));
-              _context7.next = 3;
-              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee6() {
-                return regeneratorRuntime.wrap(function _callee6$(_context6) {
+              expect(document.querySelector(docSearchSelector)).toBeInTheDocument();
+              _context12.next = 4;
+              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee10() {
+                return regeneratorRuntime.wrap(function _callee10$(_context10) {
                   while (1) {
-                    switch (_context6.prev = _context6.next) {
+                    switch (_context10.prev = _context10.next) {
                       case 0:
-                        _context6.next = 2;
-                        return waitFor(function () {
-                          fireEvent.click(document.querySelector('.DocSearch-Button'));
-                        });
+                        _context10.t0 = fireEvent;
+                        _context10.next = 3;
+                        return screen.findByText('Search');
+
+                      case 3:
+                        _context10.t1 = _context10.sent;
 
-                      case 2:
-                        fireEvent.input(document.querySelector('.DocSearch-Input'), {
+                        _context10.t0.click.call(_context10.t0, _context10.t1);
+
+                      case 5:
+                      case "end":
+                        return _context10.stop();
+                    }
+                  }
+                }, _callee10);
+              })));
+
+            case 4:
+              _context12.next = 6;
+              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee11() {
+                return regeneratorRuntime.wrap(function _callee11$(_context11) {
+                  while (1) {
+                    switch (_context11.prev = _context11.next) {
+                      case 0:
+                        _context11.t0 = fireEvent;
+                        _context11.next = 3;
+                        return screen.findByPlaceholderText('Search docs');
+
+                      case 3:
+                        _context11.t1 = _context11.sent;
+                        _context11.t2 = {
                           target: {
                             value: 'q'
                           }
-                        });
+                        };
 
-                      case 3:
+                        _context11.t0.input.call(_context11.t0, _context11.t1, _context11.t2);
+
+                      case 6:
                       case "end":
-                        return _context6.stop();
+                        return _context11.stop();
                     }
                   }
-                }, _callee6);
+                }, _callee11);
               })));
 
-            case 3:
+            case 6:
               expect(screen.getByText(/No results for/)).toBeInTheDocument();
               expect(document.querySelector('.DocSearch-Help a')).not.toBeInTheDocument();
 
-            case 5:
+            case 8:
             case "end":
-              return _context7.stop();
+              return _context12.stop();
           }
         }
-      }, _callee7);
+      }, _callee12);
     })));
-    it('render the link to the repository', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee9() {
+    it('render the link to the repository', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee15() {
       var link;
-      return regeneratorRuntime.wrap(function _callee9$(_context9) {
+      return regeneratorRuntime.wrap(function _callee15$(_context15) {
         while (1) {
-          switch (_context9.prev = _context9.next) {
+          switch (_context15.prev = _context15.next) {
             case 0:
               render( /*#__PURE__*/React.createElement(DocSearch, {
                 transformSearchClient: function transformSearchClient(searchClient) {
@@ -288,49 +417,75 @@ describe('api', function () {
                     search: noResultSearch
                   });
                 },
-                getMissingResultsUrl: function getMissingResultsUrl(_ref9) {
-                  var query = _ref9.query;
+                getMissingResultsUrl: function getMissingResultsUrl(_ref14) {
+                  var query = _ref14.query;
                   return "https://github.com/algolia/docsearch/issues/new?title=".concat(query);
                 }
               }));
-              _context9.next = 3;
-              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee8() {
-                return regeneratorRuntime.wrap(function _callee8$(_context8) {
+              _context15.next = 3;
+              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee13() {
+                return regeneratorRuntime.wrap(function _callee13$(_context13) {
                   while (1) {
-                    switch (_context8.prev = _context8.next) {
+                    switch (_context13.prev = _context13.next) {
+                      case 0:
+                        _context13.t0 = fireEvent;
+                        _context13.next = 3;
+                        return screen.findByText('Search');
+
+                      case 3:
+                        _context13.t1 = _context13.sent;
+
+                        _context13.t0.click.call(_context13.t0, _context13.t1);
+
+                      case 5:
+                      case "end":
+                        return _context13.stop();
+                    }
+                  }
+                }, _callee13);
+              })));
+
+            case 3:
+              _context15.next = 5;
+              return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee14() {
+                return regeneratorRuntime.wrap(function _callee14$(_context14) {
+                  while (1) {
+                    switch (_context14.prev = _context14.next) {
                       case 0:
-                        _context8.next = 2;
-                        return waitFor(function () {
-                          fireEvent.click(document.querySelector('.DocSearch-Button'));
-                        });
+                        _context14.t0 = fireEvent;
+                        _context14.next = 3;
+                        return screen.findByPlaceholderText('Search docs');
 
-                      case 2:
-                        fireEvent.input(document.querySelector('.DocSearch-Input'), {
+                      case 3:
+                        _context14.t1 = _context14.sent;
+                        _context14.t2 = {
                           target: {
                             value: 'q'
                           }
-                        });
+                        };
 
-                      case 3:
+                        _context14.t0.input.call(_context14.t0, _context14.t1, _context14.t2);
+
+                      case 6:
                       case "end":
-                        return _context8.stop();
+                        return _context14.stop();
                     }
                   }
-                }, _callee8);
+                }, _callee14);
               })));
 
-            case 3:
+            case 5:
               expect(screen.getByText(/No results for/)).toBeInTheDocument();
               link = document.querySelector('.DocSearch-Help a');
               expect(link).toBeInTheDocument();
               expect(link.getAttribute('href')).toBe('https://github.com/algolia/docsearch/issues/new?title=q');
 
-            case 7:
+            case 9:
             case "end":
-              return _context9.stop();
+              return _context15.stop();
           }
         }
-      }, _callee9);
+      }, _callee15);
     })));
   });
 });

package/dist/esm/icons/ControlKeyIcon.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function ControlKeyIcon(): JSX.Element;

package/dist/esm/icons/ErrorIcon.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function ErrorIcon(): JSX.Element;

package/dist/esm/icons/GoToExternalIcon.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function GoToExternal(): JSX.Element;

package/dist/esm/icons/LoadingIcon.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function LoadingIcon(): JSX.Element;

package/dist/esm/icons/NoResultsIcon.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function NoResultsIcon(): JSX.Element;

package/dist/esm/icons/RecentIcon.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function RecentIcon(): JSX.Element;

package/dist/esm/icons/ResetIcon.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function ResetIcon(): JSX.Element;

package/dist/esm/icons/SearchIcon.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function SearchIcon(): JSX.Element;

package/dist/esm/icons/SelectIcon.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function SelectIcon(): JSX.Element;

package/dist/esm/icons/SourceIcon.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare function SourceIcon(props: {
     type: string;
 }): JSX.Element;

package/dist/esm/icons/StarIcon.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function StarIcon(): JSX.Element;

package/dist/esm/version.d.ts

@@ -1 +1 @@
-export declare const version = "3.0.0-alpha.50";
+export declare const version = "3.1.1";

package/dist/esm/version.js

@@ -1 +1 @@
-export var version = '3.0.0-alpha.50';
+export var version = '3.1.1';