Props on components' children come in on props.children[0].props.children.props, not on props.children[0].props

[valentijnnieman]

One thing that I found weird when writing the Tabs component, is that the props on children components coming from Dash are not available on props.children[0].props(for example, where props.children[0] is a Tab component for instance), but on props.children[0].props.children.props. I've went around this by having some logic saying "if child.props.children exists, the props are coming from Dash, otherwise they're coming from Demo.js", but that causes weirdness when, in JS (Demo.js or perhaps a unit test), you set children on a <Tab/>, causing the logic to pick that up as "oh, these are coming from Dash" and using the child.props.children.props which is then not the props we want!

Hope this makes sense!

[T4rk1n]

I found that weird too, it's the TreeContainer render function that does this.

[chriddyp]

Right, that's because we wrap each component in a NotifyObservers component. Until tabs was written, we didn't have any components that needed to introspect their children

[valentijnnieman]

Ah cool thanks. Let me see if I can come up with a fix!

[chriddyp]

This is now available as props._dashprivate_layout