A11y for supervised users import:

Make it possible to tab-navigate to import page and ensure tab/arrows-navigation works there.

BUG=360588

Review URL: https://codereview.chromium.org/246603004

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@266435 0039d316-1c4b-4281-b951-d872f2087c98

chrome/browser/resources/chromeos/login/screen_locally_managed_user_creation.css

@@ -15,6 +15,10 @@
   height: 100%;
 }
 
+#managed-user-creation .nofocus:focus {
+  outline: none;
+}
+
 #managed-user-creation .step-controls {
   -webkit-padding-end: 20px;
   bottom: 20px;

chrome/browser/resources/chromeos/login/screen_locally_managed_user_creation.js

@@ -256,8 +256,9 @@ login.createScreen('LocallyManagedUserCreationScreen',
     decorate: function() {
       // Mousedown has to be used instead of click to be able to prevent 'focus'
       // event later.
-      this.addEventListener('mousedown',
-                            this.handleMouseDown_.bind(this));
+      this.addEventListener('mousedown', this.handleMouseDown_.bind(this));
+      var screen = $('managed-user-creation');
+      var importList = screen.importList_;
     },
 
     /**
@@ -330,6 +331,35 @@ login.createScreen('LocallyManagedUserCreationScreen',
 
     /** @override */
     decorate: function() {
+      this.setAttribute('tabIndex', 0);
+      this.classList.add('nofocus');
+      var importList = this;
+      var screen = $('managed-user-creation');
+
+      this.addEventListener('focus', function(e) {
+        if (importList.selectedPod_ == null) {
+          if (importList.pods.length > 0)
+            importList.selectPod(importList.pods[0]);
+        }
+      });
+
+      this.addEventListener('keydown', function(e) {
+        switch (e.keyIdentifier) {
+          case 'Up':
+            importList.selectNextPod(-1);
+            e.stopPropagation();
+            break;
+          case 'Enter':
+            if (importList.selectedPod_ != null)
+              screen.importSupervisedUser_();
+            e.stopPropagation();
+            break;
+          case 'Down':
+            importList.selectNextPod(+1);
+            e.stopPropagation();
+            break;
+        }
+      });
     },
 
     /**
@@ -409,6 +439,7 @@ login.createScreen('LocallyManagedUserCreationScreen',
       if (!podToSelect)
         return;
       podToSelect.classList.add('focused');
+      podToSelect.focus();
       var screen = $('managed-user-creation');
       if (!this.selectedPod_) {
         screen.getScreenButton('import').disabled = true;
@@ -422,6 +453,25 @@ login.createScreen('LocallyManagedUserCreationScreen',
       }
     },
 
+    selectNextPod: function(direction) {
+      if (!this.selectedPod_)
+        return false;
+      var index = -1;
+      for (var i = 0, pod; pod = this.pods[i]; ++i) {
+        if (pod == this.selectedPod_) {
+          index = i;
+          break;
+        }
+      }
+      if (-1 == index)
+        return false;
+      index = index + direction;
+      if (index < 0 || index >= this.pods.length)
+        return false;
+      this.selectPod(this.pods[index]);
+      return true;
+    },
+
     selectUser: function(user_id) {
       for (var i = 0, pod; pod = this.pods[i]; ++i) {
         if (pod.user.id == user_id) {