Fix Drag & Drop JS runtime #3516

jakubpeleska · 2024-05-28T15:42:21Z

Description

This PR completes the drag-and-drop support, which was previously implemented in:

Changes

drag and drop refactor - draganddrop.js
fix for CSS class wails-drop-target-active
add debounce on dragleave to avoid flickering of the wails-drop-target-active class

This implementation provides developers with enough functionality to start using this feature in production. Therefore, we believe this commit can conclude all previous efforts and mark the drag-and-drop feature as ready for production.

How Has This Been Tested?

Fix was tested on a dummy project available on https://github.com/beam-transfer/wails-drag-and-drop

Windows
macOS
Linux

Video

red area - drop zone "--wails-drop-target": "drop"
yellow area - drop zone disabled "--wails-drop-target": "none"
teal area - element without any special treatment

drag-and-drop-demonstration.mp4

Type of change

Bug fix (non-breaking change which fixes an issue)

Checklist:

I have updated website/src/pages/changelog.mdx with details of this PR
My code follows the general coding style of this project
I have performed a self-review of my own code
I have commented my code, particularly in hard-to-understand areas
I have made corresponding changes to the documentation
My changes generate no new warnings
I have added tests that prove my fix is effective or that my feature works
New and existing unit tests pass locally with my changes

* implement basic dnd for linux * implemented windows * progress changed linux handling and added coordinates to drop * progress fix drop coordinates on windows * progress remove log from windows * progress move js * update js after merge * fix event listener registration * fix segfault on non file drag * remove logs, fix coordinates * minor changes, simplify to drop only * rename EnableWails -> EnableFileDrop * add documentation (PR id missing) * add PR id to changelog * fix remove casting from malloc * fix nil check for OnFileDrop's callback * fix nil check for OnFileDrop skip event when nil * add error message for nil callback in OnFileDrop --------- Co-authored-by: lyimmi <lelvente.zambo@gmail.com> Co-authored-by: Lea Anthony <lea.anthony@gmail.com>

* implement native drag and drop for macOS * update docs * add to changelog * update docs (macOS is supported) * Fix windows DragAndDrop options * Fix class unset on dragleave for full frame elements * improve class unset (nested elements and borders case)

into feature/1090_native_drag_and_drop_for_file_and_folder

pavelbinar · 2024-05-29T13:42:21Z

Hi @lyimmi , @APshenkin please take a look.

website/docs/reference/options.mdx

leaanthony

Thanks for taking the time to loop back to this 🙏
What do you think the challenges for this approach might be for a multi-window application?

APshenkin · 2024-06-02T00:23:10Z

@jakubpeleska @pavelbinar
This looks great. Thank you for finishing this!

Hope to see this released in v2 soon!

jakubpeleska · 2024-06-02T09:27:14Z

@leaanthony Thanks for taking a look.

Thanks for taking the time to loop back to this 🙏 What do you think the challenges for this approach might be for a multi-window application?

As for the multi-window challenges, I can't really speak for the native implementations. However, the runtime JS should work out of the box, assuming that there are separate JS runtimes for each window. That being said, I did not test it, so I can't be sure. @APshenkin and @lyimmi might have more insight into the challenges of native implementations.

…_and_folder

leaanthony · 2024-06-07T23:30:23Z

v2/internal/frontend/desktop/darwin/WailsWebView.m

+
+  // collecting all file paths
+  NSString *files_str = @"";
+  NSMutableArray *files_strs = [[NSMutableArray alloc] init];


Does this need to be released?

@leaanthony @jakubpeleska

Here we iterate over NSURL array to convert them to just strings, then join then all in one string.

So files_strs is needed. Only if someone have better know how to do this mapping, as I'm not Objective-C expert 😅.

However files_str is redundant, as it's not used. You can remove it.

I was thinking the [alloc] would require a [release]

Oh, yes you are right, sorry misunderstood you 😅

…_and_folder

