22 files changed, 262 insertions, 49 deletions

diff --git a/electron-builder.yml b/electron-builder.yml
index b2c243e49..df7d2223a 100644
--- a/electron-builder.yml
+++ b/electron-builder.yml
@@ -11,6 +11,7 @@ mac:
   gatekeeperAssess: false
   category: public.app-category.productivity
   icon: ./build-helpers/images/icon.icns
+  darkModeSupport: true
 
 afterSign: ./build-helpers/notarize.js
 
diff --git a/package.json b/package.json
index eb5e0de6c..838be1299 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
   "name": "ferdi",
   "productName": "Ferdi",
   "appId": "com.kytwb.ferdi",
-  "version": "5.3.4-beta.7",
+  "version": "5.4.0-beta.1",
   "description": "Messaging app for WhatsApp, Slack, Telegram, HipChat, Hangouts and many many more.",
   "copyright": "kytwb",
   "main": "index.js",
diff --git a/packages/theme/src/themes/dark/index.ts b/packages/theme/src/themes/dark/index.ts
index e94f54c55..67d0cfb71 100644
--- a/packages/theme/src/themes/dark/index.ts
+++ b/packages/theme/src/themes/dark/index.ts
@@ -66,6 +66,7 @@ export const selectSearchColor = inputBackground;
 
 // Modal
 export const colorModalOverlayBackground = color(legacyStyles.darkThemeBlack).alpha(0.8).rgb().string();
