MD Settings: circumvent problems with shadow DOM and aria radio* roles

chrome/browser/resources/settings/controls/controlled_radio_button.js

Index: chrome/browser/resources/settings/controls/controlled_radio_button.js
diff --git a/chrome/browser/resources/settings/controls/controlled_radio_button.js b/chrome/browser/resources/settings/controls/controlled_radio_button.js
index 13a021fa93deee4d72395a8993902a75b179fab4..d7b4933e4066a324ee99faefa035445211dc7f3d 100644
--- a/chrome/browser/resources/settings/controls/controlled_radio_button.js
+++ b/chrome/browser/resources/settings/controls/controlled_radio_button.js
@@ -8,7 +8,10 @@ Polymer({
   behaviors: [PrefControlBehavior],
 
   properties: {
-    label: String,
+    label: {
+      type: String,
+      observer: 'labelChanged_',
+    },
 
     name: {
       type: String,
@@ -23,6 +26,12 @@ Polymer({
     },
   },
 
+  hostAttributes: {
+    // NOTE(dbeam): this should not be necessary but currently radiogroup and
+    // radio roles don't work across shadow DOM boundaries.
+    role: 'radio',
+  },
+
   listeners: {
     'focus': 'onFocus_',
   },
@@ -35,6 +44,14 @@ Polymer({
     return this.pref.enforcement == chrome.settingsPrivate.Enforcement.ENFORCED;
   },
 
+  /** @private */
+  labelChanged_: function() {
+    if (this.label)
+      this.setAttribute('aria-label', this.label);
+    else
+      this.removeAttribute('aria-label');

[hcarmona, 2017/04/11 17:47:25]

There's only one case where label isn't set.

https://cs.chromium.org/chromium/src/chrome/browser/resources/settings/appear...

After this change, the radio and input are unlabelled.

+  },
+
   /**
    * @param {boolean} controlled
    * @param {string} name