Repository navigation
Emit new lines for Arrow function bodies or preserve source new line feeds #2259
Description
Activity
Probably at:
https://github.com/Microsoft/TypeScript/blob/master/src/compiler/emitter.ts#L4304It'd be nice to have a flag that emits arrow function bodies on new lines.
Your arrow functions should stay on a single line (as that's how they were written). Property accesses will respect newlines from now on.
Someone might need to look into the source maps to see if we're emitting them properly such that you can break appropriately on subexpression.
In our latest bits the code you've written gets emitted as:
x.a('#test') .b('test') .c(function () { return 'foo'; }) .d(function () { return 'bar'; }) .e(function () { return 5; }) .f(function () { return 6; });
This seems to most accurately match what you have written. Ideally you should be able to set a breakpoint on something like 'foo' or 'bar' and have it appropriately mapped over to the "return 'foo';" statement.
Cyrus Najmabadi (@CyrusNajmabadi) Is that a change available in TypeScript#master? Compiling with 1.4.1 locally and the playground seem to emit all those chained function calls on the same line.
Matt Traynham (@mtraynham) Yup. This is what i get when i try things in the latest master.
Cyrus Najmabadi (@CyrusNajmabadi) Just tried with master locally and you are correct! The indents can be a bit funny, but this is much much better.
Just an example of the weird indent issue (closing this anyway):
code:
return this.edit(role) .then((role: Role) => this.roleService.add(role) .then((data: ng.IHttpPromiseCallbackArg<Role>) => data.data));compiled:
return this.edit(role) .then(function (role) { return _this.roleService.add(role) .then(function (data) { return data.data; }); });Thanks!
Matt Traynham (@mtraynham) Yup. this is something we're aware of. Daniel Rosenwasser (@DanielRosenwasser) has run into this when dealing with emit for Computed-Property-Names in Object Literals. We get this:
return this.edit(role) .then(function (role) { return _this.roleService.add(role) .then(function (data) { return data.data; }); });
We really should be increasing the indent level once when we start emiting the arguments to 'then', and once again when we emit the body of 'function (role)'. This would then produce:
return this.edit(role) .then(function (role) { return _this.roleService.add(role) .then(function (data) { return data.data; }); });
- locked and limited conversation to collaborators
on Jun 18, 2018
After compilation, everything get's collapsed to a single line (Arrow Functions, getter/setter chaining, promises). That being said, it is a huge pain point when debugging because you have to step-into/step-out to get to particular calls in the code.
As an example:
Becomes:
Using Chrome and sourceMaps, the breakpoints are still skipped.
http://www.typescriptlang.org/Playground#src=(%3Cany%3E%20x).a('%23test')%0A%20%20%20%20.b('test')%0A%09.c(()%20%3D%3E%20'foo')%0A%09.d(()%20%3D%3E%20'bar')%0A%09.e(()%20%3D%3E%205)%0A%09.f(()%20%3D%3E%206)%3B