From ee4b79120e7dfd1fdd83e444f64ea086fe8c4f1c Mon Sep 17 00:00:00 2001
From: Josh Perez <60019601+josh-signal@users.noreply.github.com>
Date: Thu, 15 Jul 2021 18:01:41 -0400
Subject: [PATCH] Adds keyboard access to the finish linking phone button

---
 background.html              |  4 ++--
 js/views/install_view.js     |  5 -----
 test/index.html              |  4 ++--
 ts/util/lint/exceptions.json | 10 +---------
 4 files changed, 5 insertions(+), 18 deletions(-)

diff --git a/background.html b/background.html
index 44ccb5769..bbbb89ff6 100644
--- a/background.html
+++ b/background.html
@@ -255,13 +255,13 @@
               <span class='banner-icon lead-pencil'></span>
               <div class='header'>{{ chooseName }}</div>
               <div>
-                <input type='text' class='device-name' spellcheck='false' maxlength='50' />
+                <input type='text' class='device-name' spellcheck='false' maxlength='50' tabIndex="0" />
               </div>
             </div>
 
               <div class='nav'>
                 <div>
-                  <a class='button finish'>{{ finishLinkingPhoneButton }}</a>
+                  <button class="button finish" type="submit" tabIndex="0">{{ finishLinkingPhoneButton }}</button>
                 </div>
               </div>
           </div>
diff --git a/js/views/install_view.js b/js/views/install_view.js
index 8317bb5a5..9c2e5fae3 100644
--- a/js/views/install_view.js
+++ b/js/views/install_view.js
@@ -29,7 +29,6 @@
     events: {
       'click .try-again': 'connect',
       'click .second': 'shutdown',
-      'click .finish': 'finishLinking',
       // the actual next step happens in confirmNumber() on submit form #link-phone
     },
     initialize(options = {}) {
@@ -180,10 +179,6 @@
       this.$(DEVICE_NAME_SELECTOR).val(deviceName || window.getHostName());
       this.$(DEVICE_NAME_SELECTOR).focus();
     },
-    finishLinking() {
-      // We use a form so we get submit-on-enter behavior
-      this.$('#link-phone').submit();
-    },
     confirmNumber() {
       const tsp = textsecure.storage.protocol;
 
diff --git a/test/index.html b/test/index.html
index b498b8186..8cfa6e484 100644
--- a/test/index.html
+++ b/test/index.html
@@ -237,13 +237,13 @@
               <span class='banner-icon lead-pencil'></span>
               <div class='header'>{{ chooseName }}</div>
               <div>
-                <input type='text' class='device-name' spellcheck='false' maxlength='50' />
+                <input type='text' class='device-name' spellcheck='false' maxlength='50' tabIndex="0" />
               </div>
             </div>
 
               <div class='nav'>
                 <div>
-                  <a class='button finish'>{{ finishLinkingPhoneButton }}</a>
+                  <button class="button finish" type="submit" tabIndex="0">{{ finishLinkingPhoneButton }}</button>
                 </div>
               </div>
           </div>
diff --git a/ts/util/lint/exceptions.json b/ts/util/lint/exceptions.json
index dbc3155a7..432554a5f 100644
--- a/ts/util/lint/exceptions.json
+++ b/ts/util/lint/exceptions.json
@@ -573,14 +573,6 @@
     "updated": "2020-03-24T19:03:04.861Z",
     "reasonDetail": "Protected from arbitrary input"
   },
-  {
-    "rule": "jQuery-$(",
-    "path": "js/views/install_view.js",
-    "line": "      this.$('#link-phone').submit();",
-    "reasonCategory": "usageTrusted",
-    "updated": "2020-03-24T19:03:04.861Z",
-    "reasonDetail": "Protected from arbitrary input"
-  },
   {
     "rule": "jQuery-$(",
     "path": "js/views/install_view.js",
@@ -14157,4 +14149,4 @@
     "updated": "2021-03-18T21:41:28.361Z",
     "reasonDetail": "A generic hook. Typically not to be used with non-DOM values."
   }
-]
\ No newline at end of file
+]