Skip to content

Make upload new icon button open the file picker - #1159

Open
mchugh19 wants to merge 1 commit into
nextcloud:masterfrom
mchugh19:fix/icon-upload-button-master
Open

mchugh19 wants to merge 1 commit into
nextcloud:masterfrom
mchugh19:fix/icon-upload-button-master

Conversation

@mchugh19

Copy link
Copy Markdown

Fixes #1113

Problem

On Administration → External sites, clicking "Upload new icon" did nothing: no file picker opened, no network request fired, no console error.

Root cause

The hidden <input type="file"> was triggered via native label forwarding through an NcButton wrapped in <label for="uploadicon">. NcButton attaches its own click listener and swallows the event before native label → input forwarding happens (a <button> inside a <label> is also invalid interactive content, so browsers won't do label activation anyway).

Fix

Drop the <label> wrapper and give the NcButton an explicit @click handler that programmatically clicks the hidden input through a Vue template ref. Triggering the input directly was already proven to work in the issue thread, and the upload backend path is unchanged.

Testing

Built from this branch and deployed the resulting js/external-admin.mjs (+ matching CSS) onto a Nextcloud 34 / External 9.0.1 instance: the file picker now opens, the upload completes with "Icon uploaded successfully", and the icon appears in the list. Page styling verified intact.

🤖 AI (if applicable)

  • The content of this PR was partly or fully generated using AI
    (but verified by a human)

The hidden file input was triggered via native label forwarding through
an NcButton wrapped in <label for="uploadicon">. NcButton attaches its
own click handler and renders a <button> inside the <label> (invalid
interactive content), so the click never reached the input and no file
picker opened.

Replace the label with an explicit @click handler that programmatically
clicks the hidden input via a template ref.

Fixes nextcloud#1113
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

"Upload new icon" doesn't work

1 participant