1170394 - WebVR-rendered container layers don't properly support intermediate surface rendering (opacity, css filters, etc.)

Status: RESOLVED FIXED

(Core :: Graphics, defect)

Description

[Josh Carpenter [:jcarpenter]]

Attachment: cssfilter-transfor3D-animation-glitch.mov

Am experimenting with CSS filters in web VR prototypes and seeing glitches when animating the transform of an element that has a css filter applied. The type and number of filters does not seem to matter. In every case, the visibility of the animated element pops in and out erratically for the duration of the tween.

Screencap attached. That's taken from fullscreen VR mode, but the behavior is the same in normal mode.

=== Code ===

.container {
  height: 40cm;
  width: 30cm;
  filter: grayscale(0.5) blur(10px);
}

*:-moz-full-screen .container--mono {
  transform: translate(-50%, -50%) translate3d(0, 0, -34cm);
}

@keyframes container-pushBack {
  from {
    transform: translate(-50%, -50%) translate3d(0, 0,  -34cm) scale(1, 1);
  }
  to { 
    transform: translate(-50%, -50%) translate3d(0, 0,  -38cm) scale(0.75, 0.75);
  }
}

... And am specifying the css animation rules in JS as: 'container-pushBack 0.3s ease forwards';

Comment 1

[Josh Carpenter [:jcarpenter]]

Sorry, very important caveat to mention: these glitches are being observed in a VR web app that we're building on top of modified versions of Gecko. So it's very possible that the graphics work being landed by Jip and Vlad may be the root cause. I have not had a chance to generate a test in standard Nightly or Release yet.

Comment 2

[Jeff Muizelaar [:jrmuizel]]

Can you test in standard Nightly and attach a test case?

Comment 3

[Josh Carpenter [:jcarpenter]]

Hi Jeff, sure thing. Will follow up.

Comment 4

[Vladimir Vukicevic [:vlad] [:vladv] (needinfo me, slow to respond)]

This is a webvr-only bug -- there is currently brokenness in DefaultComputeEffectiveTransforms that causes using an intermediate surface (which is needed for filters/opacity) to not work.

Comment 7

[:kip (Kearwood Gilbert)]

The CSS VR rendering path involved in this bug has been removed as part of WebVR 1.1