Fix bugs in service picker and service dev tool (#687)

panels/dev-service/ha-panel-dev-service.html

@@ -294,7 +294,7 @@
         alert(`Error parsing JSON: ${this.serviceData}`);
       }
 
-      this.hass.callService(this.domain, this.service, this.parsedJSON);
+      this.hass.callService(this._domain, this._service, this.parsedJSON);
     }
 
     _entityPicked(ev) {

src/components/ha-combo-box.html

@@ -16,7 +16,7 @@
       }
     </style>
     <vaadin-combo-box-light
-      items='[[items]]'
+      items='[[_items]]'
       item-value-path='[[itemValuePath]]'
       item-label-path='[[itemLabelPath]]'
       value='{{value}}'

src/components/ha-service-picker.html

@@ -6,7 +6,7 @@
   <template>
     <ha-combo-box
       label='Service'
-      items='[[_computeServices(hass)]]'
+      items='[[_services]]'
       value='{{value}}'
       allow-custom-value
     ></ha-combo-box>
@@ -19,7 +19,11 @@ class HaServicePicker extends Polymer.Element {
 
   static get properties() {
     return {
-      hass: Object,
+      hass: {
+        type: Object,
+        observer: '_hassChanged',
+      },
+      _services: Array,
       value: {
         type: String,
         notify: true,
@@ -27,11 +31,14 @@ class HaServicePicker extends Polymer.Element {
     };
   }
 
-  _computeServices(hass) {
+  _hassChanged(hass, oldHass) {
+    if (!hass) {
+      this._services = [];
+    } else if (oldHass && hass.config.services === oldHass.config.services) {
+      return;
+    }
     const result = [];
 
-    if (!hass) return result;
-
     Object.keys(hass.config.services).sort().forEach((domain) => {
       const services = Object.keys(hass.config.services[domain]).sort();
 
@@ -40,7 +47,7 @@ class HaServicePicker extends Polymer.Element {
       }
     });
 
-    return result;
+    this._services = result;
   }
 }