Fixed a11y tab handling on cookies settings

Hidden buttons are no longer accessible by pressing TAB.
Cookie buttons are no longer accessible by pressing TAB.
  The cookie buttons are still accessible by pressing left/right.
  The "Remove" button is still accessible by pressing TAB.

BUG=408470

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

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

chrome/browser/resources/options/cookies_list.js

@@ -173,12 +173,12 @@ cr.define('options', function() {
         return;
       this.expanded_ = expanded;
       if (expanded) {
+        this.classList.add('show-items');
         var oldExpanded = this.list.expandedItem;
         this.list.expandedItem = this;
         this.updateItems_();
         if (oldExpanded)
           oldExpanded.expanded = false;
-        this.classList.add('show-items');
       } else {
         if (this.list.expandedItem == this) {
           this.list.expandedItem = null;
@@ -535,7 +535,6 @@ cr.define('options', function() {
       div.className = 'cookie-item';
       // Help out screen readers and such: this is a clickable thing.
       div.setAttribute('role', 'button');
-      div.tabIndex = 0;
       div.textContent = text;
       var apps = this.data.appsProtectingThis;
       if (apps)

chrome/browser/resources/options/cookies_view.css

@@ -116,6 +116,7 @@ list.cookie-list > .deletable-item[selected] .cookie-data {
   -webkit-margin-start: 14em;
   -webkit-padding-start: 7px;
   -webkit-transition: 150ms ease-in-out;
+  display: none;
   height: 0;
   opacity: 0;
   /* Make the cookie items wrap correctly. */
@@ -129,6 +130,7 @@ list.cookie-list > .deletable-item[selected] .cookie-data {
 }
 
 .show-items .cookie-items {
+  display: block;
   opacity: 1;
 }