Replace native alert()/confirm() with tpen-alert/tpen-confirm modal dialogs#496
Merged
Replace native alert()/confirm() with tpen-alert/tpen-confirm modal dialogs#496
Conversation
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Native
alert()andconfirm()calls produce inconsistent, browser-controlled blocking dialogs. This replaces all instances across the codebase with the existingtpen-alert/tpen-confirmevent-dispatch system.Alert replacements
alert()→TPEN.eventDispatcher.dispatch('tpen-alert', { message })Affected:
annotorious-annotator/plain.js,roles-handler,projects/index.js,project-list-write.js,api/Project.js,manage-project/index.jsThe permissions-denied alert in
manage-project/index.jsnow defers the redirect viatpen-alert-acknowledgedso the user sees the dialog before being navigated away.Confirm replacements
All
confirm()calls are replaced via a newutilities/confirmAction.jshelper:The helper generates a unique
confirmId(crypto.randomUUID()with a fallback) for each dialog.ConfirmContainerechoes the ID through button-click events; listeners useon()with an ID guard so stale callbacks from earlier dialogs never fire on a later one.Affected:
decline-project,leave-project,manage-layers,manage-pages,manifest-import,navigation-manager,quicktype-manager,roles-handler(3 instances),line-parser.js(3 instances),manage-project/index.jsConfirmContainer improvements
tpen-confirmrequests while a dialog is already visible, preventing button-mash stacking.:focus-visibleCSS so the focused button has a visible outline, making tab/enter navigation work correctly.positiveButtonText/negativeButtonText. Destructive or statement-style confirms use specific labels (e.g., Delete/Cancel, Leave/Cancel, Publish/Cancel, Transfer/Cancel, Discard/Keep Editing); question-style confirms keep the Yes/No defaults.Methods that were
asyncsolely due toawait confirm(…)patterns have hadasync/awaitremoved from both the method and its call sites.Original prompt
💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.