fix(ripple): disable ripple on android 4.4 with chrome

ionic-team · Dec 14, 2016 · 97ec20e · 97ec20e
1 parent e80f4cf
commit 97ec20e
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 6 deletions.
diff --git a/src/config/test/config.spec.ts b/src/config/test/config.spec.ts
@@ -37,8 +37,8 @@ describe('Config', () => {
     expect(config.get('activator')).toEqual('none');
   });
 
-  it('should set activator setting to ripple for Android Chrome v36 and above on a linux device', () => {
-    platform.setUserAgent('Mozilla/5.0 (Linux; Android 4.2.2; GT-I9505 Build/JDQ39) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/36.0.1650.59 Mobile Safari/537.36');
+  it('should set activator setting to ripple for Android v5.0 and above using Chrome v36 and above on a linux device', () => {
+    platform.setUserAgent('Mozilla/5.0 (Linux; Android 5.0; Google Nexus 5 - 5.1.0 - API 22 - 1080x1920 Build/LMY47D) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Crosswalk/22.52.561.4 Mobile Safari/537.36');
     platform.setNavigatorPlatform('linux');
     platform.setQueryParams(qp);
     platform.init();
@@ -47,6 +47,16 @@ describe('Config', () => {
     expect(config.get('activator')).toEqual('ripple');
   });
 
+  it('should set activator setting to none for Android v4.4 and below and Chrome v36 and above on a linux device', () => {
+    platform.setUserAgent('Mozilla/5.0 (Linux; Android 4.4.2; XT901 Build/KDA20.92-3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Crosswalk/22.52.561.4 Mobile Safari/537.36');
+    platform.setNavigatorPlatform('linux');
+    platform.setQueryParams(qp);
+    platform.init();
+    config.init(null, qp, platform);
+
+    expect(config.get('activator')).toEqual('none');
+  });
+
   it('should set activator setting to ripple for Android v5.0 and above on a linux device not using Chrome', () => {
     platform.setUserAgent('Mozilla/5.0 (Android 5.0; Mobile; rv:41.0) Gecko/41.0 Firefox/41.0');
     platform.setNavigatorPlatform('linux');

diff --git a/src/platform/platform-registry.ts b/src/platform/platform-registry.ts
@@ -4,7 +4,7 @@ import { Platform, PlatformConfig } from './platform';
 import { windowLoad } from '../util/dom';
 
 
-export const PLATFORM_CONFIGS: {[key: string]: PlatformConfig} = {
+export const PLATFORM_CONFIGS: { [key: string]: PlatformConfig } = {
 
   /**
    * core
@@ -29,7 +29,7 @@ export const PLATFORM_CONFIGS: {[key: string]: PlatformConfig} = {
       let smallest = Math.min(p.width(), p.height());
       let largest = Math.max(p.width(), p.height());
       return (smallest > 390 && smallest < 520) &&
-            (largest > 620 && largest < 800);
+        (largest > 620 && largest < 800);
     }
   },
 
@@ -41,7 +41,7 @@ export const PLATFORM_CONFIGS: {[key: string]: PlatformConfig} = {
       let smallest = Math.min(p.width(), p.height());
       let largest = Math.max(p.width(), p.height());
       return (smallest > 460 && smallest < 820) &&
-            (largest > 780 && largest < 1400);
+        (largest > 780 && largest < 1400);
     }
   },
 
@@ -64,7 +64,11 @@ export const PLATFORM_CONFIGS: {[key: string]: PlatformConfig} = {
           let chromeVersion = p.matchUserAgentVersion(/Chrome\/(\d+).(\d+)?/);
           if (chromeVersion) {
             // linux android device using modern android chrome browser gets ripple
-            return (parseInt(chromeVersion.major, 10) < 36 ? 'none' : 'ripple');
+            if (parseInt(chromeVersion.major, 10) < 36 || p.version().major < 5) {
+              return 'none';
+            } else {
+              return 'ripple';
+            }
           }
           // linux android device not using chrome browser checks just android's version
           if (p.version().major < 5) {