angular-esri-map - npm Package Compare versions

Comparing version 1.0.0-beta.4 to 1.0.0-beta.5

bower.json

 {
   "name": "angular-esri-map",
-  "version": "1.0.0-beta.4",
+  "version": "v1.0.0-beta.5",
   "homepage": "https://github.com/Esri/angular-esri-map",
@@ -5,0 +5,0 @@ "authors": [

CHANGELOG.md

@@ -8,13 +8,60 @@ # Change Log
 
-None.
+Coming soon...
 
-## [Beta 4](v1.0.0-beta.4)
+## [v1.0.0-beta.5]
 
 ### Added
 
-* The esriMap directive's additonal map options now support advanced options such as Extent and Popup. https://github.com/Esri/angular-esri-map/pull/71
+Geographic center coordinates are normalized prior to updating esriMap scope values [#93](https://github.com/Esri/angular-esri-map/issues/93)
 
+Add or remove layers from the map programatically [#51](https://github.com/Esri/angular-esri-map/pull/51) [@eas604](https://github.com/eas604)
+
+The feature layer directive now includes optional attributes for opacity, definition expression, and constructor options. Opacity and definition expression act just like the visible attribute, and are watched for changes and can be adjusted at any time. [#51](https://github.com/Esri/angular-esri-map/pull/51) [@eas604](https://github.com/eas604) [#97](https://github.com/Esri/angular-esri-map/issues/97) and [#100](https://github.com/Esri/angular-esri-map/issues/100)
+
+The feature layer directive also now includes optional attributes for the layer's load and update-end events. [#103](https://github.com/Esri/angular-esri-map/issues/103)
+
+Added a directive for dynamic map service layers. Like the feature layer directive, it has optional attributes for visibility, opacity and constructor options. [#52](https://github.com/Esri/angular-esri-map/issues/52) [@Kollibri](https://github.com/Kollibri)
+
+Added a directive to set the info template(s) for layers so that they show a popup when clicked. [#52](https://github.com/Esri/angular-esri-map/issues/52) [#118](https://github.com/Esri/angular-esri-map/issues/118) [@Kollibri](https://github.com/Kollibri)
+
 ### Changed
 
-* The esriMap directive now reads additonal map options by scope function binding, and these options are passed into the construction of a map from a webmapId. https://github.com/Esri/angular-esri-map/pull/71
+Map directive's `addLayer` accepts an optional index argument, and layers are now added to the esriMap and esriLegend in the order that they appear in the markup.
+[#104](https://github.com/Esri/angular-esri-map/issues/104) and [#111](https://github.com/Esri/angular-esri-map/issues/111)
+
+Legend directive now uses `$scope.$watchCollection` to watch `map.layerInfos` for changes and refresh the legend appropriately. [#52](https://github.com/Esri/angular-esri-map/issues/52) [@Kollibri](https://github.com/Kollibri)
+
+### Documentation
+
+Examples pages are now driven by configurable JSON and have more consistent titles [#94](https://github.com/Esri/angular-esri-map/pull/94)
+
+Using `ng-options` for zoom level select Set Center and Zoom example page so that it has the correct value selected initially [c8659fce](https://github.com/Esri/angular-esri-map/commit/c8659fce94a94c5361a4cb047410b7cf0c4c87e4)
+
+Feature-layers example now includes adjustable layer opacity, definition expression, and additional information on the esriFeatureLayer directive options [#97](https://github.com/Esri/angular-esri-map/issues/97) and [#100](https://github.com/Esri/angular-esri-map/issues/100).
+
+Added an example page for the new dynamic map service layer. [c69329b9](https://github.com/Esri/angular-esri-map/commit/c69329b97ec0cd29d7aeb02a60f6691b2a525842)
+
+Added an example page showing how to add/remove layers from a map. [061ed936](https://github.com/Esri/angular-esri-map/commit/061ed9368f9931bc3fc03b536366f0b53c294b5e)
+
+Added an example page (feature-layer-events) showing how to interact with the esriFeatureLayer directive's attributes for layer load and update-end events. [#103](https://github.com/Esri/angular-esri-map/issues/103)
+
+Added an example page (other-esri-modules) showing how to use other Esri modules that we have not included directives for (such as graphics, symbols, toolbars, etc.). [#106](https://github.com/Esri/angular-esri-map/issues/106)
+
+### Tests
+
+Added functional testing using [Protractor](https://angular.github.io/protractor/#/). [#82](https://github.com/Esri/angular-esri-map/pull/82), [#94](https://github.com/Esri/angular-esri-map/pull/94), [#112](https://github.com/Esri/angular-esri-map/pull/112)
+
+### Maintenance
+
+Published to NPM [#80](https://github.com/Esri/angular-esri-map/issues/80)
+
+## [v1.0.0-beta.4]
+
+### Added
+
+* The esriMap directive's additional map options now support advanced options such as Extent and Popup. https://github.com/Esri/angular-esri-map/pull/71
+
+### Changed
+
+* The esriMap directive now reads additional map options by scope function binding, and these options are passed into the construction of a map from a webmapId. https://github.com/Esri/angular-esri-map/pull/71
 * Changes to accommodate a thorough review of the map directive life cycle, and adjustments to make sure all properties are updated and events fired as expected. https://github.com/Esri/angular-esri-map/pull/76
@@ -32,3 +79,3 @@ * Several existing docs and test pages updated ([web map example](http://esri.github.io/angular-esri-map/#/examples/web-map) includes a legend).
 
-## [Beta 3](v0.0.1-beta.3)
+## [v0.0.1-beta.3]
 
@@ -43,2 +90,3 @@ ### Added
 
+* Directives and services now support the following minimum dependency versions: JSAPI v3.11 and Angular v1.3.0. The test pages will be maintained at these versions.
 * Docs site uses JSAPI v.3.14 (#66) and Angular v1.4.4. https://github.com/Esri/angular-esri-map/pull/67
@@ -56,3 +104,3 @@
 
-## [Beta 2](v0.0.1-beta.2)
+## [v0.0.1-beta.2]
 
@@ -80,3 +128,3 @@ ### Added
 
-## [Beta 1](v0.0.1-beta.1)
+## [v0.0.1-beta.1]
 
@@ -88,3 +136,4 @@ ### Added
 
-[unreleased]: https://github.com/Esri/angular-esri-map/compare/v1.0.0-beta.4...HEAD
+[unreleased]: https://github.com/Esri/angular-esri-map/compare/v1.0.0-beta.5...HEAD
+[v1.0.0-beta.4]: https://github.com/Esri/angular-esri-map/compare/v1.0.0-beta.4...v1.0.0-beta.4
 [v1.0.0-beta.4]: https://github.com/Esri/angular-esri-map/compare/v0.0.1-beta.3...v1.0.0-beta.4
@@ -91,0 +140,0 @@ [v0.0.1-beta.3]: https://github.com/Esri/angular-esri-map/compare/v0.0.1-beta.2...v0.0.1-beta.3

docs/app/app.js

@@ -8,56 +8,24 @@ (function(angular) {
         .module('esri-map-docs', ['ngRoute', 'ngSanitize', 'ngSelect', 'hljs', 'esri.map'])
-        .config(function($routeProvider) {
+        .config(function($routeProvider, appConfig) {
             $routeProvider
-            .when('/examples', {
-                templateUrl: 'app/examples/examples.html',
-                controller: 'ExamplesCtrl'
-            })
-            .when('/examples/simple-map', {
-                templateUrl: 'app/examples/simple-map.html',
-                controller: 'SimpleMapCtrl'
-            })
-            .when('/examples/feature-layers', {
-                templateUrl: 'app/examples/feature-layers.html',
-                controller: 'FeatureLayersCtrl'
-            })
-            .when('/examples/web-map', {
-                templateUrl: 'app/examples/web-map.html',
-                controller: 'WebMapCtrl'
-            })
-            .when('/examples/legend', {
-                templateUrl: 'app/examples/legend.html',
-                controller: 'LegendCtrl'
-            })
-            .when('/examples/center-and-zoom', {
-                templateUrl: 'app/examples/center-and-zoom.html',
-                controller: 'CenterAndZoomCtrl'
-            })
-            .when('/examples/basemap', {
-                templateUrl: 'app/examples/basemap.html',
-                controller: 'BasemapCtrl'
-            })
-            .when('/examples/map-events', {
-                templateUrl: 'app/examples/map-events.html',
-                controller: 'MapEventsCtrl'
-            })
-            .when('/examples/registry-pattern', {
-                templateUrl: 'app/examples/registry-pattern.html',
-                controller: 'RegistryPatternCtrl'
-            })
-            .when('/examples/additional-map-options', {
-                templateUrl: 'app/examples/additional-map-options.html',
-                controller: 'AdditionalMapOptionsCtrl'
-            })
-            .when('/examples/no-basemap', {
-                templateUrl: 'app/examples/no-basemap.html',
-                controller: 'NoBasemapCtrl'
-            })
-            .when('/about', {
-                templateUrl: 'app/about/about.html',
-                controller: 'AboutCtrl'
-            })
-            .otherwise({
-                redirectTo: '/examples'
+                .when('/examples', {
+                    templateUrl: 'app/examples/examples.html',
+                    controller: 'ExamplesCtrl'
+                })
+                .when('/about', {
+                    templateUrl: 'app/about/about.html',
+                    controller: 'AboutCtrl'
+                })
+                .otherwise({
+                    redirectTo: '/examples'
+                });
+            // set routes of examples pages from appConfig
+            angular.forEach(appConfig.examplePages, function(example) {
+                $routeProvider
+                    .when(example.route.path, {
+                        templateUrl: example.route.templateUrl,
+                        controller: example.route.controller
+                    });
             });
         });
-})(angular);
+})(angular);

docs/app/examples/examples.js

 'use strict';
 
 angular.module('esri-map-docs')
-    .controller('ExamplesCtrl', function() {
-    });
+    .controller('ExamplesCtrl', function($scope, appConfig) {
+        var splitIndex = Math.floor(appConfig.examplePages.length / 2);
+        $scope.examplePageColumns = {
+            left: appConfig.examplePages.slice(0, splitIndex),
+            right: appConfig.examplePages.slice(splitIndex)
+        };
+    });

docs/app/examples/feature-layers.js

@@ -11,4 +11,28 @@ 'use strict';
             zoom: 12,
-            showTrees: false
+            parksOpacity: 0.8,
+            showTrees: false,
+            treesDefExpression: 'HEIGHT > 70',
+            railLayerOptions: {
+                autoGeneralize: true,
+                definitionExpression: 'TYPE = \'SC\'',
+                displayOnPan: true,
+                id: 'PortlandLightRail',
+                infoTemplate: {
+                    title: 'Portland Light Rail',
+                    content: '${*}'
+                },
+                maxAllowableOffset: 500,
+                mode: 'MODE_SNAPSHOT',
+                opacity: 1.0,
+                outFields: ['*'],
+                showAttribution: true,
+                visible: true
+            }
         };
-    });
+        $scope.treesDefExpressionInputText = $scope.map.treesDefExpression;
+        $scope.submitTreesDefExpression = function() {
+            if ($scope.treesDefExpressionInputText) {
+                $scope.map.treesDefExpression = $scope.treesDefExpressionInputText;
+            }
+        };
+    });

gulpfile.js

@@ -14,2 +14,3 @@ 'use strict';
 var deploy = require('gulp-gh-pages');
+var angularProtractor = require('gulp-angular-protractor');
 
@@ -39,4 +40,7 @@ // source directives and services
     'src/services/esriRegistry.js',
+    'src/services/esriMapUtils.js',
     'src/directives/esriMap.js',
     'src/directives/esriFeatureLayer.js',
+    'src/directives/esriDynamicMapServiceLayer.js',
+    'src/directives/esriInfoTemplate.js',
     'src/directives/esriLegend.js'])
@@ -59,3 +63,3 @@ .pipe(concat('angular-esri-map.js'))
 
-// serve docs on local web server
+// serve docs and tests on local web server
 // and reload anytime source code or docs are modified
@@ -75,2 +79,17 @@ gulp.task('serve', ['build'], function() {
 
+// serve tests on local web server
+gulp.task('serve-test', ['build'], function() {
+  browserSync({
+    server: {
+      baseDir: 'test',
+      routes: {
+        '/lib': 'docs/lib'
+      }
+    },
+    open: false,
+    port: 9002,
+    notify: false
+  });
+});
+
 // deploy to github pages
@@ -90,3 +109,19 @@ gulp.task('deploy', ['build'], function () {
 
+gulp.task('test', ['serve-test'], function() {
+  return gulp.src(['./test/e2e/specs/*.js'])
+    .pipe(angularProtractor({
+      'configFile': 'test/e2e/conf.js',
+      'args': ['--baseUrl', 'http://localhost:9002'],
+      'autoStartStopServer': true
+      // 'debug': true
+    }))
+    .on('end', function() {
+      browserSync.exit();
+    })
+    .on('error', function(e) {
+      throw e;
+    });
+});
+
 // Default Task
 gulp.task('default', ['serve']);

package.json

 {
   "name": "angular-esri-map",
-  "version": "1.0.0-beta.4",
+  "version": "v1.0.0-beta.5",
   "description": "A collection of directives to help you use Esri maps and services in your Angular applications",
   "main": "dist/angular-esri-map.js",
-  "directories": {
-    "example": "examples"
-  },
   "dependencies": {},
   "devDependencies": {
     "browser-sync": "~1.6.1",
+    "gh-release": "^2.0.1",
     "gulp": "^3.8.9",
@@ -22,3 +20,5 @@ "gulp-clean": "~0.3.0",
     "gulp-util": "~2.2.16",
-    "run-sequence": "~0.3.6"
+    "run-sequence": "~0.3.6",
+    "protractor": "~2.2.0",
+    "gulp-angular-protractor": "~0.0.2"
   },
@@ -49,3 +49,3 @@ "repository": {
     "build": "gulp build",
-    "test": "gulp lint",
+    "test": "gulp test",
     "release": "./scripts/release.sh",
@@ -52,0 +52,0 @@ "start": "gulp"

README.md

@@ -13,12 +13,15 @@ angular-esri-map
 
-To use these directives in your own Angular application, first install the module as a dependency using bower:
+To use these directives in your own Angular application, first install the module as a dependency using any of the following methods.
 
 ```bash
+# install via bower
 bower install angular-esri-map
+
+# OR install via npm
+npm install angular-esri-map
 ```
+Alternatively, you can clone or [download](https://github.com/Esri/angular-esri-map/releases) this repo and copy the desired module file (`angular-esri-map.js` or `angular-esri-map.min.js`) into your application.
 
-Or clone or download this repo and copy the desired module file (`angular-esri-map.js` or `angular-esri-map.min.js`) into your application.
+Once you've added the module to your application, you can use the sample code below to use the map and feature layer directives. Just change the "path/to/angular-esri-map.js" to point to the location of the file in your environment and load the page in a browser.
 
-Once you've added the module to your application, you can use the sample code below to use the map and feature layer directives. Just change the paths to point to the locations of the libraries in your environment and go.
-
 ![App](https://raw.github.com/Esri/angular-esri-map/master/angular-esri-map.png)
@@ -37,4 +40,4 @@
     <esri-map id="map" center="map.center" zoom="map.zoom" basemap="topo">
+        <esri-feature-layer url="http://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/services/Heritage_Trees_Portland/FeatureServer/0"></esri-feature-layer>
         <esri-feature-layer url="http://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/services/Portland_Parks/FeatureServer/0"></esri-feature-layer>
-        <esri-feature-layer url="http://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/services/Heritage_Trees_Portland/FeatureServer/0"></esri-feature-layer>
     </esri-map>
@@ -75,3 +78,3 @@ <p>Lat: {{ map.center.lat | number:3 }}, Lng: {{ map.center.lng | number:3 }}, Zoom: {{map.zoom}}</p>
 4. run `gulp` from the command line. This will run the linting and build commands and then start a local web server hosting the application under the `docs` folder
-5. Modify the directive source files (under `src`) or documentation (under `docs`) and your browser will automatically reload as you save your changes
+5. Modify the source files (under `src`) and test pages (under `test`). Test pages are served along with the docs site when you run the `gulp` task and are accessible from the root (i.e. `http://localhost:9002/simple-map.html`).
 6. Make a [pull request](https://help.github.com/articles/creating-a-pull-request) to contribute your changes
@@ -81,3 +84,3 @@
 
-These directives were originally built using Angular v1.2.16 and the ArcGIS API for JavaScript v3.11. They have been tested on every minor release of each of those libraries since then.
+These directives and services require, at a minimum, Angular v1.3.0 and the ArcGIS API for JavaScript v3.11. They have been tested on every minor release of each of those libraries since then.
 
@@ -84,0 +87,0 @@ You will need [Node](http://nodejs.org/) and [Gulp](https://github.com/gulpjs/gulp/blob/master/docs/getting-started.md#getting-started) to do local development.

src/directives/esriFeatureLayer.js

 (function(angular) {
     'use strict';
 
-    angular.module('esri.map').directive('esriFeatureLayer', function ($q) {
+    function isTrue(val) {
+        return val === true || val === 'true';
+    }
+
+    angular.module('esri.map').directive('esriFeatureLayer', function($q, esriMapUtils) {
         // this object will tell angular how our directive behaves
@@ -18,10 +22,85 @@ return {
 
+            // isolate scope for feature layer so it can be added/removed dynamically
+            scope: {
+                url: '@',
+                visible: '@?',
+                opacity: '@?',
+                definitionExpression: '@?',
+                // function binding for event handlers
+                load: '&',
+                updateEnd: '&',
+                // function binding for reading object hash from attribute string
+                // or from scope object property
+                // see Example 7 here: https://gist.github.com/CMCDragonkai/6282750
+                layerOptions: '&'
+            },
+
             // define an interface for working with this directive
-            controller: function ($scope, $element, $attrs) {
+            controller: function($scope) {
+                var self = this;
                 var layerDeferred = $q.defer();
 
-                require([
-                    'esri/layers/FeatureLayer'], function (FeatureLayer) {
-                    var layer = new FeatureLayer($attrs.url);
+                this.layerType = 'FeatureLayer';
 
+                require(['esri/layers/FeatureLayer', 'esri/InfoTemplate'], function(FeatureLayer, InfoTemplate) {
+
+                    // layerOptions.infoTemplate expects one of the following:
+                    //  1. [title <String | Function>, content <String | Function>]
+                    //  2. {title: <String | Function>, content: <String | Function>}
+                    //  3. a valid Esri JSAPI InfoTemplate
+                    // TODO: refactor to shared factory/service to be used by feature layer directive as well
+                    function objectToInfoTemplate(infoTemplate) {
+                        // only attempt to construct if a valid InfoTemplate wasn't already passed in
+                        if (infoTemplate.declaredClass === 'esri.InfoTemplate') {
+                            return infoTemplate;
+                        } else {
+                            // construct infoTemplate from object, using 2 args style:
+                            //  https://developers.arcgis.com/javascript/jsapi/infotemplate-amd.html#infotemplate2
+                            if (angular.isArray(infoTemplate) && infoTemplate.length === 2) {
+                                return new InfoTemplate(infoTemplate[0], infoTemplate[1]);
+                            } else {
+                                return new InfoTemplate(infoTemplate.title, infoTemplate.content);
+                            }
+                        }
+                    }
+
+                    var layerOptions = $scope.layerOptions() || {};
+
+                    // $scope.visible takes precedence over $scope.layerOptions.visible
+                    if (angular.isDefined($scope.visible)) {
+                        layerOptions.visible = isTrue($scope.visible);
+                    }
+
+                    // $scope.opacity takes precedence over $scope.layerOptions.opacity
+                    if ($scope.opacity) {
+                        layerOptions.opacity = Number($scope.opacity);
+                    }
+
+                    // $scope.definitionExpression takes precedence over $scope.layerOptions.definitionExpression
+                    if ($scope.definitionExpression) {
+                        layerOptions.definitionExpression = $scope.definitionExpression;
+                    }
+
+                    // $scope.layerOptions.infoTemplate takes precedence over
+                    // layer options defined in nested esriLayerOption directives
+                    if (layerOptions.hasOwnProperty('infoTemplate')) {
+                        self.setInfoTemplate(layerOptions.infoTemplate);
+                    }
+
+                    // normalize info template defined in $scope.layerOptions.infoTemplate
+                    // or nested esriLayerOption directive to be instance of esri/InfoTemplate
+                    // and pass to layer constructor in layerOptions
+                    if (self._infoTemplate) {
+                        self._infoTemplate = objectToInfoTemplate(self._infoTemplate);
+                        layerOptions.infoTemplate = self._infoTemplate;
+                    }
+
+                    // layerOptions.mode expects a FeatureLayer constant name as a <String>
+                    // https://developers.arcgis.com/javascript/jsapi/featurelayer-amd.html#constants
+                    if (layerOptions.hasOwnProperty('mode')) {
+                        // look up and convert to the appropriate <Number> value
+                        layerOptions.mode = FeatureLayer[layerOptions.mode];
+                    }
+
+                    var layer = new FeatureLayer($scope.url, layerOptions);
                     layerDeferred.resolve(layer);
@@ -31,26 +110,13 @@ });
                 // return the defered that will be resolved with the feature layer
-                this.getLayer = function () {
+                this.getLayer = function() {
                     return layerDeferred.promise;
                 };
 
-                // set the visibility of the feature layer
-                this.setVisible = function (isVisible) {
-                    var visibleDeferred = $q.defer();
-
-                    this.getLayer().then(function (layer) {
-                        if (isVisible) {
-                            layer.show();
-                        } else {
-                            layer.hide();
-                        }
-
-                        visibleDeferred.resolve();
-                    });
-
-                    return visibleDeferred.promise;
+                this.setInfoTemplate = function(infoTemplate) {
+                    this._infoTemplate = infoTemplate;
                 };
             },
 
-            // now we can link our directive to the scope, but we can also add it to the map..
-            link: function (scope, element, attrs, controllers) {
+            // now we can link our directive to the scope, but we can also add it to the map
+            link: function(scope, element, attrs, controllers) {
                 // controllers is now an array of the controllers from the 'require' option
@@ -60,30 +126,14 @@ var layerController = controllers[0];
 
-                var visible = attrs.visible || 'true';
-                var isVisible = scope.$eval(visible);
+                // bind directive attributes to layer properties and events
+                esriMapUtils.initLayerDirecive(scope, attrs, layerController, mapController).then(function(layer) {
 
-                // set the initial visible state of the feature layer
-                layerController.setVisible(isVisible);
+                    // additional directive attribute binding specific to this type of layer
 
-                // add a $watch condition on the visible attribute, if it changes and the new value is different than the previous, then use to
-                // set the visibility of the feature layer
-                scope.$watch(function () { return scope.$eval(attrs.visible); }, function (newVal, oldVal) {
-                    if (newVal !== oldVal) {
-                        layerController.setVisible(newVal);
-                    }
-                });
-
-                layerController.getLayer().then(function (layer) {
-                    // add layer
-                    mapController.addLayer(layer);
-
-                    //look for layerInfo related attributes. Add them to the map's layerInfos array for access in other components
-                    mapController.addLayerInfo({
-                      title: attrs.title || layer.name,
-                      layer: layer,
-                      hideLayers: (attrs.hideLayers) ? attrs.hideLayers.split(',') : undefined,
-                      defaultSymbol: (attrs.defaultSymbol) ? JSON.parse(attrs.defaultSymbol) : true
+                    // watch the scope's definitionExpression property for changes
+                    // set the definitionExpression of the feature layer
+                    scope.$watch('definitionExpression', function(newVal, oldVal) {
+                        if (newVal !== oldVal) {
+                            layer.setDefinitionExpression(newVal);
+                        }
                     });
-
-                    // return the layer
-                    return layer;
                 });
@@ -90,0 +140,0 @@ }

src/directives/esriLegend.js

@@ -45,7 +45,4 @@ (function(angular) {
                 legend.startup();
-                scope.layers = legend.layers;
-                angular.forEach(scope.layers, function(layer, i) {
-                  scope.$watch('layers['+i+'].renderer',function() {
-                    legend.refresh();
-                  });
+                scope.$watchCollection(function () { return mapController.getLayerInfos(); }, function (newValue/*, oldValue, scope*/) {
+                    legend.refresh(newValue);
                 });
@@ -52,0 +49,0 @@ legendDeferred.resolve(legend);

src/directives/esriMap.js

@@ -10,2 +10,3 @@ (function(angular) {
             if (geoCenter) {
+                geoCenter = geoCenter.normalize();
                 scope.center = {
@@ -79,3 +80,3 @@ lat: geoCenter.y,
                     if (mapOptions.hasOwnProperty('extent')) {
-                        // construct if parent controller isn'tsupplying a valid and already constructed Extent
+                        // construct if parent controller isn't supplying a valid and already constructed Extent
                         // e.g. if the controller or HTML view are only providing JSON
@@ -89,4 +90,8 @@ if (mapOptions.extent.declaredClass !== 'esri.geometry.Extent') {
                     // default to a new Popup dijit for now
+                    // mapOptions.infoWindow expects:
+                    //  {options: <Object>, srcNodeRef: <Node | String>}
                     if (mapOptions.hasOwnProperty('infoWindow')) {
-                        mapOptions.infoWindow = new Popup(mapOptions.infoWindow.options, mapOptions.infoWindow.srcNodeRef);
+                        if (mapOptions.infoWindow.hasOwnProperty('srcNodeRef')) {
+                            mapOptions.infoWindow = new Popup(mapOptions.infoWindow.options || {}, mapOptions.infoWindow.srcNodeRef);
+                        }
                     }
@@ -219,8 +224,17 @@
                 // adds the layer, returns the promise that will be resolved with the result of map.addLayer
-                this.addLayer = function(layer) {
+                this.addLayer = function(layer, index) {
+                    // layer: valid JSAPI layer
+                    // index: optional <Number>; likely only used internally by, for example, esriFeatureLayer
                     return this.getMap().then(function(map) {
-                        return map.addLayer(layer);
+                        return map.addLayer(layer, index);
                     });
                 };
 
+                // support removing layers, e.g. when esriFeatureLayer goes out of scope
+                this.removeLayer = function (layer) {
+                    return this.getMap().then(function (map) {
+                        return map.removeLayer(layer);
+                    });
+                };
+
                 // array to store layer info, needed for legend
@@ -231,3 +245,3 @@ this.addLayerInfo = function(lyrInfo) {
                     } else {
-                        this.layerInfos.push(lyrInfo);
+                        this.layerInfos.unshift(lyrInfo);
                     }
@@ -234,0 +248,0 @@ };

test/README.md

 ## Test Pages
 
-Many of the examples from the documentation site are included here as stand-alone pages with just the bare minimum code needed to demonstrate the specific features in each (i.e. no Bootstrap, no extra module dependencies like ngRouter, etc).
+The test pages in this folder serve two purposes:
 
-These pages were created before the docs site, and may not be up to date.
+1. Demonstrate a specific feature of the directives and services with the bare minimum code (i.e. no Bootstrap, no extra module dependencies like ngRouter, etc)
+2. To be run by the e2e test specs when you execute `gulp test`
 
-These pages are served when you run the `gulp` task and are accessible from the root (i.e. `http://localhost:9002/simple-map.html`).
+These pages are served along with the docs site when you run the `gulp` task and are accessible from the root (i.e. `http://localhost:9002/simple-map.html`).
+
+You may notice that most of these test pages have corresponding the examples in the docs site. Many of these pages were created before the docs site. You can expect test pages that have corresponding e2e test specs be up to date. Other test pages may not be as current as their corresponding example pages in the docs site.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

5471196

increased by79.62%

Number of package files

93

increased by55%

Lines of code

2171

increased by119.74%

Number of lines in readme file

121

increased by2.54%

Worsened metrics

Dev dependency count

15

increased by25%

Number of low supply chain risk alerts

6

increased by20%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes