asp.net - ontouchenter and ontouchleave in Blazor component not firing

Question

The Microsoft documentation mentions the @ontouchenter and @ontouchleave events.

I would like to utilize these to enable drag and drop in my Blazor app, but it doesn't seem like these events are firing. There is not a lot of examples of other mentions on the web.

Does anyone know whether they are supposed to work? Do I need to do any special to make them work?

UPDATE I think it is because the element position is not changed, as the normal draggable ensures via mouse drag.

Is it possible to change/update the elements position (x,y) via c# in Blazor?

Example The following is a minimal example

Index.razor

@page "/"

<h1>Hello, world!</h1>

Welcome to your new app.

<div style="height: 300px;width: 300px;background-color: cornflowerblue;touch-action: none; border: medium;"
     ondragover="event.preventDefault();"        
     @ontouchenter="OnTouch"
     @ontouchleave="OnTouch"         
     @ondragenter="OnDrag"
     @ondragleave="OnDrag"
     @ondrop="OnDrop">
    Drag to Me
</div>

<DragItem></DragItem>
<DragItem></DragItem>
<DragItem></DragItem>
<DragItem></DragItem>

@code{
    private void OnTouch(TouchEventArgs args)
    {
        Console.WriteLine("Index:OnTouch:" + args.Type);
    }

    void OnDrag(DragEventArgs args)
    {
        Console.WriteLine("Index:OnDrag:" + args.Type);
    }

    void OnDrop(DragEventArgs args)
    {
        Console.WriteLine("Index:OnDrop:" + args.Type);
    }
}

DragItem.razor

<div       
     draggable="true"
     @ontouchmove="OnTouchMove"
     style=" cursor: move;
        background-color: cornflowerblue;
        touch-action: none;
        user-select: none;
        border: medium;
        min-height: 100px;
        min-width: 100px">
    DragMe
</div>

@code {
private void OnTouch(TouchEventArgs args)
    {
        Console.WriteLine("OnTouch:" + args.Type);
    }

    private void OnTouchMove(TouchEventArgs args)
    {
        //double x = args.ChangedTouches[0].ClientX;
        //double y = args.ChangedTouches[0].ClientY;
        //--> I guess this is where I should update my dragitem position
        //--> Normal drag via mouse automatically updates position, but not touchMove
    }

    void OnDrag(DragEventArgs args)
    {
        Console.WriteLine("OnDrag:" + args.Type);
    }

    void OnDrop(DragEventArgs args)
    {
        Console.WriteLine("OnDrop:" + args.Type);
    }

    void StoryClicked()
    {
        Console.WriteLine("StoryClicked");
    }
}

question from:https://stackoverflow.com/questions/65951539/ontouchenter-and-ontouchleave-in-blazor-component-not-firing

Answer 1

Waitting for answers