tauri-apps / tauri

Build smaller, faster, and more secure desktop and mobile applications with a web frontend.
https://tauri.app
Apache License 2.0
84.06k stars 2.53k forks source link

[bug] Native HTML5 DragNDrop doesn't work for compiled Mobile app #6828

Open Horsty80 opened 1 year ago

Horsty80 commented 1 year ago

Describe the bug

I've implemented Native HTML Drag'N'Drop in a react app with vite and typescript. Is working fine on web, and compiled desktop app but if i compile to mobile app isn't working anymore.

Reproduction

This is a basic repo to reproduce

https://github.com/Horsty80/dnd-app

Only need to clone it, install dependencies and try :

Expected behavior

That Native DragNDrop functionnality are working

Platform and versions

[✔] Environment
    - OS: Mac OS 13.3.1 X64
    ✔ Xcode Command Line Tools: installed
    ✔ rustc: 1.69.0 (84c898d65 2023-04-16)
    ✔ Cargo: 1.69.0 (6e9a83356 2023-04-12)
    ✔ rustup: 1.25.2 (17db695f1 2023-02-01)
    ✔ Rust toolchain: stable-aarch64-apple-darwin (default)
    - node: 18.12.1
    - pnpm: 8.1.1
    - yarn: 1.22.19
    - npm: 8.19.2

[-] Packages
    - tauri [RUST]: 2.0.0-alpha.8
    - tauri-build [RUST]: 2.0.0-alpha.4
    - wry [RUST]: 0.27.3
    - tao [RUST]: 0.18.3
    - @tauri-apps/api [NPM]: not installed!
    - @tauri-apps/cli [NPM]: 2.0.0-alpha.8

[-] App
    - build-type: bundle
    - CSP: unset
    - distDir: ../dist
    - devPath: http://localhost:5173/
    - framework: React
    - bundler: Vite

Stack trace

No stack trace, the app is compile, but the functionnality not present.
You can not drag n drop card item inside mobile app

Additional context

Following this tutorial to implemente drag n drop functionnality : https://dev.to/franklin030601/creating-an-app-using-drag-and-drop-with-react-without-libraries--5cg9#6

Live demo here : https://drag-and-drop-react-app.netlify.app/

FabianLars commented 1 year ago

idk about mobile but for desktop you need to disable tauri's own file drop mechanism by setting "fileDropEnabled": false in your window config. Unfortunately the file drop and native html dnd are mutually exclusive :/

Horsty80 commented 1 year ago

Thanks i will try this config :)

Horsty80 commented 1 year ago

Thanks @FabianLars it's working for Desktop indeed with "fileDropEnabled": false

For mobile isn't working, maybe due to conflict with the scroll behavior i didn't know =/

I will edit my Issue to specify that is only for mobile and tauri alpha V2