Add pointerenter/leave to nonBubblingEvents

src/Components/Web.JS/src/Rendering/Events/EventDelegator.ts

@@ -24,6 +24,8 @@ const nonBubblingEvents = toLookup([
   'loadstart',
   'mouseenter',
   'mouseleave',
+  'pointerenter',
+  'pointerleave',
   'pause',
   'play',
   'playing',

src/Components/test/E2ETest/Tests/EventTest.cs

@@ -104,6 +104,27 @@ public void MouseEnterAndMouseLeave_CanTrigger()
         Browser.Equal("mouseenter,mouseleave,", () => output.Text);
     }
 
+    [Fact]
+    public void PointerEnterAndPointerLeave_CanTrigger()
+    {
+        Browser.MountTestComponent<MouseEventComponent>();
+
+        var input = Browser.Exists(By.Id("pointerenter_input"));
+
+        var output = Browser.Exists(By.Id("output"));
+        Assert.Equal(string.Empty, output.Text);
+
+        // Pointer enter the button and then pointer leave
+        Browser.ExecuteJavaScript($@"
+            var pointerEnterElement = document.getElementById('pointerenter_input');
+            var pointerEnterEvent = new PointerEvent('pointerenter');
+            var pointerLeaveEvent = new PointerEvent('pointerleave');
+            pointerEnterElement.dispatchEvent(pointerEnterEvent);
+            pointerEnterElement.dispatchEvent(pointerLeaveEvent);");
+
+        Browser.Equal("pointerenter,pointerleave,", () => output.Text);
+    }
+
     [Fact]
     public void MouseMove_CanTrigger()
     {

src/Components/test/testassets/BasicTestApp/MouseEventComponent.razor

@@ -12,6 +12,9 @@
     <p>
         Mouseenter: <input id="mouseenter_input" type="text" @onmouseenter="OnMouseEvent" @onmouseleave="OnMouseEvent" />
     </p>
+    <p>
+        Pointerenter: <input id="pointerenter_input" type="text" @onpointerenter="OnPointerEvent" @onpointerleave="OnPointerEvent" />
+    </p>
     <p>
         <span id="mousemove_input" @onmousemove="OnMouseEvent">Mousemove city!</span>
     </p>