Merge pull request #238 from CompuIves/feat/extension-gallery

feat: add extension gallery

README.md

@@ -184,11 +184,14 @@ Additionally, 25 packages that include the vscode version of some services (with
     - Running terminals
     - Running vscode extensions (not web-compatible)
     - and probably more?
-  This library exports a `vscode-ext-host-server` bin to start the remote agent
+
+  Another package `@codingame/monaco-vscode-server` is published, which expose a `vscode-ext-host-server` bin to start the remote agent
 - **Accessibility**: `@codingame/monaco-vscode-accessibility-service-override`
   - Register accessibility helpers
 - **Workspace trust**: `@codingame/monaco-vscode-workspace-trust-service-override`
   - Ask user it they trust the current workspace, disable some features if not
+- **Extension Gallery**: `@codingame/monaco-vscode-extension-gallery-service-override`
+  - Support for the VSCode marketplace, it allows to install extensions from the marketplace.
 Usage:
 
 ```typescript

demo/package.json

@@ -12,7 +12,7 @@
     "build": "tsc --noEmit && vite --config vite.config.ts build",
     "build:github": "tsc --noEmit && vite --config vite.github-page.config.ts build && touch dist/.nojekyll",
     "start:debugServer": "node --loader ts-node/esm src/debugServer.ts",
-    "start:extHostServer": "vscode-ext-host-server --without-connection-token"
+    "start:extHostServer": "WEB_ENDPOINT_URL_TEMPLATE=http://localhost:5173/ vscode-ext-host-server --without-connection-token"
   },
   "devDependencies": {
     "@codingame/monaco-vscode-rollup-vsix-plugin": "file:../dist/rollup-vsix-plugin",
@@ -49,6 +49,7 @@
     "@codingame/monaco-vscode-editor-service-override": "file:../dist/service-override-editor",
     "@codingame/monaco-vscode-emmet-default-extension": "file:../dist/default-extension-emmet",
     "@codingame/monaco-vscode-environment-service-override": "file:../dist/service-override-environment",
+    "@codingame/monaco-vscode-extension-gallery-service-override": "file:../dist/service-override-extension-gallery",
     "@codingame/monaco-vscode-extension-editing-default-extension": "file:../dist/default-extension-extension-editing",
     "@codingame/monaco-vscode-extensions-service-override": "file:../dist/service-override-extensions",
     "@codingame/monaco-vscode-files-service-override": "file:../dist/service-override-files",

demo/src/features/remoteExtension.ts

@@ -7,5 +7,5 @@ declare global {
 }
 
 if (window.rootDirectory != null) {
-  registerRemoteExtension(`${window.rootDirectory}/src/features/remoteExtensionExample/`)
+  void registerRemoteExtension(`${window.rootDirectory}/src/features/remoteExtensionExample/`)
 }

demo/src/features/remoteExtensionExample/package.json

@@ -4,7 +4,7 @@
     "version": "1.0.0",
     "activationEvents": ["*"],
     "engines": {
-      "vscode": "*"
+      "vscode": "^1.77.0"
     },
     "l10n": "./l10n",
     "main": "./main.js",

demo/src/setup.ts

@@ -9,6 +9,7 @@ import getTextmateServiceOverride from '@codingame/monaco-vscode-textmate-servic
 import getThemeServiceOverride from '@codingame/monaco-vscode-theme-service-override'
 import getLanguagesServiceOverride from '@codingame/monaco-vscode-languages-service-override'
 import getAudioCueServiceOverride from '@codingame/monaco-vscode-audio-cue-service-override'
+import getExtensionGalleryServiceOverride from '@codingame/monaco-vscode-extension-gallery-service-override'
 import getViewsServiceOverride, {
   isEditorPartVisible,
   Parts,
@@ -84,13 +85,19 @@ await Promise.all([
     folders: [{
       path: '/tmp'
     }]
-  }))
+  })),
+  initFile(monaco.Uri.file('/tmp/.vscode/extensions.json'), `{
+    "recommendations": [
+        "vscodevim.vim"
+    ]
+}`)
 ])
 
 // Override services
 await initializeMonacoService({
   ...getLogServiceOverride(),
   ...getExtensionServiceOverride(toWorkerConfig(ExtensionHostWorker)),
+  ...getExtensionGalleryServiceOverride({ webOnly: false }),
   ...getModelServiceOverride(),
   ...getNotificationServiceOverride(),
   ...getDialogsServiceOverride(),
@@ -140,6 +147,16 @@ await initializeMonacoService({
   },
   developmentOptions: {
     logLevel: LogLevel.Info // Default value
+  },
+  productConfiguration: {
+    extensionsGallery: {
+      serviceUrl: 'https://open-vsx.org/vscode/gallery',
+      itemUrl: 'https://open-vsx.org/vscode/item',
+      resourceUrlTemplate: 'https://open-vsx.org/vscode/unpkg/{publisher}/{name}/{version}/{path}',
+      controlUrl: '',
+      nlsBaseUrl: '',
+      publisherUrl: ''
+    }
   }
 })
 

demo/vite.config.ts

@@ -19,7 +19,7 @@ export default defineConfig({
       apply: 'serve',
       configureServer: server => {
         server.middlewares.use((_req, res, next) => {
-          res.setHeader('Cross-Origin-Embedder-Policy', 'require-corp')
+          res.setHeader('Cross-Origin-Embedder-Policy', 'credentialless')
           res.setHeader('Cross-Origin-Opener-Policy', 'same-origin')
           res.setHeader('Cross-Origin-Resource-Policy', 'cross-origin')
           next()
@@ -59,7 +59,7 @@ export default defineConfig({
 
       // These 2 lines prevent vite from reloading the whole page when starting a worker (so 2 times in a row after cleaning the vite cache - for the editor then the textmate workers)
       // it's mainly empirical and probably not the best way, fix me if you find a better way
-      'monaco-editor/esm/vs/nls.js', 'monaco-editor/esm/vs/editor/editor.worker.js', 'vscode-textmate', 'vscode-oniguruma', '@vscode/vscode-languagedetection',
+      'monaco-editor/esm/vs/nls.js', 'monaco-editor/esm/vs/editor/editor.worker.js', 'vscode-textmate', 'vscode-oniguruma', '@vscode/vscode-languagedetection', 'vscode-semver',
       ...(await glob('monaco-editor/esm/vs/**/common/**/*.js', { cwd: path.resolve(__dirname, '../node_modules') }))
     ],
     exclude: [],

package.json

@@ -20,7 +20,7 @@
     "compile-default-extensions": "NODE_OPTIONS=--max_old_space_size=8192 rollup --config rollup/rollup.default-extensions.ts --configPlugin 'typescript={tsconfig: `tsconfig.rollup-config-default-extensions.json`}'",
     "compile-language-packs": "NODE_OPTIONS=--max_old_space_size=8192 rollup --config rollup/rollup.language-packs.ts --configPlugin 'typescript={tsconfig: `tsconfig.rollup-config-language-packs.json`}'",
     "clean": "rm -rf dist/",
-    "compile-server": "rollup --config rollup/rollup.server.config.ts --configPlugin 'typescript={tsconfig: `tsconfig.rollup-config-server.json`, include: [`./rollup/rollup.server.config.ts`, `./rollup/rollup-metadata-plugin.ts`]}'",
+    "compile-server": "rollup --config rollup/rollup.server.config.ts --configPlugin 'typescript={tsconfig: `tsconfig.rollup-config-server.json`, include: [`./rollup/rollup.server.config.ts`, `./rollup/rollup-metadata-plugin.ts`]}' --vscode-version ${npm_package_config_vscode_version} --vscode-ref ${npm_package_config_vscode_ref}",
     "compile-treemending-script": "rollup --config rollup/rollup.treemending-script.config.ts --configPlugin 'typescript={tsconfig: `tsconfig.rollup-config-treemending-script.json`, include: [`./rollup/rollup.treemending-script.config.ts`, `./rollup/rollup-metadata-plugin.ts`]}'",
     "compile-rollup-plugins": "rollup --config rollup/rollup.rollup-plugins.config.ts --configPlugin 'typescript={tsconfig: `tsconfig.rollup-config-plugins.json`, include: [`./rollup/rollup.rollup-plugins.config.ts`, `./rollup/rollup-metadata-plugin.ts`]}'",
     "copy-monaco-editor": "cp -R node_modules/monaco-editor dist/ && (cd dist/monaco-editor; change-package-name \"@codingame/monaco-editor-treemended\")",
@@ -57,6 +57,7 @@
     "@types/mime-types": "^2.1.4",
     "@types/node": "^18.17.15",
     "@types/semver": "^7.5.5",
+    "@types/vscode-semver": "npm:@types/semver@=5.5.0",
     "@types/vscode": "~1.83.0",
     "@types/yauzl": "^2.10.3",
     "@typescript-eslint/eslint-plugin": "^6.11.0",
@@ -112,6 +113,7 @@
     "node-pty": "1.1.0-beta1",
     "vscode-oniguruma": "1.7.0",
     "vscode-regexpp": "^3.1.0",
+    "vscode-semver": "npm:semver@=5.5.0",
     "vscode-textmate": "9.0.0",
     "xterm": "5.4.0-beta.27",
     "xterm-addon-canvas": "0.6.0-beta.27",

rollup/rollup.config.ts

@@ -496,6 +496,7 @@ const workerGroups: Record<string, string> = {
 
 const externals = Object.keys({ ...pkg.dependencies })
 const external: rollup.ExternalOption = (source) => {
+  if (source === 'semver' || source.startsWith('semver')) return true
   if (source.includes('tas-client-umd')) return true
   if (source.startsWith(MONACO_EDITOR_DIR) || source.startsWith('monaco-editor/')) {
     return true

rollup/rollup.server.config.ts

@@ -4,6 +4,7 @@ import typescript from '@rollup/plugin-typescript'
 import commonjs from '@rollup/plugin-commonjs'
 import json from '@rollup/plugin-json'
 import { PackageJson } from 'type-fest'
+import replace from '@rollup/plugin-replace'
 import * as path from 'path'
 import { fileURLToPath } from 'url'
 import metadataPlugin from './rollup-metadata-plugin.js'
@@ -15,72 +16,84 @@ const BASE_DIR = path.resolve(__dirname, '..')
 const TSCONFIG = path.resolve(BASE_DIR, 'tsconfig.rollup.json')
 
 const externals = Object.keys(pkg.dependencies)
-const config: rollup.RollupOptions = {
-  cache: false,
-  external: (source) => {
-    if (source === 'graceful-fs' || source === 'xterm-headless') {
-      // commonjs module
-      return false
-    }
-    return externals.some(external => source === external || source.startsWith(`${external}/`))
-  },
-  output: [{
-    format: 'esm',
-    dir: 'dist/server',
-    entryFileNames: '[name].js',
-    chunkFileNames: '[name].js',
-    banner: (module) => module.isEntry ? '#!/usr/bin/env node' : ''
-  }],
-  input: {
-    server: 'src/server/server.ts',
-    'bootstrap-fork': 'src/server/bootstrap-fork.ts'
-  },
-  plugins: [
-    json({
-      compact: true,
-      namedExports: false,
-      preferConst: false
-    }),
-    commonjs({
-      ignoreDynamicRequires: true
-    }),
-    nodeResolve({
-      extensions: EXTENSIONS,
-      modulePaths: ['vscode/src'],
-      browser: false,
-      preferBuiltins: true
-    }),
-    typescript({
-      noEmitOnError: true,
-      tsconfig: TSCONFIG,
-      compilerOptions: {
-        outDir: 'dist/server'
+export default (args: Record<string, string>): rollup.RollupOptions => {
+  const vscodeVersion = args['vscode-version']
+  delete args['vscode-version']
+  const vscodeRef = args['vscode-ref']
+  delete args['vscode-ref']
+  if (vscodeVersion == null) {
+    throw new Error('Vscode version is mandatory')
+  }
+  return rollup.defineConfig({
+    cache: false,
+    external: (source) => {
+      if (source === 'graceful-fs' || source === 'xterm-headless') {
+        // commonjs module
+        return false
       }
-    }),
-    metadataPlugin({
-      handle (_, dependencies) {
-        const packageJson: PackageJson = {
-          name: '@codingame/monaco-vscode-server',
-          ...Object.fromEntries(Object.entries(pkg).filter(([key]) => ['version', 'keywords', 'author', 'license', 'repository', 'type'].includes(key))),
-          private: false,
-          description: `VSCode server designed to be used with ${pkg.name}`,
-          bin: {
-            'vscode-ext-host-server': './server.js'
-          },
-          dependencies: {
-            vscode: `npm:${pkg.name}@^${pkg.version}`,
-            ...Object.fromEntries(Object.entries(pkg.dependencies).filter(([key]) => dependencies.has(key)))
+      return externals.some(external => source === external || source.startsWith(`${external}/`))
+    },
+    output: [{
+      format: 'esm',
+      dir: 'dist/server',
+      entryFileNames: '[name].js',
+      chunkFileNames: '[name].js',
+      banner: (module) => module.isEntry ? '#!/usr/bin/env node' : ''
+    }],
+    input: {
+      server: 'src/server/server.ts',
+      'bootstrap-fork': 'src/server/bootstrap-fork.ts'
+    },
+    plugins: [
+      replace({
+        VSCODE_VERSION: JSON.stringify(vscodeVersion),
+        VSCODE_REF: JSON.stringify(vscodeRef),
+        preventAssignment: true
+      }),
+      json({
+        compact: true,
+        namedExports: false,
+        preferConst: false
+      }),
+      commonjs({
+        ignoreDynamicRequires: true
+      }),
+      nodeResolve({
+        extensions: EXTENSIONS,
+        modulePaths: ['vscode/src'],
+        browser: false,
+        preferBuiltins: true
+      }),
+      typescript({
+        noEmitOnError: true,
+        tsconfig: TSCONFIG,
+        compilerOptions: {
+          outDir: 'dist/server'
+        }
+      }),
+      metadataPlugin({
+        handle (_, dependencies) {
+          const packageJson: PackageJson = {
+            name: '@codingame/monaco-vscode-server',
+            ...Object.fromEntries(Object.entries(pkg).filter(([key]) => ['version', 'keywords', 'author', 'license', 'repository', 'type'].includes(key))),
+            private: false,
+            description: `VSCode server designed to be used with ${pkg.name}`,
+            bin: {
+              'vscode-ext-host-server': './server.js'
+            },
+            dependencies: {
+              vscode: `npm:${pkg.name}@^${pkg.version}`,
+              ...Object.fromEntries(Object.entries(pkg.dependencies).filter(([key]) => dependencies.has(key)))
+            }
           }
+          this.emitFile({
+            fileName: 'package.json',
+            needsCodeReference: false,
+            source: JSON.stringify(packageJson, null, 2),
+            type: 'asset'
+          })
         }
-        this.emitFile({
-          fileName: 'package.json',
-          needsCodeReference: false,
-          source: JSON.stringify(packageJson, null, 2),
-          type: 'asset'
-        })
-      }
-    })
-  ]
+      })
+    ]
+  })
 }
-
-export default config