fix(compiler): resolve breaking changes in AngularJS 1.7.1

remove use of private and undocumented arguments to $controller
update how preAssignBindingsEnabled is handled for AngularJS 1.7+

Fixes #11319

Author: Splaktar

package-lock.json

@@ -21,14 +21,14 @@
   "scss": "./dist/angular-material.scss",
   "devDependencies": {
     "add-stream": "^1.0.0",
-    "angular": "^1.5.0",
-    "angular-animate": "^1.5.0",
-    "angular-aria": "^1.5.0",
-    "angular-messages": "^1.5.0",
-    "angular-mocks": "^1.5.0",
-    "angular-route": "^1.5.0",
-    "angular-sanitize": "^1.5.0",
-    "angular-touch": "^1.5.0",
+    "angular": "^1.7.0",
+    "angular-animate": "^1.7.0",
+    "angular-aria": "^1.7.0",
+    "angular-messages": "^1.7.0",
+    "angular-mocks": "^1.7.0",
+    "angular-route": "^1.7.0",
+    "angular-sanitize": "^1.7.0",
+    "angular-touch": "^1.7.0",
     "angularytics": "^0.4.0",
     "canonical-path": "0.0.2",
     "cli-color": "^1.0.0",

package.json

@@ -124,7 +124,8 @@ function MdCompilerProvider($compileProvider) {
    * - `>=1.7` - the compiler calls the constructor first before assigning bindings and
    *    `$compileProvider.preAssignBindingsEnabled()` no longer exists.
    *
-   * The default value is `false` but will change to `true` in AngularJS Material 1.2.
+   * The default value is `false` in AngularJS 1.6 and earlier but `true` in AngularJS 1.7.
+   * It is planned to change this to always default to `true` in AngularJS Material 1.2.
    *
    * It is recommended to set this flag to `true` in AngularJS Material 1.1.x. The only reason
    * it's not set that way by default is backwards compatibility. Not setting the flag to `true`
@@ -133,10 +134,13 @@ function MdCompilerProvider($compileProvider) {
    * Material Dialog/Panel/Toast/BottomSheet controllers using the `$controller` helper
    * as it always follows the `$compileProvider.preAssignBindingsEnabled()` value.
    */
-  // TODO change it to `true` in Material 1.2.
-  var respectPreAssignBindingsEnabled = false;
+  var respectPreAssignBindingsEnabled = angular.version.major === 1 && angular.version.minor >= 7;
   this.respectPreAssignBindingsEnabled = function(respected) {
     if (angular.isDefined(respected)) {
+      if (!respected && angular.version.major === 1 && angular.version.minor >= 7) {
+        throw new Error(
+          'Disabling respectPreAssignBindingsEnabled is not supported in AngularJS 1.7 or later.');
+      }
       respectPreAssignBindingsEnabled = respected;
       return this;
     }
@@ -444,27 +448,38 @@ function MdCompilerProvider($compileProvider) {
 
   /**
    * Creates and instantiates a new controller with the specified options.
-   * @param {!Object} options Options that include the controller
+   * @param {!Object} options Options that include the controller function or string.
    * @param {!Object} injectLocals Locals to to be provided in the controller DI.
    * @param {!Object} locals Locals to be injected to the controller.
    * @returns {!Object} Created controller instance.
    */
   MdCompilerService.prototype._createController = function(options, injectLocals, locals) {
-    // The third and fourth arguments to $controller are considered private and are undocumented:
-    // https://github.com/angular/angular.js/blob/master/src/ng/controller.js#L86
-    // Passing `true` as the third argument causes `$controller` to return a function that
-    // gets the controller instance instead returning of the instance directly. When the
-    // controller is defined as a function, `invokeCtrl.instance` is the *same instance* as
-    // `invokeCtrl()`. However, then the controller is an ES6 class, `invokeCtrl.instance` is a
-    // *different instance* from `invokeCtrl()`.
-    var invokeCtrl = this.$controller(options.controller, injectLocals, true, options.controllerAs);
-
-    if (getPreAssignBindingsEnabled() && options.bindToController) {
-      angular.extend(invokeCtrl.instance, locals);
+    var ctrl;
+    if ((angular.version.major === 1 && angular.version.minor === 7 && angular.version.dot >= 1) ||
+        (angular.version.major === 1 && angular.version.minor > 7)) {
+      ctrl = this.$controller(options.controller, injectLocals);
+    } else {
+      // The third argument to $controller is considered private and is undocumented
+      // in AngularJS prior to 1.7.1:
+      // https://github.com/angular/angular.js/blob/v1.6.10/src/ng/controller.js#L102-L109
+      // Passing `true` as the third argument causes `$controller` to return a function that
+      // gets the controller instance instead of returning the instance directly. When the
+      // controller is defined as a function, `invokeCtrl.instance` is the *same instance* as
+      // `invokeCtrl()`. However, when the controller is an ES6 class, `invokeCtrl.instance` is a
+      // *different instance* from `invokeCtrl()`.
+      var invokeCtrl = this.$controller(options.controller, injectLocals, true);
+
+      if (getPreAssignBindingsEnabled() && options.bindToController) {
+        angular.extend(invokeCtrl.instance, locals);
+      }
+
+      // Instantiate and initialize the specified controller.
+      ctrl = invokeCtrl();
     }
 
-    // Instantiate and initialize the specified controller.
-    var ctrl = invokeCtrl();
+    if (options.controllerAs) {
+      injectLocals.$scope[options.controllerAs] = ctrl;
+    }
 
     if (!getPreAssignBindingsEnabled() && options.bindToController) {
       angular.extend(ctrl, locals);

src/core/services/compiler/compiler.js

@@ -112,7 +112,7 @@ describe('$mdCompiler service', function() {
         var data = compile({
           template: '<span>hello</span>'
         });
-        var scope = $rootScope.$new();
+        var scope = $rootScope.$new(false);
         data.link(scope);
         expect(data.element.scope()).toBe(scope);
       }));
@@ -127,7 +127,7 @@ describe('$mdCompiler service', function() {
             this.injectedOne = one;
           }
         });
-        var scope = $rootScope.$new();
+        var scope = $rootScope.$new(false);
         data.link(scope);
         expect(data.element.controller()).toBeTruthy();
         expect(data.element.controller().injectedOne).toBe(1);
@@ -143,7 +143,7 @@ describe('$mdCompiler service', function() {
           }
         });
 
-        var scope = $rootScope.$new();
+        var scope = $rootScope.$new(false);
         data.link(scope);
 
         expect(ctrlElement).toBe(data.element);
@@ -155,7 +155,7 @@ describe('$mdCompiler service', function() {
           controller: function Ctrl() {},
           controllerAs: 'myControllerAs'
         });
-        var scope = $rootScope.$new();
+        var scope = $rootScope.$new(false);
         data.link(scope);
         expect(scope.myControllerAs).toBe(data.element.controller());
       }));
@@ -164,12 +164,24 @@ describe('$mdCompiler service', function() {
 
   });
 
-  [
+  var bindingStatesToTest;
+  if (angular.version.major === 1 && angular.version.minor >= 7) {
+    bindingStatesToTest = [
+      {respectPreAssignBindingsEnabled: true}
+    ];
+  } else if (angular.version.major === 1 && angular.version.minor === 6) {
+    bindingStatesToTest = [
       {respectPreAssignBindingsEnabled: true},
       {respectPreAssignBindingsEnabled: false},
-      // TODO change `equivalentTo` to `true` in Material 1.2.
       {respectPreAssignBindingsEnabled: '"default"', equivalentTo: false}
-  ].forEach(function(options) {
+    ];
+  } else if (angular.version.major === 1 && angular.version.minor < 6) {
+    bindingStatesToTest = [
+      {respectPreAssignBindingsEnabled: false}
+    ];
+  }
+
+  bindingStatesToTest.forEach(function(options) {
     var realRespectPreAssignBindingsEnabled = options.respectPreAssignBindingsEnabled;
     var respectPreAssignBindingsEnabled = angular.isDefined(options.equivalentTo) ?
       options.equivalentTo :
@@ -224,8 +236,8 @@ describe('$mdCompiler service', function() {
         expect(isInstantiated).toBe(true);
       });
 
-      // Bindings are not preassigned only if we respect the AngularJS config and they're
-      // disabled there. This logic will change in Material 1.2.0.
+      // Bindings are not pre-assigned if we respect the AngularJS config and pre-assigning
+      // them is disabled there.
       if (respectPreAssignBindingsEnabled && !preAssignBindingsEnabledInAngularJS) {
         it('disabled should assign bindings after constructor', function() {
           var isInstantiated = false;
@@ -400,7 +412,7 @@ describe('$mdCompiler service', function() {
 
     it('should preserve a previous linked scope', function() {
 
-      var scope = $rootScope.$new();
+      var scope = $rootScope.$new(false);
 
       var data = compile({
         contentElement: $compile('<div>With Scope</div>')(scope)
@@ -445,7 +457,7 @@ describe('$mdCompiler service', function() {
     beforeEach(inject(function($injector) {
       $mdCompiler = $injector.get('$mdCompiler');
       $rootScope = $injector.get('$rootScope');
-      pageScope = $rootScope.$new();
+      pageScope = $rootScope.$new(false);
     }));
 
     it('should assign bindings by $onInit for ES6 classes', function(done) {