do not wrap font family name

[nturgut]

do not wrap font family name in webkit otherwise icons not show on safari 13 (both IOS and desktop)

Manually tested using Flutter Gallery app and other additions:

• Iphone with safari 12
• Iphone with safari 13
• Desktop with safari 13
• Firefox Desktop
• Chrome Desktop
• Chrome on Android

Additional fonts/icons tested:
"MdiIcons" (package:material_design_icons_flutter/material_design_icons_flutter.dart)
"Lucida" Grande

Fixes the issue: flutter/flutter#41218
Fixes the issue: flutter/flutter#41483

[yjbanov]

LGTM if LGT @hterkelsen

[mdebbar]

LGTM if LGT @hterkelsen

[mdebbar]

Instead of listing all the possible punctuation symbols, is it possible to use something like this: RegExp(r"[^a-z0-9 ]", caseSensitive: false)? Which matches anything other than an alphabet or digit or whitespace.

[harryterkelsen]

I think we should just try to match the whole family name with a regex for CSS identifiers: https://developer.mozilla.org/en-US/docs/Web/CSS/custom-ident

so something like

RegExp(r"[a-zA-Z][a-zA-Z0-9\-_]*")

[nturgut]

@hterkelsen
I think using one regex for all the matches will create maintance/readibility issues. The correct regex for a valid family is very long and hard to understand in the first look.

If we use:
static final RegExp cssIdentifiers = RegExp(r"[a-zA-Z][a-zA-Z0-9\-_]*");

This does not cover valid cases such as:

• Gill Sans Extrabold
• ahem ahem

If we add the whitespace and use:

static final RegExp cssIdentifiers = RegExp(r"[a-zA-Z][a-zA-Z0-9\-_\s]*");
this also does not recognize invalid cases such as:

• Ahem 1989
• Goudy Bookletter 1911

We can also add the digit starting token case using \b\d yet this will make the regex even longer.

Please let me know if you have a suggestion for simpler regex? Otherwise use 2 regex one @mdebbar 's other is the digit check:

static final RegExp notPunctuation = RegExp(r"[^a-z0-9\s]", caseSensitive: false);
static final RegExp startWithDigit = RegExp(r"\b\d");

Note (the documentation):
"Font family names must either be given quoted as strings, or unquoted as a sequence of one or more identifiers. This means that punctuation characters and digits at the start of each token must be escaped in unquoted font family names."

[harryterkelsen]

You could do:

static final RegExp cssIdentifiers = RegExp(r"[a-zA-Z][a-zA-Z0-9\-_]*(\s[a-zA-Z][a-zA-Z0-9\-_]*)+");

[nturgut]

Please check the new version :)

I believe it is very readable. It has two parts but each of them are very small.

Thanks for the review!

[harryterkelsen]

I think we should just try to match the whole family name with a regex for CSS identifiers: https://developer.mozilla.org/en-US/docs/Web/CSS/custom-ident

so something like

RegExp(r"[a-zA-Z][a-zA-Z0-9\-_]*")

[nturgut]

I'll send one more commit. Thanks for all the comments.