v2/internal/frontend/desktop/darwin/WailsWebView.m

…_and_folder

leaanthony · 2024-06-10T05:15:46Z

Thanks all involved in this monumental effort! Anyone fancy writing a small guide on how to use it? 😅

lyimmi and others added 5 commits February 6, 2024 17:18

Fix runtime drop target detection and CSS class assignment

8ebbda4

Edit changelog

1e274d9

Merge branch 'master'

9637286

into feature/1090_native_drag_and_drop_for_file_and_folder

leaanthony reviewed Jun 1, 2024

View reviewed changes

website/docs/reference/options.mdx Outdated Show resolved Hide resolved

leaanthony reviewed Jun 1, 2024

View reviewed changes

Fix drag-and-drop options in references

54ff310

Merge branch 'master' into feature/1090_native_drag_and_drop_for_file…

600997b

…_and_folder

pavelbinar force-pushed the feature/1090_native_drag_and_drop_for_file_and_folder branch from 0f84d4a to 600997b Compare June 3, 2024 11:14

9dl approved these changes Jun 7, 2024

View reviewed changes

leaanthony reviewed Jun 7, 2024

View reviewed changes

Merge branch 'master' into feature/1090_native_drag_and_drop_for_file…

e34fa36

…_and_folder

leaanthony reviewed Jun 8, 2024

View reviewed changes

v2/internal/frontend/desktop/darwin/WailsWebView.m Outdated Show resolved Hide resolved

leaanthony reviewed Jun 8, 2024

View reviewed changes

v2/internal/frontend/desktop/darwin/WailsWebView.m Show resolved Hide resolved

leaanthony added 3 commits June 10, 2024 15:10

Update v2/internal/frontend/desktop/darwin/WailsWebView.m

944c4a5

Update v2/internal/frontend/desktop/darwin/WailsWebView.m

ba43678

Merge branch 'master' into feature/1090_native_drag_and_drop_for_file…

4218ac4

…_and_folder

leaanthony approved these changes Jun 10, 2024

View reviewed changes

leaanthony merged commit 022a5ff into wailsapp:master Jun 10, 2024
8 checks passed

makew0rld mentioned this pull request Jun 16, 2024

wails 2.9.0 linux issue #3542

Open

FrancescoLuzzi mentioned this pull request Jul 8, 2024

fix: compute dropped file path before css handling #3595

Merged

15 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix Drag & Drop JS runtime #3516

Fix Drag & Drop JS runtime #3516

jakubpeleska commented May 28, 2024 •

edited

Loading

pavelbinar commented May 29, 2024

leaanthony left a comment

APshenkin commented Jun 2, 2024

jakubpeleska commented Jun 2, 2024

leaanthony Jun 7, 2024

jakubpeleska Jun 8, 2024

APshenkin Jun 8, 2024

leaanthony Jun 8, 2024

APshenkin Jun 8, 2024

leaanthony commented Jun 10, 2024 •

edited

Loading

Fix Drag & Drop JS runtime #3516

Fix Drag & Drop JS runtime #3516

Conversation

jakubpeleska commented May 28, 2024 • edited Loading

Description

Changes

How Has This Been Tested?

Video

Type of change

Checklist:

pavelbinar commented May 29, 2024

leaanthony left a comment

Choose a reason for hiding this comment

APshenkin commented Jun 2, 2024

jakubpeleska commented Jun 2, 2024

leaanthony Jun 7, 2024

Choose a reason for hiding this comment

jakubpeleska Jun 8, 2024

Choose a reason for hiding this comment

APshenkin Jun 8, 2024

Choose a reason for hiding this comment

leaanthony Jun 8, 2024

Choose a reason for hiding this comment

APshenkin Jun 8, 2024

Choose a reason for hiding this comment

leaanthony commented Jun 10, 2024 • edited Loading

jakubpeleska commented May 28, 2024 •

edited

Loading

leaanthony commented Jun 10, 2024 •

edited

Loading