Bug 138162

Summary: Partially rendered translate3d(0,0,0) menus after zooming in
Product: WebKit Reporter: Chris Rebert <webkit>
Component: CSSAssignee: Nobody <webkit-unassigned>
Severity: Normal CC: eoconnor, hnrch02+webkit, migiwa, philippe.wang, simon.fraser, webkit-bug-importer
Priority: P2 Keywords: HasReduction, InRadar
Version: Safari 9   
Hardware: iPhone / iPad   
OS: iOS 9.3   
URL: http://jsbin.com/dukoxo/1
Bug Depends on:    
Bug Blocks: 159753    
Description Flags
GIF video of the bug occurring none

Description Chris Rebert 2014-10-28 17:32:54 PDT
Created attachment 240582 [details]
GIF video of the bug occurring

Original Bootstrap bug report: https://github.com/twbs/bootstrap/pull/14603

To repro:
1. Open iOS Simulator for iPad 2 + iOS 8
2. Open Safari in the simulator
3. Open http://jsbin.com/dukoxo/1 in Safari
4. Zoom in on the navbar
5. Click/tap the left "Dropdown", then the right "Dropdown". (Note that a menu appears below the clicked "Dropdown".)
6. (You might need to repeat #5 a couple times)
7. The menu that appears below the right Dropdown will misrender, with a white rectangle obscuring the right half of the menu.

See also the GIF video in this comment: https://github.com/twbs/bootstrap/pull/14603#issuecomment-56440223

The bug is provoked by this portion of the page's CSS:

  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);

Removing these translate3d transforms avoids the bug.
Comment 1 Radar WebKit Bug Importer 2014-10-28 21:56:18 PDT
Comment 2 Chris Rebert 2014-10-28 22:01:47 PDT
(This was also filed as <rdar://problem/18804973> )
Comment 3 Simon Fraser (smfr) 2014-10-28 22:04:40 PDT
Does this reproduce on iPhone/iPad devices?
Comment 4 Chris Rebert 2014-10-28 22:28:12 PDT
It has been reproduced on
an iPad running iOS 7.1.2
and an iPhone 5S running iOS 7.0.4.

Haven't had the chance to test against physical iOS 8 devices.
Comment 5 Heinrich Fenkart 2014-10-28 23:23:00 PDT
I reproduced just now on an iPad mini (MD528FD/A) running iOS 8.1 (12B410) and on an iPhone 5 (MD297DN/A) also running iOS 8.1 (12B411)
Comment 6 Simon Fraser (smfr) 2014-10-29 11:53:33 PDT
This only happens when you zoom in.
Comment 7 Simon Fraser (smfr) 2014-10-29 13:24:02 PDT
I reproduced this same bug on an iPhone running iOS 7, so it's not a regression in iOS 8.
Comment 8 Simon Fraser (smfr) 2014-10-29 15:48:24 PDT
I think what's happening here is that when clicking on the dropdowns, the GraphicsLayer is changing size from BIG to SMALL temporarily, but a bunch of repaints come in when it's SMALL and we clip them using layer size. Then it gets resized to BIG again (but we don't repaint the new area), then process the (clipped) repaint rects.
Comment 9 philippe.wang 2016-07-06 06:17:28 PDT
reproduced today on an iPhone 5 with iOS 9.3.2 :(
Comment 10 Chris Rebert 2016-09-17 23:16:50 PDT
I can't seem to repro with iOS 10.0.1 on iPhone 5S.