Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Object literals in Angular templates are missing trailing commas #15897

Open
mmeylan opened this issue Jan 9, 2024 · 3 comments · May be fixed by #15926
Open

Object literals in Angular templates are missing trailing commas #15897

mmeylan opened this issue Jan 9, 2024 · 3 comments · May be fixed by #15926
Assignees
@fisker
Labels
lang:angular Issues affecting Angular template (not general JS/TS issues used for Angular) status:needs discussion Issues needing discussion and a decision to be made before action can be taken

Comments

@mmeylan
Copy link

mmeylan commented Jan 9, 2024 •
edited

Prettier 3.1.1
Playground link

--parser angular
--trailing-comma all

Input:

<div
  *ngIf="{
    spacing: spacing$ | async,
    user: user$ | async,
  } as ctx"
  [ngClass]="{
    'px-lg': ctx.spacing == 'lg',
    'px-md': ctx.spacing == 'md',
    'px-xs': ctx.spacing == 'xs',
  }"
>
  Hi Prettier !
</div>

Output:

<div
  *ngIf="{
    spacing: spacing$ | async,
    user: user$ | async
  } as ctx"
  [ngClass]="{
    'px-lg': ctx.spacing == 'lg',
    'px-md': ctx.spacing == 'md',
    'px-xs': ctx.spacing == 'xs'
  }"
>
  Hi Prettier !
</div>

Expected behavior:
Trailing commas should be kept/inserted in object literals. This used to work on 2.8.

<div
  *ngIf="{
    spacing: spacing$ | async,
    user: user$ | async,
  } as ctx"
  [ngClass]="{
    'px-lg': ctx.spacing == 'lg',
    'px-md': ctx.spacing == 'md',
    'px-xs': ctx.spacing == 'xs',
  }"
>
  Hi Prettier !
</div>
@mmeylan mmeylan changed the title Object in Angular templates are missing trailing commas on the last line Object literals in Angular templates are missing trailing commas Jan 9, 2024
@fisker
Copy link
Member

fisker commented Jan 15, 2024

It's indented to not support trailingComma,

prettier/src/language-html/embed/angular-attributes.js

Line 23 in b4ed91b

// angular does not allow trailing comma

But maybe it's supportted now?

@fisker fisker added lang:angular Issues affecting Angular template (not general JS/TS issues used for Angular) status:needs investigation Issues that need additional investigation, e.g. to understand whether the reported behavior is a bug labels Jan 15, 2024
@fisker
Copy link
Member

fisker commented Jan 15, 2024

Ah, supported since May, 2023. angular/angular#49535

@fisker fisker added status:needs discussion Issues needing discussion and a decision to be made before action can be taken and removed status:needs investigation Issues that need additional investigation, e.g. to understand whether the reported behavior is a bug labels Jan 15, 2024
@fisker fisker self-assigned this Jan 15, 2024
@fisker
Copy link
Member

fisker commented Jan 15, 2024

It seems still not supported in call arguments.

Prettier 3.2.2
Playground link

--parser angular
--print-width 120

Input:

<div
  *ngIf="call(  a)"
>
</div>

Output:

<div *ngIf="call(a)"></div>

Prettier 3.2.2
Playground link

--parser angular
--print-width 120

Input:

<div
  *ngIf="call(  a,)"
>
</div>

Output:

SyntaxError: Unexpected token )

@fisker fisker linked a pull request Jan 15, 2024 that will close this issue
Open
4 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@fisker fisker

Labels
lang:angular Issues affecting Angular template (not general JS/TS issues used for Angular) status:needs discussion Issues needing discussion and a decision to be made before action can be taken
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Respect trailingComma in angular templates fisker/prettier
2 participants
@fisker @mmeylan