From c2ad65e7bca6598dc813fe2fe58b466070e3d19c Mon Sep 17 00:00:00 2001 From: Benjamin Pasero Date: Fri, 27 Sep 2024 15:19:34 +0200 Subject: [PATCH] esm - convert window related helpers to TS --- .eslintrc.json | 2 +- ...ootstrap-window.js => bootstrap-window.ts} | 263 ++++++++---------- src/server-main.ts | 2 +- src/tsconfig.json | 8 +- src/tsec.exemptions.json | 4 +- .../parts/sandbox/electron-sandbox/preload.ts | 14 +- .../processExplorer/processExplorer.js | 47 ---- .../processExplorer/processExplorer.ts | 24 ++ .../workbench/{workbench.js => workbench.ts} | 191 ++++++------- .../window/electron-sandbox/window.ts | 24 ++ .../issue/electron-sandbox/issueReporter.js | 50 ---- .../issue/electron-sandbox/issueReporter.ts | 25 ++ 12 files changed, 290 insertions(+), 364 deletions(-) rename src/{bootstrap-window.js => bootstrap-window.ts} (72%) delete mode 100644 src/vs/code/electron-sandbox/processExplorer/processExplorer.js create mode 100644 src/vs/code/electron-sandbox/processExplorer/processExplorer.ts rename src/vs/code/electron-sandbox/workbench/{workbench.js => workbench.ts} (69%) delete mode 100644 src/vs/workbench/contrib/issue/electron-sandbox/issueReporter.js create mode 100644 src/vs/workbench/contrib/issue/electron-sandbox/issueReporter.ts diff --git a/.eslintrc.json b/.eslintrc.json index 8e7e412b53e93..e5294d9351cd3 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -1133,7 +1133,7 @@ "restrictions": [] }, { - "target": "src/{bootstrap-cli.ts,bootstrap-esm.ts,bootstrap-fork.ts,bootstrap-node.ts,bootstrap-import.ts,bootstrap-meta.ts,bootstrap-window.js,cli.ts,main.ts,server-cli.ts,server-main.ts,bootstrap-server.ts}", + "target": "src/{bootstrap-cli.ts,bootstrap-esm.ts,bootstrap-fork.ts,bootstrap-node.ts,bootstrap-import.ts,bootstrap-meta.ts,bootstrap-window.ts,cli.ts,main.ts,server-cli.ts,server-main.ts,bootstrap-server.ts}", "restrictions": [] } ] diff --git a/src/bootstrap-window.js b/src/bootstrap-window.ts similarity index 72% rename from src/bootstrap-window.js rename to src/bootstrap-window.ts index 80c56f0440f03..7719d77469c28 100644 --- a/src/bootstrap-window.js +++ b/src/bootstrap-window.ts @@ -3,133 +3,44 @@ * Licensed under the MIT License. See License.txt in the project root for license information. *--------------------------------------------------------------------------------------------*/ -//@ts-check -'use strict'; +/* eslint-disable no-restricted-globals */ -/** - * @import { ISandboxConfiguration } from './vs/base/parts/sandbox/common/sandboxTypes' - * @typedef {any} LoaderConfig - */ +(function () { -/* eslint-disable no-restricted-globals */ + type ISandboxConfiguration = import('vs/base/parts/sandbox/common/sandboxTypes.js').ISandboxConfiguration; + type ILoadOptions = import('vs/platform/window/electron-sandbox/window.js').ILoadOptions; + type PreloadGlobals = typeof import('./vs/base/parts/sandbox/electron-sandbox/globals.js'); -(function (factory) { - // @ts-ignore - globalThis.MonacoBootstrapWindow = factory(); -}(function () { - const preloadGlobals = sandboxGlobals(); + // @ts-ignore (defined in preload.ts) + const preloadGlobals: PreloadGlobals = window.vscode; const safeProcess = preloadGlobals.process; // increase number of stack frames(from 10, https://github.com/v8/v8/wiki/Stack-Trace-API) Error.stackTraceLimit = 100; - /** - * @param {string} esModule - * @param {(result: unknown, configuration: ISandboxConfiguration) => Promise | undefined} resultCallback - * @param {{ - * configureDeveloperSettings?: (config: ISandboxConfiguration) => { - * forceDisableShowDevtoolsOnError?: boolean, - * forceEnableDeveloperKeybindings?: boolean, - * disallowReloadKeybinding?: boolean, - * removeDeveloperKeybindingsAfterLoad?: boolean - * }, - * canModifyDOM?: (config: ISandboxConfiguration) => void, - * beforeImport?: (config: ISandboxConfiguration) => void - * }} [options] - */ - async function load(esModule, resultCallback, options) { - - // Await window configuration from preload - const timeout = setTimeout(() => { console.error(`[resolve window config] Could not resolve window configuration within 10 seconds, but will continue to wait...`); }, 10000); - performance.mark('code/willWaitForWindowConfig'); - /** @type {ISandboxConfiguration} */ - const configuration = await preloadGlobals.context.resolveConfiguration(); - performance.mark('code/didWaitForWindowConfig'); - clearTimeout(timeout); - - // Signal DOM modifications are now OK - if (typeof options?.canModifyDOM === 'function') { - options.canModifyDOM(configuration); - } + async function load(esModule: string, resultCallback: (result: any, configuration: T) => Promise | undefined, options: ILoadOptions): Promise { - // Developer settings - const { - forceEnableDeveloperKeybindings, - disallowReloadKeybinding, - removeDeveloperKeybindingsAfterLoad - } = typeof options?.configureDeveloperSettings === 'function' ? options.configureDeveloperSettings(configuration) : { - forceEnableDeveloperKeybindings: false, - disallowReloadKeybinding: false, - removeDeveloperKeybindingsAfterLoad: false - }; - const isDev = !!safeProcess.env['VSCODE_DEV']; - const enableDeveloperKeybindings = isDev || forceEnableDeveloperKeybindings; - let developerDeveloperKeybindingsDisposable = undefined; - if (enableDeveloperKeybindings) { - developerDeveloperKeybindingsDisposable = registerDeveloperKeybindings(disallowReloadKeybinding); - } + // Window Configuration from Preload Script + const configuration = await resolveWindowConfiguration(); - globalThis._VSCODE_NLS_MESSAGES = configuration.nls.messages; - globalThis._VSCODE_NLS_LANGUAGE = configuration.nls.language; - let language = configuration.nls.language || 'en'; - if (language === 'zh-tw') { - language = 'zh-Hant'; - } else if (language === 'zh-cn') { - language = 'zh-Hans'; - } + // Signal can modify DOM + options?.canModifyDOM?.(configuration); - window.document.documentElement.setAttribute('lang', language); + // Developer settings + const { enableDeveloperKeybindings, removeDeveloperKeybindingsAfterLoad, developerDeveloperKeybindingsDisposable } = setupDeveloperKeybindings(configuration, options); - window['MonacoEnvironment'] = {}; + // NLS + setupNLS(configuration); // Signal before import() - if (typeof options?.beforeImport === 'function') { - options.beforeImport(configuration); - } + options?.beforeImport?.(configuration); + // Compute base URL and set as global const baseUrl = new URL(`${fileUriFromPath(configuration.appRoot, { isWindows: safeProcess.platform === 'win32', scheme: 'vscode-file', fallbackAuthority: 'vscode-app' })}/out/`); globalThis._VSCODE_FILE_ROOT = baseUrl.toString(); - // DEV --------------------------------------------------------------------------------------- - // DEV: This is for development and enables loading CSS via import-statements via import-maps. - // DEV: For each CSS modules that we have we defined an entry in the import map that maps to - // DEV: a blob URL that loads the CSS via a dynamic @import-rule. - // DEV --------------------------------------------------------------------------------------- - if (Array.isArray(configuration.cssModules) && configuration.cssModules.length > 0) { - performance.mark('code/willAddCssLoader'); - - const style = document.createElement('style'); - style.type = 'text/css'; - style.media = 'screen'; - style.id = 'vscode-css-loading'; - document.head.appendChild(style); - - globalThis._VSCODE_CSS_LOAD = function (url) { - style.textContent += `@import url(${url});\n`; - }; - - /** - * @type { { imports: Record }} - */ - const importMap = { imports: {} }; - for (const cssModule of configuration.cssModules) { - const cssUrl = new URL(cssModule, baseUrl).href; - const jsSrc = `globalThis._VSCODE_CSS_LOAD('${cssUrl}');\n`; - const blob = new Blob([jsSrc], { type: 'application/javascript' }); - importMap.imports[cssUrl] = URL.createObjectURL(blob); - } - - const ttp = window.trustedTypes?.createPolicy('vscode-bootstrapImportMap', { createScript(value) { return value; }, }); - const importMapSrc = JSON.stringify(importMap, undefined, 2); - const importMapScript = document.createElement('script'); - importMapScript.type = 'importmap'; - importMapScript.setAttribute('nonce', '0c6a828f1297'); - // @ts-ignore - importMapScript.textContent = ttp?.createScript(importMapSrc) ?? importMapSrc; - document.head.appendChild(importMapScript); - - performance.mark('code/didAddCssLoader'); - } + // Dev only: CSS import map tricks + setupCSSImportMaps(configuration, baseUrl); // ESM Import try { @@ -148,18 +59,48 @@ } } - /** - * @param {boolean | undefined} disallowReloadKeybinding - * @returns {() => void} - */ - function registerDeveloperKeybindings(disallowReloadKeybinding) { + async function resolveWindowConfiguration() { + const timeout = setTimeout(() => { console.error(`[resolve window config] Could not resolve window configuration within 10 seconds, but will continue to wait...`); }, 10000); + performance.mark('code/willWaitForWindowConfig'); + + const configuration = await preloadGlobals.context.resolveConfiguration() as T; + performance.mark('code/didWaitForWindowConfig'); + + clearTimeout(timeout); + + return configuration; + } + + function setupDeveloperKeybindings(configuration: T, options: ILoadOptions) { + const { + forceEnableDeveloperKeybindings, + disallowReloadKeybinding, + removeDeveloperKeybindingsAfterLoad + } = typeof options?.configureDeveloperSettings === 'function' ? options.configureDeveloperSettings(configuration) : { + forceEnableDeveloperKeybindings: false, + disallowReloadKeybinding: false, + removeDeveloperKeybindingsAfterLoad: false + }; + + const isDev = !!safeProcess.env['VSCODE_DEV']; + const enableDeveloperKeybindings = Boolean(isDev || forceEnableDeveloperKeybindings); + let developerDeveloperKeybindingsDisposable: Function | undefined = undefined; + if (enableDeveloperKeybindings) { + developerDeveloperKeybindingsDisposable = registerDeveloperKeybindings(disallowReloadKeybinding); + } + + return { + enableDeveloperKeybindings, + removeDeveloperKeybindingsAfterLoad, + developerDeveloperKeybindingsDisposable + }; + } + + function registerDeveloperKeybindings(disallowReloadKeybinding: boolean | undefined): Function { const ipcRenderer = preloadGlobals.ipcRenderer; const extractKey = - /** - * @param {KeyboardEvent} e - */ - function (e) { + function (e: KeyboardEvent) { return [ e.ctrlKey ? 'ctrl-' : '', e.metaKey ? 'meta-' : '', @@ -174,8 +115,7 @@ const TOGGLE_DEV_TOOLS_KB_ALT = '123'; // F12 const RELOAD_KB = (safeProcess.platform === 'darwin' ? 'meta-82' : 'ctrl-82'); // mac: Cmd-R, rest: Ctrl-R - /** @type {((e: KeyboardEvent) => void) | undefined} */ - let listener = function (e) { + let listener: ((e: KeyboardEvent) => void) | undefined = function (e) { const key = extractKey(e); if (key === TOGGLE_DEV_TOOLS_KB || key === TOGGLE_DEV_TOOLS_KB_ALT) { ipcRenderer.send('vscode:toggleDevTools'); @@ -194,11 +134,21 @@ }; } - /** - * @param {string | Error} error - * @param {boolean} [showDevtoolsOnError] - */ - function onUnexpectedError(error, showDevtoolsOnError) { + function setupNLS(configuration: T): void { + globalThis._VSCODE_NLS_MESSAGES = configuration.nls.messages; + globalThis._VSCODE_NLS_LANGUAGE = configuration.nls.language; + + let language = configuration.nls.language || 'en'; + if (language === 'zh-tw') { + language = 'zh-Hant'; + } else if (language === 'zh-cn') { + language = 'zh-Hans'; + } + + window.document.documentElement.setAttribute('lang', language); + } + + function onUnexpectedError(error: string | Error, showDevtoolsOnError: boolean): void { if (showDevtoolsOnError) { const ipcRenderer = preloadGlobals.ipcRenderer; ipcRenderer.send('vscode:openDevTools'); @@ -211,12 +161,7 @@ } } - /** - * @param {string} path - * @param {{ isWindows?: boolean, scheme?: string, fallbackAuthority?: string }} config - * @returns {string} - */ - function fileUriFromPath(path, config) { + function fileUriFromPath(path: string, config: { isWindows?: boolean; scheme?: string; fallbackAuthority?: string }): string { // Since we are building a URI, we normalize any backslash // to slashes and we ensure that the path begins with a '/'. @@ -225,8 +170,7 @@ pathName = `/${pathName}`; } - /** @type {string} */ - let uri; + let uri: string; // Windows: in order to support UNC paths (which start with '//') // that have their own authority, we do not use the provided authority @@ -243,15 +187,48 @@ return uri.replace(/#/g, '%23'); } - /** - * @return {typeof import('./vs/base/parts/sandbox/electron-sandbox/globals')} - */ - function sandboxGlobals() { - // @ts-ignore (defined in globals.js) - return window.vscode; + function setupCSSImportMaps(configuration: T, baseUrl: URL) { + + // DEV --------------------------------------------------------------------------------------- + // DEV: This is for development and enables loading CSS via import-statements via import-maps. + // DEV: For each CSS modules that we have we defined an entry in the import map that maps to + // DEV: a blob URL that loads the CSS via a dynamic @import-rule. + // DEV --------------------------------------------------------------------------------------- + + if (Array.isArray(configuration.cssModules) && configuration.cssModules.length > 0) { + performance.mark('code/willAddCssLoader'); + + const style = document.createElement('style'); + style.type = 'text/css'; + style.media = 'screen'; + style.id = 'vscode-css-loading'; + document.head.appendChild(style); + + globalThis._VSCODE_CSS_LOAD = function (url) { + style.textContent += `@import url(${url});\n`; + }; + + const importMap: { imports: Record } = { imports: {} }; + for (const cssModule of configuration.cssModules) { + const cssUrl = new URL(cssModule, baseUrl).href; + const jsSrc = `globalThis._VSCODE_CSS_LOAD('${cssUrl}');\n`; + const blob = new Blob([jsSrc], { type: 'application/javascript' }); + importMap.imports[cssUrl] = URL.createObjectURL(blob); + } + + const ttp = window.trustedTypes?.createPolicy('vscode-bootstrapImportMap', { createScript(value) { return value; }, }); + const importMapSrc = JSON.stringify(importMap, undefined, 2); + const importMapScript = document.createElement('script'); + importMapScript.type = 'importmap'; + importMapScript.setAttribute('nonce', '0c6a828f1297'); + // @ts-ignore + importMapScript.textContent = ttp?.createScript(importMapSrc) ?? importMapSrc; + document.head.appendChild(importMapScript); + + performance.mark('code/didAddCssLoader'); + } } - return { - load - }; -})); + // @ts-ignore + globalThis.MonacoBootstrapWindow = { load }; +}()); diff --git a/src/server-main.ts b/src/server-main.ts index 79439bdfc4b1b..592f4d005e095 100644 --- a/src/server-main.ts +++ b/src/server-main.ts @@ -231,7 +231,7 @@ async function findFreePort(host: string | undefined, start: number, end: number return undefined; } -function loadCode(nlsConfiguration: INLSConfiguration): Promise { +function loadCode(nlsConfiguration: INLSConfiguration): Promise { return new Promise((resolve, reject) => { // required for `bootstrap-esm` to pick up NLS messages diff --git a/src/tsconfig.json b/src/tsconfig.json index b2d8e8d58109c..6865667ad285a 100644 --- a/src/tsconfig.json +++ b/src/tsconfig.json @@ -33,7 +33,7 @@ "./bootstrap-meta.ts", "./bootstrap-node.ts", "./bootstrap-server.ts", - "./bootstrap-window.js", + "./bootstrap-window.ts", "./cli.ts", "./main.ts", "./server-main.ts", @@ -45,9 +45,9 @@ "./vs/platform/environment/node/userDataPath.ts", "./vs/base/parts/sandbox/electron-sandbox/preload-aux.ts", "./vs/base/parts/sandbox/electron-sandbox/preload.ts", - "./vs/code/electron-sandbox/processExplorer/processExplorer.js", - "./vs/code/electron-sandbox/workbench/workbench.js", - "./vs/workbench/contrib/issue/electron-sandbox/issueReporter.js", + "./vs/code/electron-sandbox/processExplorer/processExplorer.ts", + "./vs/code/electron-sandbox/workbench/workbench.ts", + "./vs/workbench/contrib/issue/electron-sandbox/issueReporter.ts", "./typings", "./vs/**/*.ts", "vscode-dts/vscode.proposed.*.d.ts", diff --git a/src/tsec.exemptions.json b/src/tsec.exemptions.json index dd36947764048..d5e979d578a91 100644 --- a/src/tsec.exemptions.json +++ b/src/tsec.exemptions.json @@ -14,7 +14,7 @@ "vs/workbench/services/keybinding/test/node/keyboardMapperTestUtils.ts" ], "ban-trustedtypes-createpolicy": [ - "bootstrap-window.js", + "bootstrap-window.ts", "vs/amdX.ts", "vs/base/browser/trustedTypes.ts", "vs/base/worker/workerMain.ts", @@ -41,6 +41,6 @@ "**/*.ts" ], "ban-script-content-assignments": [ - "bootstrap-window.js" + "bootstrap-window.ts" ] } diff --git a/src/vs/base/parts/sandbox/electron-sandbox/preload.ts b/src/vs/base/parts/sandbox/electron-sandbox/preload.ts index 7ff977e01fef0..32fc17f14e8ff 100644 --- a/src/vs/base/parts/sandbox/electron-sandbox/preload.ts +++ b/src/vs/base/parts/sandbox/electron-sandbox/preload.ts @@ -5,12 +5,12 @@ /* eslint-disable no-restricted-globals */ -type SandboxConfiguration = import('vs/base/parts/sandbox/common/sandboxTypes').ISandboxConfiguration; - (function () { const { ipcRenderer, webFrame, contextBridge, webUtils } = require('electron'); + type ISandboxConfiguration = import('vs/base/parts/sandbox/common/sandboxTypes.js').ISandboxConfiguration; + //#region Utilities function validateIPC(channel: string): true | never { @@ -35,9 +35,9 @@ type SandboxConfiguration = import('vs/base/parts/sandbox/common/sandboxTypes'). //#region Resolve Configuration - let configuration: SandboxConfiguration | undefined = undefined; + let configuration: ISandboxConfiguration | undefined = undefined; - const resolveConfiguration: Promise = (async () => { + const resolveConfiguration: Promise = (async () => { const windowConfigIpcChannel = parseArgv('vscode-window-config'); if (!windowConfigIpcChannel) { throw new Error('Preload: did not find expected vscode-window-config in renderer process arguments list.'); @@ -47,7 +47,7 @@ type SandboxConfiguration = import('vs/base/parts/sandbox/common/sandboxTypes'). validateIPC(windowConfigIpcChannel); // Resolve configuration from electron-main - const resolvedConfiguration: SandboxConfiguration = configuration = await ipcRenderer.invoke(windowConfigIpcChannel); + const resolvedConfiguration: ISandboxConfiguration = configuration = await ipcRenderer.invoke(windowConfigIpcChannel); // Apply `userEnv` directly Object.assign(process.env, resolvedConfiguration.userEnv); @@ -234,14 +234,14 @@ type SandboxConfiguration = import('vs/base/parts/sandbox/common/sandboxTypes'). * actual value will be set after `resolveConfiguration` * has finished. */ - configuration(): SandboxConfiguration | undefined { + configuration(): ISandboxConfiguration | undefined { return configuration; }, /** * Allows to await the resolution of the configuration object. */ - async resolveConfiguration(): Promise { + async resolveConfiguration(): Promise { return resolveConfiguration; } } diff --git a/src/vs/code/electron-sandbox/processExplorer/processExplorer.js b/src/vs/code/electron-sandbox/processExplorer/processExplorer.js deleted file mode 100644 index a13045464b636..0000000000000 --- a/src/vs/code/electron-sandbox/processExplorer/processExplorer.js +++ /dev/null @@ -1,47 +0,0 @@ -/*--------------------------------------------------------------------------------------------- - * Copyright (c) Microsoft Corporation. All rights reserved. - * Licensed under the MIT License. See License.txt in the project root for license information. - *--------------------------------------------------------------------------------------------*/ - -//@ts-check -'use strict'; - -(function () { - - /** - * @import { ISandboxConfiguration } from '../../../base/parts/sandbox/common/sandboxTypes' - */ - - const bootstrapWindow = bootstrapWindowLib(); - - // Load process explorer into window - bootstrapWindow.load('vs/code/electron-sandbox/processExplorer/processExplorerMain', function (processExplorer, configuration) { - return processExplorer.startup(configuration); - }, { - configureDeveloperSettings: function () { - return { - forceEnableDeveloperKeybindings: true - }; - }, - }); - - /** - * @returns {{ - * load: ( - * esModule: string, - * resultCallback: (result: any, configuration: ISandboxConfiguration) => unknown, - * options?: { - * configureDeveloperSettings?: (config: ISandboxConfiguration) => { - * forceEnableDeveloperKeybindings?: boolean, - * disallowReloadKeybinding?: boolean, - * removeDeveloperKeybindingsAfterLoad?: boolean - * } - * } - * ) => Promise - * }} - */ - function bootstrapWindowLib() { - // @ts-ignore (defined in bootstrap-window.js) - return window.MonacoBootstrapWindow; - } -}()); diff --git a/src/vs/code/electron-sandbox/processExplorer/processExplorer.ts b/src/vs/code/electron-sandbox/processExplorer/processExplorer.ts new file mode 100644 index 0000000000000..704c2a4c5c325 --- /dev/null +++ b/src/vs/code/electron-sandbox/processExplorer/processExplorer.ts @@ -0,0 +1,24 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Microsoft Corporation. All rights reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + *--------------------------------------------------------------------------------------------*/ + +/* eslint-disable no-restricted-globals */ + +(function () { + + type IBootstrapWindow = import('vs/platform/window/electron-sandbox/window.js').IBootstrapWindow; + + // @ts-ignore (defined in bootstrap-window.js) + const bootstrapWindow: IBootstrapWindow = window.MonacoBootstrapWindow; + + bootstrapWindow.load('vs/code/electron-sandbox/processExplorer/processExplorerMain', function (processExplorer, configuration) { + return processExplorer.startup(configuration); + }, { + configureDeveloperSettings: function () { + return { + forceEnableDeveloperKeybindings: true + }; + }, + }); +}()); diff --git a/src/vs/code/electron-sandbox/workbench/workbench.js b/src/vs/code/electron-sandbox/workbench/workbench.ts similarity index 69% rename from src/vs/code/electron-sandbox/workbench/workbench.js rename to src/vs/code/electron-sandbox/workbench/workbench.ts index e8bb6c4ba4b8c..88b13b6dcaa40 100644 --- a/src/vs/code/electron-sandbox/workbench/workbench.js +++ b/src/vs/code/electron-sandbox/workbench/workbench.ts @@ -3,18 +3,19 @@ * Licensed under the MIT License. See License.txt in the project root for license information. *--------------------------------------------------------------------------------------------*/ -//@ts-check -'use strict'; +/* eslint-disable no-restricted-globals */ (function () { - /** - * @import {INativeWindowConfiguration} from '../../../platform/window/common/window' - * @import {NativeParsedArgs} from '../../../platform/environment/common/argv' - * @import {ISandboxConfiguration} from '../../../base/parts/sandbox/common/sandboxTypes' - */ + type INativeWindowConfiguration = import('vs/platform/window/common/window.ts').INativeWindowConfiguration; + type NativeParsedArgs = import('vs/platform/environment/common/argv.js').NativeParsedArgs; + type IBootstrapWindow = import('vs/platform/window/electron-sandbox/window.js').IBootstrapWindow; + type PreloadGlobals = typeof import('vs/base/parts/sandbox/electron-sandbox/globals.js'); - const bootstrapWindow = bootstrapWindowLib(); + // @ts-ignore (defined in bootstrap-window.js) + const bootstrapWindow: IBootstrapWindow = window.MonacoBootstrapWindow; + // @ts-ignore (defined in preload.ts) + const preloadGlobals: PreloadGlobals = window.vscode; // Add a perf entry right from the top performance.mark('code/didStartRenderer'); @@ -23,7 +24,7 @@ // optimization to prevent a waterfall of loading to happen, because // we know for a fact that workbench.desktop.main will depend on // the related CSS counterpart. - bootstrapWindow.load('vs/workbench/workbench.desktop.main', + bootstrapWindow.load('vs/workbench/workbench.desktop.main', function (desktopMain, configuration) { // Mark start of workbench @@ -71,33 +72,7 @@ //#region Helpers - /** - * @returns {{ - * load: ( - * esModule: string, - * resultCallback: (result: any, configuration: INativeWindowConfiguration & NativeParsedArgs) => unknown, - * options?: { - * configureDeveloperSettings?: (config: INativeWindowConfiguration & NativeParsedArgs) => { - * forceDisableShowDevtoolsOnError?: boolean, - * forceEnableDeveloperKeybindings?: boolean, - * disallowReloadKeybinding?: boolean, - * removeDeveloperKeybindingsAfterLoad?: boolean - * }, - * canModifyDOM?: (config: INativeWindowConfiguration & NativeParsedArgs) => void, - * beforeImport?: (config: ISandboxConfiguration) => void - * } - * ) => Promise - * }} - */ - function bootstrapWindowLib() { - // @ts-ignore (defined in bootstrap-window.js) - return window.MonacoBootstrapWindow; - } - - /** - * @param {INativeWindowConfiguration & NativeParsedArgs} configuration - */ - function showSplash(configuration) { + function showSplash(configuration: INativeWindowConfiguration & NativeParsedArgs) { performance.mark('code/willShowPartsSplash'); let data = configuration.partsSplash; @@ -153,19 +128,17 @@ const style = document.createElement('style'); style.className = 'initialShellColors'; - document.head.appendChild(style); + window.document.head.appendChild(style); style.textContent = `body { - background-color: ${shellBackground}; - color: ${shellForeground}; - margin: 0; - padding: 0; - }`; + background-color: ${shellBackground}; + color: ${shellForeground}; + margin: 0; + padding: 0; + }`; // set zoom level as soon as possible - // @ts-ignore - if (typeof data?.zoomLevel === 'number' && typeof globalThis.vscode?.webFrame?.setZoomLevel === 'function') { - // @ts-ignore - globalThis.vscode.webFrame.setZoomLevel(data.zoomLevel); + if (typeof data?.zoomLevel === 'number' && typeof preloadGlobals?.webFrame?.setZoomLevel === 'function') { + preloadGlobals.webFrame.setZoomLevel(data.zoomLevel); } // restore parts if possible (we might not always store layout info) @@ -178,11 +151,11 @@ if (layoutInfo.windowBorder && colorInfo.windowBorder) { splash.setAttribute('style', ` - position: relative; - height: calc(100vh - 2px); - width: calc(100vw - 2px); - border: 1px solid var(--window-border-color); - `); + position: relative; + height: calc(100vh - 2px); + width: calc(100vw - 2px); + border: 1px solid var(--window-border-color); + `); splash.style.setProperty('--window-border-color', colorInfo.windowBorder); if (layoutInfo.windowBorderRadius) { @@ -196,51 +169,51 @@ // part: title const titleDiv = document.createElement('div'); titleDiv.setAttribute('style', ` - position: absolute; - width: 100%; - height: ${layoutInfo.titleBarHeight}px; - left: 0; - top: 0; - background-color: ${colorInfo.titleBarBackground}; - -webkit-app-region: drag; - `); + position: absolute; + width: 100%; + height: ${layoutInfo.titleBarHeight}px; + left: 0; + top: 0; + background-color: ${colorInfo.titleBarBackground}; + -webkit-app-region: drag; + `); splash.appendChild(titleDiv); if (colorInfo.titleBarBorder && layoutInfo.titleBarHeight > 0) { const titleBorder = document.createElement('div'); titleBorder.setAttribute('style', ` - position: absolute; - width: 100%; - height: 1px; - left: 0; - bottom: 0; - border-bottom: 1px solid ${colorInfo.titleBarBorder}; - `); + position: absolute; + width: 100%; + height: 1px; + left: 0; + bottom: 0; + border-bottom: 1px solid ${colorInfo.titleBarBorder}; + `); titleDiv.appendChild(titleBorder); } // part: activity bar const activityDiv = document.createElement('div'); activityDiv.setAttribute('style', ` - position: absolute; - width: ${layoutInfo.activityBarWidth}px; - height: calc(100% - ${layoutInfo.titleBarHeight + layoutInfo.statusBarHeight}px); - top: ${layoutInfo.titleBarHeight}px; - ${layoutInfo.sideBarSide}: 0; - background-color: ${colorInfo.activityBarBackground}; - `); + position: absolute; + width: ${layoutInfo.activityBarWidth}px; + height: calc(100% - ${layoutInfo.titleBarHeight + layoutInfo.statusBarHeight}px); + top: ${layoutInfo.titleBarHeight}px; + ${layoutInfo.sideBarSide}: 0; + background-color: ${colorInfo.activityBarBackground}; + `); splash.appendChild(activityDiv); if (colorInfo.activityBarBorder && layoutInfo.activityBarWidth > 0) { const activityBorderDiv = document.createElement('div'); activityBorderDiv.setAttribute('style', ` - position: absolute; - width: 1px; - height: 100%; - top: 0; - ${layoutInfo.sideBarSide === 'left' ? 'right' : 'left'}: 0; - ${layoutInfo.sideBarSide === 'left' ? 'border-right' : 'border-left'}: 1px solid ${colorInfo.activityBarBorder}; - `); + position: absolute; + width: 1px; + height: 100%; + top: 0; + ${layoutInfo.sideBarSide === 'left' ? 'right' : 'left'}: 0; + ${layoutInfo.sideBarSide === 'left' ? 'border-right' : 'border-left'}: 1px solid ${colorInfo.activityBarBorder}; + `); activityDiv.appendChild(activityBorderDiv); } @@ -249,26 +222,26 @@ if (configuration.workspace) { const sideDiv = document.createElement('div'); sideDiv.setAttribute('style', ` - position: absolute; - width: ${layoutInfo.sideBarWidth}px; - height: calc(100% - ${layoutInfo.titleBarHeight + layoutInfo.statusBarHeight}px); - top: ${layoutInfo.titleBarHeight}px; - ${layoutInfo.sideBarSide}: ${layoutInfo.activityBarWidth}px; - background-color: ${colorInfo.sideBarBackground}; - `); + position: absolute; + width: ${layoutInfo.sideBarWidth}px; + height: calc(100% - ${layoutInfo.titleBarHeight + layoutInfo.statusBarHeight}px); + top: ${layoutInfo.titleBarHeight}px; + ${layoutInfo.sideBarSide}: ${layoutInfo.activityBarWidth}px; + background-color: ${colorInfo.sideBarBackground}; + `); splash.appendChild(sideDiv); if (colorInfo.sideBarBorder && layoutInfo.sideBarWidth > 0) { const sideBorderDiv = document.createElement('div'); sideBorderDiv.setAttribute('style', ` - position: absolute; - width: 1px; - height: 100%; - top: 0; - right: 0; - ${layoutInfo.sideBarSide === 'left' ? 'right' : 'left'}: 0; - ${layoutInfo.sideBarSide === 'left' ? 'border-right' : 'border-left'}: 1px solid ${colorInfo.sideBarBorder}; - `); + position: absolute; + width: 1px; + height: 100%; + top: 0; + right: 0; + ${layoutInfo.sideBarSide === 'left' ? 'right' : 'left'}: 0; + ${layoutInfo.sideBarSide === 'left' ? 'border-right' : 'border-left'}: 1px solid ${colorInfo.sideBarBorder}; + `); sideDiv.appendChild(sideBorderDiv); } } @@ -276,28 +249,28 @@ // part: statusbar const statusDiv = document.createElement('div'); statusDiv.setAttribute('style', ` - position: absolute; - width: 100%; - height: ${layoutInfo.statusBarHeight}px; - bottom: 0; - left: 0; - background-color: ${configuration.workspace ? colorInfo.statusBarBackground : colorInfo.statusBarNoFolderBackground}; - `); + position: absolute; + width: 100%; + height: ${layoutInfo.statusBarHeight}px; + bottom: 0; + left: 0; + background-color: ${configuration.workspace ? colorInfo.statusBarBackground : colorInfo.statusBarNoFolderBackground}; + `); splash.appendChild(statusDiv); if (colorInfo.statusBarBorder && layoutInfo.statusBarHeight > 0) { const statusBorderDiv = document.createElement('div'); statusBorderDiv.setAttribute('style', ` - position: absolute; - width: 100%; - height: 1px; - top: 0; - border-top: 1px solid ${colorInfo.statusBarBorder}; - `); + position: absolute; + width: 100%; + height: 1px; + top: 0; + border-top: 1px solid ${colorInfo.statusBarBorder}; + `); statusDiv.appendChild(statusBorderDiv); } - document.body.appendChild(splash); + window.document.body.appendChild(splash); } performance.mark('code/didShowPartsSplash'); diff --git a/src/vs/platform/window/electron-sandbox/window.ts b/src/vs/platform/window/electron-sandbox/window.ts index 1adaa55008133..233f3cdeb78a3 100644 --- a/src/vs/platform/window/electron-sandbox/window.ts +++ b/src/vs/platform/window/electron-sandbox/window.ts @@ -6,6 +6,7 @@ import { getZoomLevel, setZoomFactor, setZoomLevel } from '../../../base/browser/browser.js'; import { getActiveWindow, getWindows } from '../../../base/browser/dom.js'; import { mainWindow } from '../../../base/browser/window.js'; +import { ISandboxConfiguration } from '../../../base/parts/sandbox/common/sandboxTypes.js'; import { ISandboxGlobals, ipcRenderer, webFrame } from '../../../base/parts/sandbox/electron-sandbox/globals.js'; import { zoomLevelToZoomFactor } from '../common/window.js'; @@ -62,3 +63,26 @@ export function zoomIn(target: ApplyZoomTarget | Window): void { export function zoomOut(target: ApplyZoomTarget | Window): void { applyZoom(getZoomLevel(typeof target === 'number' ? getActiveWindow() : target) - 1, target); } + +//#region Bootstrap Window + +export interface ILoadOptions { + configureDeveloperSettings?: (config: T) => { + forceDisableShowDevtoolsOnError?: boolean; + forceEnableDeveloperKeybindings?: boolean; + disallowReloadKeybinding?: boolean; + removeDeveloperKeybindingsAfterLoad?: boolean; + }; + canModifyDOM?: (config: T) => void; + beforeImport?: (config: T) => void; +} + +export interface IBootstrapWindow { + load( + esModule: string, + resultCallback: (result: any, configuration: T) => Promise | undefined, + options: ILoadOptions + ): Promise; +} + +//#endregion diff --git a/src/vs/workbench/contrib/issue/electron-sandbox/issueReporter.js b/src/vs/workbench/contrib/issue/electron-sandbox/issueReporter.js deleted file mode 100644 index 7a1164c6fb25f..0000000000000 --- a/src/vs/workbench/contrib/issue/electron-sandbox/issueReporter.js +++ /dev/null @@ -1,50 +0,0 @@ -/*--------------------------------------------------------------------------------------------- - * Copyright (c) Microsoft Corporation. All rights reserved. - * Licensed under the MIT License. See License.txt in the project root for license information. - *--------------------------------------------------------------------------------------------*/ - -//@ts-check -'use strict'; - -(function () { - - /** - * @import { ISandboxConfiguration } from '../../../../base/parts/sandbox/common/sandboxTypes' - */ - - const bootstrapWindow = bootstrapWindowLib(); - - // Load issue reporter into window - bootstrapWindow.load('vs/workbench/contrib/issue/electron-sandbox/issueReporterMain', function (issueReporter, configuration) { - return issueReporter.startup(configuration); - }, - { - configureDeveloperSettings: function () { - return { - forceEnableDeveloperKeybindings: true, - disallowReloadKeybinding: true - }; - } - } - ); - - /** - * @returns {{ - * load: ( - * esModule: string, - * resultCallback: (result: any, configuration: ISandboxConfiguration) => unknown, - * options?: { - * configureDeveloperSettings?: (config: ISandboxConfiguration) => { - * forceEnableDeveloperKeybindings?: boolean, - * disallowReloadKeybinding?: boolean, - * removeDeveloperKeybindingsAfterLoad?: boolean - * } - * } - * ) => Promise - * }} - */ - function bootstrapWindowLib() { - // @ts-ignore (defined in bootstrap-window.js) - return window.MonacoBootstrapWindow; - } -}()); diff --git a/src/vs/workbench/contrib/issue/electron-sandbox/issueReporter.ts b/src/vs/workbench/contrib/issue/electron-sandbox/issueReporter.ts new file mode 100644 index 0000000000000..7dbac9acddc54 --- /dev/null +++ b/src/vs/workbench/contrib/issue/electron-sandbox/issueReporter.ts @@ -0,0 +1,25 @@ +/*--------------------------------------------------------------------------------------------- + * Copyright (c) Microsoft Corporation. All rights reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + *--------------------------------------------------------------------------------------------*/ + +/* eslint-disable no-restricted-globals */ + +(function () { + + type IBootstrapWindow = import('vs/platform/window/electron-sandbox/window.js').IBootstrapWindow; + + // @ts-ignore (defined in bootstrap-window.js) + const bootstrapWindow: IBootstrapWindow = window.MonacoBootstrapWindow; + + bootstrapWindow.load('vs/workbench/contrib/issue/electron-sandbox/issueReporterMain', function (issueReporter, configuration) { + return issueReporter.startup(configuration); + }, { + configureDeveloperSettings: function () { + return { + forceEnableDeveloperKeybindings: true, + disallowReloadKeybinding: true + }; + } + }); +}());