fix(searchBox): force cursor position to be at the end of the query

fixes #946
algolia · Jul 6, 2016 · e76e8ce · e76e8ce
1 parent 08db254
commit e76e8ce
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 0 deletions.
diff --git a/src/widgets/search-box/__tests__/search-box-test.js b/src/widgets/search-box/__tests__/search-box-test.js
@@ -567,6 +567,7 @@ describe('searchBox()', () => {
     beforeEach(() => {
       container = document.body.appendChild(document.createElement('input'));
       container.focus = sinon.spy();
+      container.setSelectionRange = sinon.spy();
     });
 
     context('when auto', () => {
@@ -615,6 +616,15 @@ describe('searchBox()', () => {
         // Then
         expect(container.focus.called).toEqual(true);
       });
+
+      it('forces cursor to be at the end of the query', () => {
+        // Given
+        helper.state.query = 'foo';
+        // When
+        widget.init({state, helper, onHistoryChange});
+        // Then
+        expect(container.setSelectionRange.calledWith(3, 3)).toEqual(true);
+      });
     });
 
     context('when false', () => {

diff --git a/src/widgets/search-box/search-box.js b/src/widgets/search-box/search-box.js
@@ -227,6 +227,7 @@ function searchBox({
 
       if (autofocus === true || autofocus === 'auto' && helper.state.query === '') {
         input.focus();
+        input.setSelectionRange(helper.state.query.length, helper.state.query.length);
       }
     },
     render({helper}) {