Print Preview: Improving accessibility of margins UI.

chrome/browser/resources/print_preview/margins_ui.js

 // Copyright (c) 2011 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 cr.define('print_preview', function() {
   'strict';
 
   function MarginsUI() {
     var marginsUI = document.createElement('div');
     marginsUI.__proto__ = MarginsUI.prototype;
@@ skipping 89 matching lines @@
     draw: function() {
       this.applyClippingMask_();
       this.pairsAsList.forEach(function(pair) { pair.draw(); });
     },
 
     /**
      * Shows the margins UI.
      */
     show: function() {
       this.hidden = false;
+      this.classList.remove('invisible');
     },
 
     /**
-     * Hides the margins UI.
+     * Hides the margins UI and removes from the DOM if requested.
+     * @param {boolean} removeFromDOM True if |this| should also be removed from

[Lei Zhang, 2011/10/26 00:51:48]

Technically it's still in the DOM, just hidden.

[dpapad, 2011/10/26 01:24:24]

Yes, display: none; prevents it from being rendered, I made this more clear.

+     *     the DOM (in order to not interfere with the tab order).
      */
-    hide: function() {
-      this.hidden = true;
+    hide: function(removeFromDOM) {
+      removeFromDOM ? this.hidden = true : this.classList.add('invisible');
     },
 
     /**
      * Applies a clipping mask on |this| so that it does not paint on top of the
      * scrollbars (if any).
      */
     applyClippingMask_: function() {
       var bottom = previewArea.height;
       var right = previewArea.width;
       this.style.clip = "rect(0, " + right + "px, " + bottom + "px, 0)";
@@ skipping 65 matching lines @@
           this.lastClickedMarginsUIPair.getDragDisplacementFrom(point);
       dragEvent.destinationPoint = point;
       this.dispatchEvent(dragEvent);
     },
   };
 
   return {
     MarginsUI: MarginsUI
   };
 });