Skip to content
This repository has been archived by the owner on Aug 31, 2023. It is now read-only.

feat(rome_js_formatter): Parenthesize TypeScript types #3108

Merged
merged 4 commits into from
Aug 30, 2022

Conversation

MichaReiser
Copy link
Contributor

@MichaReiser MichaReiser commented Aug 25, 2022

This PR implements the rules for when parentheses around TypeScript types are needed or can be removed without changing the semantics of the program.

The majority of the PR is to implement NeedsParentheses for every TsType.

Tests

I added unit tests for all rules where parentheses are required and reviewed the updated snapshots.

There are a few new changes but these unrelated to parentheses but instead problems with the formatting of the specific syntax.

Average compatibility: 84.00 -> 84.41
Compatible lines: 81.75 -> 82.38

@cloudflare-workers-and-pages
Copy link

cloudflare-workers-and-pages bot commented Aug 25, 2022

Deploying with  Cloudflare Pages  Cloudflare Pages

Latest commit: 52386d2
Status: ✅  Deploy successful!
Preview URL: https://8259e6f2.tools-8rn.pages.dev
Branch Preview URL: https://feat-parenthesise-types.tools-8rn.pages.dev

View logs

@@ -716,6 +789,86 @@ impl NeedsParentheses for JsAnyAssignmentPattern {
}
}

impl NeedsParentheses for TsType {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These union implementation isn't used anywhere but I think it will be useful to remind everyone adding a new TsType to also implement NeedsParentheses

@@ -47,11 +47,11 @@ export type a =
- // prettier-ignore
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We can't support these prettier ignore comments at the moment (were ignored before). We'll only be able to support these ignore comments with the new comments infrastructure

@@ -11,60 +11,56 @@ impl FormatRule<JsVariableDeclaratorList> for FormatJsVariableDeclaratorList {
type Context = JsFormatContext;

fn fmt(&self, node: &JsVariableDeclaratorList, f: &mut JsFormatter) -> FormatResult<()> {
let format_inner = format_with(|f| {
let length = node.len();
let length = node.len();
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I moved the group outside into the FormatJsVariableDeclaration to match prettier's formatting

@MichaReiser MichaReiser changed the title feat(npm): hook *Conent APIs to WASM bindings (#3097) feat(rome_js_formatter): Parenthesize TypeScript types Aug 25, 2022
Base automatically changed from feat/parentheses-transform to main August 29, 2022 15:13
@MichaReiser MichaReiser temporarily deployed to aws August 29, 2022 15:28 Inactive
@rome rome deleted a comment from github-actions bot Aug 29, 2022
@MichaReiser MichaReiser temporarily deployed to aws August 29, 2022 15:30 Inactive
This PR implements the rules for when parentheses around TypeScript types are needed or can be removed without changing the semantics of the program.

The majority of the PR is to implement `NeedsParentheses` for every `TsType`.

This PR further fixes an instability issue with the syntax rewriter. The rewriter used to remove all whitespace between the `(` paren and the token (or first comment and skipped token trivia). This is necessary or the formatter otherwise inserts an extra blank line before nodes that are parenthesized:

```
a
(
  Long &&
  Longer &&
)
```

becomes

```
a

(
  Long &&
  Longer &&
)
```

Notice, the added new line. What this logic didn't account for is that it should not remove a leading new line before a comment because we want to keep the comment on its own line and this requires that there's a leading new line trivia.

The last fix is in the source map that so far assumed that all ranges are added in increasing `end` order

```
correct: 2..3, 2..4, 2..5 (notice how the ranges are sorted by end)
incorrect: 2..4, 2..3, 2..5
```

This PR updates the sorting of the text ranges to also account the end ranges.

I added unit tests for all rules where parentheses are required and reviewed the updated snapshots.

There are a few new changes but these unrelated to parentheses but instead problems with the formatting of the specific syntax.

Average compatibility: 83.70 -> 84.11
Compatible lines: 80.79 -> 81.42
@MichaReiser MichaReiser temporarily deployed to aws August 29, 2022 15:31 Inactive
@MichaReiser
Copy link
Contributor Author

!bench_formatter

@github-actions
Copy link

github-actions bot commented Aug 29, 2022

@MichaReiser MichaReiser temporarily deployed to aws August 29, 2022 15:38 Inactive
@github-actions
Copy link

Formatter Benchmark Results

group                                    main                                   pr
-----                                    ----                                   --
formatter/checker.ts                     1.00    485.0±5.75ms     5.4 MB/sec    1.02    494.3±5.30ms     5.3 MB/sec
formatter/compiler.js                    1.00    267.0±2.81ms     3.9 MB/sec    1.04    277.1±1.78ms     3.8 MB/sec
formatter/d3.min.js                      1.00    222.7±2.37ms  1205.4 KB/sec    1.04    231.8±2.33ms  1157.7 KB/sec
formatter/dojo.js                        1.00     13.9±0.01ms     4.9 MB/sec    1.01     14.1±0.02ms     4.9 MB/sec
formatter/ios.d.ts                       1.00    292.6±1.57ms     6.4 MB/sec    1.01    295.3±1.50ms     6.3 MB/sec
formatter/jquery.min.js                  1.00     58.4±0.71ms  1448.8 KB/sec    1.01     58.8±0.82ms  1438.7 KB/sec
formatter/math.js                        1.00    453.7±6.69ms  1461.4 KB/sec    1.04    470.5±3.44ms  1409.4 KB/sec
formatter/parser.ts                      1.00      9.3±0.01ms     5.2 MB/sec    1.01      9.4±0.01ms     5.2 MB/sec
formatter/pixi.min.js                    1.00    253.0±4.89ms  1776.7 KB/sec    1.03    261.6±3.00ms  1718.2 KB/sec
formatter/react-dom.production.min.js    1.00     72.5±1.23ms  1624.7 KB/sec    1.01     73.5±1.17ms  1603.5 KB/sec
formatter/react.production.min.js        1.00      3.5±0.01ms  1806.7 KB/sec    1.01      3.5±0.01ms  1790.5 KB/sec
formatter/router.ts                      1.00      7.2±0.01ms     8.5 MB/sec    1.01      7.3±0.03ms     8.4 MB/sec
formatter/tex-chtml-full.js              1.00    588.5±5.42ms  1585.5 KB/sec    1.01    595.6±2.62ms  1566.9 KB/sec
formatter/three.min.js                   1.00    282.6±2.33ms     2.1 MB/sec    1.04    294.2±2.07ms  2043.5 KB/sec
formatter/typescript.js                  1.00   1821.7±6.74ms     5.2 MB/sec    1.03   1872.1±8.52ms     5.1 MB/sec
formatter/vue.global.prod.js             1.00     95.5±1.55ms  1291.6 KB/sec    1.00     95.7±1.21ms  1289.1 KB/sec

@MichaReiser MichaReiser temporarily deployed to aws August 29, 2022 17:31 Inactive
@MichaReiser MichaReiser merged commit 575b4d9 into main Aug 30, 2022
@MichaReiser MichaReiser deleted the feat/parenthesise-types branch August 30, 2022 09:25
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants