microsoft/vscode-mock-debug

can this extension run on https://vscode.dev/

zhfnjust opened this issue · 6 comments

can this extension run on https://vscode.dev/

When I start the debugger, it doesn't respond
image

Same here. If you open the devtools:

Uncaught (in promise) ReferenceError: process is not defined
	at et.normalizePathAndCasing (web-extension.js:10:19521)
	at et.start (web-extension.js:10:13434)
	at G.launchRequest (web-extension.js:12:2034)

if (process.platform === 'win32') {

Yes, "Mock Debug" is one of the few debug extensions that should work in a browser (and runs on https://vscode.dev/).

But this feature was was broken by commit 72b556c:
process is node API which does not exist when running in the browser.

/cc @connor4312 @dbaeumer

@connor4312 the "Web Extension" launch config can be used to run and debug the extension in the web.

I've been struggling with this all day. I've cloned this repo and built, and I'm trying to test as outlined at https://code.visualstudio.com/api/extension-guides/web-extensions#test-your-web-extension .

When I try I on vscode.dev (or github using the "open in github.dev" option) and load the locally built extension as outlined using npx serve and npx localtunnel I see CORS errors in the console as shown below.

Refused to connect to 'https://eager-otters-kick-67-183-2-129.loca.lt/package.json' because it violates the following Content Security Policy directive: "connect-src 'self'
            wss://vsls-prod-ins-usw2-private-relay.servicebus.windows.net
            wss://vsls-prod-rel-usw2-relay-1.servicebus.windows.net
            wss://vsls-prod-rel-usw2-relay-2.servicebus.windows.net

When I try as outlined in the docs using @vscode/test-web (e.g. running the command vscode-test-web --extensionDevelopmentPath=. . from the package.json) then I can see the extension is loaded and I can set a breakpoint in the .md file in the workspace, but on trying to debug via the command "Mock Debug: Debug File" then the debugger appears to launch but just sits there, and in the console output I see the below error (truncated):

Uncaught (in promise) Error (FileSystemError): Unable to read file '/vscode-test-web://mount/README.md' (Unavailable (FileSystemError): Error: No file system handle registered (/vscode-test-web:/))
	at Yt._handleError (../../../vs/workbench/api/worker/extensionHostWorker.js:76:30420)
	at Object.readFile (../../../vs/workbench/api/worker/extensionHostWorker.js:76:28894)
	at async Object.readFile (http://localhost:3000/static/devextensions/dist/web-extension.js#vscode-extension:4303:12)
	at async MockRuntime.loadSource (http://localhost:3000/static/devextensions/dist/web-extension.js#vscode-extension:3335:31)
	at async MockRuntime.verifyBreakpoints (http://localhost:3000/static/devextensions/dist/web-extension.js#vscode-extension:3462:7)
	at async MockRuntime.setBreakPoint (http://localhost:3000/static/devextensions/dist/web-extension.js#vscode-extension:3241:5)
	at async eval (http://localhost:3000/static/devextensions/dist/web-extension.js#vscode-extension:3652:38)
	at async Promise.all (index 0)
at async _MockDebugSession.setBreakPointsRequest (http://localhost:3000/static/devextensions/dist/web-extension.js#vscode-extension:3657:31)

Something I'm doing wrong? Are the docs wrong (or incomplete)? Or is there an issue here? Thanks.

p.s. Let me know if I should open a new issue @weinand rather than just pile on here. Thanks!