microsoft / vscode-cdp-proxy

Sample Chrome Debug Protocol proxy used to extend vscode-js-debug

vscode-cdp-proxy

Sample Chrome Debug Protocol proxy used to extend vscode-js-debug with custom targets. This can be used to allow js-debug to work with esoteric targets, like WebAssembly-compiled and frameworks like React Native. Say you're building a React Native debugger. The general flow would work like so:

1. You have a React Native extension, which allows users to start debugging via a command or a launch config.

2. When a session starts, you start a CDP proxy, like the one in this repo. Say it starts listening on localhost:3000

3. Then, you call vscode.debug.startDebugger with a configuration like:

   {
     "type": "pwa-chrome",
     "request": "attach",
     "address": "localhost",  // <- host your proxy is running on
     "port": 3000,            // <- port your proxy is running on
   }

4. The debugger will then connect to the proxy like it would any other CDP-enabled target.

5. Finally, you translate between CDP and the protocol used to debug your target application. In the case of React Native, this is might be a minimal rewrite of some CDP behavior. In the case of more advanced WebAssembly targets, you might translate into something entirely new.

Using this Package

Parts of this package are exported from js-debug. We may publish these parts as nicely packaged bits for reuse here and in the extension, but that's not done right now.

Check out demo.js for an example of a server.

vscode-cdp-proxy's Issues

Module load error in 0.2.1

Unfortunately the change to close #6 introduced a new error when requiring the module.

https://npm.runkit.com/vscode-cdp-proxy

var vscodeCdpProxy = require("vscode-cdp-proxy")

Will now fail with:

Error: Cannot find module './cdp'
Require stack:
- /app/available_modules/1634688999000/vscode-cdp-proxy/dist/index.js
- /app/index.js

index.js (https://unpkg.com/browse/[email protected]/dist/index.js) now contains

__exportStar(require("./cdp"), exports);

but we only have cdp.d.ts type definitions.

Missing type definitions cause TS compilation errors for users of the 0.2.0 release.

https://github.com/microsoft/vscode-cdp-proxy/blob/v0.2.0/src/cdp.d.ts is referenced from https://github.com/microsoft/vscode-cdp-proxy/blob/v0.2.0/src/index.ts#L8 and so will attempt to be loaded during any top level import of vscode-cdp-proxy (such as https://github.com/microsoft/vscode-cdp-proxy/blob/v0.2.0/demo.js#L7)

Unfortunately the published npm package does not contain this file, see https://unpkg.com/browse/[email protected]/dist/. It only exists in src and isn't generated and written to dist during compilation, it is also never copied into dist during prepackaging.

Package imports in JS should still be fine since index.js never references it but importing the module in TypeScript loads types from index.d.ts which includes export * from './cdp';. TS compilation of a module importing vscode-cdp-proxy therefore fails with error TS2307: can not find module './cdp' or its corresponding type declarations.