Bug 244240

Summary: Mouse wheel behavior on <input type="number"> is changed by other elements with wheel event handler
Product: WebKit Reporter: azuma.ginkakuji
Component: WebKit2Assignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: akeerthi, azuma.ginkakuji, cdumez, karlcow, kkinnunen, ntim, rniwa, simon.fraser, webkit-bug-importer, wenson_hsieh
Priority: P2 Keywords: InRadar
Version: Safari 15   
Hardware: Unspecified   
OS: Unspecified   

Description azuma.ginkakuji 2022-08-23 00:57:02 PDT 
Steps to reproduce problem

1. Open https://jsfiddle.net/ytfh4r2k/
2. Focus the first input field and move mouse pointer on it.
3. Turn the mouse wheel on the first input field.
4. Then, focus the second input field and move mouse pointer on it.
5. Turn the mouse wheel on the second input field.

Actual: Each input field behaves differently: the value of the first input field changes but the value of the second input field doesn't change.
Expected: Both input fields behave in the same way.

I think it is strange that the wheel behavior changes by an event handler of not-self nor not-ancestor elements.

It behaves as expected in Firefox. Chrome behaves as the same as Safari. https://bugs.chromium.org/p/chromium/issues/detail?id=1355750
Comment 1 Alexey Proskuryakov 2022-08-23 10:34:52 PDT 
Reproduces with trackpad too. Also reproduces in Chrome.

This is strange indeed, TextFieldInputType::shouldSpinButtonRespondToWheelEvents() is a very simple function.

I think that this isn't even a DOM issue, but we probably short circuit these wheel events in UI process. Both input fields respect wheel/scroll events in WebKit1, and the bug only reproduces with WebKit2. It's curious that Chrome appears to have an identical one.
Comment 2 Radar WebKit Bug Importer 2022-08-30 00:57:16 PDT 
<rdar://problem/99318505>
Comment 3 Simon Fraser (smfr) 2022-09-08 16:43:34 PDT 
This is happening because the <p> with the wheel event handler is creating an event region, so we send wheel events to the main thread.

What we should be doing is to add <input type="number"> to the wheel event region, like we do for <select>