Difference in blending modes between FF and Chrome

Report Construct 2 bugs here.

Post » Tue Jan 27, 2015 1:45 pm

Problem Description
Apparently for at least the blend mode "Destination Out" FireFox 35.0.1 and Chrome 40.0.2214.93 m seem to display the same thing in a different fashion.

Description of Capx
Based on the example "Blendmodes.capx" provided with C2.
The capx is supposed to display the result of the same blend mode applied to a sprite over another.
Both Sprite (the cog) and Sprite 2 (the HTML5 logo) are in the layer effects which forces texture on.
I added another instance of Sprite2 in the layer background for the purpose of the demonstration. I also added the drag drop behavior to the Sprite 2 to make it easier to experiment.

Steps to Reproduce Bug
  • Execute the capx in Chrome
  • Drag drop the biggest HTML5 logo, all works as expected, notice how the big logo in the background appears on a deeper layer and how the smallest logo keeps its colors.
  • Execute in FF
  • Notice how the bigger logo appears to be in front of the other images. Notice how the smaller logo has its colors changed and "overexposed" when being overlapped by the bigger logo.

Observed Result
In FF the colors of the smaller logo change and seems overexposed.
The layer's order does not seem to be respected as well.

Expected Result
The display that happens in Chrome to be the same in FF.

Affected Browsers
  • Chrome: (YES)
  • FireFox: (YES)
  • Internet Explorer: (Not tested)

Operating System and Service Pack
Win 7 pro SP1

Construct 2 Version ID
R195
You do not have the required permissions to view the files attached to this post.
New to Construct ? Where to start

Image Image

Image Image

Please attach a capx to any help request or bug report !
Moderator
B
289
S
112
G
94
Posts: 7,333
Reputation: 69,293

Post » Tue Jan 27, 2015 4:22 pm

I tested out the capx in FF, Chrome, NodeWebkit, and IE.
I seem to get the same additive blending effect in FF.

Below is an image showing screenshot comparisons of the four platforms I tested.
I changed the background image to a stone texture with a sharply defined edge, to make the FireFox blending behavior easier to see.

bug - blend mode - destination out.png

At the far right is a recreation of the FF example composed entirely in Photoshop, with the Logo set to additive (Linear Dodge) blend, and overlapping the stone. I lined up the recreation to match the FF example, down to the pixel, and the resulting Photoshop recreation is exactly identical to the FF version.
So it looks like FF really is using the additive blending mode for some reason.

FF: v35.0
Chrome: v40.0.2214.93 m


Hope this helps out.
You do not have the required permissions to view the files attached to this post.
B
27
S
18
G
8
Posts: 327
Reputation: 6,156

Post » Tue Jan 27, 2015 6:32 pm

Huh, looks like a bug in Firefox. Chrome and IE seem to display it right...
Scirra Founder
B
395
S
233
G
88
Posts: 24,376
Reputation: 193,842

Post » Tue Jan 27, 2015 7:36 pm

I made a report : https://bugzilla.mozilla.org/show_bug.cgi?id=1126444
Feel free to add any informations that would add to it.
New to Construct ? Where to start

Image Image

Image Image

Please attach a capx to any help request or bug report !
Moderator
B
289
S
112
G
94
Posts: 7,333
Reputation: 69,293


Return to Bugs

Who is online

Users browsing this forum: No registered users and 1 guest