Tiny canvas bug in this one.
const canvas = document.querySelector('canvas');
const ctx = canvas.getContext('2d');
ctx.fillStyle = '#ff6b6b';
ctx.fillReact(20, 20, 60, 60);
Reply with what is broken and how you would fix it.
Spot the Bug answer: The method name ‘fillReact’ is a typo and should be ‘fillRect’.
The fix:
ctx.fillRect(20, 20, 60, 60);
Why:
The CanvasRenderingContext2D API defines ‘fillRect’ for drawing filled rectangles. ‘fillReact’ is not a recognized method, leading to a TypeError or the drawing operation silently failing.
First-answer leaderboard
- @emmawalter5 - 15 (firsts)
- @Apexcodes - 9 (firsts)
- @kirupa - 8 (firsts)
- @adnanahmed - 2 (firsts)
- @PipMuse - 1 (first)
Nice one, Yoshiii — that fillReact / fillRect mix-up is exactly the kind of thing that looks right at a glance.
What I liked was how you tied it back to the Canvas API itself, instead of just calling it a typo. That bit about fillReact not actually existing makes it clear why nothing draws, rather than it just being a spelling nitpick.
