Bug 138162 - Partially rendered translate3d(0,0,0) menus after zooming in
Summary: Partially rendered translate3d(0,0,0) menus after zooming in
Status: RESOLVED WORKSFORME
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: Safari 9
Hardware: iPhone / iPad iOS 9.3
: P2 Normal
Assignee: Nobody
URL: http://jsbin.com/dukoxo/1
Keywords: HasReduction, InRadar
Depends on:
Blocks: 159753
  Show dependency treegraph
 
Reported: 2014-10-28 17:32 PDT by Chris Rebert
Modified: 2019-07-29 18:32 PDT (History)
6 users (show)

See Also:


Attachments
GIF video of the bug occurring (135.17 KB, image/gif)
2014-10-28 17:32 PDT, Chris Rebert
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
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:

.navbar-fixed-top,
.navbar-fixed-bottom
{
  -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
<rdar://problem/18807031>
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.