1893956 - When open bilibili.com as desktop site, zooming will causing stripe appear in the video player, for example, https://www.bilibili.com/video/BV1QD4y1f7jo/

Status: RESOLVED FIXED

(Core :: Graphics: WebRender, defect)

Description

[Tom25519]

Steps to reproduce:

1. Open https://www.bilibili.com/video/BV1QD4y1f7jo/
2. Enable "Desktop site"
3. Zooming

Actual results:

Stripe appear in the video player.

Expected results:

This bug shouldn't appear.

Comment 1

[Tom25519]

Attachment: Screenrecorder-2024-04-29-12-34-42-605.mp4

Comment 2

[Jamie Nicol [:jnicol]]

I made a reduced test case here: https://codepen.io/jamienicol/pen/QWXPZbG . This reproduces 100% reliably in the "full" codepen view, but only some of the time in the "debug" view. The header bar and iframe in the full view must affect the positioning or something, but not sure why it reproduces some of the time in debug view.

This bug actually doesn't reproduce for me any more on my Pixel 8, it was fixed by bug 1880346. That made us use hardware decoding for AV1 whereas previously we were using software decoding. Presumably the bug will still occur on devices that do not support hardware decoded AV1, and potentially other software-decoded video formats on other websites.

With hardware decoding, webrender handles the video as an RGB image. For software decoding, webrender receives a YUV image. The difference is that in the YUV case we create the compositor surface as an Underlay, as opposed to an Overlay for RGB.

In Underlay mode, we render a cutout to the picture cache tiles. During low-quality zooming, when we composite both the picture tiles and the underlay surface with a scale, the cutout does not align exactly with the surface, resulting in a 1 pixel wide seam at the video edges. It might be possible to ensure these are aligned correctly whilst zooming. Though with linear sampling the cutout edge presumably gets blurred and I'm not sure how to avoid that.

Also, in underlay mode, the picture cache tiles get invalidated every frame, negating the purpose of low-quality zoom mode. Overlay mode does not have this issue. So I think the best solution here is to disallow Underlay surfaces during an active low quality pinch zoom

Comment 3

[Jamie Nicol [:jnicol]]

My reduced test case also encounters another cause of seams similar to bug 1894106. In that bug we ensured that a compositor tile's rect and clip rect were both converted to device space on the CPU. However, the clip_rect (calculated here gets round()ed by the call to CompositeState::get_device_rect(), whereas the rect (calculated here does not. I'm not sure how I missed that when fixing the original bug, but the solution is to round() in both places.

Comment 4

[Jamie Nicol [:jnicol]]

Attachment: Bug 1893956 - Disallow underlay compositor surfaces during low-quality pinch zoom. r?#gfx-reviewers

Underlay compositor surfaces require a cutout to be rendered to the
picture cache tiles above the underlay. During low-quality pinch zoom
the screen position of the cutout after the picture cache tiles have
been composited may not align exactly with the position of the
underlay surface which is composited directly. This can result in
visible seams along the edges of video.

Additionally, in underlay mode picture tiles still get invalidated
during a low quality zoom, which results in worse performance.

This patch therefore disallows Underlay compositor surfaces whilst a
low-quality pinch zoom is active.

Comment 5

[Jamie Nicol [:jnicol]]

Attachment: Bug 1893956 - Ensure consistent rounding for draw compositor tile and clip rects. r?#gfx-reviewers

In bug 1894106 we ensured that draw compositor tiles' tile rects and
clip rects were both calculated on the CPU, to avoid visible seams
whilst low-quality pinch zooming. However, the clip_rect's calculation
uses CompositeState::get_device_rect(), which rounds the rect, whereas
the newly added tile rect calculation used a raw call to
ScaleOffset::map_rect(), which does not. This means that seams still
sometimes flicker whilst zooming. This patch fixes this by using
CompositeState::get_device_rect() for the tile rect calculation as
well, ensuring consistent rounding.

Comment 6

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/c37e3c5bd749
Disallow underlay compositor surfaces during low-quality pinch zoom. r=gfx-reviewers,nical
https://hg.mozilla.org/integration/autoland/rev/6503e8e0e009
Ensure consistent rounding for draw compositor tile and clip rects. r=gfx-reviewers,nical

Comment 7

[Cristian Tuns]

https://hg.mozilla.org/mozilla-central/rev/c37e3c5bd749
https://hg.mozilla.org/mozilla-central/rev/6503e8e0e009