From 625563d78fd831ae4e1574070706ac1dd21baacf Mon Sep 17 00:00:00 2001
From: Shane Tomlinson <stomlinson@mozilla.com>
Date: Tue, 22 May 2012 14:45:29 +0100
Subject: [PATCH] Make the "is this your computer" screen keyboard navigable.
* For the buttons, use id's instead of classes.
* Focus the "yes" button when the screen is shown.
issue #1582
---
.../static/dialog/controllers/is_this_your_computer.js | 10 +++++++---
.../static/dialog/views/is_this_your_computer.ejs | 4 ++--
2 files changed, 9 insertions(+), 5 deletions(-)
diff --git a/resources/static/dialog/controllers/is_this_your_computer.js b/resources/static/dialog/controllers/is_this_your_computer.js
index 182e60c01..41fb15f36 100644
--- a/resources/static/dialog/controllers/is_this_your_computer.js
+++ b/resources/static/dialog/controllers/is_this_your_computer.js
@@ -7,6 +7,7 @@ BrowserID.Modules.IsThisYourComputer = (function() {
"use strict";
var bid = BrowserID,
+ dom = bid.DOM,
user = bid.User,
errors = bid.Errors,
email;
@@ -20,9 +21,12 @@ BrowserID.Modules.IsThisYourComputer = (function() {
self.renderWait("is_this_your_computer", options);
- // TODO - Make the selectors use ids instead of classes.
- self.click("button.this_is_my_computer", self.yes);
- self.click("button.this_is_not_my_computer", self.no);
+ // renderWait does not automatically focus the first input element or
+ // button, so it must be done manually.
+ dom.focus("#this_is_my_computer");
+
+ self.click("#this_is_my_computer", self.yes);
+ self.click("#this_is_not_my_computer", self.no);
Module.sc.start.call(self, options);
},
diff --git a/resources/static/dialog/views/is_this_your_computer.ejs b/resources/static/dialog/views/is_this_your_computer.ejs
index d592e7714..1ca1d9e49 100644
--- a/resources/static/dialog/views/is_this_your_computer.ejs
+++ b/resources/static/dialog/views/is_this_your_computer.ejs
@@ -6,12 +6,12 @@
<h2><%= gettext('If you don\'t mind me asking, is this your computer?') %></h2>
<p>
- <button class="this_is_my_computer" tabindex="3"><%= gettext('yes') %></button>
+ <button id="this_is_my_computer"><%= gettext('yes') %></button>
<%= gettext('If so, we\'ll keep you logged in for a couple weeks.') %>
</p>
<p>
- <button class="this_is_not_my_computer negative" tabindex="3"><%= gettext('no') %></button>
+ <button id="this_is_not_my_computer" class="negative"><%= gettext('no') %></button>
<%= gettext('If you\'re at a public computer such as a library or internet cafe, we\'ll ask you for your password again in an hour.') %>
</p>
</div>
--
GitLab