microsoft / microsoft/applicationinsights-react-js
useTrackEvents skipFirstRun not working properly in React strict mode
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 47
- Forks
- 18
- Avg merge
- 1d 2h
- Merged PRs (30d)
- 8
Description
When you run your application in development mode and with the strict mode on the skipFirstRun parameter is not working properly. The reason for this is that when the strict mode tries to identifying unsafe lifecycles it will rerender your component making it call the function twice by default. This is not going to happen in production environment, but can be confusing in dev mode.
Steps to Reproduce
- OS/Browser: Windows/Chrome
- React Version: 18.2.0
Use the useTrackEvent hook in dev mode with the strict mode on.
Expected behavior
useTrackEvents skipFirstRun parameter works properly in development with strict mode.
Additional context
To prevent this issue, all you need to do is set the firstRun variable back to true, when the hook unmounts. I can create a PR for this if you want.
Thanks!
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by locating the useTrackEvent hook and reproduce the issue in a React 18.2.0 development build with Strict Mode enabled. Inspect how skipFirstRun behaves across the hook's mount and unmount cycle, then verify that the callback is skipped only on the initial run in development and still behaves correctly in production.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- frontend, observability-sre
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100