How to fix a production bug of a react.js package in a web application

You got a production bug reported by the support team. A ticket assigned to you by your lead, which has screenshots of the issue and production URL of the page, on which the error appeared.

You did npm start on your react application. You followed the steps to reproduce the issue. Somehow, it was not straightforward. You pinged the support guy and decided to discuss over a zoom call. After the walkthrough, you understood the cause of the issue.

You followed the steps one more time and saw the issue on the local. The issue lies inside a react package which is being used in multiple macro-frontends. You created a hotfix branch from the main branch of the package's repository. 

You fixed the issue and you are now confused what to do next. 

Lets see what are the options for a developer:

1. Merge to the main branch and publish a new version
2. Push to hotfix branch and publish a beta version

If a developer takes the first option then it can break other applications which have caret(^) sign in package.json for the package. A team should not be allowed to publish a new version without testing on a stage environment. So, we are at risk with option one.

If team takes option two then beta version can be used in the application where the bug appeared. Testing can be done on a stage environment. But, we cannot deploy to production with a beta version.

Finally, we have to take hybrid solutions of both options. Plus we have to test other applications as well due to package dependencies. If there are more than 3 applications then you need to evaluate breaking changes and come to a decision to change the number of applications which are required to get the latest published version.

So, after testing done on the stage environment, we should merge the branch to the main branch and publish a new version. Now, we are ready to deploy to production. No! Not yet, you need to replace the beta version from your application’s code with the latest published version.

Do a production release and inform the support team.