@angular-wave/angular.ts 0.4.2 → 0.4.4

package/src/directive/messages/messages.spec.js

@@ -48,8 +48,6 @@ describe("ngMessages", () => {
         '  <div ng-message="val">Message is set</div>' +
         "</div>",
     )($rootScope);
-    $rootScope.$digest();
-
     expect(element.text()).not.toContain("Message is set");
 
     $rootScope.$apply(() => {
@@ -65,8 +63,6 @@ describe("ngMessages", () => {
         '  <div ng-message="one, two, three">Message is set</div>' +
         "</div>",
     )($rootScope);
-    $rootScope.$digest();
-
     expect(element.text()).not.toContain("Message is set");
 
     $rootScope.$apply(() => {
@@ -100,8 +96,6 @@ describe("ngMessages", () => {
         '  <ng-message when="val">Message is set</div>' +
         "</ng-messages>",
     )($rootScope);
-    $rootScope.$digest();
-
     expect(element.text()).not.toContain("Message is set");
 
     $rootScope.$apply(() => {
@@ -117,8 +111,6 @@ describe("ngMessages", () => {
         '  <ng-message when=" one two three ">Message is set</div>' +
         "</ng-messages>",
     )($rootScope);
-    $rootScope.$digest();
-
     expect(element.text()).not.toContain("Message is set");
 
     $rootScope.$apply(() => {
@@ -152,8 +144,6 @@ describe("ngMessages", () => {
         '  <div ng-message-exp="variable">Message is crazy</div>' +
         "</div>",
     )($rootScope);
-    $rootScope.$digest();
-
     expect(element.text()).not.toContain("Message is crazy");
 
     $rootScope.$apply(() => {
@@ -188,8 +178,6 @@ describe("ngMessages", () => {
         '  <ng-message when-exp="variable">Message is crazy</ng-message>' +
         "</ng-messages>",
     )($rootScope);
-    $rootScope.$digest();
-
     expect(element.text()).not.toContain("Message is crazy");
 
     $rootScope.$apply(() => {
@@ -236,7 +224,7 @@ describe("ngMessages", () => {
   //           '  <div ng-message="val">Message is set</div>' +
   //           "</div>",
   //       )($rootScope);
-  //       $rootScope.$digest();
+  //       ;
 
   //       $rootScope.$apply(() => {
   //         $rootScope.col = prop;
@@ -460,14 +448,11 @@ describe("ngMessages", () => {
 
     // Trigger the message to be displayed
     $rootScope.col = { primary: true };
-    $rootScope.$digest();
     expect(messageChildren(element).length).toEqual(1);
     const oldMessageNode = messageChildren(element)[0];
 
     // Remove the message
     $rootScope.col = { primary: undefined };
-    $rootScope.$digest();
-
     // Since we have spied on the `leave` method, the message node is still in the DOM
     //expect($animate.leave).toHaveBeenCalled();
     // const nodeToRemove = $animate.leave.calls.mostRecent().args[0][0];
@@ -475,8 +460,6 @@ describe("ngMessages", () => {
 
     // Add the message back in
     $rootScope.col = { primary: true };
-    $rootScope.$digest();
-
     // Simulate the animation completing on the node
     // JQLite(nodeToRemove).remove();
 
@@ -570,9 +553,7 @@ describe("ngMessages", () => {
       const deregisterSpy = spyOn(ctrl, "deregister").and.callThrough();
 
       const nodeA = element[0].querySelector('[ng-message="a"]');
-      JQLite(nodeA).remove();
-      $rootScope.$digest(); // The next digest triggers the error
-
+      JQLite(nodeA).remove(); // The next digest triggers the error
       // Make sure removing the element triggers the deregistration in ngMessages
       expect(trim(deregisterSpy.calls.mostRecent().args[0].nodeValue)).toBe("");
       expect(messageChildren(element).length).toBe(0);
@@ -609,9 +590,7 @@ describe("ngMessages", () => {
         const deregisterSpy = spyOn(ctrl, "deregister").and.callThrough();
 
         const nodeB = element[0].querySelector('[ng-message="b"]');
-        JQLite(nodeB).remove();
-        $rootScope.$digest(); // The next digest triggers the error
-
+        JQLite(nodeB).remove(); // The next digest triggers the error
         // Make sure removing the element triggers the deregistration in ngMessages
         expect(trim(deregisterSpy.calls.mostRecent().args[0].nodeValue)).toBe(
           "",
@@ -679,8 +658,6 @@ describe("ngMessages", () => {
         $rootScope.col = { unexpected: false };
       });
 
-      $rootScope.$digest();
-
       expect(element.text().trim()).toBe("");
       expect(element[0].classList.contains("ng-active")).toBeFalse();
 
@@ -747,8 +724,6 @@ describe("ngMessages", () => {
       )($rootScope);
       $rootScope.default = true;
       $rootScope.col = { unexpected: true };
-      $rootScope.$digest();
-
       expect(element.text().trim()).toBe("Default message is set");
 
       $rootScope.$apply("default = false");
@@ -853,7 +828,7 @@ describe("ngMessages", () => {
     //       $templateCache.set("abc.html", "<div></div>");
 
     //       element = $compile(html)($rootScope);
-    //       $rootScope.$digest();
+    //       ;
 
     //       const includeElement = element[0].querySelector(
     //         "[ng-messages-include], ng-messages-include",
@@ -918,7 +893,6 @@ describe("ngMessages", () => {
         '<div ng-messages="data"><div ng-messages-include="/mock/hello"></div></div>',
       )($rootScope);
 
-      $rootScope.$digest();
       expect($templateCache.get("/mock/hello")).toBeDefined();
     });
 
@@ -934,12 +908,9 @@ describe("ngMessages", () => {
         failed: true,
       };
 
-      $rootScope.$digest();
-
       expect(messageChildren(element).length).toBe(1);
       expect(trim(element.text())).toEqual("Your value is that of failure");
 
-      $rootScope.$digest();
       setTimeout(() => {
         expect(messageChildren(element).length).toBe(1);
         expect(trim(element.text())).toEqual("You did not enter a value");
@@ -1034,8 +1005,6 @@ describe("ngMessages", () => {
       $templateCache.set("messages1.html", "");
       $templateCache.set("messages2.html", "   ");
       element = $compile(html)($rootScope);
-      $rootScope.$digest();
-
       expect(element.text()).toBe("");
       expect(element[0].childNodes.length).toBe(2);
     });

package/src/directive/model/model.js

@@ -10,7 +10,6 @@ import {
 } from "../../shared/constants";
 import {
   minErr,
-  forEach,
   isNumber,
   isNumberNaN,
   isPromiseLike,
@@ -29,6 +28,7 @@ import {
 import { defaultModelOptions } from "../model-options/model-options";
 import { startingTag } from "../../shared/jqlite/jqlite";
 import { ScopePhase } from "../../core/scope/scope";
+import { isProxySymbol } from "../../core/model/model";
 
 export const ngModelMinErr = minErr("ngModel");
 
@@ -77,8 +77,6 @@ export class NgModelController {
     "$element",
     "$parse",
     "$animate",
-    "$timeout",
-    "$q",
     "$interpolate",
   ];
 
@@ -89,8 +87,6 @@ export class NgModelController {
    * @param {import('../../shared/jqlite/jqlite').JQLite} $element
    * @param {import("../../core/parse/parse").ParseService} $parse
    * @param {*} $animate
-   * @param {*} $timeout
-   * @param {import("../../core/q/q").QPromise<any>} $q
    * @param {*} $interpolate
    */
   constructor(
@@ -100,8 +96,6 @@ export class NgModelController {
     $element,
     $parse,
     $animate,
-    $timeout,
-    $q,
     $interpolate,
   ) {
     /** @type {any} The actual value from the control's view  */
@@ -160,16 +154,14 @@ export class NgModelController {
     this.$$currentValidationRunId = 0;
 
     /** @type {import('../../core/scope/scope.js').Scope} */
-    this.$$scope = $scope;
+    this.$$scope = $element.controller() ? $element.controller() : $scope; // attempt to bind to nearest controller if present
 
     /** @type {import('../../core/scope/scope.js').Scope} */
     this.$$rootScope = $scope.$root;
     this.$$attr = $attr;
     this.$$element = $element;
     this.$$animate = $animate;
-    this.$$timeout = $timeout;
     this.$$parse = $parse;
-    this.$q = $q;
     this.$$exceptionHandler = $exceptionHandler;
 
     this.$$hasNativeValidators = false;
@@ -525,7 +517,7 @@ export class NgModelController {
    * </example>
    */
   $rollbackViewValue() {
-    this.$$timeout.cancel(this.$$pendingDebounce);
+    clearTimeout(this.$$pendingDebounce);
     this.$viewValue = this.$$lastCommittedViewValue;
     this.$render();
   }
@@ -597,10 +589,10 @@ export class NgModelController {
         setValidity(errorKey, null);
       } else {
         if (!that.$$parserValid) {
-          forEach(that.$validators, (v, name) => {
+          Object.keys(that.$validators).forEach((name) => {
             setValidity(name, null);
           });
-          forEach(that.$asyncValidators, (v, name) => {
+          Object.keys(that.$asyncValidators).forEach((name) => {
             setValidity(name, null);
           });
         }
@@ -614,13 +606,13 @@ export class NgModelController {
 
     function processSyncValidators() {
       let syncValidatorsValid = true;
-      forEach(that.$validators, (validator, name) => {
+      Object.entries(that.$validators).forEach(([name, validator]) => {
         const result = Boolean(validator(modelValue, viewValue));
         syncValidatorsValid = syncValidatorsValid && result;
         setValidity(name, result);
       });
       if (!syncValidatorsValid) {
-        forEach(that.$asyncValidators, (v, name) => {
+        Object.keys(that.$asyncValidators).forEach((name) => {
           setValidity(name, null);
         });
         return false;
@@ -631,7 +623,7 @@ export class NgModelController {
     function processAsyncValidators() {
       const validatorPromises = [];
       let allValid = true;
-      forEach(that.$asyncValidators, (validator, name) => {
+      Object.entries(that.$asyncValidators).forEach(([name, validator]) => {
         const promise = validator(modelValue, viewValue);
         if (!isPromiseLike(promise)) {
           throw ngModelMinErr(
@@ -656,7 +648,7 @@ export class NgModelController {
       if (!validatorPromises.length) {
         validationDone(true);
       } else {
-        that.$q.all(validatorPromises).then(
+        Promise.all(validatorPromises).then(
           () => {
             validationDone(allValid);
           },
@@ -686,7 +678,7 @@ export class NgModelController {
    * usually handles calling this in response to input events.
    */
   $commitViewValue() {
-    this.$$timeout.cancel(this.$$pendingDebounce);
+    clearTimeout(this.$$pendingDebounce);
 
     // If the view value has not changed then we should just exit, except in the case where there is
     // a native validator on the element. In this case the validation state may have changed even though
@@ -737,9 +729,8 @@ export class NgModelController {
     }
     if (isNumberNaN(this.$modelValue)) {
       // this.$modelValue has not been touched yet...
-      this.$modelValue = /** @type {(Scope) => any} */ (this.$$ngModelGet)(
-        this.$$scope,
-      );
+      // @ts-ignore
+      this.$modelValue = this.$$ngModelGet(this.$$scope);
     }
     const prevModelValue = this.$modelValue;
     const allowInvalid = this.$options.getOption("allowInvalid");
@@ -761,6 +752,9 @@ export class NgModelController {
           // external validators (e.g. calculated on the server),
           // that just call $setValidity and need the model value
           // to calculate their validity.
+          if (that.$modelValue[isProxySymbol]) {
+            delete that.$modelValue;
+          }
           that.$modelValue = allValid ? modelValue : undefined;
           writeToModelIfNeeded();
         }
@@ -768,7 +762,8 @@ export class NgModelController {
     );
 
     function writeToModelIfNeeded() {
-      if (that.$modelValue !== prevModelValue) {
+      // intentional loose equality
+      if (that.$modelValue != prevModelValue) {
         that.$$writeModelToScope();
       }
     }
@@ -776,17 +771,13 @@ export class NgModelController {
 
   $$writeModelToScope() {
     this.$$ngModelSet(this.$$scope, this.$modelValue);
-    forEach(
-      this.$viewChangeListeners,
-      function (listener) {
-        try {
-          listener();
-        } catch (e) {
-          this.$$exceptionHandler(e);
-        }
-      },
-      this,
-    );
+    Object.values(this.$viewChangeListeners).forEach((listener) => {
+      try {
+        listener();
+      } catch (e) {
+        this.$$exceptionHandler(e);
+      }
+    }, this);
   }
 
   /**
@@ -859,13 +850,13 @@ export class NgModelController {
       debounceDelay = debounceDelay["*"];
     }
 
-    this.$$timeout.cancel(this.$$pendingDebounce);
+    clearTimeout(this.$$pendingDebounce);
     const that = this;
     if (/** @type {number} */ (debounceDelay) > 0) {
       // this fails if debounceDelay is an object
-      this.$$pendingDebounce = this.$$timeout(() => {
+      this.$$pendingDebounce = setTimeout(() => {
         that.$commitViewValue();
-      }, debounceDelay);
+      }, /** @type {number} */ (debounceDelay));
     } else if (this.$$rootScope.$$phase !== ScopePhase.NONE) {
       this.$commitViewValue();
     } else {
@@ -1072,7 +1063,7 @@ function setupModelWatcher(ctrl) {
   //    -> scope value did not change since the last digest as
   //       ng-change executes in apply phase
   // 4. view should be changed back to 'a'
-  ctrl.$$scope.$watch((scope) => {
+  ctrl.$$scope.$watch("scope", (scope) => {
     const modelValue = ctrl.$$ngModelGet(scope);
 
     // if scope model value and ngModel value are out of sync
@@ -1105,6 +1096,7 @@ export function ngModelDirective($rootScope) {
       /** @param {import("../../shared/jqlite/jqlite.js").JQLite} element  */
       (element) => {
         // Setup initial state of the control
+
         element[0].classList.add(PRISTINE_CLASS, UNTOUCHED_CLASS, VALID_CLASS);
 
         return {
@@ -1143,11 +1135,7 @@ export function ngModelDirective($rootScope) {
             element.on("blur", () => {
               if (modelCtrl.$touched) return;
 
-              if ($rootScope.$$phase !== ScopePhase.NONE) {
-                scope.$evalAsync(setTouched);
-              } else {
-                scope.$apply(setTouched);
-              }
+              scope.$apply(setTouched);
             });
           },
         };

package/src/directive/model/model.spec.js

@@ -40,7 +40,6 @@ describe("ngModel", () => {
     element = JQLite("<form><input></form>");
     let $controller = injector.get("$controller");
     scope = injector.get("$rootScope");
-    $q = injector.get("$q");
     $rootScope = scope;
     ctrl = $controller(NgModelController, {
       $scope: scope,
@@ -371,8 +370,6 @@ describe("ngModel", () => {
         };
 
         ctrl.$setViewValue("123");
-        scope.$digest();
-
         expect(element[0].classList.contains("ng-valid-parse")).toBeTrue();
         expect(element[0].classList.contains("ng-invalid-parse")).toBeFalse();
         expect(
@@ -381,8 +378,6 @@ describe("ngModel", () => {
 
         parserIsFailing = true;
         ctrl.$setViewValue("12345");
-        scope.$digest();
-
         expect(element[0].classList.contains("ng-valid-parse")).toBeFalse();
         expect(element[0].classList.contains("ng-invalid-parse")).toBeTrue();
         expect(
@@ -422,8 +417,6 @@ describe("ngModel", () => {
         expect(scope.value).toBeUndefined();
 
         defer.resolve();
-        scope.$digest();
-
         expect(ctrl.$modelValue).toBe("b");
         expect(scope.value).toBe("b");
 
@@ -434,8 +427,6 @@ describe("ngModel", () => {
         expect(scope.value).toBe("b");
 
         defer.resolve();
-        scope.$digest();
-
         expect(ctrl.$modelValue).toBe("c");
         expect(scope.value).toBe("c");
       });
@@ -519,11 +510,9 @@ describe("ngModel", () => {
         )($rootScope);
 
         $rootScope.val = 123;
-        $rootScope.$digest();
         expect($rootScope.form.field.$viewValue).toBe("123");
 
         $rootScope.val = null;
-        $rootScope.$digest();
         expect($rootScope.form.field.$viewValue).toBe(null);
 
         dealoc(form);
@@ -534,11 +523,9 @@ describe("ngModel", () => {
           '<form name="form"><input type="text" name="field" ng-model="val" /></form>',
         )($rootScope);
         $rootScope.val = 123;
-        $rootScope.$digest();
         expect($rootScope.form.field.$viewValue).toBe("123");
 
         $rootScope.val = null;
-        $rootScope.$digest();
         expect($rootScope.form.field.$viewValue).toBe(null);
 
         dealoc(form);
@@ -549,11 +536,9 @@ describe("ngModel", () => {
           '<form name="form"><input type="email" name="field" ng-model="val" /></form>',
         )($rootScope);
         $rootScope.val = 123;
-        $rootScope.$digest();
         expect($rootScope.form.field.$viewValue).toBe("123");
 
         $rootScope.val = null;
-        $rootScope.$digest();
         expect($rootScope.form.field.$viewValue).toBe(null);
 
         dealoc(form);
@@ -564,11 +549,9 @@ describe("ngModel", () => {
           '<form name="form"><input type="url" name="field" ng-model="val" /></form>',
         )($rootScope);
         $rootScope.val = 123;
-        $rootScope.$digest();
         expect($rootScope.form.field.$viewValue).toBe("123");
 
         $rootScope.val = null;
-        $rootScope.$digest();
         expect($rootScope.form.field.$viewValue).toBe(null);
 
         dealoc(form);
@@ -633,7 +616,7 @@ describe("ngModel", () => {
         //   const input = $compile(
         //     '<input name="myControl" maxlength="1" ng-model="value" >',
         //   )($rootScope);
-        //   $rootScope.$digest();
+        //   ;
 
         //   spyOn($animate, "addClass");
         //   spyOn($animate, "removeClass");
@@ -646,7 +629,7 @@ describe("ngModel", () => {
         //   setModelValue(ctrl, 3);
         //   ctrl.$processModelValue();
 
-        //   // $animate adds / removes classes in the $$postDigest, which
+        //   // $animate adds / removes classes in the $postUpdate, which
         //   // we cannot trigger with $digest, because that would set the model from the scope,
         //   // so we simply check if the functions have been called
         //   expect($animate.removeClass.calls.mostRecent().args[0][0]).toBe(
@@ -973,8 +956,6 @@ describe("ngModel", () => {
         expect(ctrl.$pending.promiseValidator).toBe(true);
 
         defer.resolve();
-        scope.$digest();
-
         expect(ctrl.$valid).toBe(true);
         expect(ctrl.$invalid).toBe(false);
         expect(ctrl.$pending).toBeUndefined();
@@ -982,8 +963,6 @@ describe("ngModel", () => {
         scope.$apply('value = "123"');
 
         defer.reject();
-        scope.$digest();
-
         expect(ctrl.$valid).toBe(false);
         expect(ctrl.$invalid).toBe(true);
         expect(ctrl.$pending).toBeUndefined();
@@ -1067,10 +1046,7 @@ describe("ngModel", () => {
         newDefer = defer;
 
         newDefer.reject();
-        scope.$digest();
         oldDefer.resolve();
-        scope.$digest();
-
         expect(ctrl.$valid).toBe(false);
         expect(ctrl.$invalid).toBe(true);
         expect(ctrl.$pending).toBeUndefined();
@@ -1103,7 +1079,6 @@ describe("ngModel", () => {
         expect(isObject(ctrl.$pending)).toBe(true);
 
         defers[1].resolve();
-        scope.$digest();
         expect(ctrl.$valid).toBe(true);
         expect(ctrl.$invalid).toBe(false);
         expect(isObject(ctrl.$pending)).toBe(false);
@@ -1131,8 +1106,6 @@ describe("ngModel", () => {
         expect(isObject(ctrl.$pending)).toBe(false);
 
         defer.resolve();
-        scope.$digest();
-
         expect(ctrl.$valid).toBe(false);
         expect(ctrl.$invalid).toBe(true);
         expect(isObject(ctrl.$pending)).toBe(false);
@@ -1186,13 +1159,10 @@ describe("ngModel", () => {
         const formCtrl = $rootScope.myForm;
         const usernameCtrl = formCtrl.username;
 
-        $rootScope.$digest();
         expect(usernameCtrl.$invalid).toBe(true);
         expect(formCtrl.$invalid).toBe(true);
 
         usernameCtrl.$setViewValue("valid-username");
-        $rootScope.$digest();
-
         expect(usernameCtrl.$invalid).toBe(false);
         expect(formCtrl.$invalid).toBe(false);
         delete Object.prototype.someThing;
@@ -1219,42 +1189,30 @@ describe("ngModel", () => {
           return usernameDefer.promise;
         };
 
-        $rootScope.$digest();
         expect(usernameCtrl.$invalid).toBe(true);
         expect(formCtrl.$invalid).toBe(true);
 
         usernameCtrl.$setViewValue("valid-username");
-        $rootScope.$digest();
-
         expect(formCtrl.$pending.usernameAvailability).toBeTruthy();
         expect(usernameCtrl.$invalid).toBeUndefined();
         expect(formCtrl.$invalid).toBeUndefined();
 
         usernameDefer.resolve();
-        $rootScope.$digest();
         expect(usernameCtrl.$invalid).toBe(false);
         expect(formCtrl.$invalid).toBe(true);
 
         ageCtrl.$setViewValue(22);
-        $rootScope.$digest();
-
         expect(usernameCtrl.$invalid).toBe(false);
         expect(ageCtrl.$invalid).toBe(false);
         expect(formCtrl.$invalid).toBe(false);
 
         usernameCtrl.$setViewValue("valid");
-        $rootScope.$digest();
-
         expect(usernameCtrl.$invalid).toBe(true);
         expect(ageCtrl.$invalid).toBe(false);
         expect(formCtrl.$invalid).toBe(true);
 
         usernameCtrl.$setViewValue("another-valid-username");
-        $rootScope.$digest();
-
         usernameDefer.resolve();
-        $rootScope.$digest();
-
         expect(usernameCtrl.$invalid).toBe(false);
         expect(formCtrl.$invalid).toBe(false);
         expect(formCtrl.$pending).toBeFalsy();
@@ -1471,11 +1429,9 @@ describe("ngModel", () => {
     it("should set ng-empty or ng-not-empty when the view value changes", () => {
       const element = $compile('<input ng-model="value" />')($rootScope);
 
-      $rootScope.$digest();
       expect(element.val()).toBe("");
 
       $rootScope.value = "XXX";
-      $rootScope.$digest();
       expect(element.val()).toBe("XXX");
 
       element.val("");
@@ -1492,7 +1448,6 @@ describe("ngModel", () => {
         $rootScope,
       );
 
-      $rootScope.$digest();
       expect(element[0].classList.contains("ng-valid")).toBeTrue();
       expect(element[0].classList.contains("ng-pristine")).toBeTrue();
       expect(element[0].classList.contains("ng-touched")).toBeFalse();
@@ -1530,8 +1485,6 @@ describe("ngModel", () => {
       const element = $compile(
         '<input type="email" ng-model="value" required />',
       )($rootScope);
-      $rootScope.$digest();
-
       expect(element[0].classList.contains("ng-invalid")).toBeTrue();
       expect(element[0].classList.contains("ng-invalid-required")).toBeTrue();
 

package/src/directive/model-options/model-options.js

@@ -1,4 +1,4 @@
-import { forEach, isDefined, trim } from "../../shared/utils";
+import { isDefined, trim } from "../../shared/utils";
 
 const DEFAULT_REGEXP = /(\s+|^)default(\s+|$)/;
 
@@ -70,33 +70,29 @@ class ModelOptions {
     options = Object.assign({}, options);
 
     // Inherit options from the parent if specified by the value `"$inherit"`
-    forEach(
-      options,
-      function (option, key) {
-        if (option === "$inherit") {
-          if (key === "*") {
-            inheritAll = true;
-          } else {
-            options[key] = this.$$options[key];
-            // `updateOn` is special so we must also inherit the `updateOnDefault` option
-            if (key === "updateOn") {
-              options.updateOnDefault = this.$$options.updateOnDefault;
-            }
+    Object.entries(options).forEach(([key, option]) => {
+      if (option === "$inherit") {
+        if (key === "*") {
+          inheritAll = true;
+        } else {
+          options[key] = this.$$options[key];
+          // `updateOn` is special so we must also inherit the `updateOnDefault` option
+          if (key === "updateOn") {
+            options.updateOnDefault = this.$$options.updateOnDefault;
           }
-        } else if (key === "updateOn") {
-          // If the `updateOn` property contains the `default` event then we have to remove
-          // it from the event list and set the `updateOnDefault` flag.
-          options.updateOnDefault = false;
-          options[key] = trim(
-            option.replace(DEFAULT_REGEXP, () => {
-              options.updateOnDefault = true;
-              return " ";
-            }),
-          );
         }
-      },
-      this,
-    );
+      } else if (key === "updateOn") {
+        // If the `updateOn` property contains the `default` event then we have to remove
+        // it from the event list and set the `updateOnDefault` flag.
+        options.updateOnDefault = false;
+        options[key] = trim(
+          /** @type {string} */ (option).replace(DEFAULT_REGEXP, () => {
+            options.updateOnDefault = true;
+            return " ";
+          }),
+        );
+      }
+    }, this);
 
     if (inheritAll) {
       // We have a property of the form: `"*": "$inherit"`