diff --git a/bower.json b/bower.json index ac446cd..5b9b9dd 100644 --- a/bower.json +++ b/bower.json @@ -31,7 +31,7 @@ "iron-selector": "PolymerElements/iron-selector#1 - 2" }, "devDependencies": { - "web-component-tester": "^6.0.0", + "web-component-tester": "^6.5.0", "iron-component-page": "PolymerElements/iron-component-page#1 - 2" }, "variants": { diff --git a/google-map-poly.html b/google-map-poly.html index 905c26c..e42a1ba 100644 --- a/google-map-poly.html +++ b/google-map-poly.html @@ -271,6 +271,13 @@ observer: '_geodesicChanged' }, + /** + * When true, the poly is not visible. + */ + hidden: { + type: Boolean + }, + /** * If the path is not closed, the icons to be rendered along the polyline. */ @@ -351,7 +358,11 @@ attached: function() { // If element is added back to DOM, put it back on the map. - this.poly && this.poly.setMap(this.map); + if (this.poly) { + this.poly.setMap(this.map); + this.poly.setVisible(!this.hidden); + this.poly.setDraggable(this.draggable); + } }, // Attribute/property change watchers. diff --git a/test/google-map-basic.html b/test/google-map-basic.html index a359592..a053bed 100644 --- a/test/google-map-basic.html +++ b/test/google-map-basic.html @@ -21,6 +21,14 @@ var map2 = document.querySelector('#map2'); var map3 = document.querySelector('#map3'); +var whenReady = function(m, cb) { + if (m.map) { + cb(); + } else { + m.addEventListener('google-map-ready', cb); + } +}; + suite('google-map', function() { // TODO: test setting an invalid latitude/longitude value. See if throws. @@ -29,11 +37,11 @@ test.skip('invalid lat/lng'); test('noAutoTilt', function() { - map.addEventListener('google-map-ready', function(e) { + whenReady(map, function(e) { // When noAutoTilt is set, tilt is left at default (45). assert.equal(map.map.getTilt(), 45); }); - map3.addEventListener('google-map-ready', function(e) { + whenReady(map3, function(e) { // When noAutoTilt is set, tilt is set to 0. assert.equal(map3.map.getTilt(), 0); }); @@ -72,7 +80,7 @@ }); test('change properties', function(done) { - map3.addEventListener('google-map-ready', function(e) { + whenReady(map3, function(e) { assert.isTrue(map3.fitToMarkers); assert.equal(map3.markers.length, 0); assert.equal(map3.zoom, map3.map.getZoom()); diff --git a/test/google-map-update-pos.html b/test/google-map-update-pos.html index e411ad5..09e7f43 100644 --- a/test/google-map-update-pos.html +++ b/test/google-map-update-pos.html @@ -14,11 +14,19 @@ diff --git a/test/poly-basic.html b/test/poly-basic.html index 3c8b064..79846d2 100644 --- a/test/poly-basic.html +++ b/test/poly-basic.html @@ -29,27 +29,25 @@ var point3 = document.querySelector('#point3'); var point4 = document.querySelector('#point4'); - test('before map is ready', function() { - assert.isUndefined(poly.map); - assert.isUndefined(poly.path); - assert.isUndefined(poly.poly); + var whenReady = function(cb) { + if (map.map) { + cb(); + } else { + map.addEventListener('google-map-ready', cb); + } + }; + + test('defaults', function() { assert.isFalse(poly.editing); assert.isNull(poly.offsetParent, 'google-map-poly should be display: none'); }); test('after poly is initialized', function(done) { - map.addEventListener('google-map-ready', function(e) { - assert.isNotNull(poly.map); - //done(); - }); - - var listener; - poly.addEventListener('google-map-poly-path-built', listener = function(e) { - poly.removeEventListener('google-map-poly-path-built', listener); - - assert.isNotNull(poly.path); - assert.isNotNull(poly.poly); + whenReady(function(e) { flush(function() { + assert.isNotNull(poly.map); + assert.isNotNull(poly.path); + assert.isNotNull(poly.poly); assert.equal(poly.path.getLength(), 4); assert.equal(poly.path.getAt(0).lat(), point1.latitude); assert.equal(poly.path.getAt(0).lng(), point1.longitude); @@ -82,28 +80,30 @@ }); test('when styling is changed', function(done) { - poly.clickable = true; - poly.draggable = true; - poly.editable = true; - poly.geodesic = true; - poly.hidden = true; - poly.strokeColor = 'white'; - poly.strokeOpacity = .5; - poly.strokeWeight = 2; - poly.zIndex = 1; + whenReady(function() { + poly.clickable = true; + poly.draggable = true; + poly.editable = true; + poly.geodesic = true; + poly.hidden = true; + poly.strokeColor = 'white'; + poly.strokeOpacity = .5; + poly.strokeWeight = 2; + poly.zIndex = 1; - flush(function() { - assert.isTrue(poly.poly.get('clickable')); - assert.isTrue(poly.poly.getDraggable()); - assert.isTrue(poly.poly.getEditable()); - assert.isTrue(poly.poly.get('geodesic')); - assert.equal(poly.poly.get('strokeColor'), 'white'); - assert.equal(poly.poly.get('strokeOpacity'), .5); - assert.equal(poly.poly.get('strokeWeight'), 2); - assert.isFalse(poly.poly.getVisible()); - assert.equal(poly.poly.get('zIndex'), 1); + flush(function() { + assert.isTrue(poly.poly.get('clickable')); + assert.isTrue(poly.poly.getDraggable()); + assert.isTrue(poly.poly.getEditable()); + assert.isTrue(poly.poly.get('geodesic')); + assert.equal(poly.poly.get('strokeColor'), 'white'); + assert.equal(poly.poly.get('strokeOpacity'), .5); + assert.equal(poly.poly.get('strokeWeight'), 2); + assert.isFalse(poly.poly.getVisible()); + assert.equal(poly.poly.get('zIndex'), 1); - done(); + done(); + }); }); }); diff --git a/test/poly-custom-properties.html b/test/poly-custom-properties.html index c5133cc..476db7a 100644 --- a/test/poly-custom-properties.html +++ b/test/poly-custom-properties.html @@ -25,9 +25,16 @@ var map = document.querySelector('#map'); var poly = document.querySelector('#poly'); + var whenReady = function(cb) { + if (map.map) { + cb(); + } else { + map.addEventListener('google-map-ready', cb); + } + }; test('after poly is initialized', function(done) { - map.addEventListener('google-map-ready', function(e) { + whenReady(function(e) { assert.isNotNull(poly.map); //done(); });