[Problem/Bug]: Cannot interact independently with multiple WebView2 controls using touch

[cansik]

What happened?

We would like to display two WebView2 controls in a single window and allow two people to interact with each browser simultaneously. The issue is that both browsers receive touch pointer input, even when the pointer was not initiated within their bounds.

It seems that WM_POINTER events are not correctly delivered to the WebView2 instance that should actually receive them.

As a result, both browsers respond to the same messages, which prevents us from displaying two browsers that can be interacted with independently by two people at the same time. This occurs not only when scrolling but also with pinch gestures and other input.

We were able to reproduce this in WPF using the WebView2CompositionControl (with Switch.System.Windows.Input.Stylus.EnablePointerSupport enabled) and also in a default WinUI3 app using WebView2. Here is a video showing the WinUI3 example.

webview-scroll-demo.mp4

So far, we have not observed any working example, regardless of the versions used.

Interestingly, this behavior does not occur with the default WinUI3 components, such as a scrollable TextBox. Here is another example we captured in WinUI3.

textbox-scroll-demo.mp4

Importance

Blocking. My app's basic functions are not working due to this issue.

Runtime Channel

Stable release (WebView2 Runtime)

Runtime Version

140.0.3485.66

SDK Version

1.0.3530-prerelease

Framework

WinUI3/WinAppSDK

Operating System

Windows 10, Windows 11

OS Version

10.0.26100 Build 26100

Repro steps

Create a new WinUI3 (or WPF) application, install the WebView2 NuGet package (if needed), and add the following XAML code:

<?xml version="1.0" encoding="utf-8"?>
<Window
    x:Class="YourApp.WebWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="WebView2 Demo">

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        
        <WebView2 Grid.Column="0" Source="https://learn.microsoft.com/en-gb/microsoft-edge/webview2/"></WebView2>
        <WebView2 Grid.Column="1" Source="https://learn.microsoft.com/en-gb/microsoft-edge/webview2/"></WebView2>
    </Grid>
</Window>

Then build and run the app. Use a touch screen to try scrolling in both WebView2 controls simultaneously.

Repros in Edge Browser

No, issue does not reproduce in the corresponding Edge version

Regression

No, this never worked

Last working version (if regression)

No response

[Rsed19901]

What happened?

We would like to display two WebView2 controls in a single window and allow two people to interact with each browser simultaneously. The issue is that both browsers receive touch pointer input, even when the pointer was not initiated within their bounds.

It seems that WM_POINTER events are not correctly delivered to the WebView2 instance that should actually receive them.

As a result, both browsers respond to the same messages, which prevents us from displaying two browsers that can be interacted with independently by two people at the same time. This occurs not only when scrolling but also with pinch gestures and other input.

We were able to reproduce this in WPF using the WebView2CompositionControl (with Switch.System.Windows.Input.Stylus.EnablePointerSupport enabled) and also in a default WinUI3 app using WebView2. Here is a video showing the WinUI3 example.

webview-scroll-demo.mp4

So far, we have not observed any working example, regardless of the versions used.

Interestingly, this behavior does not occur with the default WinUI3 components, such as a scrollable TextBox. Here is another example we captured in WinUI3.

textbox-scroll-demo.mp4

Importance

Blocking. My app's basic functions are not working due to this issue.

Runtime Channel

Stable release (WebView2 Runtime)

Runtime Version

140.0.3485.66

SDK Version

1.0.3530-prerelease

Framework

WinUI3/WinAppSDK

Operating System

Windows 10, Windows 11

OS Version

10.0.26100 Build 26100

Repro steps

Create a new WinUI3 (or WPF) application, install the WebView2 NuGet package (if needed), and add the following XAML code:

<?xml version="1.0" encoding="utf-8"?>
<Window
    x:Class="YourApp.WebWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="WebView2 Demo">

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        
        <WebView2 Grid.Column="0" Source="https://learn.microsoft.com/en-gb/microsoft-edge/webview2/"></WebView2>
        <WebView2 Grid.Column="1" Source="https://learn.microsoft.com/en-gb/microsoft-edge/webview2/"></WebView2>
    </Grid>
</Window>

Then build and run the app. Use a touch screen to try scrolling in both WebView2 controls simultaneously.

Repros in Edge Browser

No, issue does not reproduce in the corresponding Edge version

Regression

No, this never worked

Last working version (if regression)

No response