v1.19.3

Author: w-zz-w-zz-w

dist/angular-openlayers-directive.js

@@ -510,7 +510,13 @@ angular.module('openlayers-directive').directive('olLayer', ["$log", "$q", "olMa
                         // set visibility
                         if (isDefined(oldProperties) &&
                             isBoolean(properties.visible) &&
-                            properties.visible !== oldProperties.visible || isNewLayer(olLayer)) {
+                            (
+                                properties.visible !== oldProperties.visible ||
+                                isNewLayer(olLayer) ||
+                                // to make sure the underlying ol3 object is always synched
+                                olLayer.getVisible() !== properties.visible
+                            )
+                            ) {
                             olLayer.setVisible(properties.visible);
                         }
 

dist/angular-openlayers-directive.min.js

@@ -510,7 +510,13 @@ angular.module('openlayers-directive').directive('olLayer', function($log, $q, o
                         // set visibility
                         if (isDefined(oldProperties) &&
                             isBoolean(properties.visible) &&
-                            properties.visible !== oldProperties.visible || isNewLayer(olLayer)) {
+                            (
+                                properties.visible !== oldProperties.visible ||
+                                isNewLayer(olLayer) ||
+                                // to make sure the underlying ol3 object is always synched
+                                olLayer.getVisible() !== properties.visible
+                            )
+                            ) {
                             olLayer.setVisible(properties.visible);
                         }
 

dist/angular-openlayers-directive.min.no-header.js

@@ -59,11 +59,12 @@
   },
   "scripts": {
     "test": "grunt build && grunt karma:unit",
+    "test.watch": "grunt build && grunt karma:dev",
     "build": "grunt build",
     "prepublish": "npm run build",
     "postpublish": "publish-latest",
     "semantic-release": "semantic-release pre && npm publish && semantic-release post"
   },
   "main": "dist/angular-openlayers-directive",
-  "version": "1.19.2"
+  "version": "1.19.3"
 }

dist/angular-openlayers-directive.pre.js

@@ -187,7 +187,13 @@ angular.module('openlayers-directive').directive('olLayer', function($log, $q, o
                         // set visibility
                         if (isDefined(oldProperties) &&
                             isBoolean(properties.visible) &&
-                            properties.visible !== oldProperties.visible || isNewLayer(olLayer)) {
+                            (
+                                properties.visible !== oldProperties.visible ||
+                                isNewLayer(olLayer) ||
+                                // to make sure the underlying ol3 object is always synched
+                                olLayer.getVisible() !== properties.visible
+                            )
+                            ) {
                             olLayer.setVisible(properties.visible);
                         }
 

package.json

@@ -486,4 +486,70 @@ describe('Directive: openlayers layers', function() {
 
     });
 
+    describe('when updating the visibility', function() {
+        beforeEach(function() {
+            scope.layers = [
+                {
+                    identifier: 'LAYER-SPAIN',
+                    name: 'Spain',
+                    visible: true,
+                    source: {
+                        type: 'GeoJSON',
+                        url: 'json/ESP.geo.json'
+                    }
+                }
+            ];
+
+            var element = angular
+                    .element('<openlayers custom-layers="true">' +
+                                '<ol-layer ol-layer-properties="layer" ng-repeat="layer in layers"></ol-layer>' +
+                            '</openlayers>');
+            element = $compile(element)(scope);
+            scope.$digest();
+        });
+
+        it('the layer should be set to visible', function() {
+            olData.getMap().then(function(olMap) {
+                var layers = olMap.getLayers().getArray();
+                expect(layers[0].getVisible()).toBeTruthy();
+            });
+        });
+
+        it('should correctly set the layer to visible false', function() {
+            // act
+            scope.layers[0].visible = false;
+            scope.$digest();
+
+            // assert
+            olData.getMap().then(function(olMap) {
+                var layers = olMap.getLayers().getArray();
+                expect(layers[0].getVisible()).toBeFalsy();
+            });
+
+        });
+
+        it('should sync visibility of the underlying OL3 object if not aligned', function() {
+            // assume our object is set to visible false
+            scope.layers[0].visible = false;
+            scope.$digest();
+
+            olData.getMap().then(function(olMap) {
+                var layers = olMap.getLayers().getArray();
+                // set visibility on the underlying ol3 object
+                layers[0].setVisible(true);
+            });
+
+            scope.layers[0].name = 'Bla bla'; // just to kick on change detection
+            scope.$digest();
+
+            // assert
+            olData.getMap().then(function(olMap) {
+                var layers = olMap.getLayers().getArray();
+                expect(layers[0].getVisible()).toBeFalsy();
+            });
+
+        });
+
+    });
+
 });