Codebases often end up being frozen in time. Be it due to developers being too focused on new features, or due to the attention of the company shifting elsewhere. While the world moves on, these codebases continue to accumulate technical debt. Dependencies become outdated, security vulnerabilities accumulate, and as the codebase ages, it becomes increasingly complex to get things back on track.
Bosun aims to solve this problem by offering a platform that enables workflows driving automatic software maintenance. In this case study we will take the Spectrum chat application, a frozen production codebase, and show how we can use Bosun to upgrade its dependencies quickly, easily and safely.
After using Bosun to automate the dependency upgrades, developers no longer need to worry about having to dig through upgrade guides, meticulously comb through the application codebase, or manually perform the changes whilst worrying about testing the application. Bosun workflows take care of all of the above, and present the developer with a beautiful pull request that is easy to review and merge.
As your customers demanded more and more features, your developers gained new insights, and your codebase gained new structures and intricacies. Guiding coding agents through large scale migrations and transformations involves complex workflows with concrete guard rails and quality checks. Upgrading the Spectrum chat application to the modern day is the sort of project that many companies put off for years, out of concerns of cost overruns and the risk of breaking the application. With Bosun, these projects can finally be tackled.
Our approach to developing workflows is to start out with a high level plan that we implement by naievely instructing agents to perform each step. Then as we test the workflow, we add guard rails and quality checks to ensure that the workflow produces the desired result. In this article we will show the first steps of this process, porting the various components of the Spectrum chat application to the latest version of React.
Discovery
An important aspect of Bosun workflows is that by splitting up each task into finer steps, we can increase the likelihood of success. By naively instructing agents to perform each step, we can ensure that the workflow is simple and easy to understand. Then as we test the workflow, we can add guard rails and quality checks to ensure that the workflow produces the desired result.
For discovery, we defined the following steps:
- Determining the current Node.JS version
- Determining what package manager was used
- Determining the target React version
These three steps ensure that from this point on all agents will use the correct commands to operate on the codebase and that the mission is well established.
Preparation
To prepare for the actual upgrade, we need two important things, a good plan and a good test suite. There are great guides online for upgrading each version of React. We can have an agent gather that information. Because we’re just upgrading the components in this workflow, we’ll establish a regression test suite with no external dependencies so that we can quickly validate the upgrade. These are the steps we defined:
- Research upgrade guides
- Set up regression test suite
- Create regression test suite Github workflow
- Find all React components
- Generate regression tests for each component
When generating the regression tests, we first generate a list of all React components in the codebase. Then we run agents in a for each loop to generate a regression test for each component. This ensures that we don’t build up a huge context size that degrades performance and ensures we don’t skip any components.
Execution
The execution phase is where we actually perform the upgrade. We defined the following steps:
- Upgrade the package and its peer dependencies
- Follow the upgrade guide instructions
- Fix the regression test setup
- Run the regression tests and fix any failures
Again looping over both the upgrade guide instructions and the regression tests ensures that we don’t miss any steps.
This straight forward approach already yields great results for upgrading React components and forms a solid foundation while leaving lots of room for improvement. Here’s some ideas for improvements:
- Making the regression tests optional for when a suite already exists
- Making the script for finding React components into a Node.JS package that can be separately improved
- Splitting out the discovery steps into a separate reusable workflow
We hope you found this case study interesting and we look forward to hearing from you. If you are interested in learning more about Bosun, please visit our website. If you have a software maintenance, migration or transformation challenge, we are currently taking on projects and would love to hear from you so please do send us an email.