From eea0b028c96a8255566e6600a8e6d238e7a51a8d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=81=8F=E5=8F=B3?= <afc163@gmail.com>
Date: Fri, 7 Feb 2020 13:15:24 +0800
Subject: [PATCH] :bug: Typography editable should focus at the end (#21268)

close #21261
---
 components/typography/Editable.tsx            |  7 +++++--
 components/typography/__tests__/index.test.js | 11 +++++++++++
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/components/typography/Editable.tsx b/components/typography/Editable.tsx
index ffec409bb4..bc3f0b7818 100644
--- a/components/typography/Editable.tsx
+++ b/components/typography/Editable.tsx
@@ -46,8 +46,11 @@ class Editable extends React.Component<EditableProps, EditableState> {
   };
 
   componentDidMount() {
-    if (this.textarea) {
-      this.textarea.focus();
+    if (this.textarea && this.textarea.resizableTextArea) {
+      const { textArea } = this.textarea.resizableTextArea;
+      textArea.focus();
+      const { length } = textArea.value;  
+      textArea.setSelectionRange(length, length);  
     }
   }
 
diff --git a/components/typography/__tests__/index.test.js b/components/typography/__tests__/index.test.js
index 0e18b733e3..c1b0b21f80 100644
--- a/components/typography/__tests__/index.test.js
+++ b/components/typography/__tests__/index.test.js
@@ -241,6 +241,17 @@ describe('Typography', () => {
         wrapper.find('TextArea').simulate('blur');
       });
     });
+
+    it('should focus at the end of textarea', () => {
+      const wrapper = mount(<Paragraph editable>content</Paragraph>);
+      wrapper
+        .find('.ant-typography-edit')
+        .first()
+        .simulate('click');
+      const textareaNode = wrapper.find('textarea').getDOMNode();
+      expect(textareaNode.selectionStart).toBe(7);
+      expect(textareaNode.selectionEnd).toBe(7);
+    });
   });
 
   it('warning if use setContentRef', () => {