100devs-calculator icon indicating copy to clipboard operation
100devs-calculator copied to clipboard

Fixed the bug with the styled calculator!

Open Tailsxz opened this issue 1 year ago • 0 comments

I completed the challenge: 5 I feel good about my code: 2 Learned a lot about bubbling. The only difference between the working base calc and the styled calc was that I added pesky spans in the styled one. The click of the span was bubbling up to the parent button's click listener so that's why sometimes the classList was returning empty and other times the actual classList, because the target itself was the span! This bug hurt my head a lot when I first ran into it and I'm glad I revisited it a month later and figured it out! The simplest fix was to add a class of decimal to the span itself, but a much less hacky fix is just using the pointer events property and setting it to none for the span within CSS.

Tailsxz avatar Dec 19 '23 18:12 Tailsxz