MD User Manager: fixes accessibility issues

chrome/browser/resources/md_user_manager/user_manager_pages.html

Index: chrome/browser/resources/md_user_manager/user_manager_pages.html
diff --git a/chrome/browser/resources/md_user_manager/user_manager_pages.html b/chrome/browser/resources/md_user_manager/user_manager_pages.html
index 9e5276f12d2366470deb40f88c423af4413b9de0..f85d1a67230c965897c188922e7025fc10b48474 100644
--- a/chrome/browser/resources/md_user_manager/user_manager_pages.html
+++ b/chrome/browser/resources/md_user_manager/user_manager_pages.html
@@ -17,6 +17,10 @@
         display: flex;
         justify-content: center;
       }
+
+      neon-animated-pages > div:not(.iron-selected) > ::content > * {

[tommycli, 2016/05/04 17:04:11]

Hmm... why is this necessary? I thought not-selected animated pages were
automatically not visible?

Is this because of the above CSS rule applying to neon-animated-pages > div?

[Moe, 2016/05/04 17:33:52]

neon-animated-pages works as expected. Note that if you look at the full source
of this file, user-manager-pages has its own content element (other than the
extra one that i removed). Q: why does it have its own content element? b/c for
countless reasons i can't componentize its distributed children and bring them
into this file! One reason being that the user pods JS/logic is complex and
shared between cros and desktop.

neon-animated-pages hides non-selected pages which are the wrapper divs (<div
id="...">). That does not penetrate to distributed children of
user-manager-pages. this new rules basically says "if a wrapper div is not
selected and has a <content> tag as a child, go ahead and hide the elements
under <content> as well."

'!important' is also needed b/c some of those children set 'display: block'
using id which is more specific and therefore takes priority.

[tommycli, 2016/05/04 17:56:02]

Hmm... I see. Do you still need this rule if the isPageVisible_ dom-if
statements are gone?

I suspect (though I'm not sure) that the <content></content> tag is not stamped
until after isPageVisible_ is true, and that's why the light-dom content is not
auto-hidden.

[tommycli, 2016/05/04 18:58:12]

I just spoke to michaelpg about this topic. Basically - <content> should never
be within a dom-if. Bad things happen.

[Moe, 2016/05/04 19:37:40]

I took content out of dom-if. user-pods-page is the default page anyway. so let
it get stamped right away. However, we still seem to need this rule. setting
'display: none' on <content> doesn't seem to propagate to its children. (based
on chrome's accessibility extension test results).

[tommycli, 2016/05/04 20:16:57]

Okay that's fine, can you just add a comment above explaining that
neon-animated-pages doesn't hide the content automatically?

+        display: none !important;
+      }
     </style>
     <neon-animated-pages id="animatedPages" attr-for-selected="id"
         selected="[[selectedPage_]]" entry-animation="slide-from-left-animation"
@@ -42,12 +46,12 @@
       </div>
       <div id="supervised-create-confirm-page">
         <template is="dom-if"
-            if="[[isPageVisible_(selectedPage_, 'supervised-create-confirm-page')]]">
+            if="[[isPageVisible_(selectedPage_,
+                                 'supervised-create-confirm-page')]]">
           <supervised-user-create-confirm profile-info="[[pageData_]]">
           </supervised-user-create-confirm>
         </template>
       </div>
-      <content></content>
     </neon-animated-pages>
   </template>
   <script src="chrome://md-user-manager/user_manager_pages.js"></script>