Merge pull request mozilla-services#4869 from testeaxeax/issue-4652

Fix mozilla-services#4652, bring textbox into view when refocusing
chenba · Sep 13, 2018 · f9d7b65 · f9d7b65
2 parents 2d4bef5 + c508586
commit f9d7b65
Showing 1 changed file with 7 additions and 2 deletions.
diff --git a/server/src/pages/shot/text-tool.js b/server/src/pages/shot/text-tool.js
@@ -152,10 +152,10 @@ exports.TextTool = class TextTool extends React.Component {
     this.setState({color, colorName});
 
     const txtInput = this.textInput.current;
-    txtInput.focus();
     if (!this.isElementInViewPort(txtInput)) {
        txtInput.scrollIntoView({block: "center"});
     }
+    txtInput.focus();
   }
 
   onDragMouseDown(e) {
@@ -260,15 +260,20 @@ exports.TextTool = class TextTool extends React.Component {
     const txtInput = this.textInput.current;
 
     this.setState({textSize: size});
-    txtInput.focus();
     if (!this.isElementInViewPort(txtInput)) {
        txtInput.scrollIntoView({block: "center"});
     }
+    txtInput.focus();
   }
 
   onInput() {
+    const txtInput = this.textInput.current;
+
     hasFirstInput = true;
     this.adjustX();
+    if (!this.isElementInViewPort(txtInput)) {
+       txtInput.scrollIntoView({block: "center"});
+    }
   }
 
   adjustWidth() {