Skip to content

bug(MatDialogTitle): Whitespace rendered when content of enclosing tag is wrapped #26896

@Ollitod

Description

@Ollitod

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

14

Description

We basically wrap the content of every tag in our source code. After upgrading Material to v15, we noticed that the whitespaces which are rendered around the content of an element annotated with mat-dialog-title are also visible on the UI. This was not the case in Material v14. In both versions when inspecting the DOM, you can see that whitespaces are visible around the text. The following example illustrates the problem:

This ...

<h2 mat-dialog-title>
  Text content
</h2>

... will be rendered as " Text content " in the DOM.

In Material v14 these whitespaces were simply ignored in by the MatDialogTitle, but since v15 they are actually visible on the UI as described above.

Material v14:
image

Material v15:
image

Reproduction

Steps to reproduce:

  1. Wrap content of a tag annotated with mat-dialog-title
  2. Inspect the DOM in the browser (Chrome)
  3. See the rendered whitespace in front of the text

Expected Behavior

The whitespaces are ignored by MatDialogTitle

Actual Behavior

The whitespaces are visible on the UI like " Text content "

Environment

  • Angular: 15.2.4
  • CDK/Material: 15.2.4
  • Browser(s): Chrome (110.0.5481.177 (Offizieller Build) (x86_64))
  • Operating System (e.g. Windows, macOS, Ubuntu): macOS Ventura

Metadata

Metadata

Assignees

Labels

needs triageThis issue needs to be triaged by the team

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions