hostAttributes now does not override existing instance attributes; additionally class is unsupported in host attributes.

Steven Orvell · Steven Orvell · commit 85cc721be91b · 2015-04-30T17:29:57.000-07:00
diff --git a/src/micro/attributes.html b/src/micro/attributes.html
@@ -67,9 +67,15 @@
       }
     },
 
+    /* apply attributes to node but avoid overriding existing values */
     _applyAttributes: function(node, attr$) {
       for (var n in attr$) {
-        this.serializeValueToAttribute(attr$[n], n, this);
+        // NOTE: never allow 'class' to be set in hostAttributes
+        // since shimming classes would make it work 
+        // inconsisently under native SD
+        if (!this.hasAttribute(n) && (n !== 'class')) {
+          this.serializeValueToAttribute(attr$[n], n, this);
+        }
       }
     },
 
diff --git a/test/unit/attributes-elements.html b/test/unit/attributes-elements.html
@@ -4,6 +4,7 @@
     hostAttributes: {
       attr1: 'this is attr 1',
       attr2: 42,
+      attr3: 'host',
       'aria-role': 'button',
       title: 'awesome',
       'attr-object': {foo: 'bar', nested: {'meaning': 42}, arr: [0, 'foo', true]},
diff --git a/test/unit/attributes.html b/test/unit/attributes.html
@@ -18,7 +18,7 @@
 <body>
 
 
-<x-basic id="basicDefault"></x-basic>
+<x-basic id="basicDefault" attr3="instance"></x-basic>
 
 <x-compose id="compose"></x-compose>
 
@@ -253,15 +253,17 @@
   test('hostAttributes set correctly', function() {
     assert.strictEqual(basicDefault.getAttribute('attr1'), 'this is attr 1');
     assert.strictEqual(basicDefault.getAttribute('attr2'), '42');
+    assert.strictEqual(basicDefault.getAttribute('attr3'), 'instance', 'host attribute overrode instance attribute and should not');
     assert.strictEqual(basicDefault.getAttribute('aria-role'), 'button');
     assert.strictEqual(basicDefault.getAttribute('title'), 'awesome');
     assert.strictEqual(basicDefault.title, 'awesome');
     assert.equal(basicDefault.getAttribute('attr-object'),
       JSON.stringify(configuredObject));
     assert.equal(basicDefault.hasAttribute('attr-stupid'), false);
-    assert(basicDefault.classList.contains('foo'));
-    assert(basicDefault.classList.contains('bar'));
-    assert(basicDefault.classList.contains('baz'));
+    // class not is not serialized
+    assert.notOk(basicDefault.classList.contains('foo'));
+    assert.notOk(basicDefault.classList.contains('bar'));
+    assert.notOk(basicDefault.classList.contains('baz'));
   });
 
   test('hostAttributes set correctly in composed element', function() {
@@ -273,9 +275,10 @@
     assert.equal(compose.$.basic.getAttribute('attr-object'),
       JSON.stringify(configuredObject));
     assert.equal(compose.$.basic.hasAttribute('attr-stupid'), false);
-    assert(compose.$.basic.classList.contains('foo'));
-    assert(compose.$.basic.classList.contains('bar'));
-    assert(compose.$.basic.classList.contains('baz'));
+    // class not is not serialized
+    assert.notOk(compose.$.basic.classList.contains('foo'));
+    assert.notOk(compose.$.basic.classList.contains('bar'));
+    assert.notOk(compose.$.basic.classList.contains('baz'));
     if (!Polymer.Settings.useNativeShadow) {
       assert(compose.$.basic.classList.contains('style-scope'));
       assert(compose.$.basic.classList.contains('x-compose'));
