feat(inIframe/isEmbedded) add ability to detect generic embedding

On web we detect if we run on an iframe, and on mobile we detect if the
app is one of ours.

index.html

                 Component: JitsiMeetJS.app.entryPoints.APP
             })
 
-            const inIframe = () => {
+            const isEmbedded = () => {
                 try {
                     return window.self !== window.top;
                 } catch (e) {
             };
 
             const isElectron = navigator.userAgent.includes('Electron');
-            const shouldRegisterWorker = !isElectron && !inIframe() && 'serviceWorker' in navigator;
+            const shouldRegisterWorker = !isElectron && !isEmbedded() && 'serviceWorker' in navigator;
 
             if (shouldRegisterWorker) {
                 navigator.serviceWorker

react/features/analytics/functions.ts

     browser
 } from '../base/lib-jitsi-meet';
 import { isAnalyticsEnabled } from '../base/lib-jitsi-meet/functions.any';
+import { isEmbedded } from '../base/util/embedUtils';
 import { getJitsiMeetGlobalNS } from '../base/util/helpers';
-import { inIframe } from '../base/util/iframeUtils';
 import { loadScript } from '../base/util/loadScript';
 import { parseURLParams } from '../base/util/parseURLParams';
 import { parseURIString } from '../base/util/uri';
     permanentProperties.externalApi = typeof API_ID === 'number';
 
     // Report if we are loaded in iframe
-    permanentProperties.inIframe = inIframe();
+    permanentProperties.inIframe = isEmbedded();
 
     // Report the tenant from the URL.
     permanentProperties.tenant = tenant || '/';

react/features/app/actions.web.ts

 } from '../base/config/actions';
 import { setLocationURL } from '../base/connection/actions.web';
 import { loadConfig } from '../base/lib-jitsi-meet/functions.web';
-import { inIframe } from '../base/util/iframeUtils';
+import { isEmbedded } from '../base/util/embedUtils';
 import { parseURIString } from '../base/util/uri';
 import { isVpaasMeeting } from '../jaas/functions';
 import { clearNotifications, showNotification } from '../notifications/actions';
         // if close page is enabled redirect to it, without further action
         if (enableClosePage) {
             if (isVpaasMeeting(getState())) {
-                const isOpenedInIframe = inIframe();
+                const isOpenedInIframe = isEmbedded();
 
                 if (isOpenedInIframe) {
                     // @ts-ignore

react/features/app/components/App.native.tsx

 import DimensionsDetector from '../../base/responsive-ui/components/DimensionsDetector.native';
 import { updateSettings } from '../../base/settings/actions';
 import JitsiThemePaperProvider from '../../base/ui/components/JitsiThemeProvider.native';
+import { isEmbedded } from '../../base/util/embedUtils.native';
 import { _getRouteToRender } from '../getRouteToRender.native';
 import logger from '../logger';
 
 
         const liteTxt = AppInfo.isLiteSDK ? ' (lite)' : '';
 
-        logger.info(`Loaded SDK ${AppInfo.sdkVersion}${liteTxt}`);
+        logger.info(`Loaded SDK ${AppInfo.sdkVersion}${liteTxt} isEmbedded=${isEmbedded()}`);
     }
 
     /**

react/features/app/middleware.ts

 import { CONNECTION_ESTABLISHED, CONNECTION_FAILED } from '../base/connection/actionTypes';
 import { getURLWithoutParams } from '../base/connection/utils';
 import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
-import { inIframe } from '../base/util/iframeUtils';
+import { isEmbedded } from '../base/util/embedUtils';
 
 import { reloadNow } from './actions';
 import { _getRouteToRender } from './getRouteToRender';
     // @ts-ignore
     const { history, location } = window;
 
-    if (inIframe()) {
+    if (isEmbedded()) {
         return;
     }
 

react/features/base/app/middleware.web.ts

 import { AnyAction } from 'redux';
 
 import MiddlewareRegistry from '../redux/MiddlewareRegistry';
-import { inIframe } from '../util/iframeUtils';
+import { isEmbedded } from '../util/embedUtils';
 
 import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from './actionTypes';
 import logger from './logger';
     case APP_WILL_MOUNT: {
         // Disable it inside an iframe until Google fixes the origin trial for 3rd party sources:
         // https://bugs.chromium.org/p/chromium/issues/detail?id=1504167
-        if (!inIframe() && 'PressureObserver' in globalThis) {
+        if (!isEmbedded() && 'PressureObserver' in globalThis) {
             pressureObserver = new window.PressureObserver(
                     (records: typeof window.PressureRecord) => {
                         logger.info('Compute pressure state changed:', JSON.stringify(records));

react/features/base/config/configWhitelist.ts

-import { inIframe } from '../util/iframeUtils';
+import { isEmbedded } from '../util/embedUtils';
 
 import extraConfigWhitelist from './extraConfigWhitelist';
-import inIframeConfigWhitelist from './inIframeConfigWhitelist';
+import isEmbeddedConfigWhitelist from './isEmbeddedConfigWhitelist';
 
 /**
  * The config keys to whitelist, the keys that can be overridden.
     'webrtcIceTcpDisable',
     'webrtcIceUdpDisable',
     'whiteboard.enabled'
-].concat(extraConfigWhitelist).concat(inIframe() ? inIframeConfigWhitelist : []);
+].concat(extraConfigWhitelist).concat(isEmbedded() ? isEmbeddedConfigWhitelist : []);

react/features/base/config/inIframeConfigWhitelist.ts

-/**
- * Additional config whitelist extending the original whitelist in the case where jitsi-meet is loaded in an iframe.
- */
-export default [];

react/features/base/config/inIframeInterfaceConfigWhitelist.ts

-/**
- * Additional interface config whitelist extending the original whitelist in the case where jitsi-meet is loaded in an
- * iframe.
- */
-export default [];

react/features/base/config/interfaceConfigWhitelist.ts

-import { inIframe } from '../util/iframeUtils';
+import { isEmbedded } from '../util/embedUtils';
 
 import extraInterfaceConfigWhitelistCopy from './extraInterfaceConfigWhitelist';
-import inIframeInterfaceConfigWhitelist from './inIframeInterfaceConfigWhitelist';
+import isEmbeddedInterfaceConfigWhitelist from './isEmbeddedInterfaceConfigWhitelist';
 
 /**
  * The interface config keys to whitelist, the keys that can be overridden.
     'VERTICAL_FILMSTRIP',
     'VIDEO_LAYOUT_FIT',
     'VIDEO_QUALITY_LABEL_DISABLED'
-].concat(extraInterfaceConfigWhitelistCopy).concat(inIframe() ? inIframeInterfaceConfigWhitelist : []);
+].concat(extraInterfaceConfigWhitelistCopy).concat(isEmbedded() ? isEmbeddedInterfaceConfigWhitelist : []);

react/features/base/config/isEmbeddedConfigWhitelist.ts

+/**
+ * Additional config whitelist extending the original whitelist applied when Jitsi Meet is embedded
+ * in another app be that with an iframe or a mobile SDK.
+ */
+export default [
+    'customToolbarButtons',
+    'defaultLogoUrl',
+    'deploymentUrls',
+    'liveStreaming',
+    'salesforceUrl'
+];

react/features/base/config/isEmbeddedInterfaceConfigWhitelist.ts

+/**
+ * Additional interface config whitelist extending the original whitelist applied when Jitsi Meet is embedded
+ * in another app be that with an iframe or a mobile SDK.
+ */
+export default [
+];

react/features/base/connection/actions.any.ts

 import { getCurrentConference } from '../conference/functions';
 import { IConfigState } from '../config/reducer';
 import JitsiMeetJS, { JitsiConnectionEvents } from '../lib-jitsi-meet';
-import { inIframe } from '../util/iframeUtils';
+import { isEmbedded } from '../util/embedUtils';
 import { parseURLParams } from '../util/parseURLParams';
 import {
     appendURLParam,
     const iceServersOverride = params['iceServers.replace'];
 
     // Allow iceServersOverride only when jitsi-meet is in an iframe.
-    if (inIframe() && iceServersOverride) {
+    if (isEmbedded() && iceServersOverride) {
         options.iceServersOverride = iceServersOverride;
     }
 

react/features/base/jitsi-local-storage/setup.web.ts

 import { safeJsonParse } from '@jitsi/js-utils/json';
 
 import { browser } from '../lib-jitsi-meet';
-import { inIframe } from '../util/iframeUtils';
+import { isEmbedded } from '../util/embedUtils';
 import { parseURLParams } from '../util/parseURLParams';
 
 import logger from './logger';
         return true;
     }
 
-    if (browser.isWebKitBased() && inIframe()) {
+    if (browser.isWebKitBased() && isEmbedded()) {
         // WebKit browsers don't persist local storage for third-party iframes.
 
         return true;

react/features/base/util/embedUtils.native.ts

+import { getBundleId } from 'react-native-device-info';
+
+/**
+ * BUndle ids for the Jitsi Meet apps.
+ */
+const JITSI_MEET_APPS = [
+
+    // iOS app.
+    'com.atlassian.JitsiMeet.ios',
+
+    // Android + iOS (testing) app.
+    'org.jitsi.meet',
+
+    // Android debug app.
+    'org.jitsi.meet.debug',
+
+    // 8x8 Work (Android).
+    'org.vom8x8.sipua',
+
+    // 8x8 Work (iOS).
+    'com.yourcompany.Virtual-Office'
+];
+
+/**
+ * Checks whether we are loaded in iframe. In the mobile case we treat SDK
+ * consumers as the web treats iframes.
+ *
+ * @returns {boolean} Whether the current app is a Jitsi Meet app.
+ */
+export function isEmbedded(): boolean {
+    return !JITSI_MEET_APPS.includes(getBundleId());
+}

react/features/base/util/iframeUtils.ts → react/features/base/util/embedUtils.web.ts

  *
  * @returns {boolean} Whether the current page is loaded in an iframe.
  */
-export function inIframe(): boolean {
-    if (navigator.product === 'ReactNative') {
-        return false;
-    }
-
+export function isEmbedded(): boolean {
     try {
         return window.self !== window.top;
     } catch (e) {

react/features/conference/middleware.any.ts

 import { SET_REDUCED_UI } from '../base/responsive-ui/actionTypes';
 import { LOWER_HAND_MESSAGE } from '../base/tracks/constants';
 import { BUTTON_TYPES } from '../base/ui/constants.any';
-import { inIframe } from '../base/util/iframeUtils';
+import { isEmbedded } from '../base/util/embedUtils';
 import { isCalendarEnabled } from '../calendar-sync/functions';
 import FeedbackDialog from '../feedback/components/FeedbackDialog';
 import { setFilmstripEnabled } from '../filmstrip/actions.any';
         }
     }
 
-    if (inIframe() && state['features/base/config'].disableIframeAPI && !browser.isElectron()
-        && !isVpaasMeeting(state) && !allowIframe) {
+    // TODO: enable for mobile too?
+    if (isEmbedded() && state['features/base/config'].disableIframeAPI && !browser.isElectron()
+            && !browser.isReactNative() && !isVpaasMeeting(state) && !allowIframe) {
         // show sticky notification and redirect in 5 minutes
         const { locationURL } = state['features/base/connection'];
         let translationKey = 'notify.disabledIframe';

react/features/recent-list/middleware.ts

 import { JITSI_CONFERENCE_URL_KEY } from '../base/conference/constants';
 import { addKnownDomains } from '../base/known-domains/actions';
 import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
-import { inIframe } from '../base/util/iframeUtils';
+import { isEmbedded } from '../base/util/embedUtils';
 import { parseURIString } from '../base/util/uri';
 
 import { _storeCurrentConference, _updateConferenceDuration } from './actions';
     const state = getState();
     const { doNotStoreRoom } = state['features/base/config'];
 
-    if (!doNotStoreRoom && !inIframe()) {
+    if (!doNotStoreRoom && !isEmbedded()) {
         let locationURL;
 
         /**
 function _setRoom({ dispatch, getState }: IStore, next: Function, action: AnyAction) {
     const { doNotStoreRoom } = getState()['features/base/config'];
 
-    if (!doNotStoreRoom && !inIframe() && action.room) {
+    if (!doNotStoreRoom && !isEmbedded() && action.room) {
         const { locationURL } = getState()['features/base/connection'];
 
         if (locationURL) {

react/features/recording/components/Recording/LocalRecordingManager.web.ts

 import { getRoomName } from '../../../base/conference/functions';
 import { MEDIA_TYPE } from '../../../base/media/constants';
 import { getLocalTrack, getTrackState } from '../../../base/tracks/functions';
-import { inIframe } from '../../../base/util/iframeUtils';
+import { isEmbedded } from '../../../base/util/embedUtils';
 import { stopLocalVideoRecording } from '../../actions.any';
 
 interface ISelfRecording {
         const { dispatch, getState } = store;
 
         // @ts-ignore
-        const supportsCaptureHandle = Boolean(navigator.mediaDevices.setCaptureHandleConfig) && !inIframe();
+        const supportsCaptureHandle = Boolean(navigator.mediaDevices.setCaptureHandleConfig) && !isEmbedded();
         const tabId = uuidV4();
 
         this.selfRecording.on = onlySelf;