bug(TYPOGRAPHY): mat-typography css class only working after mat.typography-hierarchy($theme)

[anschm]

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.1.3

Description

The css class .mat-typography on the body html tag does only work if the following line of code was executed at the theming:

$theme: mat.define-light-theme((
color: (
....
),
typography: mat.define-typography-config()
));

@include mat.all-component-themes($theme);
@include mat.typography-hierarchy($theme);

In angular 14 the typography was generated by default and provided by the css class mat-typography to the content. This is described at the documation for angular material 15 at the same way. But the typography style is not provided to the content. All p HTML-Tags have font family Times. After doing mat.typography-hierarchy($theme) all works. I don't know whether this is new and the documentation should changed or it is a bug.

Reproduction

1.) Create a angular project with angular material
2.) Create a custom theme
3.) Add mat-typography ass css class to the body tag

Expected Behavior

All elements have the same font familiy

Actual Behavior

Different font-families on different elements.

Environment

• Angular: 15.0.1
• CDK/Material: 15.0.1
• Browser(s): Chrome
• Operating System (e.g. Windows, macOS, Ubuntu): MAC M1

[sergidt]

same issue here!

good catch @anschm
I can confirm, it only works as expected after adding:
@include mat.typography-hierarchy($theme);

[crisbeto]

Duplicate of #26524.

[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.}