Fix 'null' hover text with gr-editable-label

This is fixed by switching some default values to empty strings, rather
than 'null', which makes more sense anyway given that the types of
these properties are strings to begin with.

Bug: Issue 7623
Change-Id: I424522a157513dfdf1726267bfd174c4230dcd8f

polygerrit-ui/app/elements/shared/gr-editable-label/gr-editable-label.js

@@ -35,12 +35,12 @@
       value: {
         type: String,
         notify: true,
-        value: null,
+        value: '',
         observer: '_updateTitle',
       },
       placeholder: {
         type: String,
-        value: null,
+        value: '',
       },
       readOnly: {
         type: Boolean,
@@ -181,7 +181,7 @@
     },
 
     _updateTitle(value) {
-      this.setAttribute('title', (value && value.length) ? value : null);
+      this.setAttribute('title', this._computeLabel(value, this.placeholder));
     },
   });
 })();

polygerrit-ui/app/elements/shared/gr-editable-label/gr-editable-label_test.html

@@ -35,6 +35,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
+<test-fixture id="no-placeholder">
+  <template>
+    <gr-editable-label value=""></gr-editable-label>
+  </template>
+</test-fixture>
+
 <test-fixture id="read-only">
   <template>
     <gr-editable-label
@@ -47,12 +53,14 @@ limitations under the License.
 <script>
   suite('gr-editable-label tests', () => {
     let element;
+    let elementNoPlaceholder;
     let input;
     let label;
     let sandbox;
 
     setup(() => {
       element = fixture('basic');
+      elementNoPlaceholder = fixture('no-placeholder');
 
       input = element.$.input.$.input;
       label = element.$$('label');
@@ -78,6 +86,26 @@ limitations under the License.
       assert.equal(input.value, 'value text');
     });
 
+    test('title with placeholder', done => {
+      assert.equal(element.title, 'value text');
+      element.value = '';
+
+      element.async(() => {
+        assert.equal(element.title, 'label text');
+        done();
+      });
+    });
+
+    test('title without placeholder', done => {
+      assert.equal(elementNoPlaceholder.title, '');
+      element.value = 'value text';
+
+      element.async(() => {
+        assert.equal(element.title, 'value text');
+        done();
+      });
+    });
+
     test('edit value', done => {
       const editedStub = sandbox.stub();
       element.addEventListener('changed', editedStub);