@angular-wave/angular.ts 0.4.2 → 0.4.4

package/src/directive/input/input.spec.js

@@ -1,7 +1,6 @@
 import { Angular } from "../../loader";
 import { dealoc, JQLite } from "../../shared/jqlite/jqlite";
 import { EMAIL_REGEXP, ISO_DATE_REGEXP, URL_REGEXP } from "./input";
-import { forEach } from "../../shared/utils";
 
 describe("input", () => {
   let $compile;
@@ -68,7 +67,6 @@ describe("input", () => {
       },
     });
     $compile(input)(scope);
-    scope.$digest();
     expect(setterCalls).toBe(0);
   });
 
@@ -112,7 +110,6 @@ describe("input", () => {
       expect(scope.form.nameA.$name).toBe("nameA");
       const oldModel = scope.form.nameA;
       scope.nameID = "B";
-      scope.$digest();
       expect(scope.form.nameA).toBeUndefined();
       expect(scope.form.nameB).toBe(oldModel);
       expect(scope.form.nameB.$name).toBe("nameB");
@@ -127,7 +124,6 @@ describe("input", () => {
       expect(model.$name).toBe("nameA");
 
       scope.nameID = "B";
-      scope.$digest();
       expect(model.$name).toBe("nameB");
     });
   });
@@ -432,8 +428,6 @@ describe("input", () => {
         it("should validate if min is empty", () => {
           scope.minVal = undefined;
           scope.value = "2014-01";
-          scope.$digest();
-
           expect(scope.form.alias.$error.min).toBeFalsy();
         });
       });
