Extra "data" attributes

[rcilia]

Would it be possible to support extra "data" attributes on mesh (and possibly groups and other types?) objects?
For example, adding this component to a Canvas will crash with a Uncaught TypeError: Cannot set property 'qa' of undefined error:

const Box = () => (
  <mesh data-qa="test">
    <boxBufferGeometry args={[1, 1, 1]} />
    <meshNormalMaterial />
  </mesh>
)

This is only an issue with custom arguments containing a - in the name.

Is this something that could be considered?
Thanks

[joshuaellis]

There's a userData object that's the defacto way of storing... user data.... on objects in three.js. IMO this how we should do it to avoid pollution.

[rcilia]

Right, my use case is more for ui tests purposes. I have that babel plugin that'll add a data-qa attribute automatically, but it makes r3f crash.

[rcilia]

it might make more sense to make sure the plugin doesn't add that attribute to non-react elements though, but I was wondering if a fix could also be applied to r3f for other purposes.

[joshuaellis]

IMO it seems like a real edge case, particularly to your testing needs. Maybe it's worth chatting with the folks who wrote the babel-plugin to see their thoughts on the matter because I imagine when the created the plugin they only saw it being used on the DOM.

what you're wanting to do I append random props to THREE objects which could lead to a load of bugs as it's a very tight ecosystem, but I'm just speculating here.

[rcilia]

Yep that makes sense, thank you for your input!