feat: add setSelectionRange for the ref of Input and TextArea (#27584)

Co-authored-by: lvpansen <pansen.lv@atzuche.com>
ant-design · Nov 19, 2020 · 7c3b84e · 7c3b84e
1 parent 2ff971e
commit 7c3b84e
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 0 deletions.
diff --git a/components/input/Input.tsx b/components/input/Input.tsx
@@ -179,6 +179,10 @@ class Input extends React.Component<InputProps, InputState> {
     this.input.blur();
   }
 
+  setSelectionRange(start: number, end: number, direction?: 'forward' | 'backward' | 'none') {
+    this.input.setSelectionRange(start, end, direction);
+  }
+
   select() {
     this.input.select();
   }

diff --git a/components/input/__tests__/index.test.js b/components/input/__tests__/index.test.js
@@ -74,6 +74,15 @@ describe('Input', () => {
       wrapper.unmount();
     });
   });
+
+  it('set mouse cursor position', () => {
+    const defaultValue = '11111';
+    const valLength = defaultValue.length;
+    const wrapper = mount(<Input autoFocus defaultValue={defaultValue} />);
+    wrapper.instance().setSelectionRange(valLength, valLength);
+    expect(wrapper.instance().input.selectionStart).toEqual(5);
+    expect(wrapper.instance().input.selectionEnd).toEqual(5);
+  });
 });
 
 describe('prefix and suffix', () => {

diff --git a/components/input/__tests__/textarea.test.js b/components/input/__tests__/textarea.test.js
@@ -172,6 +172,15 @@ describe('TextArea', () => {
     expect(wrapper.find('textarea').hasClass('ant-input-lg')).toBe(true);
     expect(wrapper.render()).toMatchSnapshot();
   });
+
+  it('set mouse cursor position', () => {
+    const defaultValue = '11111';
+    const valLength = defaultValue.length;
+    const wrapper = mount(<TextArea autoFocus defaultValue={defaultValue} />);
+    wrapper.instance().setSelectionRange(valLength, valLength);
+    expect(wrapper.instance().resizableTextArea.textArea.selectionStart).toEqual(5);
+    expect(wrapper.instance().resizableTextArea.textArea.selectionEnd).toEqual(5);
+  });
 });
 
 describe('TextArea allowClear', () => {