Skip to content

Incorrect handling of @font-face nested in conditional At-rules (@media) #30

Open
@LanetheGreat

Description

@LanetheGreat

According to MDN's documentation on At-Rules Nesting, @font-face is allowed to be nested within conditional At-Rules such as @media but this library flags that as an error and strips it from the source CSS during parsing in these 2 spots:

  1. factories = {
    '@page': cssutils.css.CSSPageRule,
    '@media': CSSMediaRule,
    }
    if atval in (
    '@charset ',
    '@font-face',
    '@import',
    '@namespace',
    '@variables',
    ):
    self._log.error(
    'CSSMediaRule: This rule is not '
    'allowed in CSSMediaRule - ignored: '
    '%s.' % self._valuestr(tokens),
    token=token,
    error=xml.dom.HierarchyRequestErr,
    )
  2. if (
    isinstance(rule, cssutils.css.CSSCharsetRule)
    or isinstance(rule, cssutils.css.CSSFontFaceRule)
    or isinstance(rule, cssutils.css.CSSImportRule)
    or isinstance(rule, cssutils.css.CSSNamespaceRule)
    or isinstance(rule, cssutils.css.MarginRule)
    ):
    self._log.error(
    '%s: This type of rule is not allowed here: %s'
    % (self.__class__.__name__, rule.cssText),
    error=xml.dom.HierarchyRequestErr,
    )
    return

Found this out while parsing <style> tags from ConstantContact's email template previews to minify the CSS because they appear to use nested rules like this:

@media screen {
    @font-face{
        font-family: "Open Sans";
        font-style: normal;
        font-weight: 400;
        src: local("Open Sans Regular"), local("OpenSans-Regular"), url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVZ0bf8pkAg.woff2) format("woff2");
        unicode-range: u+0000-00ff,u+0131,u+0152-0153,u+02c6,u+02da,u+02dc,u+2000-206f,u+2074,u+20ac,u+2212,u+2215;
    }
    @font-face{
        font-family: "Merriweather";
        font-style: normal;
        font-weight: 400;
        src: local("Merriweather Regular"), local("Merriweather-Regular"), url(https://fonts.gstatic.com/s/merriweather/v19/u-440qyriQwlOrhSvowK_l5-fCZMdeX3rg.woff2) format("woff2");
        unicode-range: u+0000-00ff,u+0131,u+0152-0153,u+02c6,u+02da,u+02dc,u+2000-206f,u+2074,u+20ac,u+2212,u+2215;
    }
}

Errors:

ERROR   CSSMediaRule: This rule is not allowed in CSSMediaRule - ignored: @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v15/mem8YaGs126MiZpBA-UFVZ0bf8pkAg.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; }. [6:18: @font-face]
ERROR   CSSMediaRule: This rule is not allowed in CSSMediaRule - ignored: @font-face { font-family: 'Merriweather'; font-style: normal; font-weight: 400; src: local('Merriweather Regular'), local('Merriweather-Regular'), url(https://fonts.gstatic.com/s/merriweather/v19/u-440qyriQwlOrhSvowK_l5-fCZMdeX3rg.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; }. [6:376: @font-face]

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't workinggood first issueGood for newcomershelp wantedExtra attention is needed

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions