Node.js 12.x + Electron 9x

.gitpod.dockerfile

@@ -8,13 +8,12 @@ RUN sudo apt-get update \
     # window manager
     && sudo apt-get install -y jwm \
     # electron
-    && sudo apt-get install -y libgtk-3-0 libnss3 libasound2 \
+    && sudo apt-get install -y libgtk-3-0 libnss3 libasound2 libgbm1 \
     # native-keymap
     && sudo apt-get install -y libx11-dev libxkbfile-dev \
     && sudo rm -rf /var/lib/apt/lists/*
 
-# Pin Node.js to v10.
-ENV NODE_VERSION="10.21.0"
+ENV NODE_VERSION="12.14.1"
 RUN bash -c ". .nvm/nvm.sh \
     && nvm install $NODE_VERSION \
     && nvm use $NODE_VERSION \

.travis.yml

@@ -1,6 +1,8 @@
 sudo: required
 language: node_js
-node_js: "10"
+node_js:
+- 10
+- 12
 git:
   depth: 1
 cache:

CHANGELOG.md

@@ -4,6 +4,7 @@
 
 - [core] fixed handling of environment variables on Windows [#7973](https://github.com/eclipse-theia/theia/pull/7973)
 - [plugin-ext] fix file-icon incorrectly displays name icon with a dot in name [#7680](https://github.com/eclipse-theia/theia/pull/7680)
+- [core] Added support for Node.js `12.x`. From now on, you can use Node.js `12.x` to build Theia from the sources. The recommended minimum version is aligned with `electron`: Node.js `12.14.1`. The support for Node.js `10.x` will be dropped in one of the forthcoming releases. [#7968](https://github.com/eclipse-theia/theia/pull/7968)
 
 Breaking Changes:
 

dev-packages/application-manager/package.json

@@ -28,10 +28,10 @@
     "test": "theiaext test"
   },
   "dependencies": {
-    "@babel/core": "^7.5.5",
-    "@babel/plugin-transform-classes": "^7.5.5",
-    "@babel/plugin-transform-runtime": "^7.5.5",
-    "@babel/preset-env": "^7.5.5",
+    "@babel/core": "^7.10.0",
+    "@babel/plugin-transform-classes": "^7.10.0",
+    "@babel/plugin-transform-runtime": "^7.10.0",
+    "@babel/preset-env": "^7.10.0",
     "@theia/application-package": "^1.3.0",
     "@theia/compression-webpack-plugin": "^3.0.0",
     "@types/fs-extra": "^4.0.2",

dev-packages/application-manager/src/generator/frontend-generator.ts

@@ -170,7 +170,7 @@ app.on('ready', () => {
 
     // Remove the default electron menus, waiting for the application to set its own.
     Menu.setApplicationMenu(Menu.buildFromTemplate([{
-        role: 'help', submenu: [{ role: 'toggledevtools'}]
+        role: 'help', submenu: [{ role: 'toggleDevTools' }]
     }]));
 
     function createNewWindow(theUrl) {
@@ -206,7 +206,10 @@ app.on('ready', () => {
             x: windowState.x,
             y: windowState.y,
             isMaximized: windowState.isMaximized,
-            ...windowOptionsAdditions
+            ...windowOptionsAdditions,
+            webPreferences: {
+                nodeIntegration: true
+            }
         };
 
         // Always hide the window, we will show the window when it is ready to be shown in any case.
@@ -263,16 +266,15 @@ app.on('ready', () => {
         newWindow.on('move', saveWindowStateDelayed);
 
         // Fired when a beforeunload handler tries to prevent the page unloading
-        newWindow.webContents.on('will-prevent-unload', event => {
-            const preventStop = 0 !== dialog.showMessageBox(newWindow, {
+        newWindow.webContents.on('will-prevent-unload', async event => {
+            const { response } = await dialog.showMessageBox(newWindow, {
                 type: 'question',
                 buttons: ['Yes', 'No'],
                 title: 'Confirm',
                 message: 'Are you sure you want to quit?',
                 detail: 'Any unsaved changes will not be saved.'
             });
-
-            if (!preventStop) {
+            if (response === 0) { // 'Yes'
                 // This ignores the beforeunload callback, allowing the page to unload
                 event.preventDefault();
             }
@@ -330,22 +332,14 @@ app.on('ready', () => {
         })
     }
 
-    const setElectronSecurityToken = port => {
-        return new Promise((resolve, reject) => {
-            electron.session.defaultSession.cookies.set({
-                url: \`http://localhost:\${port}/\`,
-                name: ElectronSecurityToken,
-                value: JSON.stringify(electronSecurityToken),
-                httpOnly: true,
-            }, error => {
-                if (error) {
-                    reject(error);
-                } else {
-                    resolve();
-                }
-            });
-        })
-    }
+    const setElectronSecurityToken = async port => {
+        await electron.session.defaultSession.cookies.set({
+            url: \`http://localhost:\${port}/\`,
+            name: ElectronSecurityToken,
+            value: JSON.stringify(electronSecurityToken),
+            httpOnly: true
+        });
+    };
 
     const loadMainWindow = port => {
         if (!mainWindow.isDestroyed()) {

dev-packages/application-manager/src/generator/webpack-generator.ts

@@ -49,7 +49,7 @@ export class WebpackGenerator extends AbstractGenerator {
 
     protected compileWebpackConfig(): string {
         return `/**
- * Don't touch this file. It will be renerated by theia build.
+ * Don't touch this file. It will be regenerated by theia build.
  * To customize webpack configuration change ${this.configPath}
  */
 // @ts-check

