Fall ce-0085 · Szenario scenario-file-api

File API drag and drop does not work in contenteditable

OS: macOS 14.0 Gerät: Desktop or Laptop MacBook Pro Browser: Safari 17.0 Tastatur: US Entwurf
file-apidrag-dropsafarimacos

Diese Seite wurde noch nicht übersetzt

Derzeit wird der englische Originalinhalt angezeigt. Wir freuen uns über Ihre Hilfe bei der Übersetzung.

Phenomenon

When trying to drag and drop files into a contenteditable element, the File API may not work as expected. File drop events may not fire, or file content may not be accessible.

Reproduction example

  1. Create a contenteditable div.
  2. Try to drag a file from the file system into the contenteditable.
  3. Listen for drop events and try to read file content.
  4. Observe whether files can be dropped and accessed.

Observed behavior

  • In Safari on macOS, file drag and drop may not work in contenteditable.
  • Drop events may not fire for files.
  • File content may not be accessible.
  • The default paste behavior may interfere.

Expected behavior

  • File drag and drop should work in contenteditable.
  • Drop events should fire correctly.
  • File content should be accessible via File API.

Playground for this case

Use the reported environment as a reference and record what happens in your environment while interacting with the editable area.

Reported environment
OS: macOS 14.0
Device: Desktop or Laptop MacBook Pro
Browser: Safari 17.0
Keyboard: US
Your environment

Use this editable area to reproduce the described case.

Event log
Use this log together with the case description when filing or updating an issue.
0 events
Interact with the editable area to see events here.