@@ -476,8 +470,6 @@ describe("input", () => {
           expect(scope.form.alias.$error.max).toBeFalsy();
 
           scope.maxVal = "2012-01";
-          scope.$digest();
-
           expect(
             inputElm.find("input")[0].classList.contains("ng-invalid"),
           ).toBeTrue();
@@ -487,8 +479,6 @@ describe("input", () => {
         it("should validate if max is empty", () => {
           scope.maxVal = undefined;
           scope.value = "2012-03";
-          scope.$digest();
-
           expect(scope.form.alias.$error.max).toBeFalsy();
         });
       });
@@ -621,8 +611,6 @@ describe("input", () => {
           expect(scope.form.alias.$error.min).toBeFalsy();
 
           scope.minVal = "2014-W01";
-          scope.$digest();
-
           expect(
             inputElm.find("input")[0].classList.contains("ng-invalid"),
           ).toBeTrue();
@@ -632,8 +620,6 @@ describe("input", () => {
         it("should validate if min is empty", () => {
           scope.minVal = undefined;
           scope.value = "2013-W03";
-          scope.$digest();
-
           expect(scope.form.alias.$error.min).toBeFalsy();
         });
       });
@@ -677,8 +663,6 @@ describe("input", () => {
           expect(scope.form.alias.$error.max).toBeFalsy();
 
           scope.maxVal = "2012-W01";
-          scope.$digest();
-
           expect(
             inputElm.find("input")[0].classList.contains("ng-invalid"),
           ).toBeTrue();
@@ -688,8 +672,6 @@ describe("input", () => {
         it("should validate if max is empty", () => {
           scope.maxVal = undefined;
           scope.value = "2012-W01";
-          scope.$digest();
-
           expect(scope.form.alias.$error.max).toBeFalsy();
         });
       });
@@ -824,8 +806,6 @@ describe("input", () => {
           expect(scope.form.alias.$error.min).toBeFalsy();
 
           scope.minVal = "2010-01-01T01:02:00";
-          scope.$digest();
-
           expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
           expect(scope.form.alias.$error.min).toBeTruthy();
         });
@@ -833,8 +813,6 @@ describe("input", () => {
         it("should validate if min is empty", () => {
           scope.minVal = undefined;
           scope.value = "2010-01-01T01:02:00";
-          scope.$digest();
-
           expect(scope.form.alias.$error.min).toBeFalsy();
         });
       });
@@ -872,8 +850,6 @@ describe("input", () => {
           expect(scope.form.alias.$error.max).toBeFalsy();
 
           scope.maxVal = "2000-01-01T01:02:00";
-          scope.$digest();
-
           expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
           expect(scope.form.alias.$error.max).toBeTruthy();
         });
@@ -881,8 +857,6 @@ describe("input", () => {
         it("should validate if max is empty", () => {
           scope.maxVal = undefined;
           scope.value = "2000-01-01T01:02:00";
-          scope.$digest();
-
           expect(scope.form.alias.$error.max).toBeFalsy();
         });
 
@@ -893,8 +867,6 @@ describe("input", () => {
           )(scope);
           scope.maxVal = "2013-01-01T00:00:00";
           scope.value = "2012-01-01T00:00:00";
-          scope.$digest();
-
           expect(scope.form.alias.$error.max).toBeFalsy();
           expect(scope.form.alias.$valid).toBeTruthy();
 
@@ -916,13 +888,9 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
         scope.max = "2001-01-01T01:02:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
         scope.max = "2024-01-01T01:02:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -936,13 +904,9 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
         scope.min = "2014-01-01T01:02:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
         scope.min = "2009-01-01T01:02:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -956,13 +920,9 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
         scope.max = "2001-01-01T01:02:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
         scope.max = "2024-01-01T01:02:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -976,13 +936,9 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
         scope.min = "2014-01-01T01:02:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
         scope.min = "2009-01-01T01:02:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
     });
@@ -1130,8 +1086,6 @@ describe("input", () => {
           expect(scope.form.alias.$error.min).toBeFalsy();
 
           scope.minVal = "23:55:00";
-          scope.$digest();
-
           expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
           expect(scope.form.alias.$error.min).toBeTruthy();
         });
@@ -1139,8 +1093,6 @@ describe("input", () => {
         it("should validate if min is empty", () => {
           scope.minVal = undefined;
           scope.value = "23:55:00";
-          scope.$digest();
-
           expect(scope.form.alias.$error.min).toBeFalsy();
         });
       });
@@ -1174,8 +1126,6 @@ describe("input", () => {
         it("should validate if max is empty", () => {
           scope.maxVal = undefined;
           scope.value = "05:30:00";
-          scope.$digest();
-
           expect(scope.form.alias.$error.max).toBeFalsy();
         });
       });
@@ -1191,8 +1141,6 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.max = "06:34:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -1207,8 +1155,6 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.min = "05:50:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -1223,8 +1169,6 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.max = "06:34:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -1239,8 +1183,6 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.min = "05:50:00";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
     });
@@ -1355,8 +1297,6 @@ describe("input", () => {
           inputElm = formElm.find("input");
 
           scope.value = "2000-01-01";
-          scope.$digest();
-
           expect(scope.form.alias.$error.min).toBeFalsy();
         });
       });
@@ -1395,8 +1335,6 @@ describe("input", () => {
 
           scope.value = "2020-01-01";
           scope.max = new Date(2014, 10, 10, 0, 0, 0).toISOString();
-          scope.$digest();
-
           expect(scope.form.myControl.$error.max).toBeTruthy();
         });
 
@@ -1406,8 +1344,6 @@ describe("input", () => {
           )(scope);
 
           scope.value = "2020-01-01";
-          scope.$digest();
-
           expect(scope.form.alias.$error.max).toBeFalsy();
         });
       });
@@ -1423,13 +1359,9 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.max = "2001-01-01";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.max = "2021-01-01";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -1444,13 +1376,9 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.min = "2014-01-01";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.min = "2009-01-01";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -1465,13 +1393,9 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.max = "2001-01-01";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.max = "2021-01-01";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -1486,13 +1410,9 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.min = "2014-01-01";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.min = "2009-01-01";
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -1507,13 +1427,9 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.max = new Date(2013, 1, 1, 1, 2, 0);
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.max = new Date(2014, 1, 1, 1, 2, 0);
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -1528,13 +1444,9 @@ describe("input", () => {
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.min = new Date(2014, 1, 1, 1, 2, 0);
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
         scope.min = new Date(2009, 1, 1, 1, 2, 0);
-        scope.$digest();
-
         expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
       });
 
@@ -1745,7 +1657,6 @@ describe("input", () => {
         scope.value = "one";
         expect(() => {
           $compile('<input type="number" ng-model="value" />')(scope);
-          scope.$digest();
         }).toThrowError(/numfmt/);
       });
 
@@ -1903,23 +1814,18 @@ describe("input", () => {
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.min = 10;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.min = 20;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
           scope.min = null;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.min = "20";
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
           scope.min = "abc";
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
         });
       });
