Typescript: ES5 async/await sourcemap issue

[roblourens]

TypeScript Version: 2.2.1

Code

async function bar(): Promise<void> {
    await foo();
    let x = 1;
}

produces

function bar() {
    return __awaiter(this, void 0, void 0, function () {
        var x;
        return __generator(this, function (_a) {
            switch (_a.label) {
                case 0: return [4 /*yield*/, foo()];
                case 1:
                    _a.sent();
                    x = 1;
                    return [2 /*return*/];
            }
        });
    });
}

The sourcemap associates the let x part of the ts with the var x part of the js. This is technically correct, but not very useful in practice. If you set a breakpoint on the let x line in chrome devtools or vscode, it actually sets a breakpoint on the var x line which runs before the await foo line. So it's practically impossible to debug this code with sourcemaps. It would be much more useful if the whole line was just sourcemapped to the x=1 line in the case.

[auchenberg]

Tracking similar reported issue for VS users: https://developercommunity.visualstudio.com/content/problem/23101/tyepscript-breakpoints-async-issues.html

[ijabit]

Any ETA on when this might be fixed? Or is there an older version of TypeScript for Visual Studio 2015 that I can install which doesn't have this issue?

[ijabit]

I may have to resort to using a multi-stage compilation using Babel if this bug isn't fixed, which would be very inconvenient. It's been two months, so can you at least give us a status update? Will this be fixed?

[mhegazy]

@rbuckton can you please take a look.

[ijabit]

@mhegazy
This is ridiculous, I've been telling our entire team that this bug will be fixed in TypeScript 2.4 and now you've pushed it to 2.5? This bug makes debugging TypeScript with async methods impossible! Please re-evaluate your priorities here.

[mhegazy]

@ijabit sorry for the frustration this might have caused. fix should be in typescript@next tomorrow, and in [email protected] later this month.

[ijabit]

@mhegazy I see now it's in Milestone 2.4.1, and not 2.5 any longer. I'm glad its fixed! Eagerly awaiting TS 2.4.1 :)

[ijabit]

I still have breakpoint issues when compiling TS -> ES5. Compiling TS -> ES6 and then using Babel go from ES6 -> ES5 produces the correct source maps. Are you sure this issue is fixed in 2.4.1? I installed the 2.4.1 TypeScript for VS 2015 yesterday and am still seeing sourcemap issues.

[auchenberg]

Compiling from ES6 to ES5 via Babel might be the problem here, as I doubt
Babel will factor the source-map generated by TS in.

Does your ES6 code work as expected? You can try in Chrome DevTools or VS
Code.

/K
On Thu, Jun 29, 2017 at 1:24 PM ijabit [e-mail] wrote:

I still have breakpoint issues when compiling TS -> ES5. Compiling TS ->
ES6 and then using Babel go from ES6 -> ES5 produces the correct source
maps. Are you sure this issue is fixed in 2.4.1? I installed the 2.4.1
TypeScript for VS 2015 yesterday and am still seeing sourcemap issues.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/Microsoft/TypeScript/issues/14506#issuecomment-312093488,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAKl96JOYV72_5r_gBJURgR54d5lHu7Sks5sJAgPgaJpZM4MVoea
.

[ijabit]

Actually Babel works great, but TS doesn't! As soon as I go from TS -> ES5 directly it screws up the sourcemaps. If I run through Babel it works perfect.

[taicho]

Any news on this issue? I'm still running into this in 2.4.2. Using async/await completely destroys the ability to debug properly... No matter if my target is set to es6, es2015 or es5 the result is the same...breakpoints don't get honored, lines jump between TS and JS etc...

[ijabit]

@taicho if you run it through babel that seems to clean up all the TypeScript sourcemaps and fixes stuff.

[taicho]

@ijabit Thanks for the workaround. Anybody have any idea why this is closed? Am I missing something? Not trying to sound testy but I’m starting to think I should rewrite all the async/await in my condenase to go back to standard promise syntax as it’s getting hard to showcase the benefits of async/await when it becomes near impossible to debug. Can we at least reopen this issue so it’s not forgotten about?