Fix modal transition delays by making TransitionGroup name conditional #2845
Conversation
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
|
|
- Modified BOrchestrator.vue to only apply 'b-list' transition name for toast items - Modal elements no longer have forced transition delays - Added comprehensive tests to verify conditional transition behavior - Maintains toast animation functionality while fixing modal performance Co-authored-by: xvaara <[email protected]>
Copilot
AI
changed the title
[WIP] useModal and BApp, delay in rendering multiple modals
Fix modal transition delays by making TransitionGroup name conditional
Sep 15, 2025
xvaara
approved these changes
Sep 15, 2025
commit: |
|
Important Review skippedBot user detected. To trigger a single review, invoke the You can disable this status message by setting the Comment |
xvaara
added a commit
to xvaara/bootstrap-vue-next
that referenced
this pull request
Oct 11, 2025
* upstream/main: chore: release main (bootstrap-vue-next#2868) fix(useModalOrchestrator): circular dependency (bootstrap-vue-next#2874) docs(BModal): Parity pass (bootstrap-vue-next#2866) docs: Enable directly loading examples into StackBlitz (bootstrap-vue-next#2869) fix(BApp): wrap our test app in BApp in main.ts to enable easy verification of useModal, etc. (bootstrap-vue-next#2865) export useScrollLock() (bootstrap-vue-next#2854) chore: release main (bootstrap-vue-next#2858) fix(BToggle): stop looking for missing targets after directive is unmounted (bootstrap-vue-next#2857) chore: release main (bootstrap-vue-next#2851) Fix modal transition delays by making TransitionGroup name conditional (bootstrap-vue-next#2845) chore: release main (bootstrap-vue-next#2842) fix(BTable): events being wrongly stopped when sent from elements inside TRs (bootstrap-vue-next#2841)
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.
The issue was that multiple modals rendered through
useModalandBApphad noticeable delays due to forced transitions inBOrchestrator. TheTransitionGroupwithname="b-list"applied a 0.5s cubic-bezier transition to all orchestrated elements (modals, toasts, popovers), even whennoAnimation=truewas set on individual modals.Root Cause
The
b-listtransition was originally intended for toast animations but was being applied globally to all elements in the orchestrator, causing unwanted delays when stacking multiple modals.Solution
Made the transition name conditional based on the content type:
This ensures:
Testing
Added comprehensive unit tests to verify the conditional behavior works correctly for different combinations of modal and toast elements. Manual testing confirms modals now open instantly without delays while toast animations remain smooth.
Fixes #2839.
✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.