search

versoly / taos

A simple and small (600 bytes) library to help animate elements while scrolling using responsive Tailwind CSS JIT utility classes.
MIT License
229 stars 8 forks source link

Fix uncaught TypeError caused by `SVGAnimatedString` type `className` #14

Open regan-karlewicz opened 1 month ago

regan-karlewicz commented 1 month ago

Problem

taos.js:85 Uncaught TypeError: e4.className.includes is not a function
    at taos.js:85:49
    at Array.forEach (<anonymous>)
    at MutationObserver.observe.attributes (taos.js:84:15)

Root Cause

According to MDN: className can [...] be an instance of SVGAnimatedString if the element is an SVGElement.

This error is thrown when the MutationObserver receives an SVG element with a SVGAnimatedString type className.

Solution

Use Element.getAttribute instead of directly referencing className, as suggested by MDN.

https://developer.mozilla.org/en-US/docs/Web/API/Element/className#notes