When the camera app is under high load (perhaps when memory is swapping?) and/or when the shutter button is tapped very, very rapidly, it sometimes animates as a square rather than as a circle. I've seen this in both camera and video mode. You can see it in the video that was recorded for bug 1066885: http://youtu.be/8-mlqgAvaUY I find it fairly easy to reproduce this by just tapping a fast as I can on the shutter button in either mode. We know (from bug 1066885, for example) that the camera code can get stuff out of sync when buttons are pushed really rapidly. What if js/controllers/controls.js calls captureHighlightOff while the captureHighlightOn animation is still happening? Or vice versa? Could either of those things cause the border-radius of an animated element to change in mid-animation? On the other hand, this seems like it could be a platform bug. If I were investigating, I'd ask someone in #gfx if they know whether css animations ever intentionally drop details like border-radius settings to speed things up under high load.
Wilson: I think all of the shutter button CSS animation code is yours, right? Is this something you've got time to investigate?
This is a platform bug I've seen in the past. The `will-change` property first surfaced this bug. I believe it's related to layer masks breaking. We could fiddle around with CSS to see if there is anything we can do to avoid it, but that's not fixing the root of the problem. I'm on PTO tomorrow, but can take a look next week.