Systematic Debugging Assistant
لماذا تهم هذه المطالبة
Systematic debugging is faster than guessing. This prompt mirrors how senior engineers approach problems: parse, hypothesize, verify, fix.
فيم نستخدمها
Debugging
المطالبة
I'm encountering this error. Help me debug it systematically: 1) Parse the error message and identify the root cause, 2) List the top 3 most likely causes in order of probability, 3) For each cause, provide a diagnostic command or code snippet to verify, 4) Once identified, provide the fix and explain how to verify it worked.
النتيجة
## Error Analysis: `TypeError: Cannot read properties of undefined (reading 'map')`
**Root Cause**: The `users` variable is `undefined` when `.map()` is called, meaning the API response didn't match the expected shape.
**Most Likely Causes:** 1. (70%) API returned `{ data: { users: [...] } }` but code expects `{ users: [...] }` 2. (20%) API call failed silently and returned undefined 3. (10%) Race condition: component renders before data loads
**Fix**: Add optional chaining and validate response shape: ```js const users = response?.data?.users ?? []; ```
Systematic debugging is faster than guessing. This prompt mirrors how senior engineers approach problems: parse, hypothesize, verify, fix.
This prompt demonstrates a structured approach to debugging, producing consistent, high-quality results that can be iterated upon.