Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(input): duplicate triggering of input events #1323

Merged
merged 5 commits into from
Aug 8, 2023

Conversation

tianenpang
Copy link
Member

@tianenpang tianenpang commented Aug 8, 2023

Closes #1308

📝 Description

This PR fixes the issue where native DOM events for the input were being triggered twice. This issue was caused by the duplication of inputProps and otherProps in the mergeProps.

Firstly, inputProps is derived from originalProps after being processed by useTextField, which already includes the native DOM events. Secondly, otherProps also contain a similar set of props.

In this scenario, there could be two identical DOM event functions present in mergeProps. However, within mergeProps, the identical functions are executed in a chain (source), leading to the execution of the functions twice.

⛳️ Current behavior (updates)

Filter out duplicate event functions in filterDOMProps.

🚀 New behavior

The filterDOMProps utility method now supports the omitEventNames option to prevent redundant event functions. (Skips only functions with names starting with on[A-Z]).

💣 Is this a breaking change (Yes/No):

No.

📝 Additional Information

Test cases have been added and passed successfully.

@changeset-bot
Copy link

changeset-bot bot commented Aug 8, 2023

🦋 Changeset detected

Latest commit: 5c227d1

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 34 packages
Name Type
@nextui-org/react-rsc-utils Patch
@nextui-org/input Patch
@nextui-org/divider Patch
@nextui-org/react-utils Patch
@nextui-org/modal Patch
@nextui-org/navbar Patch
@nextui-org/popover Patch
@nextui-org/tabs Patch
@nextui-org/react Patch
@nextui-org/accordion Patch
@nextui-org/dropdown Patch
@nextui-org/avatar Patch
@nextui-org/badge Patch
@nextui-org/button Patch
@nextui-org/card Patch
@nextui-org/checkbox Patch
@nextui-org/chip Patch
@nextui-org/code Patch
@nextui-org/image Patch
@nextui-org/kbd Patch
@nextui-org/link Patch
@nextui-org/pagination Patch
@nextui-org/progress Patch
@nextui-org/radio Patch
@nextui-org/ripple Patch
@nextui-org/skeleton Patch
@nextui-org/snippet Patch
@nextui-org/spacer Patch
@nextui-org/spinner Patch
@nextui-org/switch Patch
@nextui-org/table Patch
@nextui-org/tooltip Patch
@nextui-org/user Patch
@nextui-org/use-real-shape Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel
Copy link

vercel bot commented Aug 8, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
nextui-storybook-v2 ✅ Ready (Inspect) Visit Preview 💬 Add feedback Aug 8, 2023 3:04pm

@vercel
Copy link

vercel bot commented Aug 8, 2023

@tianenpang is attempting to deploy a commit to the NextUI Team on Vercel.

A member of the Team first needs to authorize it.

@jrgarciadev
Copy link
Member

Huge thanks! @tianenpang

@jrgarciadev jrgarciadev merged commit 4200164 into nextui-org:main Aug 8, 2023
6 checks passed
@github-actions github-actions bot mentioned this pull request Aug 8, 2023
@tianenpang
Copy link
Member Author

Hi @jrgarciadev, this PR only updates the filterDOMProps for the input, perhaps there are other components that we should also address to prevent similar issues 👀

@tianenpang tianenpang deleted the fix/input-dom-props branch August 8, 2023 15:27
@jrgarciadev
Copy link
Member

Yes @tianenpang I'd be nice to apply the same change to other components

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[BUG] - <Input /> onSelect event different behavior
2 participants