Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat(platform): add ability to override platform detection methods #23915

Merged
merged 7 commits into from
Sep 14, 2021
Merged

feat(platform): add ability to override platform detection methods #23915

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
4776aef
feat(platform): add ability to override platform detection methods
willmartian Sep 11, 2021
4b03c06
style: run lint
willmartian Sep 13, 2021
3f2e3a6
fix: fix import
willmartian Sep 13, 2021
7b55ced
test(config): add config e2e test for platform override
willmartian Sep 14, 2021
c981a33
test(platform): remove e2e and add spec test
willmartian Sep 14, 2021
7778f4e
fix: export PlatformConfig type
willmartian Sep 14, 2021
5fe56bb
revert(react-router): remove setupConfig in test-app
willmartian Sep 14, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions core/src/global/ionic-global.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,9 +21,6 @@ export const initialize = (userConfig: IonicConfig = {}) => {
Context.config = config;
const Ionic = (win as any).Ionic = (win as any).Ionic || {};

// Setup platforms
setupPlatforms(win);

const platformHelpers: any = {};
if (userConfig._ael) {
platformHelpers.ael = userConfig._ael;
Expand Down Expand Up @@ -51,6 +48,9 @@ export const initialize = (userConfig: IonicConfig = {}) => {
saveConfig(win, configObj);
}

// Setup platforms
setupPlatforms(win);

// first see if the mode was set as an attribute on <html>
// which could have been set by the user, or by pre-rendering
// otherwise get the mode via config settings, and fallback to md
Expand Down
7 changes: 7 additions & 0 deletions core/src/utils/config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
import { AnimationBuilder, Mode, SpinnerTypes, TabButtonLayout } from '../interface';

import { PlatformDetectionConfig } from './platform';

export interface IonicConfig {
/**
* When it's set to `false`, disables all animation and transition across the app.
Expand Down Expand Up @@ -175,6 +177,11 @@ export interface IonicConfig {
*/
sanitizerEnabled?: boolean;

/**
* Overrides the default platform detection methods.
*/
platformDetection?: PlatformDetectionConfig;
liamdebeasi marked this conversation as resolved.
Show resolved Hide resolved

// PRIVATE configs
keyboardHeight?: number;
inputShims?: boolean;
Expand Down
12 changes: 10 additions & 2 deletions core/src/utils/platform.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { config } from '../global/config';

export type Platforms = keyof typeof PLATFORMS_MAP;

Expand Down Expand Up @@ -29,8 +30,13 @@ export const setupPlatforms = (win: any = window) => {
return platforms;
};

const detectPlatforms = (win: Window) =>
(Object.keys(PLATFORMS_MAP) as Platforms[]).filter(p => PLATFORMS_MAP[p](win));
const detectPlatforms = (win: Window) => {
const customPlatformMethods = config.get('platformDetection');
return (Object.keys(PLATFORMS_MAP) as Platforms[]).filter(p => {
const customMethod = customPlatformMethods && customPlatformMethods[p];
return typeof customMethod === 'function' ? customMethod(win) : PLATFORMS_MAP[p](win);
});
}

const isMobileWeb = (win: Window): boolean =>
isMobile(win) && !isHybrid(win);
Expand Down Expand Up @@ -117,6 +123,8 @@ export const testUserAgent = (win: Window, expr: RegExp) =>
const matchMedia = (win: Window, query: string): boolean =>
win.matchMedia && win.matchMedia(query).matches;

export type PlatformDetectionConfig = Partial<typeof PLATFORMS_MAP>;

const PLATFORMS_MAP = {
'ipad': isIpad,
'iphone': isIphone,
Expand Down
11 changes: 11 additions & 0 deletions packages/react-router/test-app/src/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,19 @@
import { setupConfig, isPlatform } from '@ionic/react';
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import * as serviceWorker from './serviceWorker';

setupConfig({
platformDetection: {
'cordova': (win: any) => {
const isCordova = !!(win['cordova'] || win['phonegap'] || win['PhoneGap']);
console.log('Checking if platform is "cordova" with a custom detection method: ', isCordova);
return isCordova;
},
}
});

ReactDOM.render(<App />, document.getElementById('root'));

// If you want your app to work offline and load faster, you can change
Expand Down