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

InputNumber: Infinite Loop When Unmount Component #7323

Closed
tnowad opened this issue Oct 10, 2024 · 2 comments · Fixed by #7325
Closed

InputNumber: Infinite Loop When Unmount Component #7323

tnowad opened this issue Oct 10, 2024 · 2 comments · Fixed by #7325
Assignees
Labels
Type: Bug Issue contains a defect related to a specific component.
Milestone

Comments

@tnowad
Copy link
Contributor

tnowad commented Oct 10, 2024

Describe the bug

The InputNumber component from PrimeReact triggers an infinite loop of calls to the onChange and onValueChange handlers when the value is decremented to 0. This behavior results in the following issues:

  • On Desktop:

    • The onChange handler functions correctly.
    • The onValueChange handler enters an infinite loop upon reaching 0.
  • On Mobile:

    • Both onChange and onValueChange handlers enter an infinite loop when the value is set to 0.

This issue appears to be related to the unmounting of the component and may involve improper cleanup of internal state or effects when the value reaches 0.

Reproducer

https://stackblitz.com/edit/vitejs-vite-zhutef

System Information

System:
    OS: Linux 6.10 Gentoo Linux
    CPU: (12) x64 AMD Ryzen 5 5500U with Radeon Graphics
    Memory: 8.15 GB / 18.91 GB
    Container: Yes
    Shell: 3.7.1 - /bin/fish
  Binaries:
    Node: 22.3.0 - ~/.local/share/nvm/v22.3.0/bin/node
    npm: 10.8.1 - ~/.local/share/nvm/v22.3.0/bin/npm
    pnpm: 9.12.0 - ~/.local/share/pnpm/pnpm
  npmPackages:
    primereact: ^10.8.4 => 10.8.4
    react: ^18.3.1 => 18.3.1

Steps to reproduce the behavior

  1. Render the InputNumber component with an initial value of 2.
  2. Click the decrement button until the value reaches 0.
  3. Observe the console logs:
    • On Desktop: onChange functions correctly, but onValueChange enters an infinite loop.
    • On Mobile: Both onChange and onValueChange enter an infinite loop.

Expected behavior

  • The InputNumber component should unmount without causing any infinite loops in the onChange or onValueChange handlers when the value is reduced to 0.
  • The onChange and onValueChange handlers should only be triggered once when the value changes, reflecting the current state without repeated calls.
  • Once the value is set to 0, the component should not trigger further events, allowing for clean unmounting and resource management.
@tnowad tnowad added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Oct 10, 2024
@melloware melloware added Type: Bug Issue contains a defect related to a specific component. and removed Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible labels Oct 10, 2024
@melloware
Copy link
Member

Excellent analysis, PR is welcome?

@tnowad
Copy link
Contributor Author

tnowad commented Oct 10, 2024

Thank you! I will take a look at it and create a pull request.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Bug Issue contains a defect related to a specific component.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants