Bug 243986 - Allow changing text selection by clicking the padding area on an input field
Summary: Allow changing text selection by clicking the padding area on an input field
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Forms (show other bugs)
Version: Safari Technology Preview
Hardware: Mac (Intel) macOS 12
: P2 Normal
Assignee: Nobody
URL:
Keywords: BrowserCompat, InRadar
Depends on:
Blocks:
 
Reported: 2022-08-16 03:34 PDT by Jesper van den Ende
Modified: 2022-08-16 21:15 PDT (History)
6 users (show)

See Also:


Attachments
screen recording (2.55 MB, video/mp4)
2022-08-16 03:34 PDT, Jesper van den Ende
no flags Details
shadow content (17.56 KB, image/png)
2022-08-16 16:25 PDT, Karl Dubost
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Jesper van den Ende 2022-08-16 03:34:53 PDT
Created attachment 461667 [details]
screen recording

To reproduce:
(1) Visit duckduckgo.com and search for some text
(2) Click and drag the padding area on the search field

Expected result:
The search text is selected

Actual result:
The input field receives focus but the cursor is not set at the right position.

Attached is a video of a comparison between Safari (left) and Firefox (right).
Comment 1 Kimmo Kinnunen 2022-08-16 04:37:37 PDT
Pull request: https://github.com/WebKit/WebKit/pull/3359
Comment 2 Kimmo Kinnunen 2022-08-16 04:53:05 PDT
(In reply to Kimmo Kinnunen from comment #1)
> Pull request: https://github.com/WebKit/WebKit/pull/3359
Scratch that, wrong bug number.
Comment 3 Karl Dubost 2022-08-16 16:25:18 PDT
Created attachment 461681 [details]
shadow content

I just tested with Safari Version 16.0 (18614.1.19.1.5)
on macOS 13.0 Beta (22A5295i)
And I can't reproduce.

The text selection is happening. 

Jesper, do you have more details to reproduce?
Or do you have information on plugins, extensions you would have installed. 

Ha I think I figured it out.
This is more about hit testing and the selectable area. 
In the screencast, the cursor is placed above the text but inside the search form.
On Firefox, the selection happens, on Safari it doesn't.

The markup is a box which is 44px high.

<input type="text" 
   name="q" tabindex="1" autocomplete="off" 
   id="search_form_input" class="search__input--adv js-search-input" 
   value="lorem ipsum dolor sit amet" 
   autocapitalize="off" autocorrect="off">

The shadow content is 20px high:

<div contenteditable="plaintext-only">lorem ipsum dolor sit amet</div>


The selection is happening only if the cursor is in the 20px high area.
See the screenshot about shadow content.
Comment 4 Radar WebKit Bug Importer 2022-08-16 16:26:20 PDT
<rdar://problem/98753984>
Comment 5 Karl Dubost 2022-08-16 21:15:13 PDT
A test like this could be used for testing the selection in a specific area
https://searchfox.org/wubkat/source/LayoutTests/editing/selection/user-select-all-selection.html



data:text/html,<!doctype%20html><html><input%20style="height:100px;font-size:20px;border:1px%20solid%20red;"%20type="text">