Lusito / tsx-dom

Lightweight DOM Libraries
https://lusito.github.io/tsx-dom/
MIT License
49 stars 17 forks source link

Attempting to set className does not work as expected #18

Closed Jonagent closed 1 year ago

Jonagent commented 1 year ago

Setting the prop className as per the type results in unexpected behavior.
The property to set in this case is "class", eg:

// TSX
<div className="myClass" />

would be equivalent to:

// HTML
<div class="myClass" />

I notice React uses the className method as well, which makes sense as the types used in this project seem to be taken from React (Preact?).

I have made the change which I've been using in my project in this fork. I would have submitted a pull request but the tests fail even before I make any changes.

Lusito commented 1 year ago

The prop for class is actually class and not className in this project. You are probably writing JavaScript, as TypeScript would vave complained here.

React used className because of a reason that is no longer valid. Afaik you can use class in react as well nowadays.

Jonagent commented 1 year ago

That is peculiar as the only reason I have the issue is due to TypeScript complaining.

image

Lusito commented 1 year ago

Do you maybe have any other jsx/tsx libraries or types installed in your project? Maybe @types/react? DetailedHtmlProps does not come from my project

Jonagent commented 1 year ago

Yep, there was @types/react hiding in there. Removed that and now class works as expected. Thanks