ampproject / ampproject/amphtml

Add `allow-important` for `style[amp-runtime]` on a transformed document

Open
#37,761 6 comments 0 reactions 2 assignees Claimed by @erwinmombay View on GitHub
P2: Soon Stale Type: Feature Request WG: caching
Dominant language
JavaScript
Stars
14.9k
Forks
4.1k
PR merge metrics
No merged PRs in 30d

Description

### Description

The issue we're currently seeing with the PHP AMP Toolbox (https://github.com/ampproject/amp-toolbox-php/issues/496) is that the SSR-produced version of the page includes `!important` tags in the `` element, as they are coming from the `amp-runtime.css` and from extensions like `amp-ad`.

This currently would mean that SSR is not a viable option, as it includes inlining the CSS that makes up the AMP runtime and the extensions. If that cannot be done, the whole approach of SSR is without value.

So, in that regard, the `!important` tag would need to be supported within the `<style amp-runtime>` element on a _transformed_ document as well. If not, any try at doing SSR will lead to validation errors in the Google Search Console.

### Alternatives Considered

We couldn't come up with a viable alternative so far. Here's what we considered:

* removal of the `!important` tags before inlining would break the layout
* not inlining breaks/invalidates SSR

### Additional Context

SSR applies the transformations that the AMP Cache would do, but does them on the origin server. As such, SSR moves these transformations from _after the validation to _before the validation. Therefore, validation needs to be able to take SSR transformations into account. This includes applying whatever CSS AMP would apply via the runtime without SSR, and that includes the `!important` tag.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.