Repository navigation
Replace bootbox with a native dialog for confirmations - #566
Merged
Merged
Conversation
Links and buttons marked data-confirm="confirmation" now open an Alpine-driven <dialog> that shows the title and message as text, and submit the method form with DOM methods. The grid's export messages use notify(). The bootbox package, which has an unfixed XSS advisory, is removed.
Contributor
Author
|
Development checks for this PR are on #567. |
21 tasks done
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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.
Replaces bootbox with a small confirmation dialog built on the native
<dialog>element and Alpine (which Livewire already loads), and removes thebootboxpackage. Part of #521 (one less jQuery/Bootstrap dependency).bootbox has an open cross-site scripting advisory with no fixed version (Dependabot alert #137): it renders its title and message as HTML. BIOSPEX only passed it text from its own views, so the risk was low, but the new dialog removes it by design.
Confirm dialogs
The 10 admin links and buttons marked
data-confirm="confirmation"keep their markup (data-title,data-content,data-method,hrefordata-href).<x-confirm-dialog>(resources/views/components/confirm-dialog.blade.php, in the admin layout): a<dialog>whose title and message are set with Alpine'sx-text, so they're always text, never HTML. Cancel and Confirm buttons as before.resources/js/confirm-dialog.js: one delegated click listener opens the dialog. Confirm navigates for GET, or submits a hidden POST form with_methodand the CSRF token, now built with DOM methods instead of concatenating the URL into HTML. Cancel, Escape and a click on the backdrop close it without doing anything.common.jsgo; the native dialog returns focus to what opened it.'at the end of the "Stop Processing" message.Grid export messages
The subjects grid's "Export Submitted" and "Export Error" alerts (
bootboxMsg) becomenotify()notifications, like the flash messages.Result
bootboxremoved frompackage.json,admin-globals.jsand the CSS. The admin bundle goes from 94 kB to 77 kB.main.Tested locally (biospex.test)
On the subjects page, with form submission intercepted so nothing was sent:
/admin/projects/{project}/ocrwith_method=postand the CSRF token.data-title/data-contentis shown as text (no element created, no script run).yarn buildsucceeds;php artisan test --compact: 632 passed.To verify on development
See #548.