Feature Request: Collapsible chained methods.

Search Terms

Collapsible
Chained

I was told to file a feature request upstream

This was originally an issue on the vscode github.

Suggestion

Chained methods should be collapsible, just like objects and arrays that span multiple lines.

Use Cases

Why This Is a Helpful Feature

When a lot of chained methods are written in a file, it can be really annoying because currently they aren't chainable. For example, with a library that I'm making which is heavily based on chained methods, they can take up a lot of space. In Visual Studio 2019, I can collapse chained methods, but in VSCode, I can't.

My Many Chained Methods

new Scene()
    .setBackgroundColor("skyBlue")
    .add(0, 5, new Rectangle(0, 250, 600, 350)
        .fill("yellow")
    )
    .add(0, 5, new Group(-600, 0)
        .fill("red")
        .add(new Rectangle(100, 100, 300, 200))
        .add(new Rectangle(400, 200, 100, 100))
        .add(wheel(400, 300))
        .add(wheel(200, 300))
        .animate(0, 5, new Animation({
            x: -600
        }, {
            x: 600
        }))
    ))

Examples

Builtin Classes like Map and Set.

Expanded.

var m = new Map()
    .set("apple", "red")
    .set("banana", "yellow")
    .set("grapes", "purple")

Collapsed should be something like this.

> var m = new Map()...
  )

Promises

Expanded

fsPromises.unlink("somePath")
    .then(() => {
        //Do something
    })
    .catch(err => {
        //Handle error
    })

Collapsed should be something like this.

> fsPromises.unlink("somePath")...
  )

Checklist

My suggestion meets these guidelines:

• This wouldn't be a breaking change in existing TypeScript/JavaScript code
• This wouldn't change the runtime behavior of existing JavaScript code
• This could be implemented without emitting different JS based on the types of the expressions
• This isn't a runtime feature (e.g. library functionality, non-ECMAScript syntax with JavaScript output, etc.)
• This feature would agree with the rest of TypeScript's Design Goals.

The issue provides examples of chained JavaScript and TypeScript expressions but names no implementation files, tests, or entry points. Start by determining which folding component owns editor support and whether this belongs in TypeScript or VS Code. Done should include a defined collapsing behavior for the shown chained-method cases and coverage for it.