[Webkit-unassigned] [Bug 271829] New: Unexpected shift of layout viewport of a webpage on input focus

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Thu Mar 28 08:45:37 PDT 2024


            Bug ID: 271829
           Summary: Unexpected shift of layout viewport of a webpage on
                    input focus
           Product: WebKit
           Version: Safari 16
          Hardware: iPhone / iPad
                OS: iOS 16
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Compositing
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: maxsinev at gmail.com
                CC: simon.fraser at apple.com

Created attachment 470637

  --> https://bugs.webkit.org/attachment.cgi?id=470637&action=review

Video with the bug (Method 1)

After several page interactions, focusing on the input leads to autoscrolling, which breaks the page layout by introducing empty space at the top. Additionally, this bug extends to affect the entire browser tab: for instance, clearing the omnibox and navigating to google.com/search triggers the bug upon clicking the Google search input.


- iOS 16+ (iOS version used for reproduction: 16.6 (20G75))
- Input positioned at the top of the page
- Input blurs upon touch movement
- The page should have sufficient scrollable content

Steps to Reproduce (Method 1):
1. Focus on the input field.
2. Initiate a touch action in the middle of the page.
3. Scroll down the page using touch movements until the browser omnibox collapses to a small line displaying the page address.
4. Scroll up the page using touch movements.
5. Refocus on the input field.
(Note: These steps must be executed rapidly and may require several attempts. A video demonstrating attempts is attached.)

Steps to Reproduce (Method 2) (Simplified):
1. Focus on the input field.
2. Scroll down with one touch until the page loader appears at the top (without reloading the page).
3. Touch the screen with a second finger and scroll down slightly.
4. Release both fingers.
5. Refocus on the input field.

Expected Behavior: The input field should be focused, and it should remain at the top of the page (as seen in Step 1).
Actual Behavior: The input field is focused but shifts downward, because of empty space at the top of the page. And looks like this empty space is a "native" thing and is out of DOM layout.

A tiny example webpage where the bug can be reproduced. https://codesandbox.io/embed/safari-test-lzljnc?file=%2Findex.html

You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20240328/2c91d049/attachment-0001.htm>

More information about the webkit-unassigned mailing list