@@ -1980,23 +1886,18 @@ describe("input", () => {
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.min = 10;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.min = 20;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
           scope.min = null;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.min = "20";
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
           scope.min = "abc";
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
         });
       });
@@ -2058,23 +1959,18 @@ describe("input", () => {
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.max = 10;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.max = 0;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
           scope.max = null;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.max = "4";
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
           scope.max = "abc";
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
         });
       });
@@ -2136,218 +2032,210 @@ describe("input", () => {
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.max = 10;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.max = 0;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
           scope.max = null;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.max = "4";
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
 
           scope.max = "abc";
-          scope.$digest();
-          expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-        });
-      });
-
-      forEach(
-        {
-          step: 'step="{{step}}"',
-          ngStep: 'ng-step="step"',
-        },
-        (attrHtml, attrName) => {
-          describe(attrName, () => {
-            it("should validate", () => {
-              scope.step = 10;
-              scope.value = 20;
-              const formElm = $compile(
-                `<form name="form"><input type="number" ng-model="value" name="alias" ${attrHtml} /></form>`,
-              )(scope);
-              inputElm = formElm.find("input");
-              scope.$digest();
-              expect(inputElm.val()).toBe("20");
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(20);
-              expect(scope.form.alias.$error.step).toBeFalsy();
-
-              inputElm[0].value = "18";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
-              expect(inputElm.val()).toBe("18");
-              expect(scope.value).toBeUndefined();
-              expect(scope.form.alias.$error.step).toBeTruthy();
-
-              inputElm[0].value = "10";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(inputElm.val()).toBe("10");
-              expect(scope.value).toBe(10);
-              expect(scope.form.alias.$error.step).toBeFalsy();
-
-              scope.$apply("value = 12");
-              expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
-              expect(inputElm.val()).toBe("12");
-              expect(scope.value).toBe(12);
-              expect(scope.form.alias.$error.step).toBeTruthy();
-            });
-
-            it("should validate even if the step value changes on-the-fly", () => {
-              scope.step = 10;
-              const formElm = $compile(
-                `<form name="form"><input type="number" ng-model="value" name="alias" ${attrHtml} /></form>`,
-              )(scope);
-              inputElm = formElm.find("input");
-              inputElm[0].value = "10";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(10);
-
-              // Step changes, but value matches
-              scope.$apply("step = 5");
-              expect(inputElm.val()).toBe("10");
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(10);
-              expect(scope.form.alias.$error.step).toBeFalsy();
-
-              // Step changes, value does not match
-              scope.$apply("step = 6");
-              expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
-              expect(scope.value).toBeUndefined();
-              expect(inputElm.val()).toBe("10");
-              expect(scope.form.alias.$error.step).toBeTruthy();
-
-              // null = valid
-              scope.$apply("step = null");
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(10);
-              expect(inputElm.val()).toBe("10");
-              expect(scope.form.alias.$error.step).toBeFalsy();
-
-              // Step val as string
-              scope.$apply('step = "7"');
-              expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
-              expect(scope.value).toBeUndefined();
-              expect(inputElm.val()).toBe("10");
-              expect(scope.form.alias.$error.step).toBeTruthy();
-
-              // unparsable string is ignored
-              scope.$apply('step = "abc"');
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(10);
-              expect(inputElm.val()).toBe("10");
-              expect(scope.form.alias.$error.step).toBeFalsy();
-            });
-
-            it('should use the correct "step base" when `[min]` is specified', () => {
-              scope.min = 5;
-              scope.step = 10;
-              scope.value = 10;
-              inputElm = $compile(
-                `<input type="number" ng-model="value" min="{{min}}" ${attrHtml} />`,
-              )(scope);
-              const ngModel = inputElm.controller("ngModel");
-              scope.$digest();
-              expect(inputElm.val()).toBe("10");
-              expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
-              expect(ngModel.$error.step).toBe(true);
-              expect(scope.value).toBe(10); // an initially invalid value should not be changed
-
-              inputElm[0].value = "15";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(15);
-
-              scope.$apply("step = 3");
-              expect(inputElm.val()).toBe("15");
-              expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
-              expect(ngModel.$error.step).toBe(true);
-              expect(scope.value).toBeUndefined();
-
-              inputElm[0].value = "8";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(8);
-
-              scope.$apply("min = 10; step = 20");
-              inputElm[0].value = "30";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm.val()).toBe("30");
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(30);
-
-              scope.$apply("min = 5");
-              expect(inputElm.val()).toBe("30");
-              expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
-              expect(ngModel.$error.step).toBe(true);
-              expect(scope.value).toBeUndefined();
-
-              scope.$apply("step = 0.00000001");
-              expect(inputElm.val()).toBe("30");
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(30);
-
-              // 0.3 - 0.2 === 0.09999999999999998
-              scope.$apply("min = 0.2; step = (0.3 - 0.2)");
-              inputElm[0].value = "0.3";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm.val()).toBe("0.3");
-              expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
-              expect(ngModel.$error.step).toBe(true);
-              expect(scope.value).toBeUndefined();
-            });
-
-            it("should correctly validate even in cases where the JS floating point arithmetic fails", () => {
-              scope.step = 0.1;
-              inputElm = $compile(
-                `<input type="number" ng-model="value" ${attrHtml} />`,
-              )(scope);
-              const ngModel = inputElm.controller("ngModel");
-
-              expect(inputElm.val()).toBe("");
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBeUndefined();
-
-              inputElm[0].value = "0.3";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(0.3);
-
-              inputElm[0].value = "2.9999999999999996";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
-              expect(ngModel.$error.step).toBe(true);
-              expect(scope.value).toBeUndefined();
-
-              // 0.5 % 0.1 === 0.09999999999999998
-              inputElm[0].value = "0.5";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(0.5);
-
-              // // 3.5 % 0.1 === 0.09999999999999981
-              inputElm[0].value = "3.5";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(3.5);
-
-              // 1.16 % 0.01 === 0.009999999999999896
-              // 1.16 * 100  === 115.99999999999999
-              scope.step = 0.01;
-              inputElm[0].value = "1.16";
-              inputElm[0].dispatchEvent(new Event("change"));
-              expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
-              expect(scope.value).toBe(1.16);
-            });
+          expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+        });
+      });
+
+      Object.entries({
+        step: 'step="{{step}}"',
+        ngStep: 'ng-step="step"',
+      }).forEach(([attrName, attrHtml]) => {
+        describe(attrName, () => {
+          it("should validate", () => {
+            scope.step = 10;
+            scope.value = 20;
+            const formElm = $compile(
+              `<form name="form"><input type="number" ng-model="value" name="alias" ${attrHtml} /></form>`,
+            )(scope);
+            inputElm = formElm.find("input");
+            scope.$digest();
+            expect(inputElm.val()).toBe("20");
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(20);
+            expect(scope.form.alias.$error.step).toBeFalsy();
+
+            inputElm[0].value = "18";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
+            expect(inputElm.val()).toBe("18");
+            expect(scope.value).toBeUndefined();
+            expect(scope.form.alias.$error.step).toBeTruthy();
+
+            inputElm[0].value = "10";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(inputElm.val()).toBe("10");
+            expect(scope.value).toBe(10);
+            expect(scope.form.alias.$error.step).toBeFalsy();
+
+            scope.$apply("value = 12");
+            expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
+            expect(inputElm.val()).toBe("12");
+            expect(scope.value).toBe(12);
+            expect(scope.form.alias.$error.step).toBeTruthy();
           });
-        },
-      );
+
+          it("should validate even if the step value changes on-the-fly", () => {
+            scope.step = 10;
+            const formElm = $compile(
+              `<form name="form"><input type="number" ng-model="value" name="alias" ${attrHtml} /></form>`,
+            )(scope);
+            inputElm = formElm.find("input");
+            inputElm[0].value = "10";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(10);
+
+            // Step changes, but value matches
+            scope.$apply("step = 5");
+            expect(inputElm.val()).toBe("10");
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(10);
+            expect(scope.form.alias.$error.step).toBeFalsy();
+
+            // Step changes, value does not match
+            scope.$apply("step = 6");
+            expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
+            expect(scope.value).toBeUndefined();
+            expect(inputElm.val()).toBe("10");
+            expect(scope.form.alias.$error.step).toBeTruthy();
+
+            // null = valid
+            scope.$apply("step = null");
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(10);
+            expect(inputElm.val()).toBe("10");
+            expect(scope.form.alias.$error.step).toBeFalsy();
+
+            // Step val as string
+            scope.$apply('step = "7"');
+            expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
+            expect(scope.value).toBeUndefined();
+            expect(inputElm.val()).toBe("10");
+            expect(scope.form.alias.$error.step).toBeTruthy();
+
+            // unparsable string is ignored
+            scope.$apply('step = "abc"');
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(10);
+            expect(inputElm.val()).toBe("10");
+            expect(scope.form.alias.$error.step).toBeFalsy();
+          });
+
+          it('should use the correct "step base" when `[min]` is specified', () => {
+            scope.min = 5;
+            scope.step = 10;
+            scope.value = 10;
+            inputElm = $compile(
+              `<input type="number" ng-model="value" min="{{min}}" ${attrHtml} />`,
+            )(scope);
+            const ngModel = inputElm.controller("ngModel");
+            scope.$digest();
+            expect(inputElm.val()).toBe("10");
+            expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
+            expect(ngModel.$error.step).toBe(true);
+            expect(scope.value).toBe(10); // an initially invalid value should not be changed
+
+            inputElm[0].value = "15";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(15);
+
+            scope.$apply("step = 3");
+            expect(inputElm.val()).toBe("15");
+            expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
+            expect(ngModel.$error.step).toBe(true);
+            expect(scope.value).toBeUndefined();
+
+            inputElm[0].value = "8";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(8);
+
+            scope.$apply("min = 10; step = 20");
+            inputElm[0].value = "30";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm.val()).toBe("30");
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(30);
+
+            scope.$apply("min = 5");
+            expect(inputElm.val()).toBe("30");
+            expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
+            expect(ngModel.$error.step).toBe(true);
+            expect(scope.value).toBeUndefined();
+
+            scope.$apply("step = 0.00000001");
+            expect(inputElm.val()).toBe("30");
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(30);
+
+            // 0.3 - 0.2 === 0.09999999999999998
+            scope.$apply("min = 0.2; step = (0.3 - 0.2)");
+            inputElm[0].value = "0.3";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm.val()).toBe("0.3");
+            expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
+            expect(ngModel.$error.step).toBe(true);
+            expect(scope.value).toBeUndefined();
+          });
+
+          it("should correctly validate even in cases where the JS floating point arithmetic fails", () => {
+            scope.step = 0.1;
+            inputElm = $compile(
+              `<input type="number" ng-model="value" ${attrHtml} />`,
+            )(scope);
+            const ngModel = inputElm.controller("ngModel");
+
+            expect(inputElm.val()).toBe("");
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBeUndefined();
+
+            inputElm[0].value = "0.3";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(0.3);
+
+            inputElm[0].value = "2.9999999999999996";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
+            expect(ngModel.$error.step).toBe(true);
+            expect(scope.value).toBeUndefined();
+
+            // 0.5 % 0.1 === 0.09999999999999998
+            inputElm[0].value = "0.5";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(0.5);
+
+            // // 3.5 % 0.1 === 0.09999999999999981
+            inputElm[0].value = "3.5";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(3.5);
+
+            // 1.16 % 0.01 === 0.009999999999999896
+            // 1.16 * 100  === 115.99999999999999
+            scope.step = 0.01;
+            inputElm[0].value = "1.16";
+            inputElm[0].dispatchEvent(new Event("change"));
+            expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
+            expect(scope.value).toBe(1.16);
+          });
+        });
+      });
 
       describe("required", () => {
         it("should be valid even if value is 0", () => {
@@ -2658,7 +2546,6 @@ describe("input", () => {
         expect(() => {
           scope.value = "one";
           inputElm = $compile('<input type="range" ng-model="value" />')(scope);
-          scope.$digest();
         }).toThrowError(/numfmt/);
       });
 
@@ -2670,8 +2557,6 @@ describe("input", () => {
             '<form name="form"><input type="range" ng-model="value" name="alias" min="{{min}}" /></form>',
           )(scope);
           inputElm = formElm.find("input");
-          scope.$digest();
-
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(inputElm.val()).toBe("-3");
           expect(scope.value).toBe(-3);
@@ -2704,8 +2589,6 @@ describe("input", () => {
           inputElm = $compile(
             '<input type="range" ng-model="value" name="alias" min="{{min}}" />',
           )(scope);
-          scope.$digest();
-
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(inputElm.val()).toBe("0");
           expect(scope.value).toBe(0);
@@ -2722,32 +2605,26 @@ describe("input", () => {
           inputElm = $compile(
             '<input type="range" ng-model="value" name="alias" min="{{min}}" />',
           )(scope);
-          scope.$digest();
-
           inputElm[0].value = "15";
           inputElm[0].dispatchEvent(new Event("change"));
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.min = 20;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(scope.value).toBe(20);
           expect(inputElm.val()).toBe("20");
 
           scope.min = null;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(scope.value).toBe(20);
           expect(inputElm.val()).toBe("20");
 
           scope.min = "15";
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(scope.value).toBe(20);
           expect(inputElm.val()).toBe("20");
 
           scope.min = "abc";
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(scope.value).toBe(20);
           expect(inputElm.val()).toBe("20");
@@ -2763,7 +2640,6 @@ describe("input", () => {
             '<form name="form"><input type="range" ng-model="value" name="alias" max="{{max}}" /></form>',
           )(scope);
           inputElm = formElm.find("input");
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(inputElm.val()).toBe("130");
           expect(scope.value).toBe(130);
@@ -2795,7 +2671,6 @@ describe("input", () => {
           inputElm = $compile(
             '<input type="range" ng-model="value" name="alias" max="{{max}}" />',
           )(scope);
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(inputElm.val()).toBe("100");
           expect(scope.value).toBe(100);
@@ -2812,31 +2687,26 @@ describe("input", () => {
           inputElm = $compile(
             '<input type="range" ng-model="value" name="alias" max="{{max}}" />',
           )(scope);
-          scope.$digest();
           inputElm[0].value = "5";
           inputElm[0].dispatchEvent(new Event("change"));
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
 
           scope.max = 0;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(scope.value).toBe(0);
           expect(inputElm.val()).toBe("0");
 
           scope.max = null;
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(scope.value).toBe(0);
           expect(inputElm.val()).toBe("0");
 
           scope.max = "4";
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(scope.value).toBe(0);
           expect(inputElm.val()).toBe("0");
 
           scope.max = "abc";
-          scope.$digest();
           expect(inputElm[0].classList.contains("ng-valid")).toBeTrue();
           expect(scope.value).toBe(0);
           expect(inputElm.val()).toBe("0");
@@ -2850,8 +2720,6 @@ describe("input", () => {
           inputElm = $compile(
             '<input type="range" ng-model="value" name="alias" max="{{max}}" min="{{min}}" />',
           )(scope);
-          scope.$digest();
-
           expect(inputElm.val()).toBe("60");
           expect(scope.value).toBe(60);
         });
@@ -2861,13 +2729,10 @@ describe("input", () => {
           inputElm = $compile(
             '<input type="range" ng-model="value" name="alias" max="{{max}}" min="{{min}}" />',
           )(scope);
-          scope.$digest();
           expect(inputElm.val()).toBe("70");
           expect(scope.value).toBe(70);
 
           scope.max = 20;
-          scope.$digest();
-
           expect(inputElm.val()).toBe("40");
           expect(scope.value).toBe(40);
         });
@@ -3516,8 +3381,6 @@ describe("input", () => {
             '<input type="checkbox" required name="cb" ng-model="value" ng-true-value="\'yes\'" />' +
             "</form>",
         )(scope);
-        scope.$digest();
-
         inputElm = formElm.find("input");
 
         expect(inputElm[0].classList.contains("ng-invalid")).toBeTrue();
@@ -3642,7 +3505,6 @@ describe("input", () => {
             '<input type="radio" ng-model="selected" ng-value="\'\'">' +
             '<input type="radio" ng-model="selected" ng-value="0">',
         )(scope);
-        scope.$digest();
         expect(inputElm[0].checked).toBe(true);
         expect(inputElm[1].checked).toBe(false);
         expect(inputElm[2].checked).toBe(false);
@@ -3678,8 +3540,6 @@ describe("input", () => {
           scope.selected = 1;
         });
 
-        scope.$digest();
-
         expect(inputElm[0].children[0].checked).toBe(true);
         expect(inputElm[0].children[1].checked).toBe(false);