fix(olHelper): remove null-layers

tombatossals · Jan 11, 2017 · 34ab1fb · 34ab1fb
1 parent 3ecd079
commit 34ab1fb
Show file tree

Hide file tree

Showing 2 changed files with 85 additions and 1 deletion.
diff --git a/src/services/olHelpers.js b/src/services/olHelpers.js
@@ -1103,16 +1103,19 @@ angular.module('openlayers-directive').factory('olHelpers', function($q, $log, $
                 while (layers.getLength() < index) {
                     var nullLayer = new ol.layer.Image();
                     nullLayer.index = layers.getLength(); // add index which will be equal to the length in this case
+                    nullLayer.name = '(null-layer)'; // we need a marker somehow
                     layers.push(nullLayer);
                 }
                 layer.index = index;
                 layers.push(layer);
             } else {
                 layer.index = index;
                 layers.insertAt(layer.index, layer);
+
+                // remove eventual null layers
                 for (var i = index + 1; i < layers.getLength(); i++) {
                     var l = layers.item(i);
-                    if (l === null) {
+                    if (l.name === '(null-layer)') {
                         layers.removeAt(i);
                         break;
                     } else {

diff --git a/test/unit/layersSpec.js b/test/unit/layersSpec.js
@@ -405,4 +405,85 @@ describe('Directive: openlayers layers', function() {
         expect(otherLayer.getLayers().getArray()[0].get('group')).toEqual('Other');
 
     });
+
+    describe('when setting the index', function() {
+
+        it('should correctly fill up the layer collection with null layers', function() {
+            scope.layers = [
+                {
+                    index: 2,
+                    name: 'Spain',
+                    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);
+
+            var layers;
+            olData.getMap().then(function(olMap) {
+                layers = olMap.getLayers();
+            });
+
+            scope.$digest();
+            expect(layers.getLength()).toBe(3);
+
+            expect(layers.item(2).getSource() instanceof ol.source.Vector).toBeTruthy();
+        });
+
+        it('should correctly populate the layer collection with when layers are provided in random order', function() {
+            scope.layers = [
+                {
+                    index: 1,
+                    name: 'Spain',
+                    source: {
+                        type: 'GeoJSON',
+                        url: 'json/ESP.geo.json'
+                    }
+                },
+                {
+                    index: 2,
+                    name: 'Italy',
+                    source: {
+                        type: 'GeoJSON',
+                        url: 'json/ESP.geo.json'
+                    }
+                },
+                {
+                    index: 0,
+                    name: 'Germany',
+                    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);
+
+            var layers;
+            olData.getMap().then(function(olMap) {
+                layers = olMap.getLayers();
+            });
+
+            scope.$digest();
+            expect(layers.getLength()).toBe(3);
+
+            expect(layers.item(0).get('name')).toBe('Germany');
+            expect(layers.item(1).get('name')).toBe('Spain');
+            expect(layers.item(2).get('name')).toBe('Italy');
+        });
+
+    });
+
 });