From 9aca5c66515180d54ad2a2fc17bdc17c1ecf4efc Mon Sep 17 00:00:00 2001
From: MikeNicholls <MikeNicholls@users.noreply.github.com>
Date: Sun, 12 May 2019 08:02:14 +1200
Subject: [PATCH] Fix inability to authenticate against a server protected with
 HTTP Basic Auth

Remove use of refs for login dialog username and password, shift values into instance properties instead (#966)
---
 src/browser/components/LoginModal.jsx | 24 +++++++++++++++---------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/src/browser/components/LoginModal.jsx b/src/browser/components/LoginModal.jsx
index 3a251fdb..f802620c 100644
--- a/src/browser/components/LoginModal.jsx
+++ b/src/browser/components/LoginModal.jsx
@@ -9,17 +9,23 @@ export default class LoginModal extends React.Component {
   constructor(props) {
     super(props);
     this.handleSubmit = this.handleSubmit.bind(this);
-    this.usernameRef = React.createRef();
-    this.passwordRef = React.createRef();
+    this.username = '';
+    this.password = '';
   }
 
   handleSubmit(event) {
     event.preventDefault();
-    const usernameNode = this.usernameRef.current;
-    const passwordNode = this.passwordRef.current;
-    this.props.onLogin(this.props.request, usernameNode.value, passwordNode.value);
-    usernameNode.value = '';
-    passwordNode.value = '';
+    this.props.onLogin(this.props.request, this.username, this.password);
+    this.username = '';
+    this.password = '';
+  }
+
+  setUsername = (e) => {
+    this.username = e.target.value;
+  }
+
+  setPassword = (e) => {
+    this.password = e.target.value;
   }
 
   render() {
@@ -54,7 +60,7 @@ export default class LoginModal extends React.Component {
                 <FormControl
                   type='text'
                   placeholder='User Name'
-                  ref={this.usernameRef}
+                  onChange={this.setUsername}
                   onClick={(e) => {
                     e.stopPropagation();
                   }}
@@ -70,7 +76,7 @@ export default class LoginModal extends React.Component {
                 <FormControl
                   type='password'
                   placeholder='Password'
-                  ref={this.passwordRef}
+                  onChange={this.setPassword}
                   onClick={(e) => {
                     e.stopPropagation();
                   }}