Deprecation warning when passing a list fonts to mat-typography-config

[josh18]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

mat-typography-config accepts a list of fonts.

What is the current behavior?

mat-typography-config throws a deprecation error:

DEPRECATION WARNING: Passing "Open Sans", sans-serif, a non-string value, to unquote() will be an error in future versions of Sass.

What are the steps to reproduce?

$custom-typography: mat-typography-config(
    $font-family: 'Open Sans', sans-serif;
);

[crisbeto]

What version of SASS are you running?

[josh18]

4.5.3 I think based on the version of node-sass in my node_modules directory. It is built using angular-cli so not 100% sure how it all fits together.

[crisbeto]

That's the one we're using as well. FWIW, I'm not sure how you didn't get a compilation error in the first place since the value is supposed to always be a string. I'll update the doc example to be clearer on the intended usage. Here's how it should work for you:

$custom-typography: mat-typography-config(
    $font-family: "'Open Sans', sans-serif";
);

[josh18]

Ah you are right, it does throw a compile error if you put in 'Open Sans', sans-serif 😳. However if you use a variable it throws the deprecation warning, e.g.:

$myFontFamily: 'Open Sans', sans-serif;

$custom-typography: mat-typography-config(
    $font-family: $myFontFamily;
);

So I guess the answer is to use the quote function:

$custom-typography: mat-typography-config(
    $font-family: quote($myFontFamily);
);

This issue can be closed unless you want to keep it open for the documentation update?

[crisbeto]

Ah good to know about the variable approach. We should be able to handle that one automatically. Let's keep the issue open for tracking purposes.

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