1577739 - CSS invert() function does not operate on root element of HTMLDocument

Status: RESOLVED DUPLICATE of bug 1423746

(Core :: Web Painting, defect, P3)

Description

[Nicholas Shanks]

Attachment: invert-root-element-reduction.html

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.132 Safari/537.36

Steps to reproduce:

1. Add :root{filter:invert(1)} to your CSS

Actual results:

The filter is not applied.

Expected results:

The entire document tree would be inverted. The behaviour should match that which any other element would present.

Chrome also has this bug, Safari does not. crbug.com/999491

Comment 1

[Timea Cernea [:tbabos][inactive]]

Reproduced this on all latest Firefox versions on Windows 10 x64. Moving it over to component, thanks for the report!

Comment 2

[Emilio Cobos Álvarez (:emilio)]

I think this is related to bug 1423746 and all the discussion in https://github.com/w3c/fxtf-drafts/issues/282.

I think we should fix bug 1423746 and this together by propagating the filters from the document element to the viewport, not the document element box.

Matt, do you agree? If so, what's the best way to propagate the filters to the viewport? I didn't see anything obvious for how we propagate the background for example...

Comment 3

[Matt Woodrow (:mattwoodrow)]

I think that sounds reasonable, though mstange is probably the best person to decide.

Background propagating is implemented using nsCSSRendering::FindBackgroundFrame. The ViewportFrame doesn't create any background items, and nsCanvasFrame will find the frame/style context for the viewport frame when looking up which background to paint.