Canvas2D filter and reset

[benjamind]

Description

The Canvas2D filter and reset functionality are the last two remaining pieces for full cross browser support for the Canvas2D APIs.

https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-reset
https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-filter-dev

The reset functionality is of somewhat lesser importance and I don't think it is widely used, but Canvas2D filter support is extremely powerful and needs tests. Currently it is unimplemented in Safari only.

The filter functionality is in use by our apps at Adobe, though we are now having to build workarounds.

Specification

https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-reset

Open Issues

No response

Tests

No response

Current Implementations

• Blink
• Gecko
• WebKit

Standards Positions

No response

Browser bug reports

https://bugs.webkit.org/show_bug.cgi?id=198416

There is an open PR for over a year, so support for this should be easy to land.

Developer discussions

No response

Polls & Surveys

No response

Existing Usage

No response

Workarounds

No good workarounds exist without full re-implementation of the filter functionality in WebGL and juggling of image data between Canvas2D and WebGL contexts to achieve the same effects. As far as I can see no polyfills exist.

Accessibility Impact

No response

Privacy Impact

No response

Other

No response

[tomayac]

FYI, here's a test case for CanvasRenderingContext2D.filter for how it should look like: https://canvas-svg-filter.glitch.me/:

[nt1m]

Canvas2D reset is shipping in STP fwiw

[fserb]

I think it would be more useful to change this from "filter and reset" to "layers (with filter support) and reset", as current WhatWG discussions pointed out that filter support on layers is the agreed path forward by all browsers.

[foolip]

@fserb can you link to the WHATWG issue where that's being discussed?

[foolip]

Looks like @fserb is out of office, but I found whatwg/html#8476 + whatwg/html#9537.

[foolip]

@nairnandu and I have discussed with @fserb to understand the layers suggestion. Google would like to suggest adjusting the scope of this to be layers, which is the agreed-upon way to do filters. The complete test list would be:

• https://wpt.fyi/results/html/canvas/element/layers?label=master&label=experimental&aligned
• https://wpt.fyi/results/html/canvas/element/reset?label=master&label=experimental&aligned
• https://wpt.fyi/results/html/canvas/offscreen/layers?label=master&label=experimental&aligned
• https://wpt.fyi/results/html/canvas/offscreen/reset?label=master&label=experimental&aligned

[foolip]

Thank you for proposing Canvas2D filter and reset for inclusion in Interop 2024.

We wanted to let you know that this proposal was not selected to be part of Interop this year.

This is because we got many more proposals than we could include in this year's project. Note that individual vendors may nevertheless choose to advance work in this area during the forthcoming year. We would welcome this proposal being resubmitted again next year if necessary.

For an overview of our process, see proposal selection. Thank you again for contributing to Interop 2024!

Posted on behalf of the Interop team.