From 96ad1dae38f7cf60fb2a9fb7df393b213c9a42fd Mon Sep 17 00:00:00 2001
From: Paulus Schoutsen <paulus@paulusschoutsen.nl>
Date: Sun, 9 Jul 2017 00:21:23 -0700
Subject: [PATCH] Polymer 2 fixes (#330)

* Fix startup error in panel-resolver

* Fix map panel stylesheet reference in develop mode under P2

* Fix automation editor recursion

* Fix HA style
---
 panels/automation/ha-automation-editor.html |  3 +++
 panels/map/ha-panel-map.html                | 13 ++++++++++---
 src/layouts/partial-panel-resolver.html     |  2 +-
 src/resources/ha-style.html                 |  4 +++-
 4 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/panels/automation/ha-automation-editor.html b/panels/automation/ha-automation-editor.html
index c6eb04579a..12ac0ba440 100644
--- a/panels/automation/ha-automation-editor.html
+++ b/panels/automation/ha-automation-editor.html
@@ -160,6 +160,7 @@ Polymer({
 
   created: function () {
     this.configChanged = this.configChanged.bind(this);
+    this._rendered = null;
   },
 
   detached: function () {
@@ -169,6 +170,8 @@ Polymer({
   },
 
   configChanged: function (config) {
+    // onChange gets called a lot during initial rendering causing recursing calls.
+    if (this._rendered === null) return;
     this.config = config;
     this.errors = null;
     this.dirty = true;
diff --git a/panels/map/ha-panel-map.html b/panels/map/ha-panel-map.html
index bd09088f67..5b2821a939 100644
--- a/panels/map/ha-panel-map.html
+++ b/panels/map/ha-panel-map.html
@@ -3,15 +3,17 @@
 <link rel="import" href="../../bower_components/app-layout/app-toolbar/app-toolbar.html">
 
 <script src="../../bower_components/leaflet/dist/leaflet.js"></script>
-<!-- otherwise the shadow dom polyfill breaks the CSS when vulcanized -->
-<link rel="stylesheet" href="../../bower_components/leaflet/dist/leaflet.css" />
 
 <link rel="import" href="../../src/components/ha-menu-button.html">
 <link rel="import" href="./ha-entity-marker.html">
 
 <dom-module id="ha-panel-map">
   <template>
-    <link rel="stylesheet" href="../../bower_components/leaflet/dist/leaflet.css" />
+    <link
+      id='stylesheet'
+      rel="stylesheet"
+      href="../../bower_components/leaflet/dist/leaflet.css"
+    />
 
     <style include="ha-style">
       #map {
@@ -53,6 +55,11 @@ Polymer({
   },
 
   attached: function () {
+    // The link tag is resolved relative to the _current_ url instead of the
+    // source HTML file. Vulcanized this is taken care off. Fix it in dev.
+    if (window.HASS_DEV) {
+      this.$.stylesheet.href = '/static/home-assistant-polymer/bower_components/leaflet/dist/leaflet.css';
+    }
     var map = this._map = window.L.map(this.$.map);
     map.setView([51.505, -0.09], 13);
     window.L.tileLayer(
diff --git a/src/layouts/partial-panel-resolver.html b/src/layouts/partial-panel-resolver.html
index 7ad858de89..6aba018873 100644
--- a/src/layouts/partial-panel-resolver.html
+++ b/src/layouts/partial-panel-resolver.html
@@ -77,7 +77,7 @@ Polymer({
   },
 
   computeCurrentPanel: function (hass, routeData) {
-    return hass.config.panels[routeData.panel];
+    return routeData ? hass.config.panels[routeData.panel] : null;
   },
 
   panelChanged: function (panel) {
diff --git a/src/resources/ha-style.html b/src/resources/ha-style.html
index 636216c2eb..ab842b242d 100644
--- a/src/resources/ha-style.html
+++ b/src/resources/ha-style.html
@@ -1,6 +1,7 @@
 <link rel="import" href="../../bower_components/polymer/polymer.html">
 
-<style is="custom-style">
+<custom-style>
+<style is="custom-style">/* remove is= on Polymer 2 */
   html {
     font-size: 14px;
 
@@ -58,6 +59,7 @@
     --light-primary-opacity: 1.0;
   }
 </style>
+</custom-style>
 
 <dom-module id='ha-style'>
   <template>