mirror of
https://github.com/responsively-org/responsively-app
synced 2024-09-20 22:31:59 +00:00
Electron upgrade to 8.3.0 and related packages to latest versions, resolves #107
This commit is contained in:
parent
277216899a
commit
1e6d539109
12 changed files with 7335 additions and 5762 deletions
|
@ -1,17 +1,20 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="Content-Security-Policy" content="default-src * data: blob: 'unsafe-inline' 'unsafe-eval';">
|
<meta
|
||||||
|
http-equiv="Content-Security-Policy"
|
||||||
|
content="default-src * data: blob: 'unsafe-inline' 'unsafe-eval';"
|
||||||
|
/>
|
||||||
<link
|
<link
|
||||||
href="https://fonts.googleapis.com/css?family=Roboto&display=swap"
|
href="https://fonts.googleapis.com/css?family=Roboto&display=swap"
|
||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
/>
|
/>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<title>Responsively</title>
|
<title>Responsively</title>
|
||||||
<script src='../node_modules/electron-cookies/dist/electron-cookies.js'></script>
|
<script src="../node_modules/electron-cookies/dist/electron-cookies.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
// prettier-ignore
|
// prettier-ignore
|
||||||
window.heap = window.heap || [], heap.load = function (e, t) { window.heap.appid = e, window.heap.config = t = t || {}; var r = t.forceSSL || "https:" === document.location.protocol, a = document.createElement("script"); a.type = "text/javascript", a.async = !0, a.src = (r ? "https:" : "http:") + "//cdn.heapanalytics.com/js/heap-" + e + ".js"; var n = document.getElementsByTagName("script")[0]; n.parentNode.insertBefore(a, n); for (var o = function (e) { return function () { heap.push([e].concat(Array.prototype.slice.call(arguments, 0))) } }, p = ["addEventProperties", "addUserProperties", "clearEventProperties", "identify", "resetIdentity", "removeEventProperty", "setEventProperties", "track", "unsetEventProperty"], c = 0; c < p.length; c++)heap[p[c]] = o(p[c]) };
|
window.heap = window.heap || [], heap.load = function (e, t) { window.heap.appid = e, window.heap.config = t = t || {}; var r = t.forceSSL || "https:" === document.location.protocol, a = document.createElement("script"); a.type = "text/javascript", a.async = !0, a.src = "https://cdn.heapanalytics.com/js/heap-" + e + ".js"; var n = document.getElementsByTagName("script")[0]; n.parentNode.insertBefore(a, n); for (var o = function (e) { return function () { heap.push([e].concat(Array.prototype.slice.call(arguments, 0))) } }, p = ["addEventProperties", "addUserProperties", "clearEventProperties", "identify", "resetIdentity", "removeEventProperty", "setEventProperties", "track", "unsetEventProperty"], c = 0; c < p.length; c++)heap[p[c]] = o(p[c]) };
|
||||||
heap.load('3453744655');
|
heap.load('3453744655');
|
||||||
</script>
|
</script>
|
||||||
<script>
|
<script>
|
||||||
|
|
|
@ -35,7 +35,7 @@ export default function DevicesPreviewer(props) {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<Tab tabId={device.id}>
|
<Tab tabId={device.id} key={device.id}>
|
||||||
{getDeviceIcon(device.type)}
|
{getDeviceIcon(device.type)}
|
||||||
{device.name}
|
{device.name}
|
||||||
</Tab>
|
</Tab>
|
||||||
|
|
|
@ -20,7 +20,6 @@ import {
|
||||||
const LeftIconsPane = props => {
|
const LeftIconsPane = props => {
|
||||||
const headwayRef = useRef();
|
const headwayRef = useRef();
|
||||||
const iconProps = {
|
const iconProps = {
|
||||||
color: iconsColor,
|
|
||||||
style: {fontSize: 30},
|
style: {fontSize: 30},
|
||||||
height: 30,
|
height: 30,
|
||||||
width: 30,
|
width: 30,
|
||||||
|
|
|
@ -47,7 +47,7 @@ export default function QuickFilterDevices(props) {
|
||||||
})}
|
})}
|
||||||
onClick={() => props.toggleFilter(FILTER_FIELDS.OS, OS.android)}
|
onClick={() => props.toggleFilter(FILTER_FIELDS.OS, OS.android)}
|
||||||
>
|
>
|
||||||
<AndroidIcon color={iconsColor} style={{fontSize: 40}} />
|
<AndroidIcon style={{fontSize: 40}} />
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
className={cx(styles.optionIcon, commonStyles.icons, {
|
className={cx(styles.optionIcon, commonStyles.icons, {
|
||||||
|
@ -73,7 +73,7 @@ export default function QuickFilterDevices(props) {
|
||||||
})}
|
})}
|
||||||
onClick={() => props.toggleFilter(FILTER_FIELDS.OS, OS.pc)}
|
onClick={() => props.toggleFilter(FILTER_FIELDS.OS, OS.pc)}
|
||||||
>
|
>
|
||||||
<DesktopIcon color={iconsColor} style={{fontSize: 40}} />
|
<DesktopIcon style={{fontSize: 40}} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -93,7 +93,7 @@ export default function QuickFilterDevices(props) {
|
||||||
props.toggleFilter(FILTER_FIELDS.DEVICE_TYPE, DEVICE_TYPE.phone)
|
props.toggleFilter(FILTER_FIELDS.DEVICE_TYPE, DEVICE_TYPE.phone)
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<MobileIcon color={iconsColor} style={{fontSize: 35}} />
|
<MobileIcon style={{fontSize: 35}} />
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
className={cx(styles.optionIcon, commonStyles.icons, {
|
className={cx(styles.optionIcon, commonStyles.icons, {
|
||||||
|
@ -111,7 +111,7 @@ export default function QuickFilterDevices(props) {
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<TabletIcon color={iconsColor} style={{fontSize: 35}} />
|
<TabletIcon style={{fontSize: 35}} />
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
className={cx(styles.optionIcon, commonStyles.icons, {
|
className={cx(styles.optionIcon, commonStyles.icons, {
|
||||||
|
@ -129,7 +129,7 @@ export default function QuickFilterDevices(props) {
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<DesktopIcon color={iconsColor} style={{fontSize: 40}} />
|
<DesktopIcon style={{fontSize: 40}} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -14,7 +14,7 @@ export default function UserPreference(props) {
|
||||||
return (
|
return (
|
||||||
<div className={cx(commonStyles.sidebarContentSection)}>
|
<div className={cx(commonStyles.sidebarContentSection)}>
|
||||||
<div className={cx(commonStyles.sidebarContentSectionTitleBar)}>
|
<div className={cx(commonStyles.sidebarContentSectionTitleBar)}>
|
||||||
<SettingsIcon color="white" width={26} margin={2} /> User Preferences
|
<SettingsIcon width={26} margin={2} /> User Preferences
|
||||||
</div>
|
</div>
|
||||||
<div className={cx(commonStyles.sidebarContentSectionContainer)}>
|
<div className={cx(commonStyles.sidebarContentSectionContainer)}>
|
||||||
<div>
|
<div>
|
||||||
|
|
|
@ -172,6 +172,14 @@ class WebView extends Component {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
getWebContents() {
|
||||||
|
return this.getWebContentForId(this.webviewRef.current.getWebContentsId());
|
||||||
|
}
|
||||||
|
|
||||||
|
getWebContentForId(id) {
|
||||||
|
return remote.webContents.fromId(id);
|
||||||
|
}
|
||||||
|
|
||||||
componentWillUnmount() {
|
componentWillUnmount() {
|
||||||
this.subscriptions.forEach(pubsub.unsubscribe);
|
this.subscriptions.forEach(pubsub.unsubscribe);
|
||||||
}
|
}
|
||||||
|
@ -179,7 +187,7 @@ class WebView extends Component {
|
||||||
initDeviceEmulationParams = () => {
|
initDeviceEmulationParams = () => {
|
||||||
try {
|
try {
|
||||||
return;
|
return;
|
||||||
this.webviewRef.current.getWebContents().enableDeviceEmulation({
|
this.getWebContents().enableDeviceEmulation({
|
||||||
screenPosition: this.isMobile ? 'mobile' : 'desktop',
|
screenPosition: this.isMobile ? 'mobile' : 'desktop',
|
||||||
screenSize: {
|
screenSize: {
|
||||||
width: this.props.device.width,
|
width: this.props.device.width,
|
||||||
|
@ -264,12 +272,10 @@ class WebView extends Component {
|
||||||
} = this.webviewRef.current.getBoundingClientRect();
|
} = this.webviewRef.current.getBoundingClientRect();
|
||||||
const {x: deviceX, y: deviceY} = message;
|
const {x: deviceX, y: deviceY} = message;
|
||||||
const zoomFactor = this.props.browser.zoomLevel;
|
const zoomFactor = this.props.browser.zoomLevel;
|
||||||
this.webviewRef.current
|
this.getWebContents().inspectElement(
|
||||||
.getWebContents()
|
Math.round(webViewX + deviceX * zoomFactor),
|
||||||
.inspectElement(
|
Math.round(webViewY + deviceY * zoomFactor)
|
||||||
Math.round(webViewX + deviceX * zoomFactor),
|
);
|
||||||
Math.round(webViewY + deviceY * zoomFactor)
|
|
||||||
);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
processEnableInspectorEvent = () => {
|
processEnableInspectorEvent = () => {
|
||||||
|
@ -320,7 +326,7 @@ class WebView extends Component {
|
||||||
};
|
};
|
||||||
|
|
||||||
initEventTriggers = webview => {
|
initEventTriggers = webview => {
|
||||||
webview.getWebContents().executeJavaScript(`
|
this.getWebContentForId(webview.getWebContentsId()).executeJavaScript(`
|
||||||
responsivelyApp.deviceId = ${this.props.device.id};
|
responsivelyApp.deviceId = ${this.props.device.id};
|
||||||
document.body.addEventListener('mouseleave', () => {
|
document.body.addEventListener('mouseleave', () => {
|
||||||
window.responsivelyApp.mouseOn = false;
|
window.responsivelyApp.mouseOn = false;
|
||||||
|
@ -393,8 +399,8 @@ class WebView extends Component {
|
||||||
this.webviewRef.current
|
this.webviewRef.current
|
||||||
.getWebContents()
|
.getWebContents()
|
||||||
.setDevToolsWebContents(devtools.webContents);
|
.setDevToolsWebContents(devtools.webContents);
|
||||||
this.webviewRef.current.getWebContents().openDevTools({mode: 'detach'});*/
|
this.getWebContents().openDevTools({mode: 'detach'});*/
|
||||||
this.webviewRef.current.getWebContents().toggleDevTools();
|
this.getWebContents().toggleDevTools();
|
||||||
};
|
};
|
||||||
|
|
||||||
_flipOrientation = () => {
|
_flipOrientation = () => {
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
// @flow
|
// @flow
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {shell} from 'electron';
|
import {shell, remote} from 'electron';
|
||||||
import {toast} from 'react-toastify';
|
import {toast} from 'react-toastify';
|
||||||
import NotificationMessage from '../NotificationMessage';
|
import NotificationMessage from '../NotificationMessage';
|
||||||
import _mergeImg from 'merge-img';
|
import _mergeImg from 'merge-img';
|
||||||
|
@ -160,7 +160,9 @@ const _delay = ms =>
|
||||||
});
|
});
|
||||||
|
|
||||||
const _takeSnapshot = (webView, options) => {
|
const _takeSnapshot = (webView, options) => {
|
||||||
return webView.getWebContents().capturePage(options);
|
return remote.webContents
|
||||||
|
.fromId(webView.getWebContentsId())
|
||||||
|
.capturePage(options);
|
||||||
};
|
};
|
||||||
|
|
||||||
function _getScreenshotFileName(
|
function _getScreenshotFileName(
|
||||||
|
|
|
@ -18,6 +18,11 @@ import log from 'electron-log';
|
||||||
import MenuBuilder from './menu';
|
import MenuBuilder from './menu';
|
||||||
import {USER_PREFERENCES} from './constants/settingKeys';
|
import {USER_PREFERENCES} from './constants/settingKeys';
|
||||||
import * as Sentry from '@sentry/electron';
|
import * as Sentry from '@sentry/electron';
|
||||||
|
import installExtension, {
|
||||||
|
REACT_DEVELOPER_TOOLS,
|
||||||
|
REDUX_DEVTOOLS,
|
||||||
|
} from 'electron-devtools-installer';
|
||||||
|
import devtron from 'devtron';
|
||||||
|
|
||||||
const path = require('path');
|
const path = require('path');
|
||||||
|
|
||||||
|
@ -52,13 +57,14 @@ if (
|
||||||
}
|
}
|
||||||
|
|
||||||
const installExtensions = async () => {
|
const installExtensions = async () => {
|
||||||
const installer = require('electron-devtools-installer');
|
|
||||||
const forceDownload = !!process.env.UPGRADE_EXTENSIONS;
|
const forceDownload = !!process.env.UPGRADE_EXTENSIONS;
|
||||||
const extensions = ['REACT_DEVELOPER_TOOLS', 'REDUX_DEVTOOLS'];
|
const extensions = [REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS];
|
||||||
|
try {
|
||||||
return Promise.all(
|
const statuses = await installExtension(extensions);
|
||||||
extensions.map(name => installer.default(installer[name], forceDownload))
|
devtron.install();
|
||||||
).catch(console.log);
|
} catch (err) {
|
||||||
|
console.log('Error installing extensions', err);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -113,6 +119,7 @@ const createWindow = async () => {
|
||||||
nodeIntegration: true,
|
nodeIntegration: true,
|
||||||
nodeIntegrationInWorker: true,
|
nodeIntegrationInWorker: true,
|
||||||
webviewTag: true,
|
webviewTag: true,
|
||||||
|
enableRemoteModule: true,
|
||||||
},
|
},
|
||||||
titleBarStyle: 'hidden',
|
titleBarStyle: 'hidden',
|
||||||
icon: iconPath,
|
icon: iconPath,
|
||||||
|
|
|
@ -10,7 +10,6 @@ import AndroidIcon from '@material-ui/icons/Android';
|
||||||
|
|
||||||
export const getDeviceIcon = deviceType => {
|
export const getDeviceIcon = deviceType => {
|
||||||
const iconProps = {
|
const iconProps = {
|
||||||
color: iconsColor,
|
|
||||||
style: {fontSize: 'inherit', paddingRight: 2},
|
style: {fontSize: 'inherit', paddingRight: 2},
|
||||||
};
|
};
|
||||||
switch (deviceType) {
|
switch (deviceType) {
|
||||||
|
|
|
@ -29,6 +29,7 @@ module.exports = api => {
|
||||||
targets: {
|
targets: {
|
||||||
electron: require('electron/package.json').version,
|
electron: require('electron/package.json').version,
|
||||||
},
|
},
|
||||||
|
corejs: '2',
|
||||||
useBuiltIns: 'usage',
|
useBuiltIns: 'usage',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
|
|
@ -26,7 +26,7 @@
|
||||||
"publish-mac": "yarn build && electron-builder build --mac --publish always",
|
"publish-mac": "yarn build && electron-builder build --mac --publish always",
|
||||||
"package-win": "yarn build && electron-builder build --win --x64",
|
"package-win": "yarn build && electron-builder build --win --x64",
|
||||||
"publish-win": "yarn build && electron-builder build --win --x64 --publish always",
|
"publish-win": "yarn build && electron-builder build --win --x64 --publish always",
|
||||||
"postinstall": "electron-builder install-app-deps package.json && yarn build-dll && opencollective-postinstall",
|
"postinstall": "electron-builder install-app-deps && yarn build-dll",
|
||||||
"postlint-fix": "prettier --ignore-path .eslintignore --single-quote --write '**/*.{*{js,jsx,json},babelrc,eslintrc,prettierrc,stylelintrc}'",
|
"postlint-fix": "prettier --ignore-path .eslintignore --single-quote --write '**/*.{*{js,jsx,json},babelrc,eslintrc,prettierrc,stylelintrc}'",
|
||||||
"postlint-styles-fix": "prettier --ignore-path .eslintignore --single-quote --write '**/*.{css,scss}'",
|
"postlint-styles-fix": "prettier --ignore-path .eslintignore --single-quote --write '**/*.{css,scss}'",
|
||||||
"precommit": "#lint-staged",
|
"precommit": "#lint-staged",
|
||||||
|
@ -191,9 +191,9 @@
|
||||||
"cross-spawn": "^6.0.5",
|
"cross-spawn": "^6.0.5",
|
||||||
"css-loader": "^1.0.1",
|
"css-loader": "^1.0.1",
|
||||||
"detect-port": "^1.3.0",
|
"detect-port": "^1.3.0",
|
||||||
"electron": "^6.0.1",
|
"electron": "^8.3.0",
|
||||||
"electron-builder": "^22.2.0",
|
"electron-builder": "^22.6.1",
|
||||||
"electron-devtools-installer": "^2.2.4",
|
"electron-devtools-installer": "^3.0.0",
|
||||||
"enzyme": "^3.7.0",
|
"enzyme": "^3.7.0",
|
||||||
"enzyme-adapter-react-16": "^1.7.0",
|
"enzyme-adapter-react-16": "^1.7.0",
|
||||||
"enzyme-to-json": "^3.3.4",
|
"enzyme-to-json": "^3.3.4",
|
||||||
|
@ -252,21 +252,21 @@
|
||||||
"@material-ui/core": "^4.3.2",
|
"@material-ui/core": "^4.3.2",
|
||||||
"@material-ui/icons": "^4.2.1",
|
"@material-ui/icons": "^4.2.1",
|
||||||
"@material-ui/lab": "^4.0.0-alpha.26",
|
"@material-ui/lab": "^4.0.0-alpha.26",
|
||||||
"@sentry/electron": "^0.17.3",
|
"@sentry/electron": "^1.3.0",
|
||||||
"bluebird": "^3.5.5",
|
"bluebird": "^3.5.5",
|
||||||
"classnames": "^2.2.6",
|
"classnames": "^2.2.6",
|
||||||
|
"core-js": "2",
|
||||||
"devtron": "^1.4.0",
|
"devtron": "^1.4.0",
|
||||||
"dotenv": "^8.1.0",
|
"dotenv": "^8.1.0",
|
||||||
"electron-cookies": "heap/electron-cookies",
|
"electron-cookies": "heap/electron-cookies",
|
||||||
"electron-debug": "^3.0.1",
|
"electron-debug": "^3.1.0",
|
||||||
"electron-log": "^3.0.7",
|
"electron-log": "^4.2.0",
|
||||||
"electron-notarize": "^0.2.1",
|
"electron-notarize": "^0.3.0",
|
||||||
"electron-settings": "^3.2.0",
|
"electron-settings": "^3.2.0",
|
||||||
"electron-updater": "^4.1.2",
|
"electron-updater": "^4.3.1",
|
||||||
"flwww": "^2.0.10",
|
"flwww": "^2.0.10",
|
||||||
"history": "^4.7.2",
|
"history": "^4.7.2",
|
||||||
"isomorphic-ws": "^4.0.1",
|
"jimp": "^0.12.1",
|
||||||
"jimp": "^0.8.4",
|
|
||||||
"merge-img": "^2.1.3",
|
"merge-img": "^2.1.3",
|
||||||
"promise-worker": "^2.0.1",
|
"promise-worker": "^2.0.1",
|
||||||
"pubsub.js": "^1.5.2",
|
"pubsub.js": "^1.5.2",
|
||||||
|
@ -277,22 +277,20 @@
|
||||||
"react-redux": "^7.1.0",
|
"react-redux": "^7.1.0",
|
||||||
"react-router": "^5.0.1",
|
"react-router": "^5.0.1",
|
||||||
"react-router-dom": "^5.0.1",
|
"react-router-dom": "^5.0.1",
|
||||||
"react-select": "^3.0.4",
|
"react-select": "^3.1.0",
|
||||||
"react-switch": "^5.0.1",
|
"react-switch": "^5.0.1",
|
||||||
"react-tabs": "^3.0.0",
|
"react-tabs": "^3.0.0",
|
||||||
"react-toastify": "^5.3.2",
|
"react-toastify": "^5.3.2",
|
||||||
"redux": "^4.0.4",
|
"redux": "^4.0.4",
|
||||||
"redux-thunk": "^2.3.0",
|
"redux-thunk": "^2.3.0",
|
||||||
"socket.io-client": "^2.2.0",
|
"source-map-support": "^0.5.9"
|
||||||
"source-map-support": "^0.5.9",
|
|
||||||
"ws": "^7.1.2"
|
|
||||||
},
|
},
|
||||||
"devEngines": {
|
"devEngines": {
|
||||||
"node": ">=7.x",
|
"node": ">=7.x",
|
||||||
"npm": ">=4.x",
|
"npm": ">=4.x",
|
||||||
"yarn": ">=0.21.3"
|
"yarn": ">=0.21.3"
|
||||||
},
|
},
|
||||||
"browserslist": "electron 1.6",
|
"browserslist": "electron 9.0.0",
|
||||||
"resolutions": {
|
"resolutions": {
|
||||||
"node-gyp": "^6.1.0",
|
"node-gyp": "^6.1.0",
|
||||||
"node-pre-gyp": "^0.14.0"
|
"node-pre-gyp": "^0.14.0"
|
||||||
|
|
12990
desktop-app/yarn.lock
12990
desktop-app/yarn.lock
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue