denoland / deno

A modern runtime for JavaScript and TypeScript.
https://deno.com
MIT License
97k stars 5.36k forks source link

Original source in cached source maps #9640

Closed kitsonk closed 2 years ago

kitsonk commented 3 years ago

When debugging, the inspector offers up emitted code that is in the cache. The emitted URL contains a base64 encoded source map. That source map is used by editors to determine the original source of the file so that breakpoints can be set and original source viewed in the editor.

Currently when we emit the source map, we have two scenarios:

In the first case, the VSCode would tend to throw an error like:

Could not load source '/projects/test/std@0.84.0/fmt/colors.ts': Unable to retrieve source content.

As it tries to rectify the location of the file provided by the inspector and the source file indicated in the source map.

In the second case, the VSCode parses out the original source content and can provide it in the editor, but it "guesses" wrong at the file type because it thinks the file is named <https://deno.land/std@0.85.0/fmt/colors.ts>.

The lsp supports "virtual" documents in the cache that start with the deno: schema. I think the only way we can fix this is to encode the source maps with the appropriate URLs in the sources. We maybe able to do that automatically with swc, but I think it will be challenging with tsc, though playing with some of the settings might work, but likely we would need to do some post processing of the emits. (The other option is just to swc for the emit always).

Also, we shouldn't be embedding the sources content in the source maps with swc, as it only increases the file sizes unnecessarily.

bartlomieju commented 2 years ago

I just triaged this issue and I can't reproduce the problem anymore. Here's my setup:

// deno.ts
import { red } from "https://deno.land/std/fmt/colors.ts";

let array = ["abc", "def", "ghi"];
let index = array.indexOf("ghi");
console.log(red("String found at position:"));
console.log(index);
// launch.json
{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Deno Run",
            "type": "pwa-node",
            "request": "launch",
            "cwd": "${workspaceFolder}",
            "runtimeExecutable": "deno",
            "runtimeArgs": [
                "run",
                "--inspect-brk",
                "--no-check",
                "--unstable",
                "--allow-read",
                "--allow-write",
                "-A",
                "${file}"
            ],
            "attachSimplePort": 9229,
            "outputCapture": "std"
        }
    ]
}

Running in VSCode with F5 to start a debugger:

/Users/biwanczuk/.deno/bin/deno run --inspect-brk --no-check --unstable --allow-read --allow-write -A /Users/biwanczuk/dev/vscode_debug_test/deno.ts
Debugger listening on ws://127.0.0.1:9229/ws/12a82a37-1cb1-4574-9441-b7a3ffda7074
Visit chrome://inspect to connect to the debugger.
Deno is waiting for debugger to connect.
Debugger session started.
String found at position:
2

Here's the output of deno info:

$ deno info deno.ts
local: /dev/vscode_debug_test/deno.ts
emit: /Library/Caches/deno/gen/file/Users/biwanczuk/dev/vscode_debug_test/deno.ts.js
type: TypeScript
dependencies: 0 unique (total 142B)

file:///Users/biwanczuk/dev/vscode_debug_test/deno.ts (142B)

$ deno info /Library/Caches/deno/gen/file/Users/biwanczuk/dev/vscode_debug_test/deno.ts.js
import { red } from "https://deno.land/std/fmt/colors.ts";
let array = [
    "abc",
    "def",
    "ghi"
];
let index = array.indexOf("ghi");
console.log(red("String found at position:"));
console.log(index);
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImZpbGU6Ly8vVXNlcnMvYml3YW5jenVrL2Rldi92c2NvZGVfZGVidWdfdGVzdC9kZW5vLnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IHJlZCB9IGZyb20gXCJodHRwczovL2Rlbm8ubGFuZC9zdGQvZm10L2NvbG9ycy50c1wiO1xuXG5sZXQgYXJyYXkgPSBbXCJhYmNcIiwgXCJkZWZcIiwgXCJnaGlcIl07XG5sZXQgaW5kZXggPSBhcnJheS5pbmRleE9mKFwiZ2hpXCIpO1xuY29uc29sZS5sb2cocmVkKFwiU3RyaW5nIGZvdW5kIGF0IHBvc2l0aW9uOlwiKSk7XG5jb25zb2xlLmxvZyhpbmRleCk7Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE1BQU0sR0FBRyxHQUFHLFFBQVEsQ0FBcUM7QUFFekQsR0FBRyxDQUFDLEtBQUssR0FBRyxDQUFDO0lBQUEsQ0FBSztJQUFFLENBQUs7SUFBRSxDQUFLO0FBQUEsQ0FBQztBQUNqQyxHQUFHLENBQUMsS0FBSyxHQUFHLEtBQUssQ0FBQyxPQUFPLENBQUMsQ0FBSztBQUMvQixPQUFPLENBQUMsR0FBRyxDQUFDLEdBQUcsQ0FBQyxDQUEyQjtBQUMzQyxPQUFPLENBQUMsR0FBRyxDQUFDLEtBQUsifQ==⏎

I believe this is no longer an issue, as source map is embedded as a base64 encoded string and doesn't have any angle brackets. I'm tentatively going to close this issue as fixed.