On Tue, Feb 10, 2015 at 12:25 PM, Boris Zbarsky <[email protected]> wrote:

> Consider this document:
>
> <!DOCTYPE html>
> <html style="filter: invert(90%);">
> Some text
> </html>
>
> Note that in this document the <html> has a transparent background but a
> black text color by default in browsers.  The canvas has a white background
> by default in browsers.
>
> The spec text says:
>
>   Conceptually, any parts of the drawing are effected by filter
>   operations. This includes any content, background, borders, text
>   decoration, outline and visible scrolling mechanism of the element
>   to which the filter is applied, and those of its descendants.
>
> The canvas background is not part of the "element to which the filter is
> applied", so per the current spec this document should render with light
> gray text on a white background.
>
> This is what Firefox does.  Chrome instead seems to make the canvas
> background black.
>
> Which behavior do we want here?  What about other cases of filters being
> applied to the root element?  Do we want to effectively propagate these
> filters to the viewport, like CSS does with 'overflow' and backgrounds on
> the root element?


We ran into the same issue with 'mix-blend-mode' on the root element.
Tab updated CSS Color level 4 to include the following:

The default background of the root element must be transparent. The default
color of the canvas (the surface on which the document is painted) is
UA-dependent, but is recommended to be white, especially if the above
colorrules are used.


So, Firefox is following the spec and Chrome should change its behavior.

Reply via email to