Closed Bug 682627 Opened 8 years ago Closed 8 years ago

Layout regression on f8.facebook.com (css3-3d-transforms detection)

Categories

(Tech Evangelism Graveyard :: English US, defect)

x86
macOS
defect
Not set

Tracking

(firefox9-)

VERIFIED WORKSFORME
Tracking Status
firefox9 - ---

People

(Reporter: Ehsan, Unassigned)

References

()

Details

(Keywords: regression)

I noticed that when scrolling, f8.facebook.com behaves really badly.  The globe on that page doesn't scroll, and jitters to try to maintain its fixed vertical position.

I bisected this, and here's the result:

The first bad revision is:
changeset:   73745:74eac3a09043
user:        Matt Woodrow <mwoodrow@mozilla.com>
date:        Wed Aug 03 15:04:20 2011 +1200
summary:     Bug 505115 - Part 8b - Add 3D Point support, and ray tracing to gfx3DMatrix. r=bjacob, sr=roc
Assignee: nobody → matt.woodrow
I think dis is site issue. 
because the problem seems to be gone if I modified https://s-static.ak.facebook.com/rsrc.php/v1/y_/r/q7O-h0eYH2K.js as follows.

 function transform3d(elem,x,y,z) {
   if (z > 500) {
     elem.setAttribute('style','display: none;');
   } else {
     if (window.has3d) {
-      //elem.setAttribute('style','-webkit-transform: translate3d('+x+'px,'+y+'px,'+z+'px);');
     } else {
       var scaleFactor = 1 + (z / 100);
       elem.setAttribute('style','-moz-transform: scale(' + scaleFactor +') translate('+x/4+'px,'+y+'px);');
     }
   }
 }
Thanks for this Ehsan and Alice!

This is a duplicate of bug 677173, because the Modenizr library is detecting the MozPerspective css property and assuming we support 3d transforms (which are still enabled by default currently).

There's still a website bug here in that they only set the -webkit-transform property, so this will still be broken once 3d transforms are enabled by default.
Sorry, *disabled by default currently.
Summary: Layout regression on f8.facebook.com → Layout regression on f8.facebook.com (css3-3d-transforms detection)
Assignee: matt.woodrow → english-us
Component: Style System (CSS) → English US
Product: Core → Tech Evangelism
QA Contact: style-system → english-us
Version: Trunk → unspecified
Morphing to Tech Evangelism for the issue that Facebook is sending us -webkit-transform when they detect we support 3D transforms.
Has someone contacted them already?
Do we have a technical contact from Facebook?  I know a couple of people there but not sure if they're the right people to approach about this.
I've reported this internally (and hopefully CC'd the right account)
Thanks for Cc'ing browser-bugs@fb.com, Rob, that's indeed the right account. Feels like this is also an issue with Modernizer. Copying Faruk Ateş and Paul Irish.
Modernizr is fine (at least once we fix bug 677173, which we plan to before release), as far as I can tell.
... but note that fixing bug 677173 will defer this facebook problem from being visible until we really enable 3d transforms.
Isn't modernizer inferring support for A by testing presence of B?
It's assuming that support for the 'perspective' property from the 3D Transforms draft implies support for 3D Transforms and that therefore "has3d" should be set to true.

That's all modernizr does here; the code that assumes that "has3d" means support for "-webkit-transform: translate3d" is site code.
My bad. Thanks for clarifying.
This should be fixed, now.
Well, the website has changed, and it no longer includes the effect that I saw in comment 0.
Status: NEW → RESOLVED
Closed: 8 years ago
Resolution: --- → WORKSFORME
Which explains why the task was closed without an attached diff. Well, again: my bad.
Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:11.0a1) Gecko/20111206 Firefox/11.0a1

https://f8.facebook.com/ has changed and the current version works fine.
Status: RESOLVED → VERIFIED
Product: Tech Evangelism → Tech Evangelism Graveyard
You need to log in before you can comment on or make changes to this bug.