feat(ui5-button): make click button preventable #11318
Open
+142
−48
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.
Currently, the click event on the
ui5-button
is the native click event from the user interaction. This creates some problems. One main issue is that the click event cannot be prevented because the event handler in the template is always attached first. This means that theisPrevented
flag is missing if the event is prevented during the bubble phase.A bigger problem happens when the
ui5-button
hastype="Submit"
and is inside a HTML form element. In this case, each time the button is clicked, the form is submitted, even if the click event is prevented.This pull request fixes the issue by changing the click event to a
CustomEvent
, instead of the nativeEvent
. This change is a soft breaking change because, in most cases, onlyevent.target
orevent.currentTarget
are used, and no other event details are usually needed. To provide backward compatibility the new custom event includes the original native event inside itse.detail.nativeEvent
, so users can still access the original event if needed.Fixes: #11103
Fixes: #9830