dev-packages/electron/package.json

@@ -20,11 +20,11 @@
     "electron-replace-ffmpeg": "electron-replace-ffmpeg.js"
   },
   "dependencies": {
-    "electron": "^4.2.11",
+    "electron": "^9.0.2",
     "electron-download": "^4.1.1",
-    "electron-store": "^2.0.0",
-    "fix-path": "^2.1.0",
-    "native-keymap": "^1.2.5",
+    "electron-store": "^5.1.1",
+    "fix-path": "^3.0.0",
+    "native-keymap": "^2.1.2",
     "node-gyp": "^3.6.0",
     "unzipper": "^0.9.11",
     "yargs": "^11.1.0"

package.json

@@ -4,10 +4,11 @@
   "version": "0.0.0",
   "engines": {
     "yarn": "1.0.x || >=1.2.1",
-    "node": ">=10.11.0 <12"
+    "node": ">=10.11.0 <13"
   },
   "resolutions": {
-    "**/@types/node": "~10.3.6"
+    "**/@types/node": "~10.3.6",
+    "**/node-abi": "^2.18.0"
   },
   "devDependencies": {
     "@types/chai-string": "^1.4.0",

packages/core/package.json

@@ -5,7 +5,7 @@
   "main": "lib/common/index.js",
   "typings": "lib/common/index.d.ts",
   "dependencies": {
-    "@babel/runtime": "^7.5.5",
+    "@babel/runtime": "^7.10.0",
     "@phosphor/widgets": "^1.9.3",
     "@primer/octicons-react": "^9.0.0",
     "@theia/application-package": "^1.3.0",

packages/core/src/electron-browser/keyboard/electron-keyboard-layout-change-notifier.ts

@@ -34,8 +34,7 @@ export class ElectronKeyboardLayoutChangeNotifier implements KeyboardLayoutChang
 
     @postConstruct()
     protected initialize(): void {
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ipcRenderer.on('keyboardLayoutChanged', (event: Event<any>, newLayout: NativeKeyboardLayout) => this.nativeLayoutChanged.fire(newLayout));
+        ipcRenderer.on('keyboardLayoutChanged', (event: Electron.IpcRendererEvent, newLayout: NativeKeyboardLayout) => this.nativeLayoutChanged.fire(newLayout));
     }
 
 }

packages/core/src/electron-browser/menu/electron-main-menu-factory.ts

@@ -237,7 +237,7 @@ export class ElectronMainMenuFactory {
                     role: 'hide'
                 },
                 {
-                    role: 'hideothers'
+                    role: 'hideOthers'
                 },
                 {
                     role: 'unhide'

packages/core/src/electron-browser/menu/electron-menu-contribution.ts

@@ -154,17 +154,13 @@ export class ElectronMenuContribution implements FrontendApplicationContribution
         registry.registerCommand(ElectronCommands.ZOOM_IN, {
             execute: () => {
                 const webContents = currentWindow.webContents;
-                webContents.getZoomLevel(zoomLevel =>
-                    webContents.setZoomLevel(zoomLevel + 0.5)
-                );
+                webContents.setZoomLevel(webContents.zoomLevel + 0.5);
             }
         });
         registry.registerCommand(ElectronCommands.ZOOM_OUT, {
             execute: () => {
                 const webContents = currentWindow.webContents;
-                webContents.getZoomLevel(zoomLevel =>
-                    webContents.setZoomLevel(zoomLevel - 0.5)
-                );
+                webContents.setZoomLevel(webContents.zoomLevel - 0.5);
             }
         });
         registry.registerCommand(ElectronCommands.RESET_ZOOM, {

packages/filesystem/src/electron-browser/file-dialog/electron-file-dialog-service.ts

@@ -24,10 +24,10 @@ import { FileStat } from '../../common';
 import { FileAccess } from '../../common/filesystem';
 import { DefaultFileDialogService, OpenFileDialogProps, SaveFileDialogProps } from '../../browser/file-dialog';
 
-// See https://github.com/electron/electron/blob/v4.2.12/docs/api/dialog.md
+// See https://github.com/electron/electron/blob/v9.0.2/docs/api/dialog.md
 // These properties get extended with newer versions of Electron
 type DialogProperties = 'openFile' | 'openDirectory' | 'multiSelections' | 'showHiddenFiles' |
-    'createDirectory' | 'promptToCreate' | 'noResolveAliases' | 'treatPackageAsDirectory';
+    'createDirectory' | 'promptToCreate' | 'noResolveAliases' | 'treatPackageAsDirectory' | 'dontAddToRecent';
 
 //
 // We are OK to use this here because the electron backend and frontend are on the same host.
@@ -47,44 +47,35 @@ export class ElectronFileDialogService extends DefaultFileDialogService {
     async showOpenDialog(props: OpenFileDialogProps, folder?: FileStat): Promise<MaybeArray<URI> | undefined> {
         const rootNode = await this.getRootNode(folder);
         if (rootNode) {
-            return new Promise<MaybeArray<URI> | undefined>(resolve => {
-                remote.dialog.showOpenDialog(this.toOpenDialogOptions(rootNode.uri, props), async (filePaths: string[] | undefined) => {
-                    if (!filePaths || filePaths.length === 0) {
-                        resolve(undefined);
-                        return;
-                    }
-
-                    const uris = filePaths.map(path => FileUri.create(path));
-                    const canAccess = await this.canReadWrite(uris);
-                    const result = canAccess ? uris.length === 1 ? uris[0] : uris : undefined;
-                    resolve(result);
-                });
-            });
+            const { filePaths } = await remote.dialog.showOpenDialog(this.toOpenDialogOptions(rootNode.uri, props));
+            if (filePaths.length === 0) {
+                return undefined;
+            }
+
+            const uris = filePaths.map(path => FileUri.create(path));
+            const canAccess = await this.canReadWrite(uris);
+            const result = canAccess ? uris.length === 1 ? uris[0] : uris : undefined;
+            return result;
         }
         return undefined;
     }
 
     async showSaveDialog(props: SaveFileDialogProps, folder?: FileStat): Promise<URI | undefined> {
         const rootNode = await this.getRootNode(folder);
         if (rootNode) {
-            return new Promise<URI | undefined>(resolve => {
-                remote.dialog.showSaveDialog(this.toSaveDialogOptions(rootNode.uri, props), async (filename: string | undefined) => {
-                    if (!filename) {
-                        resolve(undefined);
-                        return;
-                    }
-
-                    const uri = FileUri.create(filename);
-                    const exists = await this.fileSystem.exists(uri.toString());
-                    if (!exists) {
-                        resolve(uri);
-                        return;
-                    }
-
-                    const canAccess = await this.canReadWrite(uri);
-                    resolve(canAccess ? uri : undefined);
-                });
-            });
+            const { filePath } = await remote.dialog.showSaveDialog(this.toSaveDialogOptions(rootNode.uri, props));
+            if (!filePath) {
+                return undefined;
+            }
+
+            const uri = FileUri.create(filePath);
+            const exists = await this.fileSystem.exists(uri.toString());
+            if (!exists) {
+                return uri;
+            }
+
+            const canAccess = await this.canReadWrite(uri);
+            return canAccess ? uri : undefined;
         }
         return undefined;
     }

packages/git/package.json

@@ -14,8 +14,8 @@
     "@types/diff": "^3.2.2",
     "@types/p-queue": "^2.3.1",
     "diff": "^3.4.0",
-    "dugite-extra": "0.1.12",
-    "find-git-exec": "^0.0.2",
+    "dugite-extra": "0.1.14",
+    "find-git-exec": "^0.0.3",
     "find-git-repositories": "^0.1.1",
     "moment": "2.24.0",
     "octicons": "^7.1.0",

packages/plugin-ext/src/main/electron-browser/webview/electron-webview-widget-factory.ts

@@ -32,20 +32,12 @@ export class ElectronWebviewWidgetFactory extends WebviewWidgetFactory {
      *
      * @param endpoint cookie's target url
      */
-    protected attachElectronSecurityCookie(endpoint: string): Promise<void> {
-        return new Promise((resolve, reject) => {
-            remote.session.defaultSession!.cookies.set({
-                url: endpoint,
-                name: ElectronSecurityToken,
-                value: JSON.stringify(this.container.get(ElectronSecurityToken)),
-                httpOnly: true,
-            }, error => {
-                if (error) {
-                    reject(error);
-                } else {
-                    resolve();
-                }
-            });
+    protected async attachElectronSecurityCookie(endpoint: string): Promise<void> {
+        await remote.session.defaultSession!.cookies.set({
+            url: endpoint,
+            name: ElectronSecurityToken,
+            value: JSON.stringify(this.container.get(ElectronSecurityToken)),
+            httpOnly: true
         });
     }