feat: support patch extension (#57)

Author: subframe7536

README.md

@@ -7,9 +7,9 @@
   </p>
 </p>
 
-VSCode extension that custom ui css style in both editor and webview
+Custom UI Style is a VSCode extension that modify CSS and JS code in editor and webview, unify global font family, setup background image and Electron BrowserWindow options, add your custom CSS or JS code, or patching file in other VSCode extensions
 
-- Works with VSCode 1.101! (Tested on Windows and MacOS)
+- Works with VSCode 1.103! (Tested on Windows and MacOS)
 
 > [!warning]
 >
@@ -28,6 +28,7 @@ Untested on Linux and VSCode forks (like Cursor, WindSurf, etc.), and I currentl
 - [From V0.4.0] Support total restart
 - [From V0.4.0] Suppress corrupt message
 - [From V0.4.2] Load external CSS or JS file
+- [From V0.6.0] Patch files in extension
 
 ## Usage
 
@@ -181,6 +182,28 @@ To disable all external resources, setup:
 }
 ```
 
+### Patch Extension
+
+Find and replace target string or `Regexp` in extension's file
+
+```jsonc
+{
+  "custom-ui-style.extensions": {
+    // extension id
+    "github.copilot-chat": [
+      {
+        // target file path
+        "filePath": "dist/extension.js",
+        // find string (support JavaScript like regexp)
+        "find": "https://generativelanguage.googleapis.com/v1beta/openai",
+        // replace string
+        "replace": "<path/to/url>"
+      }
+    ]
+  },
+}
+```
+
 ## FAQ
 
 ### What is modified
@@ -245,6 +268,7 @@ According to [#34](https://github.com/subframe7536/vscode-custom-ui-style/issues
 | `custom-ui-style.external.loadStrategy`     | Load strategy for external CSS or JS resources                                                                                                                                                               | `string`  | `"refetch"` |
 | `custom-ui-style.external.imports`          | External CSS or JS resources, support variable: [${userHome}, ${env:your_env_name:optional_fallback_value}], support protocol: 'https://', 'file://'                                                         | `array`   | ``          |
 | `custom-ui-style.stylesheet`                | Custom css for editor, support nest selectors                                                                                                                                                                | `object`  | `{}`        |
+| `custom-ui-style.extensions`                | Config to patch extension code, key is extension id, value is config                                                                                                                                         | `object`  | `{}`        |
 | `custom-ui-style.webview.enable`            | Enable style patch in webview                                                                                                                                                                                | `boolean` | `true`      |
 | `custom-ui-style.webview.removeCSP`         | Remove Content-Security-Policy restrict in webview                                                                                                                                                           | `boolean` | `true`      |
 | `custom-ui-style.webview.monospaceSelector` | Custom monospace selector in webview                                                                                                                                                                         | `array`   | ``          |

package.json

@@ -2,7 +2,7 @@
   "publisher": "subframe7536",
   "name": "custom-ui-style",
   "displayName": "Custom UI Style",
-  "version": "0.5.9",
+  "version": "0.5.10",
   "private": true,
   "packageManager": "[email protected]",
   "description": "Custom ui css style in both editor and webview, unify global font family, setup background image",
@@ -170,6 +170,43 @@
           "type": "object",
           "description": "Custom css for editor, support nest selectors"
         },
+        "custom-ui-style.extensions.enable": {
+          "scope": "application",
+          "type": "boolean",
+          "default": true,
+          "description": "Enable file patch in other extensions"
+        },
+        "custom-ui-style.extensions.config": {
+          "scope": "application",
+          "type": "object",
+          "additionalProperties": {
+            "type": "array",
+            "items": {
+              "type": "object",
+              "properties": {
+                "filePath": {
+                  "type": "string",
+                  "description": "Relative path to extension root"
+                },
+                "find": {
+                  "type": "string",
+                  "description": "\"find\" in JavaScript code \"str.replace(find, replace)\", support regexp (e.g. /test\\d+/)"
+                },
+                "replace": {
+                  "type": "string",
+                  "description": "\"replace\" in JavaScript code \"str.replace(find, replace)\""
+                }
+              },
+              "required": [
+                "filePath",
+                "find",
+                "replace"
+              ],
+              "additionalProperties": false
+            }
+          },
+          "description": "Config to patch extension code, key is extension id, value is config"
+        },
         "custom-ui-style.webview.enable": {
           "scope": "application",
           "type": "boolean",

src/manager/base.ts

@@ -27,16 +27,19 @@ export abstract class BaseFileManager implements FileManager {
   skipAll?: (() => Promisable<string | undefined | false>) | undefined
 
   async reload() {
-    await this.skipable(async () => {
-      if (!this.hasBakFile) {
-        log.warn(`Backup file [${this.bakPath}] does not exist, backuping...`)
-        fs.cpSync(this.srcPath, this.bakPath)
-        log.info(`Create backup file [${this.bakPath}]`)
-      }
-      const newContent = await this.patch(readFileSync(this.bakPath, 'utf-8'))
-      writeFileSync(this.srcPath, newContent)
-      log.info(`Config reload [${this.srcPath}]`)
-    })
+    let skipMessage = await this.skipAll?.()
+    if (skipMessage) {
+      promptWarn(skipMessage)
+      return
+    }
+    if (!this.hasBakFile) {
+      log.warn(`Backup file [${this.bakPath}] does not exist, backuping...`)
+      fs.cpSync(this.srcPath, this.bakPath)
+      log.info(`Create backup file [${this.bakPath}]`)
+    }
+    const newContent = await this.patch(readFileSync(this.bakPath, 'utf-8'))
+    writeFileSync(this.srcPath, newContent)
+    log.info(`Config reload [${this.srcPath}]`)
   }
 
   async rollback() {
@@ -48,14 +51,5 @@ export abstract class BaseFileManager implements FileManager {
     }
   }
 
-  async skipable(fn: () => Promisable<void>) {
-    let skipMessage = await this.skipAll?.()
-    if (skipMessage) {
-      promptWarn(skipMessage)
-    } else {
-      await fn()
-    }
-  }
-
   abstract patch(content: string): Promisable<string>
 }

src/manager/extension.ts

@@ -0,0 +1,95 @@
+import type { Promisable } from '@subframe7536/type-utils'
+
+import path from 'node:path'
+
+import { extensions } from 'vscode'
+
+import { config } from '../config'
+import { log } from '../logger'
+import { promptWarn } from '../utils'
+import { BaseFileManager } from './base'
+
+interface ExtensionPatchConfig {
+  filePath: string
+  find: string
+  replace: string
+}
+
+function getBackupPath(filePath: string) {
+  const obj = path.parse(filePath)
+  return path.join(obj.dir, `${obj.name}.custom-ui-style${obj.ext}`)
+}
+
+function tryParseRegex(str: string): RegExp | string {
+  if (str.length < 3) {
+    return str
+  }
+  if (!str.startsWith('/')) {
+    return str
+  }
+
+  const lastSlashPos = str.lastIndexOf('/')
+  if (lastSlashPos <= 0) {
+    return str
+  }
+
+  const body = str.slice(1, lastSlashPos)
+  if (body.length === 0) {
+    return str
+  }
+
+  const flags = str.slice(lastSlashPos + 1)
+  if (!/^[gimsuy]*$/.test(flags)) {
+    return str
+  }
+
+  try {
+    return new RegExp(body, flags)
+  } catch (e) {
+    log.error(e)
+    return str
+  }
+}
+
+class ExtensionFileManager extends BaseFileManager {
+  constructor(private config: ExtensionPatchConfig) {
+    super(config.filePath, getBackupPath(config.filePath))
+  }
+
+  patch(content: string): Promisable<string> {
+    return content.replace(tryParseRegex(this.config.find), this.config.replace)
+  }
+}
+
+export function createExtensionFileManagers() {
+  if (!config['extensions.enable'] || !config['extensions.config']) {
+    return []
+  }
+  const managers = []
+  for (const [extensionId, patchConfig] of Object.entries(config['extensions.config'])) {
+    const rootPath = extensions.getExtension(extensionId)?.extensionPath
+    if (!rootPath) {
+      promptWarn(`No such extension: ${extensionId}, skip patch`)
+      continue
+    }
+    if (!Array.isArray(patchConfig)) {
+      promptWarn(`Config should be an array, skip patching ${extensionId}`)
+      continue
+    }
+    const warningArray = []
+    for (const conf of patchConfig) {
+      if (conf.filePath && conf.find && conf.replace) {
+        managers.push(new ExtensionFileManager({
+          ...conf,
+          filePath: path.join(rootPath, conf.filePath),
+        }))
+      } else {
+        warningArray.push(conf)
+      }
+    }
+    if (warningArray.length > 0) {
+      promptWarn(`Configs of ${extensionId} are invalid: ${JSON.stringify(warningArray, null, 2)}`)
+    }
+  }
+  return managers
+}

src/manager/index.ts

@@ -5,6 +5,7 @@ import { version } from 'vscode'
 import { config } from '../config'
 import { runAndRestart } from '../utils'
 import { CssFileManager } from './css'
+import { createExtensionFileManagers } from './extension'
 import { ExternalFileManager } from './external'
 import { JsonFileManager } from './json'
 import { MainFileManager } from './main'
@@ -26,8 +27,10 @@ export function createFileManagers() {
     new RendererFileManager(),
     new ExternalFileManager(),
     new WebViewFileManager(),
-    new JsonFileManager(), // MUST be the end of managers
+    new JsonFileManager(), // MUST be the end of built-in file managers
+    ...createExtensionFileManagers(),
   ]
+
   return {
     hasBakFile: () => managers.every(m => m.hasBakFile),
     reload: async (text: string) => {