Edge Cases
When the app works normally but breaks with unusual inputs, empty states, or large data.
What Are Edge Cases?
Edge cases happen when the app works fine for normal use but breaks in unusual situations:
- A new user with no data yet (empty state)
- Very long text that breaks the layout
- Special characters (quotes, slashes, emojis)
- Hundreds or thousands of items in a list
- Boundary dates (end of month, leap years)
- Zero or negative numbers
- Submitting a form twice quickly (double submission)
Common Edge Cases
| Scenario | What Happens | How to Fix |
|---|---|---|
| Empty state (no data) | Page crashes or shows nothing | Add a "No data yet" message |
| Very long text | Layout breaks, text overflows | Add text truncation or character limits |
| Special characters | Data corrupts or query breaks | Sanitize input, use parameterized queries |
| Large dataset | Page loads slowly or crashes | Add pagination or virtual scrolling |
| Zero values | Division by zero or wrong display | Add zero checks before calculations |
| Double submission | Duplicate entries created | Disable button after first click |
The "What If" Mindset
When building a feature, ask yourself:
- What if this list is empty?
- What if this text is very long?
- What if this number is zero?
- What if the user clicks the button twice?
- What if the user is brand new with no data?
Handling Empty States
The most common edge case. A new user opens your app and sees a crash instead of a helpful message.
Ask Claude to handle empty states
Claude promptmy-app-name: The dashboard crashes when a new user logs in and has no data yet.
Can you add proper empty state handling to the dashboard? Show a friendly message like "No data yet. Create your first entry to get started!" instead of crashing.
Proactive Edge Case Handling
Instead of waiting for bugs, ask Claude to handle edge cases before they happen:
Proactively handle edge cases
Claude promptmy-app-name: Please review the form submission on the [page name] page and add handling for these edge cases:
1. Empty form fields (show validation errors)
2. Very long text input (add character limits)
3. Double-click on submit button (prevent duplicate submissions)
4. Special characters in text fields (ensure they are saved correctly)
Testing Edge Cases
After asking Claude to fix edge cases, test them yourself:
Start the app and test manuallybash
pnpm dev:your-app-name
# Then try:
# - Submitting empty forms
# - Entering very long text (100+ characters)
# - Using special characters: ' " < > & /
# - Loading a page with no data
# - Clicking submit button rapidlyQuiz
Quiz
A brand new user opens your app and sees a crash instead of the dashboard. What type of bug is this?