history: fix focus regression when showing "Remove history" confirmation dialog.

Also reverses "OK" + "Cancel" buttons to match other overlays.

R=estade@chromium.org
BUG=407498

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

Cr-Commit-Position: refs/heads/master@{#296326}

chrome/browser/resources/history/alert_overlay.html

+<!-- TODO(dbeam): merge with chrome/browser/resources/alert_overlay.html -->
 <div id="alertOverlay" class="page">
   <div class="close-button"></div>
   <h1 id="alertOverlayTitle"></h1>
@@ -7,7 +8,7 @@
   <div class="action-area">
     <div class="button-strip">
       <button id="alertOverlayCancel" type="reset"></button>
-      <button id="alertOverlayOk" type="submit"></button>
+      <button id="alertOverlayOk" class="default-button" type="submit"></button>
     </div>
   </div>
 </div>

chrome/browser/resources/history/history.js

@@ -1975,7 +1975,13 @@ function openClearBrowsingData(e) {
 function showConfirmationOverlay() {
   $('alertOverlay').classList.add('showing');
   $('overlay').hidden = false;
+  $('history-page').setAttribute('aria-hidden', 'true');
   uber.invokeMethodOnParent('beginInterceptingEvents');
+
+  // If an element is focused behind the confirm overlay, blur it so focus
+  // doesn't accidentally get stuck behind it.
+  if ($('history-page').contains(document.activeElement))
+    document.activeElement.blur();
 }
 
 /**
@@ -1984,6 +1990,7 @@ function showConfirmationOverlay() {
 function hideConfirmationOverlay() {
   $('alertOverlay').classList.remove('showing');
   $('overlay').hidden = true;
+  $('history-page').removeAttribute('aria-hidden');
   uber.invokeMethodOnParent('stopInterceptingEvents');
 }
 
@@ -1999,10 +2006,10 @@ function confirmDeletion(okCallback, cancelCallback) {
   alertOverlay.setValues(
       loadTimeData.getString('removeSelected'),
       loadTimeData.getString('deleteWarning'),
-      loadTimeData.getString('cancel'),
       loadTimeData.getString('deleteConfirm'),
-      cancelCallback,
-      okCallback);
+      loadTimeData.getString('cancel'),
+      okCallback,
+      cancelCallback);
   showConfirmationOverlay();
 }
 

chrome/test/data/webui/history_browsertest.js

@@ -873,6 +873,41 @@ TEST_F('HistoryWebUIRealBackendTest', 'leftRightChangeFocus', function() {
   testDone();
 });
 
+TEST_F('HistoryWebUIRealBackendTest', 'showConfirmDialogAndCancel', function() {
+  waitForCallback('deleteComplete', function() {
+    testDone([false, "history deleted when it shouldn't have been"]);
+  });
+
+  document.querySelector('input[type=checkbox]').click();
+  $('remove-selected').click();
+
+  assertTrue($('alertOverlay').classList.contains('showing'));
+  assertFalse($('history-page').contains(document.activeElement));
+
+  var esc = document.createEvent('KeyboardEvent');
+  esc.initKeyboardEvent('keydown', true, true, window, 'U+001B');
+
+  document.dispatchEvent(esc);
+  assertFalse($('alertOverlay').classList.contains('showing'));
+
+  testDone();
+});
+
+TEST_F('HistoryWebUIRealBackendTest', 'showConfirmDialogAndRemove', function() {
+  document.querySelector('input[type=checkbox]').click();
+  $('remove-selected').click();
+
+  assertTrue($('alertOverlay').classList.contains('showing'));
+  assertFalse($('history-page').contains(document.activeElement));
+
+  waitForCallback('deleteComplete', testDone);
+
+  var enter = document.createEvent('KeyboardEvent');
+  enter.initKeyboardEvent('keydown', true, true, window, 'Enter');
+  document.dispatchEvent(enter);
+  assertFalse($('alertOverlay').classList.contains('showing'));
+});
+
 /**
  * Fixture for History WebUI testing when deletions are prohibited.
  * @extends {HistoryWebUIRealBackendTest}

ui/webui/resources/js/cr/ui/overlay.js

@@ -49,7 +49,7 @@ cr.define('cr.ui.overlay', function() {
           return;
 
         // Close the overlay on escape.
-        if (e.keyCode == 27)  // Escape
+        if (e.keyIdentifier == 'U+001B')
           cr.dispatchSimpleEvent(overlay, 'cancelOverlay');
 
         // Execute the overlay's default button on enter, unless focus is on an