How 1 line of test saved $10k in a React app?

A few months ago, our team was in the trenches of building a React-powered SaaS platform. The product was ambitious, deadlines were tight, and everyone was sprinting towards the next feature. But something felt…off.

“Ship it now, fix it later!” echoed in our stand-ups. Testing wasn’t exactly front and center. Until one Friday afternoon.

Our shiny new feature—a dynamic pricing calculator—was deployed to production. A last-minute change involved tweaking a discount logic. The team, trusting manual QA, didn’t write a test for it. I mean, how complicated could one `if` statement be, right? ??

Here’s the culprit:

function calculateDiscount(price, isPremiumUser) {
  return isPremiumUser 
    ? price * 0.9 
    : price * 0.85; // Oops! Discount flip ??♂?
}        

The mistake? The premium discount percentage was swapped with the standard user discount. Within hours, customer complaints rolled in. Thousands of invoices were wrong. We spent the weekend patching, apologizing, and refunding. A $10k error.

The real kicker? This entire fiasco could’ve been avoided with ONE test:

test('calculates correct discount for premium users', () => {
  expect(calculateDiscount(100, true)).toBe(90); // Simple, clear, bulletproof
});        

That Monday, the team had a come-to-JavaScript moment. We vowed to embrace Test-Driven Development (TDD) and prioritize clean, predictable code.

The transformation was slow but profound. Instead of jumping straight into JSX, we began by writing tests first. Every component, every function, every hook started with a question: What should this code do?

Take this React component as an example. A typical user dashboard:

function UserDashboard({ user }) {
  if (!user) return <Redirect to="/login" />;

  return (
    <div>
      <h1>Welcome, {user.name}</h1>
      {user.isAdmin && <AdminPanel />}
    </div>
  );
}        

Writing tests up-front turned edge cases into design opportunities:

describe('UserDashboard', () => {
  it('redirects to login if no user', () => {
    render(<UserDashboard user={null} />);
    expect(screen.getByRole('alert')).toHaveTextContent('Redirecting...');
  });

  it('renders admin panel for admins', () => {
    const adminUser = { name: 'Alice', isAdmin: true };
    render(<UserDashboard user={adminUser} />);
    expect(screen.getByText('Admin Panel')).toBeInTheDocument();
  });
});        

By focusing on clean code principles—SRP (Single Responsibility Principle), modularity, and test-first workflows—our code became resilient, easy to debug, and much more fun to work on. The team? Less burnout, fewer late nights, and actual confidence in deployments.

If you’ve been skipping TDD, trust me, it’s not about slowing down—it’s about preventing disaster before it strikes. That single test wasn’t just a line of code; it was a $10k insurance policy.

So, here’s the question: What’s your most expensive bug story? And how did it change the way you code?