+export const colorModalBackground = colorContentBackground;
 
 // Services
 export const services = merge({}, defaultStyles.services, {
diff --git a/packages/theme/src/themes/default/index.ts b/packages/theme/src/themes/default/index.ts
index 79a6d676f..1862fef6f 100644
--- a/packages/theme/src/themes/default/index.ts
+++ b/packages/theme/src/themes/default/index.ts
@@ -145,6 +145,7 @@ export const badgeBorderRadius = 50;
 
 // Modal
 export const colorModalOverlayBackground = color('#000').alpha(0.5).rgb().string();
+export const colorModalBackground = colorContentBackground;
 
 // Services
 export const services = {
diff --git a/src/components/services/content/ServiceView.js b/src/components/services/content/ServiceView.js
index f6686548d..273653ea2 100644
--- a/src/components/services/content/ServiceView.js
+++ b/src/components/services/content/ServiceView.js
@@ -13,6 +13,7 @@ import ServiceDisabled from './ServiceDisabled';
 import ServiceWebview from './ServiceWebview';
 import SettingsStore from '../../../stores/SettingsStore';
 import WebControlsScreen from '../../../features/webControls/containers/WebControlsScreen';
+import { CUSTOM_WEBSITE_ID } from '../../../features/webControls/constants';
 
 export default @observer @inject('stores') class ServiceView extends Component {
   static propTypes = {
@@ -183,11 +184,16 @@ export default @observer @inject('stores') class ServiceView extends Component {
               <WebControlsScreen service={service} />
             )}
             {!this.state.hibernate ? (
-              <ServiceWebview
-                service={service}
-                setWebviewReference={setWebviewReference}
-                detachService={detachService}
-              />
+              <>
+                {service.recipe.id === CUSTOM_WEBSITE_ID && (
+                  <WebControlsScreen service={service} />
+                )}
+                <ServiceWebview
+                  service={service}
+                  setWebviewReference={setWebviewReference}
+                  detachService={detachService}
+                />
+              </>
             ) : (
               <div>
                 <span role="img" aria-label="Sleeping Emoji">😴</span>
diff --git a/src/components/services/content/ServiceWebview.js b/src/components/services/content/ServiceWebview.js
index 03d6d5bcc..e6ebb6afb 100644
--- a/src/components/services/content/ServiceWebview.js
+++ b/src/components/services/content/ServiceWebview.js
@@ -38,6 +38,13 @@ class ServiceWebview extends Component {
     detachService({ service });
   }
 
+  refocusWebview = () => {
+    const { webview } = this;
+    if (!webview) return;
+    webview.view.blur();
+    webview.view.focus();
+  };
+
   render() {
     const {
       service,
@@ -46,7 +53,12 @@ class ServiceWebview extends Component {
 
     return (
       <ElectronWebView
-        ref={(webview) => { this.webview = webview; }}
+        ref={(webview) => {
+          this.webview = webview;
+          if (webview && webview.view) {
+            webview.view.addEventListener('did-stop-loading', this.refocusWebview);
+          }
+        }}
         autosize
         src={service.url}
         preload="./webview/recipe.js"
diff --git a/src/components/services/content/Services.js b/src/components/services/content/Services.js
index 1afbaabc4..edff29ae8 100644
--- a/src/components/services/content/Services.js
+++ b/src/components/services/content/Services.js
@@ -64,16 +64,24 @@ export default @observer @injectSheet(styles) class Services extends Component {
 
   state = {
     showConfetti: true,
-  }
+  };
+
+  _confettiTimeout = null;
 
   componentDidMount() {
-    window.setTimeout(() => {
+    this._confettiTimeout = window.setTimeout(() => {
       this.setState({
         showConfetti: false,
       });
     }, ms('8s'));
   }
 
+  componentWillUnmount() {
+    if (this._confettiTimeout) {
+      clearTimeout(this._confettiTimeout);
+    }
+  }
+
   render() {
     const {
       services,
diff --git a/src/components/ui/Modal/styles.js b/src/components/ui/Modal/styles.js
index 49b970c97..c2bebf9bb 100644
--- a/src/components/ui/Modal/styles.js
+++ b/src/components/ui/Modal/styles.js
@@ -13,7 +13,7 @@ export default theme => ({
     display: 'flex',
   },
   modal: {
-    background: '#FFF',
+    background: theme.colorModalBackground,
     maxWidth: '90%',
     height: 'auto',
     margin: 'auto auto',
diff --git a/src/features/delayApp/index.js b/src/features/delayApp/index.js
index a80ea4c72..5cc6c9506 100644
--- a/src/features/delayApp/index.js
+++ b/src/features/delayApp/index.js
@@ -57,12 +57,12 @@ export default function init(stores) {
 
             setVisibility(true);
 
-            timeLastDelay = moment();
-            shownAfterLaunch = true;
 
             setTimeout(() => {
               debug('Resetting app delay');
 
+              shownAfterLaunch = true;
+              timeLastDelay = moment();
               setVisibility(false);
             }, config.delayDuration + 1000); // timer needs to be able to hit 0
           } else {
diff --git a/src/features/webControls/components/WebControls.js b/src/features/webControls/components/WebControls.js
index 03f601a17..c6331073b 100644
--- a/src/features/webControls/components/WebControls.js
+++ b/src/features/webControls/components/WebControls.js
@@ -3,11 +3,35 @@ import PropTypes from 'prop-types';
 import { observer } from 'mobx-react';
 import injectSheet from 'react-jss';
 import { Icon } from '@meetfranz/ui';
+import { defineMessages, intlShape } from 'react-intl';
 
 import {
-  mdiReload, mdiArrowRight, mdiArrowLeft, mdiHomeOutline,
+  mdiReload, mdiArrowRight, mdiArrowLeft, mdiHomeOutline, mdiEarth,
 } from '@mdi/js';
 
+const messages = defineMessages({
+  goHome: {
+    id: 'webControls.goHome',
+    defaultMessage: '!!!Home',
+  },
+  openInBrowser: {
+    id: 'webControls.openInBrowser',
+    defaultMessage: '!!!Open in Browser',
+  },
+  back: {
+    id: 'webControls.back',
+    defaultMessage: '!!!Back',
+  },
+  forward: {
+    id: 'webControls.forward',
+    defaultMessage: '!!!Forward',
+  },
+  reload: {
+    id: 'webControls.reload',
+    defaultMessage: '!!!Reload',
+  },
+});
+
 const styles = theme => ({
   root: {
     background: theme.colorBackground,
@@ -18,7 +42,7 @@ const styles = theme => ({
     display: 'flex',
     flexDirection: 'row',
     alignItems: 'center',
-    padding: [0, 20],
+    padding: [0, 10],
 
     '& + div': {
       height: 'calc(100% - 50px)',
@@ -45,7 +69,7 @@ const styles = theme => ({
   input: {
     marginBottom: 0,
     height: 'auto',
-    marginLeft: 10,
+    margin: [0, 10],
     flex: 1,
     border: 0,
     padding: [4, 10],
@@ -68,10 +92,15 @@ class WebControls extends Component {
     canGoForward: PropTypes.bool.isRequired,
     goForward: PropTypes.func.isRequired,
     reload: PropTypes.func.isRequired,
+    openInBrowser: PropTypes.func.isRequired,
     url: PropTypes.string.isRequired,
     navigate: PropTypes.func.isRequired,
   }
 
+  static contextTypes = {
+    intl: intlShape,
+  };
+
   static getDerivedStateFromProps(props, state) {
     const { url } = props;
     const { editUrl } = state;
@@ -100,6 +129,7 @@ class WebControls extends Component {
       canGoForward,
       goForward,
       reload,
+      openInBrowser,
       url,
       navigate,
     } = this.props;
@@ -109,12 +139,16 @@ class WebControls extends Component {
       editUrl,
     } = this.state;
 
+    const { intl } = this.context;
+
     return (
       <div className={classes.root}>
         <button
           onClick={goHome}
           type="button"
           className={classes.button}
+          data-tip={intl.formatMessage(messages.goHome)}
+          data-place="bottom"
         >
           <Icon
             icon={mdiHomeOutline}
@@ -126,6 +160,8 @@ class WebControls extends Component {
           type="button"
           className={classes.button}
           disabled={!canGoBack}
+          data-tip={intl.formatMessage(messages.back)}
+          data-place="bottom"
         >
           <Icon
             icon={mdiArrowLeft}
@@ -137,6 +173,8 @@ class WebControls extends Component {
           type="button"
           className={classes.button}
           disabled={!canGoForward}
+          data-tip={intl.formatMessage(messages.forward)}
+          data-place="bottom"
         >
           <Icon
             icon={mdiArrowRight}
@@ -147,6 +185,8 @@ class WebControls extends Component {
           onClick={reload}
           type="button"
           className={classes.button}
+          data-tip={intl.formatMessage(messages.reload)}
+          data-place="bottom"
         >
           <Icon
             icon={mdiReload}
@@ -160,6 +200,7 @@ class WebControls extends Component {
             inputUrl: event.target.value,
           })}
           onFocus={(event) => {
+            console.log('on focus event');
             event.target.select();
             this.setState({
               editUrl: true,
@@ -182,6 +223,18 @@ class WebControls extends Component {
           }}
           ref={this.inputRef}
         />
+        <button
+          onClick={openInBrowser}
+          type="button"
+          className={classes.button}
+          data-tip={intl.formatMessage(messages.openInBrowser)}
+          data-place="bottom"
+        >
+          <Icon
+            icon={mdiEarth}
+            className={classes.icon}
+          />
+        </button>
       </div>
     );
   }
diff --git a/src/features/webControls/constants.js b/src/features/webControls/constants.js
new file mode 100644
index 000000000..270a3568e
--- /dev/null
+++ b/src/features/webControls/constants.js
@@ -0,0 +1 @@
+export const CUSTOM_WEBSITE_ID = 'franz-custom-website';
diff --git a/src/features/webControls/containers/WebControlsScreen.js b/src/features/webControls/containers/WebControlsScreen.js
index 1452d5a3d..cada01a6f 100644
--- a/src/features/webControls/containers/WebControlsScreen.js
+++ b/src/features/webControls/containers/WebControlsScreen.js
@@ -9,7 +9,6 @@ import Service from '../../../models/Service';
 
 const URL_EVENTS = [
   'load-commit',
-  // 'dom-ready',
   'will-navigate',
   'did-navigate',
   'did-navigate-in-page',
@@ -97,11 +96,20 @@ class WebControlsScreen extends Component {
     this.url = url;
   }
 
+  openInBrowser() {
+    const { openExternalUrl } = this.props.actions.app;
+
+    if (!this.webview) return;
+
+    openExternalUrl({ url: this.url });
+  }
+
   render() {
     return (
       <WebControls
         goHome={() => this.goHome()}
         reload={() => this.reload()}
+        openInBrowser={() => this.openInBrowser()}
         canGoBack={this.canGoBack}
         goBack={() => this.goBack()}
         canGoForward={this.canGoForward}
@@ -121,6 +129,9 @@ WebControlsScreen.wrappedComponent.propTypes = {
     services: PropTypes.instanceOf(ServicesStore).isRequired,
   }).isRequired,
   actions: PropTypes.shape({
+    app: PropTypes.shape({
+      openExternalUrl: PropTypes.func.isRequired,
+    }).isRequired,
     service: PropTypes.shape({
       reloadActive: PropTypes.func.isRequired,
     }).isRequired,
diff --git a/src/features/workspaces/components/WorkspaceDrawer.js b/src/features/workspaces/components/WorkspaceDrawer.js
index f4ee89a14..e991b9909 100644
--- a/src/features/workspaces/components/WorkspaceDrawer.js
+++ b/src/features/workspaces/components/WorkspaceDrawer.js
@@ -199,8 +199,9 @@ class WorkspaceDrawer extends Component {
               }}
               services={getServicesForWorkspace(null)}
               isActive={actualWorkspace == null}
+              shortcutIndex={0}
             />
-            {workspaces.map(workspace => (
+            {workspaces.map((workspace, index) => (
               <WorkspaceDrawerItem
                 key={workspace.id}
                 name={workspace.name}
@@ -212,6 +213,7 @@ class WorkspaceDrawer extends Component {
                 }}
                 onContextMenuEditClick={() => workspaceActions.edit({ workspace })}
                 services={getServicesForWorkspace(workspace)}
+                shortcutIndex={index + 1}
               />
             ))}
             <div
diff --git a/src/features/workspaces/components/WorkspaceDrawerItem.js b/src/features/workspaces/components/WorkspaceDrawerItem.js
index 59a2144d3..18f424d8a 100644
--- a/src/features/workspaces/components/WorkspaceDrawerItem.js
+++ b/src/features/workspaces/components/WorkspaceDrawerItem.js
@@ -5,6 +5,7 @@ import { observer } from 'mobx-react';
 import injectSheet from 'react-jss';
 import classnames from 'classnames';
 import { defineMessages, intlShape } from 'react-intl';
+import { ctrlKey } from '../../../environment';
 
 const { Menu } = remote;
 
@@ -69,6 +70,7 @@ class WorkspaceDrawerItem extends Component {
     onClick: PropTypes.func.isRequired,
     services: PropTypes.arrayOf(PropTypes.string).isRequired,
     onContextMenuEditClick: PropTypes.func,
+    shortcutIndex: PropTypes.number.isRequired,
   };
 
   static defaultProps = {
@@ -87,6 +89,7 @@ class WorkspaceDrawerItem extends Component {
       onClick,
       onContextMenuEditClick,
       services,
+      shortcutIndex,
     } = this.props;
     const { intl } = this.context;
 
@@ -112,6 +115,7 @@ class WorkspaceDrawerItem extends Component {
         onContextMenu={() => (
           onContextMenuEditClick && contextMenu.popup(remote.getCurrentWindow())
         )}
+        data-tip={`${shortcutIndex <= 9 ? `(${ctrlKey}+Alt+${shortcutIndex})` : ''}`}
       >
         <span
           className={classnames([
diff --git a/src/i18n/locales/en-US.json b/src/i18n/locales/en-US.json
index 319a55f28..140ca740b 100644
--- a/src/i18n/locales/en-US.json
+++ b/src/i18n/locales/en-US.json
@@ -102,6 +102,7 @@
   "menu.services": "Services",
   "menu.services.activatePreviousService": "Activate previous service",
   "menu.services.addNewService": "Add New Service...",
+  "menu.services.goHome": "Home",
   "menu.services.setNextServiceActive": "Activate next service",
   "menu.todos": "Todos",
   "menu.todos.enableTodos": "Enable Todos",
@@ -415,6 +416,11 @@
   "validation.oneRequired": "At least one is required",
   "validation.required": "{field} is required",
   "validation.url": "{field} is not a valid URL",
+  "webControls.back": "Back",
+  "webControls.forward": "Forward",
+  "webControls.goHome": "Home",
+  "webControls.openInBrowser": "Open in Browser",
+  "webControls.reload": "Reload",
   "welcome.loginButton": "Login to your account",
   "welcome.signupButton": "Create a free account",
   "workspaceDrawer.addNewWorkspaceLabel": "Add new workspace",
diff --git a/src/i18n/messages/src/features/webControls/components/WebControls.json b/src/i18n/messages/src/features/webControls/components/WebControls.json
new file mode 100644
index 000000000..969437e98
--- /dev/null
+++ b/src/i18n/messages/src/features/webControls/components/WebControls.json
@@ -0,0 +1,67 @@
+[
+  {
+    "id": "webControls.goHome",
+    "defaultMessage": "!!!Home",
+    "file": "src/features/webControls/components/WebControls.js",
+    "start": {
+      "line": 13,
+      "column": 10
+    },
+    "end": {
+      "line": 16,
+      "column": 3
+    }
+  },
+  {
+    "id": "webControls.openInBrowser",
+    "defaultMessage": "!!!Open in Browser",
+    "file": "src/features/webControls/components/WebControls.js",
+    "start": {
+      "line": 17,
+      "column": 17
+    },
+    "end": {
+      "line": 20,
+      "column": 3
+    }
+  },
+  {
+    "id": "webControls.back",
+    "defaultMessage": "!!!Back",
+    "file": "src/features/webControls/components/WebControls.js",
+    "start": {
+      "line": 21,
+      "column": 8
+    },
+    "end": {
+      "line": 24,
+      "column": 3
+    }
+  },
+  {
+    "id": "webControls.forward",
+    "defaultMessage": "!!!Forward",
+    "file": "src/features/webControls/components/WebControls.js",
+    "start": {
+      "line": 25,
+      "column": 11
+    },
+    "end": {
+      "line": 28,
+      "column": 3
+    }
+  },
+  {
+    "id": "webControls.reload",
+    "defaultMessage": "!!!Reload",
+    "file": "src/features/webControls/components/WebControls.js",
+    "start": {
+      "line": 29,
+      "column": 10
+    },
+    "end": {
+      "line": 32,
+      "column": 3
+    }
+  }
+]
\ No newline at end of file
diff --git a/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawerItem.json b/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawerItem.json
index 4ff190606..1b6664787 100644
--- a/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawerItem.json
+++ b/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawerItem.json
@@ -4,11 +4,11 @@
     "defaultMessage": "!!!No services added yet",
     "file": "src/features/workspaces/components/WorkspaceDrawerItem.js",
     "start": {
-      "line": 12,
+      "line": 13,
       "column": 22
     },
     "end": {
-      "line": 15,
+      "line": 16,
       "column": 3
     }
   },
@@ -17,11 +17,11 @@
     "defaultMessage": "!!!edit",
     "file": "src/features/workspaces/components/WorkspaceDrawerItem.js",
     "start": {
-      "line": 16,
+      "line": 17,
       "column": 19
     },
     "end": {
-      "line": 19,
+      "line": 20,
       "column": 3
     }
   }
diff --git a/src/index.js b/src/index.js
index 449bbad19..2ee404c0b 100644
--- a/src/index.js
+++ b/src/index.js
@@ -336,22 +336,7 @@ app.on('login', (event, webContents, request, authInfo, callback) => {
   debug('browser login event', authInfo);
   event.preventDefault();
 
-  if (authInfo.isProxy && authInfo.scheme === 'basic') {
-    debug('Sending service echo ping');
-    webContents.send('get-service-id');
-
-    ipcMain.once('service-id', (e, id) => {
-      debug('Received service id', id);
-
-      const ps = proxySettings.get(id);
-      if (ps) {
-        debug('Sending proxy auth callback for service', id);
-        callback(ps.user, ps.password);
-      } else {
-        debug('No proxy auth config found for', id);
-      }
-    });
-  } else if (authInfo.scheme === 'basic') {
+  if (!authInfo.isProxy && authInfo.scheme === 'basic') {
     debug('basic auth handler', authInfo);
     basicAuthHandler(mainWindow, authInfo);
   }
diff --git a/src/lib/Menu.js b/src/lib/Menu.js
index 01aee6f5c..f223283f9 100644
--- a/src/lib/Menu.js
+++ b/src/lib/Menu.js
@@ -9,6 +9,7 @@ import { announcementActions } from '../features/announcements/actions';
 import { announcementsStore } from '../features/announcements';
 import { todosStore } from '../features/todos';
 import { todoActions } from '../features/todos/actions';
+import { CUSTOM_WEBSITE_ID } from '../features/webControls/constants';
 
 const { app, Menu, dialog } = remote;
 
@@ -281,6 +282,10 @@ const menuItems = defineMessages({
     id: 'menu.todos.enableTodos',
     defaultMessage: '!!!Enable Todos',
   },
+  serviceGoHome: {
+    id: 'menu.services.goHome',
+    defaultMessage: '!!!Home',
+  },
 });
 
 function getActiveWebview() {
@@ -767,8 +772,12 @@ export default class FranzMenu {
       accelerator: `${cmdKey}+R`,
       click: () => {
         if (this.stores.user.isLoggedIn
-          && this.stores.services.enabled.length > 0) {
-          this.actions.service.reloadActive();
+        && this.stores.services.enabled.length > 0) {
+          if (this.stores.services.active.recipe.id === CUSTOM_WEBSITE_ID) {
+            this.stores.services.active.webview.reload();
+          } else {
+            this.actions.service.reloadActive();
+          }
         } else {
           window.location.reload();
         }
@@ -995,6 +1004,16 @@ export default class FranzMenu {
       },
     })));
 
+    if (services.active && services.active.recipe.id === CUSTOM_WEBSITE_ID) {
+      menu.push({
+        type: 'separator',
+      }, {
+        label: intl.formatMessage(menuItems.serviceGoHome),
+        accelerator: `${cmdKey}+shift+H`,
+        click: () => this.actions.service.reloadActive(),
+      });
+    }
+
     return menu;
   }
 
diff --git a/src/models/Service.js b/src/models/Service.js
index 3ab6e2603..ddc169d47 100644
--- a/src/models/Service.js
+++ b/src/models/Service.js
@@ -192,19 +192,24 @@ export default class Service {
     return userAgent;
   }
 
-  initializeWebViewEvents({ handleIPCMessage, openWindow }) {
+  initializeWebViewEvents({ handleIPCMessage, openWindow, stores }) {
+    const webContents = this.webview.getWebContents();
+
     this.webview.addEventListener('ipc-message', e => handleIPCMessage({
       serviceId: this.id,
       channel: e.channel,
       args: e.args,
     }));
 
-    this.webview.addEventListener('new-window', (event, url, frameName, options) => openWindow({
-      event,
-      url,
-      frameName,
-      options,
-    }));
+    this.webview.addEventListener('new-window', (event, url, frameName, options) => {
+      console.log('open window', event, url, frameName, options);
+      openWindow({
+        event,
+        url,
+        frameName,
+        options,
+      });
+    });
 
     this.webview.addEventListener('did-start-loading', (event) => {
       debug('Did start load', this.name, event);
@@ -238,6 +243,28 @@ export default class Service {
       debug('Service crashed', this.name);
       this.hasCrashed = true;
     });
+
+    webContents.on('login', (event, request, authInfo, callback) => {
+      // const authCallback = callback;
+      debug('browser login event', authInfo);
+      event.preventDefault();
+
+      if (authInfo.isProxy && authInfo.scheme === 'basic') {
+        debug('Sending service echo ping');
+        webContents.send('get-service-id');
+
+        debug('Received service id', this.id);
+
+        const ps = stores.settings.proxy[this.id];
+
+        if (ps) {
+          debug('Sending proxy auth callback for service', this.id);
+          callback(ps.user, ps.password);
+        } else {
+          debug('No proxy auth config found for', this.id);
+        }
+      }
+    });
   }
 
   initializeWebViewListener() {
diff --git a/src/stores/ServicesStore.js b/src/stores/ServicesStore.js
index 3173004d4..076ecc204 100644
--- a/src/stores/ServicesStore.js
+++ b/src/stores/ServicesStore.js
@@ -370,6 +370,7 @@ export default class ServicesStore extends Store {
       service.initializeWebViewEvents({
         handleIPCMessage: this.actions.service.handleIPCMessage,
         openWindow: this.actions.service.openWindow,
+        stores: this.stores,
       });
       service.initializeWebViewListener();
     }
@@ -727,6 +728,8 @@ export default class ServicesStore extends Store {
     const serviceData = data;
     const recipe = this.stores.recipes.one(recipeId);
 
+    if (!recipe) return;
+
     if (recipe.hasTeamId && recipe.hasCustomUrl && data.team && data.customUrl) {
       delete serviceData.team;
     }
diff --git a/src/webview/recipe.js b/src/webview/recipe.js
index b30199f03..3f2338b68 100644
--- a/src/webview/recipe.js
+++ b/src/webview/recipe.js
@@ -19,6 +19,7 @@ import contextMenu from './contextMenu';
 import './notifications';
 
 import { DEFAULT_APP_SETTINGS } from '../config';
+import { isDevMode } from '../environment';
 
 const debug = require('debug')('Ferdi:Plugin');
 
@@ -39,7 +40,7 @@ class RecipeController {
     'settings-update': 'updateAppSettings',
     'service-settings-update': 'updateServiceSettings',
     'get-service-id': 'serviceIdEcho',
-  }
+  };
 
   constructor() {
     this.initialize();
@@ -195,6 +196,7 @@ new RecipeController();
 // Patching window.open
 const originalWindowOpen = window.open;
 
+
 window.open = (url, frameName, features) => {
   if (!url && !frameName && !features) {
     // The service hasn't yet supplied a URL (as used in Skype).
@@ -209,7 +211,7 @@ window.open = (url, frameName, features) => {
       // Has the service changed the URL yet?
       if (newWindow.location.href !== '') {
         // Open the new URL
-        window.open(newWindow.location.href);
+        ipcRenderer.sendToHost('new-window', newWindow.location.href);
         clearInterval(checkInterval);
       }
     }, 0);
@@ -223,9 +225,13 @@ window.open = (url, frameName, features) => {
   }
 
   // We need to differentiate if the link should be opened in a popup or in the systems default browser
-  if (!frameName && !features) {
+  if (!frameName && !features && typeof features !== 'string') {
     return ipcRenderer.sendToHost('new-window', url);
   }
 
   return originalWindowOpen(url, frameName, features);
 };
+
+if (isDevMode) {
+  window.log = console.log;
+}