fix: prevent drop files overlay from appearing when dragging text

[oscar-escire]

References

• Fixes Dragging text selection over submission form triggers "drop files" message #1268
• Port of [Port dspace-7_x] fix: prevent drop files overlay from appearing when dragging text #5164

Description

Prevent the "drop files" overlay from appearing when dragging text selections in Firefox on submission pages.

List of changes in this PR:

• Added dataTransfer.types.includes('Files') guard in UploaderComponent.onDragOver() (uploader.component.ts)
• Added the same guard in FileDropzoneNoUploaderComponent.onDragOver() (file-dropzone-no-uploader.component.ts)

Instructions for Reviewers

1. Open the application in Firefox
2. Navigate to a new submission or edit a workspace item
3. Select some text on the page
4. Drag the text selection around the page
5. Expected: The "Drop files" overlay should NOT appear
6. Now drag an actual file from your file explorer onto the page
7. Expected: The "Drop files" overlay should appear as normal

Checklist

• My PR is created against the main branch of code (unless it is a backport or is fixing an issue specific to an older branch).
• My PR is small in size (e.g. less than 1,000 lines of code, not including comments & specs/tests), or I have provided reasons as to why that's not possible.
• My PR passes ESLint validation using npm run lint
• My PR doesn't introduce circular dependencies (verified via npm run check-circ-deps)
• My PR includes TypeDoc comments for all new (or modified) public methods and classes. It also includes TypeDoc for large or complex private methods.
• My PR passes all specs/tests and includes new/updated specs or tests based on the Code Testing Guide.
• My PR aligns with Accessibility guidelines if it makes changes to the user interface.
• My PR uses i18n (internationalization) keys instead of hardcoded English text, to allow for translations.
• My PR includes details on how to test it. I've provided clear instructions to reviewers on how to successfully test this fix or feature.
• If my PR includes new libraries/dependencies (in package.json), I've made sure their licenses align with the DSpace BSD License based on the Licensing of Contributions documentation.
• If my PR includes new features or configurations, I've provided basic technical documentation in the PR itself.
• If my PR fixes an issue ticket, I've linked them together.

[nathanmlf]

Hey @oscar-escire! I've tested on my side and it works as expected, I attached a video above showing the test. (Firefox - 150.0.3 - 64-bits)

pr_5312.mp4

Nice work with the improvement!

[lgeggleston]

+1, Looks good!
Tested on Firefox for the fix, + Chrome & Safari to confirm no regressions to drag & drop functionality.

[tdonohue]

👍 Thanks @oscar-escire ! This works well for me too. Code looks good as well

[dspace-bot]

Backport failed for dspace-7_x, because it was unable to cherry-pick the commit(s).

Please cherry-pick the changes locally and resolve any conflicts.

git fetch origin dspace-7_x
git worktree add -d .worktree/backport-5312-to-dspace-7_x origin/dspace-7_x
cd .worktree/backport-5312-to-dspace-7_x
git switch --create backport-5312-to-dspace-7_x
git cherry-pick -x c276e72d99066fc44f26f416413de6cbbe75b06b

[dspace-bot]

Successfully created backport PR for dspace-8_x:

• [Port dspace-8_x] fix: prevent drop files overlay from appearing when dragging text #5727

[dspace-bot]

Successfully created backport PR for dspace-9_x:

• [Port dspace-9_x] fix: prevent drop files overlay from appearing when dragging text #5728