From 1e903a947d2cfbd72d90ae4715c957d6f81168a0 Mon Sep 17 00:00:00 2001
From: Steven Orvell <sorvell@google.com>
Date: Wed, 15 Nov 2017 11:35:39 -0800
Subject: [PATCH] Add tests for setting custom `attribute` name

---
 lib/mixins/property-effects.html          |  2 +-
 test/unit/polymer.element.html            | 23 ++++++++++++++++++++---
 test/unit/polymer.properties-element.html | 21 ++++++++++++++++++---
 3 files changed, 39 insertions(+), 7 deletions(-)

diff --git a/lib/mixins/property-effects.html b/lib/mixins/property-effects.html
index 83a28ff002..02e8442630 100644
--- a/lib/mixins/property-effects.html
+++ b/lib/mixins/property-effects.html
@@ -2051,7 +2051,7 @@
        * @protected
        */
       _createReflectedProperty(property) {
-        let attr = CaseMap.camelToDashCase(property);
+        let attr = this._attributeForProperty(property);
         if (attr[0] === '-') {
           console.warn('Property ' + property + ' cannot be reflected to attribute ' +
             attr + ' because "-" is not a valid starting attribute name. Use a lowercase first letter for the property instead.');
diff --git a/test/unit/polymer.element.html b/test/unit/polymer.element.html
index 520328574f..caefabed91 100644
--- a/test/unit/polymer.element.html
+++ b/test/unit/polymer.element.html
@@ -40,7 +40,12 @@
               computed: '_compute(computedPropDep)'
             },
             accessor: String,
-            noStomp: String
+            noStomp: String,
+            customAttr: {
+              type: String,
+              attribute: 'foo',
+              reflectToAttribute: true
+            }
           };
         }
 
@@ -323,7 +328,7 @@ <h1>Sub template</h1>
 
   <test-fixture id="my-element-attr">
     <template>
-      <my-element prop="attr"></my-element>
+      <my-element prop="attr" foo="foo"></my-element>
     </template>
   </test-fixture>
 
@@ -409,10 +414,22 @@ <h1>Sub template</h1>
     test('attributes', function() {
       const fixtureEl = fixture('my-element-attr');
       assert.equal(fixtureEl.prop, 'attr');
-      assert.equal(fixtureEl._callAttributeChangedCallback, 1);
+      assert.equal(fixtureEl.customAttr, 'foo');
+      assert.equal(fixtureEl._callAttributeChangedCallback, 3);
       assert.isTrue(fixtureEl.hasAttribute('tabindex'));
     });
 
+    test('reflecting attributes', function() {
+      const fixtureEl = fixture('my-element-attr');
+      fixtureEl.prop = 'propValue';
+      // without reflect effect
+      fixtureEl._propertyToAttribute('prop');
+      assert.equal(fixtureEl.getAttribute('prop'), 'propValue');
+      // with reflect effect
+      fixtureEl.customAttr = 'customAttrValue';
+      assert.equal(fixtureEl.getAttribute('foo'), 'customAttrValue');
+    });
+
   });
 
   suite('subclass', function() {
diff --git a/test/unit/polymer.properties-element.html b/test/unit/polymer.properties-element.html
index 7931a3c7d2..f5a952039e 100644
--- a/test/unit/polymer.properties-element.html
+++ b/test/unit/polymer.properties-element.html
@@ -25,7 +25,11 @@
         static get properties() {
           return {
             prop: String,
-            noStomp: String
+            noStomp: String,
+            customAttr: {
+              type: String,
+              attribute: 'foo'
+            }
           };
         }
 
@@ -186,7 +190,7 @@
 
   <test-fixture id="my-element-attr">
     <template>
-      <my-element prop="attr"></my-element>
+      <my-element prop="attr" foo="foo"></my-element>
     </template>
   </test-fixture>
 
@@ -244,7 +248,18 @@
     test('attributes', function() {
       const fixtureEl = fixture('my-element-attr');
       assert.equal(fixtureEl.prop, 'attr');
-      assert.equal(fixtureEl._callAttributeChangedCallback, 1);
+      assert.equal(fixtureEl.customAttr, 'foo');
+      assert.equal(fixtureEl._callAttributeChangedCallback, 2);
+    });
+
+    test('reflecting attributes', function() {
+      const fixtureEl = fixture('my-element-attr');
+      fixtureEl.prop = 'propValue';
+      fixtureEl._propertyToAttribute('prop');
+      assert.equal(fixtureEl.getAttribute('prop'), 'propValue');
+      fixtureEl.customAttr = 'customAttrValue';
+      fixtureEl._propertyToAttribute('customAttr');
+      assert.equal(fixtureEl.getAttribute('foo'), 'customAttrValue');
     });
 
   });