search

obsproject / obs-browser

CEF-based OBS Studio browser plugin
GNU General Public License v2.0
769 stars 217 forks source link

mix-blend-mode=plus-lighter with partial transparency completely removes elements behind it #425

Open FugiTech opened 8 months ago

FugiTech commented 8 months ago

Operating System Info

Windows 11

Other OS

No response

OBS Studio Version

29.1.3

OBS Studio Version (Other)

No response

OBS Studio Log URL

N/A

OBS Studio Crash Log URL

N/A

Expected Behavior

If you create a browser source that contains two elements that should crossfade into eachother (using linear opacity transitions and mix-blend-mode=plus-lighter), then swapping the opacity should result in the two elements doing a crossfade transition.

A minimal example is provided at https://codepen.io/fugiman/pen/mdvRGMm

I have confirmed this works in Chrome v118 and Chromium v103 (which I believe is what the CEF in OBS 29.1.3 is forked from)

Current Behavior

Instead, on OBS 29.1.3 the bottom element will completely disappear during the transition, and the top element will blend with the background. At the end of the transition the bottom element will snap in at the correct opacity.

In other words, if you are transitioning from bottom -> top, bottom will immediately disappear and top will fade in slowly, ending with top fully visible transitioning from top -> bottom, top will slowly fade away, and then at the end bottom will snap in completely visible.

Steps to Reproduce

  1. Load https://codepen.io/fugiman/pen/mdvRGMm in Chromium 103 (or Chrome 119) and see the expected behavior
  2. Load in OBS 29.1.3 browser source and see the blue square disappearing

Anything else we should know?

No response

WizardCM commented 8 months ago

I can confirm the issue, but I don't know if it's something we can fix.