Fix @onclick:preventDefault not working with enhanced navigation#64917
Draft
Fix @onclick:preventDefault not working with enhanced navigation#64917
Conversation
Fixes #52514 Enhanced navigation's native click handler was intercepting clicks before Blazor's EventDelegator could call event.preventDefault() via the @OnClick:preventDefault directive. This caused links with preventDefault to still navigate when enhanced navigation was enabled. The fix defers enhanced navigation's click handling to EventDelegator's notifyAfterClick callback, ensuring it runs after Blazor's event handlers have processed the click (including calling preventDefault if specified). Changes: - NavigationEnhancement.ts: Added attachEnhancedNavigationClickHandlerToEventDelegator() to register enhanced nav click handling via EventDelegator's afterClick callback - BrowserRenderer.ts: Wire up enhanced navigation to use EventDelegator - Added E2E test to verify the fix
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.
Summary
Fixes #52514
@onclick:preventDefaultwas not functioning when enhanced navigation was enabled. Clicking a link with@onclick:preventDefaultwould still navigate away instead of preventing the default behavior.Root Cause
Enhanced navigation's native click handler (
document.addEventListener('click', onDocumentClick)) was intercepting clicks before Blazor's EventDelegator could callevent.preventDefault()via the@onclick:preventDefaultdirective.Solution
Defer enhanced navigation's click handling to EventDelegator's
notifyAfterClickcallback, ensuring it runs after Blazor's event handlers have processed the click (including callingpreventDefaultif specified). This follows the same pattern used byNavigationManager.ts.When an EventDelegator is available (interactive scenarios), click handling is deferred to the callback. In pure SSR scenarios without EventDelegator, the native click handler continues to work as before.
Changes
attachEnhancedNavigationClickHandlerToEventDelegator()to register enhanced nav click handling via EventDelegator'snotifyAfterClickcallbackPreventDefaultOnClickIsRespectedWithEnhancedNavigationtest to verify the fixPageWithPreventDefaultLink.razorfor the E2E test