Skip to content

Commit 51032d2

Browse files
adamdbradleyadamdbradley
committed
feat(platform): default desktop to use material design
Breaking Change: Previously the default was to use ios mode if a more specific platform was not determined. Now the material design mode (md) will apply by default. In most cases this means desktop browsers will now receive the md mode. Closes #6003
1 parent 79cfa6f commit 51032d2

File tree

3 files changed

+124
-19
lines changed

3 files changed

+124
-19
lines changed

‎ionic/config/test/config.spec.ts

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ export function run() {
77
let platform = new Platform();
88
platform.setUserAgent('Mozilla/5.0 (Linux; U; Android 4.2.2; nl-nl; GT-I9505 Build/JDQ39) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30');
99
platform.setNavigatorPlatform('linux');
10-
platform.load();
10+
platform.load(null);
1111
config.setPlatform(platform);
1212

1313
expect(config.get('activator')).toEqual('none');
@@ -18,7 +18,7 @@ export function run() {
1818
let platform = new Platform();
1919
platform.setUserAgent('Mozilla/5.0 (Linux; U; Android 4.2.2; nl-nl; GT-I9505 Build/JDQ39) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30');
2020
platform.setNavigatorPlatform('MacIntel');
21-
platform.load();
21+
platform.load(null);
2222
config.setPlatform(platform);
2323

2424
expect(config.get('activator')).toEqual('ripple');
@@ -29,7 +29,7 @@ export function run() {
2929
let platform = new Platform();
3030
platform.setUserAgent('Mozilla/5.0 (Linux; Android 4.2.2; GT-I9505 Build/JDQ39) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/35.0.1650.59 Mobile Safari/537.36');
3131
platform.setNavigatorPlatform('linux');
32-
platform.load();
32+
platform.load(null);
3333
config.setPlatform(platform);
3434

3535
expect(config.get('activator')).toEqual('none');
@@ -40,7 +40,7 @@ export function run() {
4040
let platform = new Platform();
4141
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');
4242
platform.setNavigatorPlatform('linux');
43-
platform.load();
43+
platform.load(null);
4444
config.setPlatform(platform);
4545

4646
expect(config.get('activator')).toEqual('ripple');
@@ -51,7 +51,7 @@ export function run() {
5151
let platform = new Platform();
5252
platform.setUserAgent('Mozilla/5.0 (Android 5.0; Mobile; rv:41.0) Gecko/41.0 Firefox/41.0');
5353
platform.setNavigatorPlatform('linux');
54-
platform.load();
54+
platform.load(null);
5555
config.setPlatform(platform);
5656

5757
expect(config.get('activator')).toEqual('ripple');
@@ -62,7 +62,7 @@ export function run() {
6262
let platform = new Platform();
6363
platform.setUserAgent('Mozilla/5.0 (Android 4.4; Mobile; rv:41.0) Gecko/41.0 Firefox/41.0');
6464
platform.setNavigatorPlatform('linux');
65-
platform.load();
65+
platform.load(null);
6666
config.setPlatform(platform);
6767

6868
expect(config.get('activator')).toEqual('none');
@@ -73,7 +73,7 @@ export function run() {
7373

7474
let config = providers.find(provider => provider.useValue instanceof Config).useValue;
7575

76-
expect(config.get('mode')).toEqual('ios');
76+
expect(config.get('mode')).toEqual('md');
7777
});
7878

7979
it('should used passed in Config instance in ionicProviders', () => {
@@ -197,12 +197,12 @@ export function run() {
197197
expect(config.get('hoverCSS')).toEqual(true);
198198
});
199199

200-
it('should get ios mode for core platform', () => {
200+
it('should get md mode for core platform', () => {
201201
let config = new Config();
202202
let platform = new Platform(['core']);
203203
config.setPlatform(platform);
204204

205-
expect(config.get('mode')).toEqual('ios');
205+
expect(config.get('mode')).toEqual('md');
206206
});
207207

208208
it('should get ios mode for ipad platform', () => {

‎ionic/platform/registry.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ const doc: any = document;
99
Platform.register({
1010
name: 'core',
1111
settings: {
12-
mode: 'ios',
12+
mode: 'md',
1313
keyboardHeight: 290,
1414
}
1515
});

‎ionic/platform/test/platform.spec.ts

Lines changed: 114 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ export function run() {
3131
platform.setUrl('/?ionicplatform=windows');
3232
platform.load(null);
3333

34+
expect(platform.is('core')).toEqual(false);
3435
expect(platform.is('mobile')).toEqual(true);
3536
expect(platform.is('android')).toEqual(false);
3637
expect(platform.is('windows')).toEqual(true);
@@ -42,6 +43,7 @@ export function run() {
4243
platform.setUrl('/?ionicplatform=ios');
4344
platform.load(null);
4445

46+
expect(platform.is('core')).toEqual(false);
4547
expect(platform.is('mobile')).toEqual(true);
4648
expect(platform.is('android')).toEqual(false);
4749
expect(platform.is('windows')).toEqual(false);
@@ -54,6 +56,7 @@ export function run() {
5456
platform.setUserAgent(ANDROID_UA);
5557
platform.load(null);
5658

59+
expect(platform.is('core')).toEqual(false);
5760
expect(platform.is('android')).toEqual(false);
5861
expect(platform.is('windows')).toEqual(true);
5962
expect(platform.is('ios')).toEqual(false);
@@ -65,6 +68,7 @@ export function run() {
6568
platform.setUserAgent(ANDROID_UA);
6669
platform.load(null);
6770

71+
expect(platform.is('core')).toEqual(false);
6872
expect(platform.is('android')).toEqual(false);
6973
expect(platform.is('windows')).toEqual(false);
7074
expect(platform.is('ios')).toEqual(true);
@@ -75,6 +79,7 @@ export function run() {
7579
platform.setUrl('/?ionicplatform=android');
7680
platform.load(null);
7781

82+
expect(platform.is('core')).toEqual(false);
7883
expect(platform.is('android')).toEqual(true);
7984
expect(platform.is('windows')).toEqual(false);
8085
expect(platform.is('ios')).toEqual(false);
@@ -86,38 +91,42 @@ export function run() {
8691
platform.setUserAgent(IPHONE_UA);
8792
platform.load(null);
8893

94+
expect(platform.is('core')).toEqual(false);
8995
expect(platform.is('android')).toEqual(true);
9096
expect(platform.is('windows')).toEqual(false);
9197
expect(platform.is('ios')).toEqual(false);
9298
});
9399

94-
it('should set windows via user agent', () => {
100+
it('should set windows platform via user agent', () => {
95101
let platform = new Platform();
96-
platform.setUserAgent(WINDOWS_UA);
102+
platform.setUserAgent(WINDOWS_PHONE_UA);
97103
platform.load(null);
98104

105+
expect(platform.is('core')).toEqual(false);
99106
expect(platform.is('mobile')).toEqual(true);
100107
expect(platform.is('windows')).toEqual(true);
101108
expect(platform.is('android')).toEqual(false);
102109
expect(platform.is('ios')).toEqual(false);
103110
});
104111

105-
it('should set windows8 via user agent', () => {
112+
it('should set windows platform via windows8 mobile user agent', () => {
106113
let platform = new Platform();
107-
platform.setUserAgent(WINDOWS8_UA);
114+
platform.setUserAgent(WINDOWS8_PHONE_UA);
108115
platform.load(null);
109116

117+
expect(platform.is('core')).toEqual(false);
110118
expect(platform.is('mobile')).toEqual(true);
111119
expect(platform.is('windows')).toEqual(true);
112120
expect(platform.is('android')).toEqual(false);
113121
expect(platform.is('ios')).toEqual(false);
114122
});
115123

116-
it('should set windows7 via user agent', () => {
124+
it('should set windows platform via windows7 mobile user agent', () => {
117125
let platform = new Platform();
118-
platform.setUserAgent(WINDOWS7_UA);
126+
platform.setUserAgent(WINDOWS7_PHONE_UA);
119127
platform.load(null);
120128

129+
expect(platform.is('core')).toEqual(false);
121130
expect(platform.is('mobile')).toEqual(true);
122131
expect(platform.is('windows')).toEqual(true);
123132
expect(platform.is('android')).toEqual(false);
@@ -129,6 +138,7 @@ export function run() {
129138
platform.setUserAgent(ANDROID_UA);
130139
platform.load(null);
131140

141+
expect(platform.is('core')).toEqual(false);
132142
expect(platform.is('mobile')).toEqual(true);
133143
expect(platform.is('windows')).toEqual(false);
134144
expect(platform.is('android')).toEqual(true);
@@ -140,6 +150,7 @@ export function run() {
140150
platform.setUserAgent(IPHONE_UA);
141151
platform.load(null);
142152

153+
expect(platform.is('core')).toEqual(false);
143154
expect(platform.is('mobile')).toEqual(true);
144155
expect(platform.is('windows')).toEqual(false);
145156
expect(platform.is('android')).toEqual(false);
@@ -153,6 +164,7 @@ export function run() {
153164
platform.setUserAgent(IPAD_UA);
154165
platform.load(null);
155166

167+
expect(platform.is('core')).toEqual(false);
156168
expect(platform.is('mobile')).toEqual(true);
157169
expect(platform.is('windows')).toEqual(false);
158170
expect(platform.is('android')).toEqual(false);
@@ -161,11 +173,104 @@ export function run() {
161173
expect(platform.is('tablet')).toEqual(true);
162174
});
163175

176+
it('should set core platform for osx desktop firefox', () => {
177+
let platform = new Platform();
178+
platform.setUserAgent(OSX_10_FIREFOX_43_UA);
179+
platform.load(null);
180+
181+
expect(platform.is('core')).toEqual(true);
182+
expect(platform.is('mobile')).toEqual(false);
183+
expect(platform.is('windows')).toEqual(false);
184+
expect(platform.is('android')).toEqual(false);
185+
expect(platform.is('ios')).toEqual(false);
186+
expect(platform.is('ipad')).toEqual(false);
187+
expect(platform.is('tablet')).toEqual(false);
188+
});
189+
190+
it('should set core platform for osx desktop safari', () => {
191+
let platform = new Platform();
192+
platform.setUserAgent(OSX_10_SAFARI_9_UA);
193+
platform.load(null);
194+
195+
expect(platform.is('core')).toEqual(true);
196+
expect(platform.is('mobile')).toEqual(false);
197+
expect(platform.is('windows')).toEqual(false);
198+
expect(platform.is('android')).toEqual(false);
199+
expect(platform.is('ios')).toEqual(false);
200+
expect(platform.is('ipad')).toEqual(false);
201+
expect(platform.is('tablet')).toEqual(false);
202+
});
203+
204+
it('should set core platform for osx desktop chrome', () => {
205+
let platform = new Platform();
206+
platform.setUserAgent(OSX_10_CHROME_49_UA);
207+
platform.load(null);
208+
209+
expect(platform.is('core')).toEqual(true);
210+
expect(platform.is('mobile')).toEqual(false);
211+
expect(platform.is('windows')).toEqual(false);
212+
expect(platform.is('android')).toEqual(false);
213+
expect(platform.is('ios')).toEqual(false);
214+
expect(platform.is('ipad')).toEqual(false);
215+
expect(platform.is('tablet')).toEqual(false);
216+
});
217+
218+
it('should set core platform for windows desktop chrome', () => {
219+
let platform = new Platform();
220+
platform.setUserAgent(WINDOWS_10_CHROME_40_UA);
221+
platform.load(null);
222+
223+
expect(platform.is('core')).toEqual(true);
224+
expect(platform.is('mobile')).toEqual(false);
225+
expect(platform.is('windows')).toEqual(false);
226+
expect(platform.is('android')).toEqual(false);
227+
expect(platform.is('ios')).toEqual(false);
228+
expect(platform.is('ipad')).toEqual(false);
229+
expect(platform.is('tablet')).toEqual(false);
230+
});
231+
232+
it('should set core platform for windows desktop edge', () => {
233+
let platform = new Platform();
234+
platform.setUserAgent(WINDOWS_10_EDGE_12_UA);
235+
platform.load(null);
236+
237+
expect(platform.is('core')).toEqual(true);
238+
expect(platform.is('mobile')).toEqual(false);
239+
expect(platform.is('windows')).toEqual(false);
240+
expect(platform.is('android')).toEqual(false);
241+
expect(platform.is('ios')).toEqual(false);
242+
expect(platform.is('ipad')).toEqual(false);
243+
expect(platform.is('tablet')).toEqual(false);
244+
});
245+
246+
it('should set core platform for windows desktop IE', () => {
247+
let platform = new Platform();
248+
platform.setUserAgent(WINDOWS_8_IE_11_UA);
249+
platform.load(null);
250+
251+
expect(platform.is('core')).toEqual(true);
252+
expect(platform.is('mobile')).toEqual(false);
253+
expect(platform.is('windows')).toEqual(false);
254+
expect(platform.is('android')).toEqual(false);
255+
expect(platform.is('ios')).toEqual(false);
256+
expect(platform.is('ipad')).toEqual(false);
257+
expect(platform.is('tablet')).toEqual(false);
258+
});
259+
164260
}
165261

166-
const WINDOWS_UA = 'Mozilla/5.0 (Mobile; Windows Phone 8.1; Android 4.0; ARM; Trident/7.0; Touch; rv:11.0; IEMobile/11.0; NOKIA; Lumia 930) like iPhone OS 7_0_3 Mac OS X AppleWebKit/537 (KHTML, like Gecko) Mobile Safari/537';
167-
const WINDOWS8_UA = 'Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; IEMobile/10.0; ARM; Touch; NOKIA; Lumia 920)';
168-
const WINDOWS7_UA = 'Mozilla/4.0 (compatible; MSIE 7.0; Windows Phone OS 7.0; Trident/3.1; IEMobile/7.0; LG; GW910)';
262+
const OSX_10_FIREFOX_43_UA = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:43.0) Gecko/20100101 Firefox/43.0';
263+
const OSX_10_SAFARI_9_UA = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_3) AppleWebKit/601.4.4 (KHTML, like Gecko) Version/9.0.3 Safari/601.4.4';
264+
const OSX_10_CHROME_49_UA = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.110 Safari/537.36';
265+
266+
const WINDOWS_10_CHROME_40_UA = 'Mozilla/5.0 (Windows NT 10.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.93 Safari/537.36';
267+
const WINDOWS_10_EDGE_12_UA = 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36 Edge/12.0';
268+
const WINDOWS_8_IE_11_UA = 'Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; Touch; rv:11.0) like Gecko';
269+
270+
const WINDOWS_PHONE_UA = 'Mozilla/5.0 (Mobile; Windows Phone 8.1; Android 4.0; ARM; Trident/7.0; Touch; rv:11.0; IEMobile/11.0; NOKIA; Lumia 930) like iPhone OS 7_0_3 Mac OS X AppleWebKit/537 (KHTML, like Gecko) Mobile Safari/537';
271+
const WINDOWS8_PHONE_UA = 'Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; IEMobile/10.0; ARM; Touch; NOKIA; Lumia 920)';
272+
const WINDOWS7_PHONE_UA = 'Mozilla/4.0 (compatible; MSIE 7.0; Windows Phone OS 7.0; Trident/3.1; IEMobile/7.0; LG; GW910)';
273+
169274
const ANDROID_UA = 'Mozilla/5.0 (Linux; Android 5.1.1; Nexus 6 Build/LYZ28E) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/44.0.2403.20 Mobile Safari/537.36';
170275
const IPHONE_UA = 'Mozilla/5.0 (iPhone; CPU iPhone OS 8_0 like Mac OS X) AppleWebKit/600.1.3 (KHTML, like Gecko) Version/8.0 Mobile/12A4345d Safari/600.1.4';
171276
const IPAD_UA = 'Mozilla/5.0 (iPad; CPU OS 7_0 like Mac OS X) AppleWebKit/537.51.1 (KHTML, like Gecko) Version/7.0 Mobile/11A465 Safari/9537.53';

0 commit comments

Comments
 (0)