Skip to content

Conversation

@gene-ht
Copy link

@gene-ht gene-ht commented Sep 5, 2024

Description

This PR fixes a bug where the code fails to work properly in both the Next.js production environment and development mode (with strict mode set to false) when the delay prop is set to a value greater than 0.

Fix

I removed the startOnMount filter in the maybeInitialize function, which resolves the issue. Upon reviewing the lifecycle of the component, I found that the startOnMount property is unused and redundant, and removing it simplifies the logic while fixing the bug.


Steps to Reproduce

  1. Development Mode (Strict Mode Off):

    • Create a Next.js app.
    • Disable strict mode in next.config.js or React.StrictMode.
    • Implement a component that uses the delay prop (greater than 0).
    • Run the app using next dev.
    • The component may fail or behave unexpectedly when delay is set.
  2. Production Mode:

    • Build the app using next build.
    • Deploy or serve the app using next start.
    • The component fails to work as expected when delay is greater than 0.

Expected Behavior

The application should behave consistently across both development (with or without strict mode) and production environments, regardless of the value of the delay prop.


Changes Made

  • Removed the startOnMount filter in the maybeInitialize function, as it was redundant and unused throughout the component lifecycle.
  • Ensured the changes respect the Next.js rendering cycle in both client and server environments.

Testing and Verification

  1. Tested the fix with various delay values (e.g., 0, 1000, 5000) in both development (next dev) and production (next build, next start).
  2. Verified that the fix works both with strict mode enabled and disabled in development mode.
  3. Confirmed consistent behavior between development and production environments, with no errors when using delay.

Linked Issues

Fixes #822

@codesandbox
Copy link

codesandbox bot commented Sep 5, 2024

Review or Edit in CodeSandbox

Open the branch in Web EditorVS CodeInsiders

Open Preview

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.

react-countup fails to work in next.js produnction environment

1 participant