diff --git a/core/src/components/infinite-scroll-content/infinite-scroll-content.tsx b/core/src/components/infinite-scroll-content/infinite-scroll-content.tsx
index f425e56019..6361b1e303 100644
--- a/core/src/components/infinite-scroll-content/infinite-scroll-content.tsx
+++ b/core/src/components/infinite-scroll-content/infinite-scroll-content.tsx
@@ -30,7 +30,7 @@ export class InfiniteScrollContent implements ComponentInterface {
     if (this.loadingSpinner === undefined) {
       this.loadingSpinner = this.config.get(
         'infiniteLoadingSpinner',
-        this.config.get('spinner', 'lines')
+        this.config.get('spinner', this.mode === 'ios' ? 'lines' : 'crescent')
       );
     }
   }
diff --git a/core/src/components/infinite-scroll/test/basic/index.html b/core/src/components/infinite-scroll/test/basic/index.html
index 444a4ee6aa..b424b4874d 100644
--- a/core/src/components/infinite-scroll/test/basic/index.html
+++ b/core/src/components/infinite-scroll/test/basic/index.html
@@ -30,7 +30,7 @@
       <ion-list id="list"></ion-list>
 
       <ion-infinite-scroll threshold="100px" id="infinite-scroll">
-        <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="Loading more data...">
+        <ion-infinite-scroll-content loading-spinner="crescent" loading-text="Loading more data...">
         </ion-infinite-scroll-content>
       </ion-infinite-scroll>
     </ion-content>
diff --git a/core/src/components/infinite-scroll/test/preview/index.html b/core/src/components/infinite-scroll/test/preview/index.html
index ea6c671889..0b387001d2 100644
--- a/core/src/components/infinite-scroll/test/preview/index.html
+++ b/core/src/components/infinite-scroll/test/preview/index.html
@@ -30,7 +30,7 @@
       </ion-list>
 
       <ion-infinite-scroll threshold="100px" id="infinite-scroll">
-        <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="Loading more data...">
+        <ion-infinite-scroll-content loading-spinner="bubbles" loading-text="Loading more data...">
         </ion-infinite-scroll-content>
       </ion-infinite-scroll>
     </ion-content>
diff --git a/core/src/components/infinite-scroll/test/standalone/index.html b/core/src/components/infinite-scroll/test/standalone/index.html
index ee33c560aa..d83c28aa7f 100644
--- a/core/src/components/infinite-scroll/test/standalone/index.html
+++ b/core/src/components/infinite-scroll/test/standalone/index.html
@@ -18,8 +18,8 @@
 
     <ion-infinite-scroll threshold="100px" id="infinite-scroll">
       <ion-infinite-scroll-content
-        loadingSpinner="bubbles"
-        loadingText="Loading more data...">
+        loading-spinner="bubbles"
+        loading-text="Loading more data...">
       </ion-infinite-scroll-content>
     </ion-infinite-scroll>
   </ion-content>
diff --git a/core/src/components/infinite-scroll/test/top/index.html b/core/src/components/infinite-scroll/test/top/index.html
index 029a8cff2e..3febf95aa4 100644
--- a/core/src/components/infinite-scroll/test/top/index.html
+++ b/core/src/components/infinite-scroll/test/top/index.html
@@ -24,7 +24,7 @@
     <ion-content id="content" padding>
 
       <ion-infinite-scroll threshold="100px" id="infinite-scroll" position="top">
-        <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="Loading more data...">
+        <ion-infinite-scroll-content loading-spinner="bubbles" loading-text="Loading more data...">
         </ion-infinite-scroll-content>
       </ion-infinite-scroll>
 
diff --git a/core/src/components/loading/loading.tsx b/core/src/components/loading/loading.tsx
index 6d59427338..ec66c30021 100644
--- a/core/src/components/loading/loading.tsx
+++ b/core/src/components/loading/loading.tsx
@@ -113,7 +113,10 @@ export class Loading implements ComponentInterface, OverlayInterface {
 
   componentWillLoad() {
     if (this.spinner === undefined) {
-      this.spinner = this.config.get('loadingSpinner', this.mode === 'ios' ? 'lines' : 'crescent');
+      this.spinner = this.config.get(
+        'loadingSpinner',
+        this.config.get('spinner', this.mode === 'ios' ? 'lines' : 'crescent')
+      );
     }
   }
 
diff --git a/core/src/components/refresher-content/refresher-content.tsx b/core/src/components/refresher-content/refresher-content.tsx
index 49b622cf7d..4940ad58f4 100644
--- a/core/src/components/refresher-content/refresher-content.tsx
+++ b/core/src/components/refresher-content/refresher-content.tsx
@@ -1,12 +1,14 @@
 import { Component, ComponentInterface, Prop } from '@stencil/core';
 
-import { Config, SpinnerTypes } from '../../interface';
+import { Config, Mode, SpinnerTypes } from '../../interface';
 
 @Component({
   tag: 'ion-refresher-content'
 })
 export class RefresherContent implements ComponentInterface {
 
+  mode!: Mode;
+
   @Prop({ context: 'config' }) config!: Config;
 
   /**
@@ -34,7 +36,10 @@ export class RefresherContent implements ComponentInterface {
       this.pullingIcon = this.config.get('refreshingIcon', 'arrow-down');
     }
     if (this.refreshingSpinner === undefined) {
-      this.refreshingSpinner = this.config.get('refreshingSpinner', this.config.get('spinner', 'lines'));
+      this.refreshingSpinner = this.config.get(
+        'refreshingSpinner',
+        this.config.get('spinner', this.mode === 'ios' ? 'lines' : 'crescent')
+      );
     }
   }
 
diff --git a/core/src/components/virtual-scroll/test/basic/index.html b/core/src/components/virtual-scroll/test/basic/index.html
index 569a612919..0016eb9388 100644
--- a/core/src/components/virtual-scroll/test/basic/index.html
+++ b/core/src/components/virtual-scroll/test/basic/index.html
@@ -42,7 +42,7 @@
       </ion-virtual-scroll>
 
       <ion-infinite-scroll threshold="100px" id="infinite-scroll">
-        <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="Loading more data...">
+        <ion-infinite-scroll-content loading-spinner="bubbles" loading-text="Loading more data...">
         </ion-infinite-scroll-content>
       </ion-infinite-scroll>