Masood Hayder

One thing I've noticed after months of building my first app with AI is that the bigger the project gets, the more careful I become about making changes.

When I first started, I'd describe a feature, let AI help build it, test it, and move on.

But as the app became more complex, I started noticing how even small changes could affect completely unrelated features.

And when you haven't personally written or fully understood every part of the codebase, figuring out why something broke can become a challenge of its own.

I've spent a lot of time thinking about the difference between testing a product and validating it.

When you're building software, there are so many things you can measure. Does the functionality work? Are the calculations correct? Can users complete the workflow? Are the security controls working as intended?

Those are important questions, and you can spend months getting them right.

But there's another question that technical testing can't fully answer:

I have a multi-step onboarding wizard in Next.js that ends on a generated result page. All my checks passed. Then I finished the flow by hand, pressed the browser Back button on the result page, and landed in onboarding again, not on the main screen a finished user should return to.

The cause was one word. Each navigation in the wizard used router.push, which adds a new entry to the browser s history. So the whole wizard stayed in the history stack, and Back walked straight into it. It happened in three places in one component.

The fix: router. replace instead of router.push at those three places. replace overwrites the current history entry instead of adding one, so finished steps don t pile up behind the result page. I kept router.refresh() so the server data still reloads. I merged it and confirmed it by pressing Back on a real finished flow.

Why I missed it: unit tests check what a screen renders and what a function returns. History is browser state, and no test of mine pressed Back. I found it by hand.