Bug 306724 – [WPE] Synthetic mouse events are generated even when touch events call preventDefault(), with stale coordinates

• Status: RESOLVED
• Resolution: DUPLICATE
• Component: WPE WebKit

- PROBLEM:                                                                                                                                                                                    
When a web page calls 'preventDefault()' on touch events (touchstart, touchmove, touchend), the WPE platform still generates synthetic mouse events (mousemove, mousedown, mouseup) for TAP gestures. Also, the synthetic mouse events use stale coordinates from the initial touch position, not the final touch position where the finger was lifted.                                                                                                                                               
According to the W3C Pointer Events specification, when preventDefault() is called on a touch event, compatibility mouse events should NOT be dispatched.

- STEPS TO REPRODUCE:                                                                                                                                                                         
  1. Create a web page with the following code:
  <div id="target" style="width:300px;height:300px;background:blue;">                                                                                                                         
    Touch and drag me!                                                                                                                                                                         
  </div>                                                                                                                                                                                      
  <script>                                                                                                                                                                                    
    const target = document.getElementById('target');                                                                                                                                         
                                                                                                                                                                                              
    target.addEventListener('touchstart', (e) => {                                                                                                                                            
      const touch = e.touches[0];                                                                                                                                                             
      console.log('touchstart at', touch.clientX, touch.clientY, '- calling preventDefault()');                                                                                               
      e.preventDefault();                                                                                                                                                                     
    });                                                                                                                                                                                       
                                                                                                                                                                                              
    target.addEventListener('touchmove', (e) => {                                                                                                                                             
      const touch = e.touches[0];                                                                                                                                                             
      console.log('touchmove at', touch.clientX, touch.clientY, '- calling preventDefault()');                                                                                                
      e.preventDefault();                                                                                                                                                                     
    });                                                                                                                                                                                       
                                                                                                                                                                                              
    target.addEventListener('touchend', (e) => {                                                                                                                                              
      const touch = e.changedTouches[0];                                                                                                                                                      
      console.log('touchend at', touch.clientX, touch.clientY, '- calling preventDefault()');                                                                                                 
      e.preventDefault();                                                                                                                                                                     
    });                                                                                                                                                                                       
                                                                                                                                                                                              
    target.addEventListener('mousemove', (e) => {                                                                                                                                             
      console.log('mousemove at', e.clientX, e.clientY);                                                                                                                                      
    });                                                                                                                                                                                       
                                                                                                                                                                                                                                                                                                                                                                                    
  </script>                                                                                                                                                                                   
  2. Load the page in WPE browser on a touch-enabled device                                                                                                                                   
  3. Touch down at position (100, 100)                                                                                                                                                        
  4. Drag finger to position (250, 250)                                                                                                                                                       
  5. Lift finger at position (250, 250)               

- EXPECTED RESULT:                                                                                                                                                                            
 Only touch events should be logged (no mouse events due to preventDefault):                                                                                                                 
  touchstart at 100 100 - calling preventDefault()   
  ...                                                                                                                                       
  touchmove at 150 150 - calling preventDefault()
  ...                                                                                                                                             
  touchmove at 200 200 - calling preventDefault()      
  ....                                                                                                                                       
  touchmove at 250 250 - calling preventDefault()                                                                                                                                             
  touchend at 250 250 - calling preventDefault()                                                                                                                                                     
                                                                                                                                                                                              
- ACTUAL RESULT:                                                                                                                                                                              
  Both touch and mouse events are logged, and mouse events have stale coordinates (100, 100) instead of the final position (250, 250):                                                        
  touchstart at 100 100 - calling preventDefault()                                                                                                                                            
  touchmove at 150 150 - calling preventDefault()                                                                                                                                             
  touchmove at 200 200 - calling preventDefault()                                                                                                                                             
  touchmove at 250 250 - calling preventDefault()                                                                                                                                             
  touchend at 250 250 - calling preventDefault()                                                                                                                                              
  mousemove at 100 100    ← WRONG! Should not exist, and coordinates are stale                             

- TWO ISSUES:                                                                                                                                                                                 
  1. Synthetic mouse events should NOT be generated when preventDefault() is called                                                                                                           
  2. Even if generated, coordinates should be (250, 250), not (100, 100)

Below is the explanation of the root cause analysis and the proposed fix.

  - Root Cause Analysis                                                                                                                                                                       
                                                                                                                                                                                              
  The issue is in WPEWebViewPlatform.cpp. When a touch event occurs:                                                                                                                          
                                                                                                                                                                                              
  1. handleEvent() calls page().handleTouchEvent() to send the event to WebProcess (asynchronous)                                                                                             
  2. handleEvent() then immediately calls handleGesture() (synchronous)                                                                                                                       
  3. handleGesture() detects TAP gesture and generates synthetic mouse events immediately using the gesture controller's position                                                             
  4. The gesture controller's position is captured at the beginning of the touch sequence, resulting in stale coordinates                                                                     
  5. Later, doneWithTouchEvent(wasEventHandled) is called with the WebProcess response                                                                                                        
  6. By this time, synthetic mouse events have already been dispatched with wrong coordinates                                                                                                 
                                                                                                                                                                                              
  The problem is that handleGesture() does not wait for the wasEventHandled response before generating synthetic mouse events.                                                                
                                                                                                                                                                                              
                                                                                                                                                                                    
 - Proposed Fix                                                                                                                                                                                
                                                                                                                                                                                              
  Defer synthetic mouse event generation for TAP gestures until doneWithTouchEvent() confirms whether the touch was handled:                                                                  
                                                                                                                                                                                              
  1. WPEWebViewPlatform.cpp:                                                                                                                                                                  
  - Modify handleGesture(): For TAP gestures, ONLY STORE coordinates instead of generating events immediately                                                                                      
  - Add completePendingGesture(): Generate synthetic mouse events only if wasEventHandled is false                                                                                            
                                                                                                                                                                                              
  2. PageClientImpl.cpp:                                                                                                                                                                      
  - Modify doneWithTouchEvent(): Call completePendingGesture(wasEventHandled) for WPE_PLATFORM

*** This bug has been marked as a duplicate of bug 303531 ***