angular / angular/components

bug(material/list): Whitespace before the content in list in v15

Open
#26,164 8 comments 8 reactions 0 assignees View on GitHub
area: material/list P2 regression
Dominant language
TypeScript
Stars
25k
Forks
6.8k
Avg merge
1d 8h
Merged PRs (30d)
91

Description

### Is this a regression?

Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

v14

### Description

In your html template, if you break line, a blank space will render inside the content of your list item line.

### Actual Behavior

![image](https://user-images.githubusercontent.com/12090931/205303458-e4693251-797f-4c7b-aeb0-e6c675b2786a.png)

![image](https://user-images.githubusercontent.com/12090931/205303511-8a558b08-ebec-4812-b5f4-c9e030ab7856.png)

![image](https://user-images.githubusercontent.com/12090931/205303792-0cd975b4-57b9-434c-9a69-b19e4491c60b.png)

---------

#### This Works, but my prettier configuration doesn't allow it

![image](https://user-images.githubusercontent.com/12090931/205303609-bf6fadec-8f7b-4546-9670-21f8778e8b24.png)

![image](https://user-images.githubusercontent.com/12090931/205303647-5b755fb1-2e80-4d13-a3f7-0a4cc2f953ef.png)

![image](https://user-images.githubusercontent.com/12090931/205303718-76db51d2-af20-4bda-a03a-74ad84c3f90c.png)

### Environment

- Angular: v15
- CDK/Material: v15
- Browser(s): Chrome

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the Angular Material list case from the issue: place the list item's content on a new line in an Angular v15 template and compare the rendered whitespace with v14. Done means the line break no longer creates an unwanted leading space while the documented formatting remains usable.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.