T
3

The day my button component broke every form on the site

Last Tuesday I pushed a small update to our button component in Figma without checking the dev handoff first. I changed the padding from 12px to 8px because it looked cleaner on the mockup. Turns out that tweak broke the spacing on 47 different forms across our dashboard. Users couldn't click submit on their orders because the button overlapped the error messages. I spent the next three hours rolling back the component and patching each form individually. Now I always run a manual test on the staging environment before I push any component change. Has anyone else had a tiny CSS value cause a full site meltdown?
2 comments

Log in to join the discussion

Log In
2 Comments
the_diana
the_diana23h ago
You fixing the error message positioning would have saved you that whole rollback mess.
1
betty_fisher5
betty_fisher51d agoTop Commenter
Wait, did you check if the error message positioning was also tied to that same button component? I had something similar happen with a dropdown menu where I changed the margin by 2px and it made the entire checkout flow blank out on mobile. Sometimes I think these design tools make it too easy to break stuff without realizing how deep the connections go.
0