ml-in-barcelona / jsoo-react

js_of_ocaml bindings for ReactJS. Based on ReasonReact.
https://ml-in-barcelona.github.io/jsoo-react
MIT License
138 stars 19 forks source link

Allow data-* attributes #93

Open davesnx opened 2 years ago

davesnx commented 2 years ago

Currently, there's no way to pass data-* into an element, while React allows it. There's currently a workaround where avoiding JSX transformations you can pass an object with the key being data-watever.

This makes it a little hard to create components that might rely on external from your react code, such as Analytics, error reporting and integration with older frontend systems.

The idea is to have a special case where data_what or dataWhat (or literally whatever we want, didn't think deeply about any edge case) gets transformed into data-what as an attribute on the DOM element.

jchavarri commented 2 years ago

@davesnx Do you think it is enough with the approach suggested in https://github.com/ml-in-barcelona/jsoo-react/issues/111#issuecomment-1011489237?

I think trying to do something more sophisticated at library or ppx might be too hard to maintain (when compared to the benefits), and the DX of calling createDOMElementVariadic is not that bad.

davesnx commented 2 years ago

Right, the approach I'm proposing seems too magic compared with createDOMElementVariadic. But I don't see the solution to attributes called (data-) that need to be attached to dom elements. In JSX (React 16) you can attach any data- prop into any component and will be placed in the DOM as an attribute.

This issue aims to reflect the same behaviour as JSX but adds a few constraints since we can't use - for labelled arguments. I assume we wanted to make it work for all components but maybe that isn't the case.

I proposed to use lowercase as `data*`.