mat-form-field required asterisk has preceding   that fails to collapse with prior whitespace

[stevenyxu]

What is the expected behavior?

When a <mat-label> has trailing whitespace (e.g., due to a formatter putting </mat-label> on a new line and the template compiler not collapsing whitespace) and the field is required, there should be one space between the label and the asterisk.

What is the current behavior?

There are two spaces.

https://stackblitz.com/edit/angular-h3fng3?file=app/form-field-label-example.html

mat-form-field adds  * to the label when the field is required.

https://github.com/angular/material2/blob/master/src/lib/form-field/form-field.html#L55

The surrounding .mat-form-field-label already has white-space: nowrap so   doesn't serve any additional nowrapping function I know of.

https://github.com/angular/material2/blob/master/src/lib/form-field/form-field.scss#L98

What are the steps to reproduce?

https://stackblitz.com/edit/angular-h3fng3?file=app/form-field-label-example.html

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Current, since at least d6fec35. All browsers in theory, though I haven't tested.

Is there anything else we should know?

I'll send a PR to see how it integrates. It'll likely trivially break many screendiff tests.

[josephperrott]

Closed by #15490

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}