Fix #4652, bring textbox into view when refocusing

mozilla-services · Sep 12, 2018 · c508586 · c508586
1 parent 596dc2a
commit c508586
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() {