chore(): enable "prefer-for-of"

core/src/components/animation-controller/animator.tsx

@@ -329,8 +329,8 @@ export class Animator {
    */
   afterClearStyles(propertyNames: string[]): Animator {
     this._afterStyles = this._afterStyles || {};
-    for (let i = 0; i < propertyNames.length; i++) {
+    for (const prop of propertyNames) {
-      this._afterStyles[propertyNames[i]] = '';
+      this._afterStyles[prop] = '';
     }
     return this;
   }
@@ -407,9 +407,9 @@ export class Animator {
 
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
         // ******** DOM WRITE ****************
-        children[i]._playInit(opts);
+        child._playInit(opts);
       }
     }
 
@@ -465,9 +465,9 @@ export class Animator {
   _playProgress(opts: PlayOptions | undefined) {
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
         // ******** DOM WRITE ****************
-        children[i]._playProgress(opts);
+        child._playProgress(opts);
       }
     }
 
@@ -500,9 +500,9 @@ export class Animator {
     if (!this._destroyed) {
       const children = this._childAnimations;
       if (children) {
-        for (let i = 0; i < children.length; i++) {
+        for (const child of children) {
           // ******** DOM WRITE ****************
-          children[i]._playToStep(stepValue);
+          child._playToStep(stepValue);
         }
       }
 
@@ -569,9 +569,9 @@ export class Animator {
   _playEnd(stepValue?: number) {
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
         // ******** DOM WRITE ****************
-        children[i]._playEnd(stepValue);
+        child._playEnd(stepValue);
       }
     }
 
@@ -607,8 +607,8 @@ export class Animator {
 
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
-        if (children[i]._hasDuration(opts)) {
+        if (child._hasDuration(opts)) {
           return true;
         }
       }
@@ -627,8 +627,8 @@ export class Animator {
 
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
-        if (children[i]._hasDomReads()) {
+        if (child._hasDomReads()) {
           return true;
         }
       }
@@ -756,20 +756,19 @@ export class Animator {
     const easing = (forcedLinearEasing ? 'linear' : this.getEasing());
     const durString = dur + 'ms';
 
-    for (let i = 0; i < elements.length; i++) {
+    for (const { style } of elements) {
-      const eleStyle = elements[i].style;
       if (dur > 0) {
         // ******** DOM WRITE ****************
-        eleStyle.transform = '';
+        style.transform = '';
-        eleStyle.transitionDuration = durString;
+        style.transitionDuration = durString;
 
         // each animation can have a different easing
         if (easing) {
           // ******** DOM WRITE ****************
-          eleStyle.transitionTimingFunction = easing;
+          style.transitionTimingFunction = easing;
         }
       } else {
-        eleStyle.transform = 'none';
+        style.transform = 'none';
       }
     }
   }
@@ -804,8 +803,8 @@ export class Animator {
   _setBeforeStyles() {
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
-        children[i]._setBeforeStyles();
+        child._setBeforeStyles();
       }
     }
 
@@ -818,24 +817,22 @@ export class Animator {
     const addClasses = this._beforeAddClasses;
     const removeClasses = this._beforeRemoveClasses;
 
-    for (let i = 0; i < elements.length; i++) {
+    for (const el of elements) {
-      const el = elements[i];
       const elementClassList = el.classList;
 
       // css classes to add before the animation
       if (addClasses) {
-        for (let j = 0; j < addClasses.length; j++) {
+        for (const c of addClasses) {
           // ******** DOM WRITE ****************
-          elementClassList.add(addClasses[j]);
+          elementClassList.add(c);
         }
       }
 
       // css classes to remove before the animation
       if (removeClasses) {
-
+        for (const c of removeClasses) {
-        for (let j = 0; j < removeClasses.length; j++) {
           // ******** DOM WRITE ****************
-          elementClassList.remove(removeClasses[j]);
+          elementClassList.remove(c);
         }
       }
 
@@ -856,17 +853,17 @@ export class Animator {
   _fireBeforeReadFunc() {
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
         // ******** DOM READ ****************
-        children[i]._fireBeforeReadFunc();
+        child._fireBeforeReadFunc();
       }
     }
 
     const readFunctions = this._readCallbacks;
     if (readFunctions) {
-      for (let i = 0; i < readFunctions.length; i++) {
+      for (const callback of readFunctions) {
         // ******** DOM READ ****************
-        readFunctions[i]();
+        callback();
       }
     }
   }
@@ -878,17 +875,17 @@ export class Animator {
   _fireBeforeWriteFunc() {
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
         // ******** DOM WRITE ****************
-        children[i]._fireBeforeWriteFunc();
+        child._fireBeforeWriteFunc();
       }
     }
 
     const writeFunctions = this._writeCallbacks;
     if (writeFunctions) {
-      for (let i = 0; i < writeFunctions.length; i++) {
+      for (const callback of writeFunctions) {
         // ******** DOM WRITE ****************
-        writeFunctions[i]();
+        callback();
       }
     }
   }
@@ -979,8 +976,8 @@ export class Animator {
 
     if (addWillChange && effects) {
       wc = [];
-      for (let i = 0; i < effects.length; i++) {
+      for (const effect of effects) {
-        const propWC = effects[i].wc;
+        const propWC = effect.wc;
         if (propWC === 'webkitTransform') {
           wc.push('transform', '-webkit-transform');
 
@@ -996,9 +993,9 @@ export class Animator {
 
     const elements = this._elements;
     if (elements) {
-      for (let i = 0; i < elements.length; i++) {
+      for (const el of elements) {
         // ******** DOM WRITE ****************
-        (elements[i] as any).style.willChange = willChange;
+        el.style.setProperty('will-change', willChange);
       }
     }
   }
@@ -1024,9 +1021,9 @@ export class Animator {
   _progressStart() {
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
         // ******** DOM WRITE ****************
-        children[i]._progressStart();
+        child._progressStart();
       }
     }
 
@@ -1047,9 +1044,9 @@ export class Animator {
 
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
         // ******** DOM WRITE ****************
-        children[i].progressStep(stepValue);
+        child.progressStep(stepValue);
       }
     }
 
@@ -1105,9 +1102,9 @@ export class Animator {
   _progressEnd(shouldComplete: boolean, stepValue: number, dur: number, isAsync: boolean) {
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
         // ******** DOM WRITE ****************
-        children[i]._progressEnd(shouldComplete, stepValue, dur, isAsync);
+        child._progressEnd(shouldComplete, stepValue, dur, isAsync);
       }
     }
 
@@ -1157,8 +1154,8 @@ export class Animator {
   _didFinishAll(hasCompleted: boolean, finishAsyncAnimations: boolean, finishNoDurationAnimations: boolean) {
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
-        children[i]._didFinishAll(hasCompleted, finishAsyncAnimations, finishNoDurationAnimations);
+        child._didFinishAll(hasCompleted, finishAsyncAnimations, finishNoDurationAnimations);
       }
     }
 
@@ -1176,15 +1173,15 @@ export class Animator {
 
     if (this._onFinishCallbacks) {
       // run all finish callbacks
-      for (let i = 0; i < this._onFinishCallbacks.length; i++) {
+      for (const callback of this._onFinishCallbacks) {
-        this._onFinishCallbacks[i](this);
+        callback(this);
       }
     }
 
     if (this._onFinishOneTimeCallbacks) {
       // run all "onetime" finish callbacks
-      for (let i = 0; i < this._onFinishOneTimeCallbacks.length; i++) {
+      for (const callback of this._onFinishOneTimeCallbacks) {
-        this._onFinishOneTimeCallbacks[i](this);
+        callback(this);
       }
       this._onFinishOneTimeCallbacks.length = 0;
     }
@@ -1199,8 +1196,8 @@ export class Animator {
     }
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
-        children[i].reverse(shouldReverse);
+        child.reverse(shouldReverse);
       }
     }
     this._isReverse = !!shouldReverse;
@@ -1215,8 +1212,8 @@ export class Animator {
 
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
-        children[i].destroy();
+        child.destroy();
       }
     }
 
@@ -1254,8 +1251,8 @@ export class Animator {
     // get the lowest level element that has an Animator
     const children = this._childAnimations;
     if (children) {
-      for (let i = 0; i < children.length; i++) {
+      for (const child of children) {
-        const targetEl = children[i]._transEl();
+        const targetEl = child._transEl();
         if (targetEl) {
           return targetEl;
         }
@@ -1267,6 +1264,7 @@ export class Animator {
       this._hasDur &&
       this._elements &&
       this._elements.length > 0 ?
-      this._elements[0] : null);
+      this._elements[0] : null
+    );
   }
 }

core/src/components/datetime/datetime.tsx

@@ -493,8 +493,8 @@ export class Datetime {
       col = pickerColumns[i];
       columnsWidth.push(0);
 
-      for (let j = 0; j < col.options.length; j++) {
+      for (const option of col.options) {
-        width = col.options[j].text!.length;
+        width = option.text!.length;
         if (width > columnsWidth[i]) {
           columnsWidth[i] = width;
         }

core/src/components/item-divider/item-divider.tsx

@@ -31,12 +31,11 @@ export class ItemDivider {
   componentDidLoad() {
     // Change the button size to small for each ion-button in the item
     // unless the size is explicitly set
-    const buttons = this.el.querySelectorAll('ion-button');
+    Array.from(this.el.querySelectorAll('ion-button')).forEach(button => {
-    for (let i = 0; i < buttons.length; i++) {
+      if (!button.size) {
-      if (!buttons[i].size) {
+        button.size = 'small';
-        buttons[i].size = 'small';
-      }
       }
+    });
   }
 
   hostData() {

core/src/components/nav/view-controller.ts

@@ -76,8 +76,7 @@ export function matches(view: ViewController | undefined, id: string, params: Co
   }
 
   // Test for A's keys different from B.
-  for (let i = 0; i < keysA.length; i++) {
+  for (const key of keysA) {
-    const key = keysA[i];
     if (currentParams[key] !== params[key]) {
       return false;
     }

core/src/components/route/route.tsx

@@ -50,8 +50,7 @@ export class Route {
       this.onUpdate(newValue);
       return;
     }
-    for (let i = 0; i < keys1.length; i++) {
+    for (const key of keys1) {
-      const key = keys1[i];
       if (newValue[key] !== oldValue[key]) {
         this.onUpdate(newValue);
         return;

core/src/utils/input-shims/hacks/common.ts

@@ -38,10 +38,9 @@ export function isFocused(input: HTMLInputElement): boolean {
 
 function removeClone(componentEl: HTMLElement, inputEl: HTMLElement) {
   if (componentEl && componentEl.parentElement) {
-    const clonedInputEles = componentEl.parentElement.querySelectorAll('.cloned-input');
+    Array.from(componentEl.parentElement.querySelectorAll('.cloned-input'))
-    for (let i = 0; i < clonedInputEles.length; i++) {
+      .forEach(clon => clon.remove());
-      clonedInputEles[i].remove();
+
-    }
     componentEl.style.pointerEvents = '';
   }
   (inputEl.style as any)['transform'] = '';

core/tslint.json

@@ -4,7 +4,6 @@
     "no-conditional-assignment": false,
     "no-non-null-assertion": false,
     "no-unnecessary-type-assertion": false,
-    "prefer-for-of": false,
     "no-import-side-effect": false,
     "trailing-comma": false,
     "no-null-keyword": false,