Skip to content

[Bug] Drop label renders on top of file list if element isn't visible on initialization and using compact layout #819

Description

@jacksleight

Is there an existing issue for this?

  • I have searched the existing issues

Have you updated FilePond and its plugins?

  • I have updated FilePond and its plugins

Describe the bug

If the FilePond element isn't visible (within a display: none element) when it initalizes, the UI does not render correctly. Specifically the drop label element does not get hidden. When using the compact panel layout this causes the drop label to appear on top of the files list, which prevents you from clicking the remove button.

I think this might be the same problem as mentioned in this closed issue: #574

Reproduction

I have created a CodePen that demonstrates this issue: https://codepen.io/jacksleight/pen/wvpoqpw

Let the page load, then click the button to reveal the hidden element. The revealed FilePond instance has the drop label on top, and the remove button can't be clicked:

Screenshot 2022-03-23 at 11 25 11

Environment

- Device: MacBook
- OS: macOS 12.1
- Browser: Chrome 99

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions