TL;DR

The issue can be fixed by properly handling fragment navigation in Next.js, potentially by using the replace option with router.push or modifying the href attribute.

Guidance

• Verify that the router.push method is being used correctly, and consider using the replace option to replace the current URL instead of adding a new entry to the browser's history.
• Check the href attribute of the button that triggers the navigation, and ensure it is not causing the fragment to be appended incorrectly.
• Review the changes made in Next.js version 16.2.0 and later, and check if there are any updates or workarounds provided for fragment navigation.
• Test the application with different navigation scenarios to ensure the issue is not specific to a particular route or fragment.

Example

// Example of using replace option with router.push
router.push(`/abc#DifferentFragment`, undefined, { replace: true });

Notes

The issue seems to be specific to Next.js version 16.2.0 and later, and may be related to changes made in the router.push method or fragment navigation handling.

Recommendation

Apply a workaround by using the replace option with router.push or modifying the href attribute, as the root cause of the issue is likely related to the changes made in Next.js version 16.2.0 and later.