Changeset 226791 in webkit


Ignore:
Timestamp:
Jan 11, 2018 11:53:08 AM (6 years ago)
Author:
Simon Fraser
Message:

On macOS, getBoundingClientRect gives incorrect values when pinch-zoomed
​https://bugs.webkit.org/show_bug.cgi?id=181511
rdar://problem/33741427

Reviewed by Zalan Bujtas.
Source/WebCore:

When reverting "client coordinates are relative to layout viewport" in r219829
I broke documentToClientOffset() on macOS by failing to take pinch zoom scale into
account (frameScaleFactor() is always 1 on iOs, so this bug doesn't manifest there).

Covered by existing tests.

  • page/FrameView.cpp:

(WebCore::FrameView::documentToClientOffset const):

LayoutTests:

New results in tests that get client coordinates after zooming.

  • fast/visual-viewport/client-coordinates-relative-to-layout-viewport-expected.txt:
  • fast/visual-viewport/client-rects-relative-to-layout-viewport-expected.txt:
  • fast/visual-viewport/client-rects-relative-to-layout-viewport-zoomed.html:
  • fast/visual-viewport/zoomed-fixed-expected.txt:
  • fast/visual-viewport/zoomed-fixed-header-and-footer-expected.txt:
  • fast/zooming/client-rect-in-fixed-zoomed-expected.txt:
  • fast/zooming/client-rect-in-fixed-zoomed.html: Change the test to create passing results.
Location:
trunk
Files:
10 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r226785 r226791  
     12018-01-10  Simon Fraser  <simon.fraser@apple.com>
     2
     3        On macOS, getBoundingClientRect gives incorrect values when pinch-zoomed
     4        https://bugs.webkit.org/show_bug.cgi?id=181511
     5        rdar://problem/33741427
     6
     7        Reviewed by Zalan Bujtas.
     8
     9        New results in tests that get client coordinates after zooming.
     10
     11        * fast/visual-viewport/client-coordinates-relative-to-layout-viewport-expected.txt:
     12        * fast/visual-viewport/client-rects-relative-to-layout-viewport-expected.txt:
     13        * fast/visual-viewport/client-rects-relative-to-layout-viewport-zoomed.html:
     14        * fast/visual-viewport/zoomed-fixed-expected.txt:
     15        * fast/visual-viewport/zoomed-fixed-header-and-footer-expected.txt:
     16        * fast/zooming/client-rect-in-fixed-zoomed-expected.txt:
     17        * fast/zooming/client-rect-in-fixed-zoomed.html: Change the test to create passing results.
     18
    1192018-01-11  Eric Carlson  <eric.carlson@apple.com>
    220

  • trunk/LayoutTests/fast/visual-viewport/client-coordinates-relative-to-layout-viewport-expected.txt

    r219829 r226791  
    77        RenderText {#text} at (0,0) size 79x18
    88          text run at (0,0) width 79: "Got click at "
    9         RenderInline {SPAN} at (0,0) size 104x18
    10           RenderText {#text} at (78,0) size 104x18
    11             text run at (78,0) width 104: "clicked at 52, -6"
    12 layer at (38,-20) size 28x28 backgroundClip at (0,0) size 2008x3024 clip at (0,0) size 2008x3024
    13   RenderBlock (positioned) {DIV} at (38,-20) size 28x28 [bgcolor=#FF0000]
     9        RenderInline {SPAN} at (0,0) size 122x18
     10          RenderText {#text} at (78,0) size 122x18
     11            text run at (78,0) width 122: "clicked at 172, 117"
     12layer at (158,103) size 28x28
     13  RenderBlock (positioned) {DIV} at (158,103) size 28x28 [bgcolor=#FF0000]
    1414layer at (280,228) size 25x25
    1515  RenderBlock (positioned) {DIV} at (279,227) size 26x26 [bgcolor=#008000]
    1616layer at (281,229) size 22x22
    1717  RenderBlock (positioned) {DIV} at (281,229) size 22x22 [bgcolor=#FFA500]
    18 layer at (44,-14) size 16x16 backgroundClip at (0,0) size 2008x3024 clip at (0,0) size 2008x3024
    19   RenderBlock (positioned) {DIV} at (44,-14) size 16x16 [bgcolor=#0000FF]
     18layer at (164,109) size 16x16
     19  RenderBlock (positioned) {DIV} at (164,109) size 16x16 [bgcolor=#0000FF]
    2020caret: position 12 of child 0 {#text} of child 9 {P} of body
    2121scrolled to 120,123

  • trunk/LayoutTests/fast/visual-viewport/client-rects-relative-to-layout-viewport-expected.txt

    r219829 r226791  
    1414layoutViewport: 83.5, 233.5 - 785 x 585
    1515visualViewportRect: 476, 526 - 392.5 x 292.5
    16 fixed client bounds: -856.5, -808.5 - 30 x 20
    17 fixed client rect: -856.5, -808.5 - 30 x 20
    18 absolute client bounds: -832, -952 - 50 x 25
    19 absolute client rect: -832, -952 - 50 x 25
     16fixed client bounds: -380.5, -282.5 - 30 x 20
     17fixed client rect: -380.5, -282.5 - 30 x 20
     18absolute client bounds: -356, -426 - 50 x 25
     19absolute client rect: -356, -426 - 50 x 25
    2020
    2121Scrolled to 100, 776
    2222layoutViewport: 83.5, 483.5 - 785 x 585
    2323visualViewportRect: 100, 776 - 392.5 x 292.5
    24 fixed client bounds: -104.5, -1058.5 - 30 x 20
    25 fixed client rect: -104.5, -1058.5 - 30 x 20
    26 absolute client bounds: -80, -1452 - 50 x 25
    27 absolute client rect: -80, -1452 - 50 x 25
     24fixed client bounds: -4.5, -282.5 - 30 x 20
     25fixed client rect: -4.5, -282.5 - 30 x 20
     26absolute client bounds: 20, -676 - 50 x 25
     27absolute client rect: 20, -676 - 50 x 25
    2828
    2929Scrolled to 50, 300
    3030layoutViewport: 50, 300 - 785 x 585
    3131visualViewportRect: 50, 300 - 392.5 x 292.5
    32 fixed client bounds: -38, -290 - 30 x 20
    33 fixed client rect: -38, -290 - 30 x 20
    34 absolute client bounds: 20, -500 - 50 x 25
    35 absolute client rect: 20, -500 - 50 x 25
     32fixed client bounds: 12, 10 - 30 x 20
     33fixed client rect: 12, 10 - 30 x 20
     34absolute client bounds: 70, -200 - 50 x 25
     35absolute client rect: 70, -200 - 50 x 25
    3636PASS successfullyParsed is true
    3737

  • trunk/LayoutTests/fast/visual-viewport/client-rects-relative-to-layout-viewport-zoomed.html

    r218982 r226791  
    4444            var absolute = document.getElementById('absolute');
    4545
    46             debug('layoutViewport: ' + stringFromRect(internals.layoutViewportRect()));
    47             debug('visualViewportRect: ' + stringFromRect(internals.visualViewportRect()));
     46            if (window.internals) {
     47                debug('layoutViewport: ' + stringFromRect(internals.layoutViewportRect()));
     48                debug('visualViewportRect: ' + stringFromRect(internals.visualViewportRect()));
     49            }
    4850
    4951            debug('fixed client bounds: ' + stringFromRect(fixed.getBoundingClientRect()));
    … …  
    5658        function doTest()
    5759        {
    58             if (!window.testRunner)
    59                 return;
    60 
    6160            if (window.eventSender)
    6261                eventSender.zoomPageIn();

  • trunk/LayoutTests/fast/visual-viewport/zoomed-fixed-expected.txt

    r219829 r226791  
    1919JSON.stringify(internals.visualViewportRect()) is {"x":475,"y":525,"width":392.5,"height":292.5,"top":525,"right":867.5,"bottom":817.5,"left":475}
    2020client rect of top:
    21 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-867.5,"y":-817.5,"width":785,"height":100,"top":-817.5,"right":-82.5,"bottom":-717.5,"left":-867.5}
     21JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-392.5,"y":-292.5,"width":785,"height":100,"top":-292.5,"right":392.5,"bottom":-192.5,"left":-392.5}
    2222client rect of bottom:
    23 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-867.5,"y":-332.5,"width":785,"height":100,"top":-332.5,"right":-82.5,"bottom":-232.5,"left":-867.5}
     23JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-392.5,"y":192.5,"width":785,"height":100,"top":192.5,"right":392.5,"bottom":292.5,"left":-392.5}
    2424client rect of left:
    25 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-867.5,"y":-817.5,"width":100,"height":585,"top":-817.5,"right":-767.5,"bottom":-232.5,"left":-867.5}
     25JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-392.5,"y":-292.5,"width":100,"height":585,"top":-292.5,"right":-292.5,"bottom":292.5,"left":-392.5}
    2626client rect of right:
    27 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-182.5,"y":-817.5,"width":100,"height":585,"top":-817.5,"right":-82.5,"bottom":-232.5,"left":-182.5}
     27JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":292.5,"y":-292.5,"width":100,"height":585,"top":-292.5,"right":392.5,"bottom":292.5,"left":292.5}
    2828
    2929Scrolled to 100, 776
    … …  
    3131JSON.stringify(internals.visualViewportRect()) is {"x":100,"y":776,"width":392.5,"height":292.5,"top":776,"right":492.5,"bottom":1068.5,"left":100}
    3232client rect of top:
    33 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-117.5,"y":-1068.5,"width":785,"height":100,"top":-1068.5,"right":667.5,"bottom":-968.5,"left":-117.5}
     33JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-17.5,"y":-292.5,"width":785,"height":100,"top":-292.5,"right":767.5,"bottom":-192.5,"left":-17.5}
    3434client rect of bottom:
    35 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-117.5,"y":-583.5,"width":785,"height":100,"top":-583.5,"right":667.5,"bottom":-483.5,"left":-117.5}
     35JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-17.5,"y":192.5,"width":785,"height":100,"top":192.5,"right":767.5,"bottom":292.5,"left":-17.5}
    3636client rect of left:
    37 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-117.5,"y":-1068.5,"width":100,"height":585,"top":-1068.5,"right":-17.5,"bottom":-483.5,"left":-117.5}
     37JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-17.5,"y":-292.5,"width":100,"height":585,"top":-292.5,"right":82.5,"bottom":292.5,"left":-17.5}
    3838client rect of right:
    39 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":567.5,"y":-1068.5,"width":100,"height":585,"top":-1068.5,"right":667.5,"bottom":-483.5,"left":567.5}
     39JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":667.5,"y":-292.5,"width":100,"height":585,"top":-292.5,"right":767.5,"bottom":292.5,"left":667.5}
    4040
    4141Scrolled to 50, 300
    … …  
    4343JSON.stringify(internals.visualViewportRect()) is {"x":50,"y":300,"width":392.5,"height":292.5,"top":300,"right":442.5,"bottom":592.5,"left":50}
    4444client rect of top:
    45 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-50,"y":-300,"width":785,"height":100,"top":-300,"right":735,"bottom":-200,"left":-50}
     45JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":0,"y":0,"width":785,"height":100,"top":0,"right":785,"bottom":100,"left":0}
    4646client rect of bottom:
    47 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-50,"y":185,"width":785,"height":100,"top":185,"right":735,"bottom":285,"left":-50}
     47JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":0,"y":485,"width":785,"height":100,"top":485,"right":785,"bottom":585,"left":0}
    4848client rect of left:
    49 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-50,"y":-300,"width":100,"height":585,"top":-300,"right":50,"bottom":285,"left":-50}
     49JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":0,"y":0,"width":100,"height":585,"top":0,"right":100,"bottom":585,"left":0}
    5050client rect of right:
    51 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":635,"y":-300,"width":100,"height":585,"top":-300,"right":735,"bottom":285,"left":635}
     51JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":685,"y":0,"width":100,"height":585,"top":0,"right":785,"bottom":585,"left":685}
    5252PASS successfullyParsed is true
    5353

  • trunk/LayoutTests/fast/visual-viewport/zoomed-fixed-header-and-footer-expected.txt

    r219829 r226791  
    1919JSON.stringify(internals.visualViewportRect()) is {"x":475,"y":503.5,"width":392.5,"height":292.5,"top":503.5,"right":867.5,"bottom":796,"left":475}
    2020client rect of top:
    21 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-867.5,"y":-839,"width":785,"height":100,"top":-839,"right":-82.5,"bottom":-739,"left":-867.5}
     21JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-392.5,"y":-314,"width":785,"height":100,"top":-314,"right":392.5,"bottom":-214,"left":-392.5}
    2222client rect of bottom:
    23 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-867.5,"y":-354,"width":785,"height":100,"top":-354,"right":-82.5,"bottom":-254,"left":-867.5}
     23JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-392.5,"y":171,"width":785,"height":100,"top":171,"right":392.5,"bottom":271,"left":-392.5}
    2424client rect of left:
    25 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-867.5,"y":-839,"width":100,"height":585,"top":-839,"right":-767.5,"bottom":-254,"left":-867.5}
     25JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-392.5,"y":-314,"width":100,"height":585,"top":-314,"right":-292.5,"bottom":271,"left":-392.5}
    2626client rect of right:
    27 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-182.5,"y":-839,"width":100,"height":585,"top":-839,"right":-82.5,"bottom":-254,"left":-182.5}
     27JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":292.5,"y":-314,"width":100,"height":585,"top":-314,"right":392.5,"bottom":271,"left":292.5}
    2828
    2929Scrolled to 100, 776
    … …  
    3131JSON.stringify(internals.visualViewportRect()) is {"x":100,"y":754.5,"width":392.5,"height":292.5,"top":754.5,"right":492.5,"bottom":1047,"left":100}
    3232client rect of top:
    33 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-117.5,"y":-1090,"width":785,"height":100,"top":-1090,"right":667.5,"bottom":-990,"left":-117.5}
     33JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-17.5,"y":-314,"width":785,"height":100,"top":-314,"right":767.5,"bottom":-214,"left":-17.5}
    3434client rect of bottom:
    35 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-117.5,"y":-605,"width":785,"height":100,"top":-605,"right":667.5,"bottom":-505,"left":-117.5}
     35JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-17.5,"y":171,"width":785,"height":100,"top":171,"right":767.5,"bottom":271,"left":-17.5}
    3636client rect of left:
    37 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-117.5,"y":-1090,"width":100,"height":585,"top":-1090,"right":-17.5,"bottom":-505,"left":-117.5}
     37JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-17.5,"y":-314,"width":100,"height":585,"top":-314,"right":82.5,"bottom":271,"left":-17.5}
    3838client rect of right:
    39 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":567.5,"y":-1090,"width":100,"height":585,"top":-1090,"right":667.5,"bottom":-505,"left":567.5}
     39JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":667.5,"y":-314,"width":100,"height":585,"top":-314,"right":767.5,"bottom":271,"left":667.5}
    4040
    4141Scrolled to 50, 300
    … …  
    4343JSON.stringify(internals.visualViewportRect()) is {"x":50,"y":278.5,"width":392.5,"height":292.5,"top":278.5,"right":442.5,"bottom":571,"left":50}
    4444client rect of top:
    45 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-50,"y":-321.5,"width":785,"height":100,"top":-321.5,"right":735,"bottom":-221.5,"left":-50}
     45JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":0,"y":-21.5,"width":785,"height":100,"top":-21.5,"right":785,"bottom":78.5,"left":0}
    4646client rect of bottom:
    47 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-50,"y":163.5,"width":785,"height":100,"top":163.5,"right":735,"bottom":263.5,"left":-50}
     47JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":0,"y":463.5,"width":785,"height":100,"top":463.5,"right":785,"bottom":563.5,"left":0}
    4848client rect of left:
    49 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":-50,"y":-321.5,"width":100,"height":585,"top":-321.5,"right":50,"bottom":263.5,"left":-50}
     49JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":0,"y":-21.5,"width":100,"height":585,"top":-21.5,"right":100,"bottom":563.5,"left":0}
    5050client rect of right:
    51 JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":635,"y":-321.5,"width":100,"height":585,"top":-321.5,"right":735,"bottom":263.5,"left":635}
     51JSON.stringify(fixedElement.getBoundingClientRect()) is {"x":685,"y":-21.5,"width":100,"height":585,"top":-21.5,"right":785,"bottom":563.5,"left":685}
    5252PASS successfullyParsed is true
    5353

  • trunk/LayoutTests/fast/zooming/client-rect-in-fixed-zoomed-expected.txt

    r219829 r226791  
    55
    66PASS internals.pageScaleFactor() is 2
    7 FAIL JSON.stringify(clientRect) should be {"x":22,"y":32,"width":20,"height":10,"top":32,"right":42,"bottom":42,"left":22}. Was {"x":22,"y":-248,"width":20,"height":10,"top":-248,"right":42,"bottom":-238,"left":22}.
     7PASS JSON.stringify(clientRect) is JSON.stringify({x: 22, y: -108, width: 20, height: 10, top: -108, right: 42, bottom:-98, left: 22})
    88PASS successfullyParsed is true
    99

  • trunk/LayoutTests/fast/zooming/client-rect-in-fixed-zoomed.html

    r216803 r226791  
    4141            clientRect = box.getBoundingClientRect();
    4242           
    43             shouldBe('JSON.stringify(clientRect)', 'JSON.stringify({x: 22, y: 32, width: 20, height: 10, top: 32, right: 42, bottom:42, left: 22})');
     43            shouldBe('JSON.stringify(clientRect)', 'JSON.stringify({x: 22, y: -108, width: 20, height: 10, top: -108, right: 42, bottom:-98, left: 22})');
    4444           
    4545            finishJSTest();

  • trunk/Source/WebCore/ChangeLog

    r226790 r226791  
     12018-01-10  Simon Fraser  <simon.fraser@apple.com>
     2
     3        On macOS, getBoundingClientRect gives incorrect values when pinch-zoomed
     4        https://bugs.webkit.org/show_bug.cgi?id=181511
     5        rdar://problem/33741427
     6
     7        Reviewed by Zalan Bujtas.
     8       
     9        When reverting "client coordinates are relative to layout viewport" in r219829
     10        I broke documentToClientOffset() on macOS by failing to take pinch zoom scale into
     11        account (frameScaleFactor() is always 1 on iOs, so this bug doesn't manifest there).
     12
     13        Covered by existing tests.
     14
     15        * page/FrameView.cpp:
     16        (WebCore::FrameView::documentToClientOffset const):
     17
    1182018-01-11  Youenn Fablet  <youenn@apple.com>
    219

  • trunk/Source/WebCore/page/FrameView.cpp

    r226622 r226791  
    45124512
    45134513    // Layout and visual viewports are affected by page zoom, so we need to factor that out.
    4514     return clientOrigin.scaled(1 / frame().pageZoomFactor());
     4514    return clientOrigin.scaled(1 / (frame().pageZoomFactor() * frame().frameScaleFactor()));
    45154515}
    45164516
Note: See TracChangeset for help on using the changeset viewer.