textLength should not be kebap-cased

preactjs / preact-compat

ATTENTION: The React compatibility layer for Preact has moved to the main preact repo.

http://npm.im/preact-compat

MIT License

949 stars 148 forks source link

textLength should not be kebap-cased #483

Open chrisv2 opened 6 years ago

chrisv2 commented 6 years ago

textLenght is a valid attribute on svg:tspan and svg:text: https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/textLength

Unfortunately, textLength gets kebap-cased to text-length because it matches the CAMEL_PROPS regex.

Comparing with the SVG attribute reference, the following attributes are likely affected:

clipPathUnits
glyphRef
markerHeight, markerUnit, markerWidth
textLength
xChannelSelector

itslevo commented 6 years ago

Can confirm, clipPathUnits gets rendered as clip-pathunits.

developit commented 6 years ago

Hmm - it looks like the regex that is handling clipPathUnits is missing /g, so it only replaces the first uppercase character:

https://github.com/developit/preact-compat/blob/6029c6e25f6d1c6461d5cc24a9c8bdc781f6ab87/src/index.js#L123

ikoruk commented 5 years ago

Is there a temporary workaround until this is fixed?

itsthesteve commented 5 years ago

@ikoruk this bit me today. With the g flag it gets converted to kebab which isn't the solution as far as I can tell with. Is there a way to denylist certain attributes, or svg attributes as a whole? I'm not super familiar with the internals.