Bug 157482 - Horizontally-scrollable items with a 3d transform are rendered incorrectly in RTL when container has -webkit-overflow-scroll: touch
Summary: Horizontally-scrollable items with a 3d transform are rendered incorrectly in...
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: Safari 9
Hardware: iPhone / iPad iOS 9.3
: P2 Normal
Assignee: Simon Fraser (smfr)
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2016-05-09 12:38 PDT by Matthew Wetmore
Modified: 2016-05-10 18:56 PDT (History)
12 users (show)

See Also:


Attachments
A small HTML file reproducing the bug. (850 bytes, text/html)
2016-05-09 12:38 PDT, Matthew Wetmore
no flags Details
Fixed testcase (818 bytes, text/html)
2016-05-10 15:37 PDT, Simon Fraser (smfr)
no flags Details
Patch (5.99 KB, patch)
2016-05-10 17:07 PDT, Simon Fraser (smfr)
zalan: review+
buildbot: commit-queue-
Details | Formatted Diff | Diff
Archive of layout-test-results from ews103 for mac-yosemite (795.41 KB, application/zip)
2016-05-10 17:53 PDT, Build Bot
no flags Details
Archive of layout-test-results from ews104 for mac-yosemite-wk2 (785.00 KB, application/zip)
2016-05-10 17:54 PDT, Build Bot
no flags Details
Archive of layout-test-results from ews115 for mac-yosemite (1.39 MB, application/zip)
2016-05-10 18:12 PDT, Build Bot
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Matthew Wetmore 2016-05-09 12:38:34 PDT
Created attachment 278424 [details]
A small HTML file reproducing the bug.

In RTL, a set of inline elements within a horizontally-scrollable container will flow from right to left, and the container starts scrolled all the way to the right. With default scrolling, adding a 3d transform to the items in the scrollable container causes no problem. However, on iOS safari, adding -webkit-overflow-scroll: touch to the scrollable container causes any elements of the scroller with a 3d transform to be rendered in the wrong position. For this bug to occur, there must be enough elements in the scrollable container that the container can actually scroll. Viewing the buggy page with the web inspector shows that the browser thinks the elements are in the correct place (and their tap targets still exist in the correct place as well), but the elements are drawn in the wrong position.

I've attached a small HTML file which reproduces the issue.
Comment 1 Radar WebKit Bug Importer 2016-05-10 14:16:06 PDT
<rdar://problem/26204794>
Comment 2 Simon Fraser (smfr) 2016-05-10 15:35:49 PDT
I cannot reproduce with the attached testcase on an iPad mini with 9.3.1 (making #scroller narrow enough to scroll).

Note that the test case has no 3d-transformed items.
Comment 3 Simon Fraser (smfr) 2016-05-10 15:37:55 PDT
Created attachment 278541 [details]
Fixed testcase
Comment 4 Simon Fraser (smfr) 2016-05-10 15:39:13 PDT
I can with the revised test case
Comment 5 Simon Fraser (smfr) 2016-05-10 17:07:10 PDT
Created attachment 278553 [details]
Patch
Comment 6 Build Bot 2016-05-10 17:53:14 PDT
Comment on attachment 278553 [details]
Patch

Attachment 278553 [details] did not pass mac-ews (mac):
Output: http://webkit-queues.webkit.org/results/1300958

New failing tests:
compositing/rtl/rtl-with-transformed-descendants.html
Comment 7 Build Bot 2016-05-10 17:53:18 PDT
Created attachment 278558 [details]
Archive of layout-test-results from ews103 for mac-yosemite

The attached test failures were seen while running run-webkit-tests on the mac-ews.
Bot: ews103  Port: mac-yosemite  Platform: Mac OS X 10.10.5
Comment 8 Build Bot 2016-05-10 17:54:19 PDT
Comment on attachment 278553 [details]
Patch

Attachment 278553 [details] did not pass mac-wk2-ews (mac-wk2):
Output: http://webkit-queues.webkit.org/results/1300956

New failing tests:
compositing/rtl/rtl-with-transformed-descendants.html
Comment 9 Build Bot 2016-05-10 17:54:22 PDT
Created attachment 278559 [details]
Archive of layout-test-results from ews104 for mac-yosemite-wk2

The attached test failures were seen while running run-webkit-tests on the mac-wk2-ews.
Bot: ews104  Port: mac-yosemite-wk2  Platform: Mac OS X 10.10.5
Comment 10 Build Bot 2016-05-10 18:12:31 PDT
Comment on attachment 278553 [details]
Patch

Attachment 278553 [details] did not pass mac-debug-ews (mac):
Output: http://webkit-queues.webkit.org/results/1300992

New failing tests:
compositing/rtl/rtl-with-transformed-descendants.html
Comment 11 Build Bot 2016-05-10 18:12:35 PDT
Created attachment 278562 [details]
Archive of layout-test-results from ews115 for mac-yosemite

The attached test failures were seen while running run-webkit-tests on the mac-debug-ews.
Bot: ews115  Port: mac-yosemite  Platform: Mac OS X 10.10.5
Comment 12 Simon Fraser (smfr) 2016-05-10 18:56:23 PDT
https://trac.webkit.org/r200665