Warn if no ref is returned for dynamic children

[andrei-picus-hs]

Need

As a developer
I want sensible warnings
So that I can be more productive.

Deliverables

Given I have a component
And it includes the `ReactComponentTree` mixin
And it defines a children method
When I call the method only once during a render cycle
Then no warning will be displayed.

Given I have a component
And it includes the `ReactComponentTree` mixin
And it defines a children method
And it doesn't define a `ref` prop
When I call the method more than once during a render cycle
Then a warning will be displayed.

Solution

Maybe keep a dict of calls that gets reset every render cycle?

/cc @skidding

[ovidiu-chereches-hs]

Maybe keep a dict of calls that gets reset every render cycle?

How (or where) would you add a "before render" hook?

[andrei-picus-hs]

How (or where) would you add a "before render" hook?

Reset them after DidUpdate and DidMount or before WillMount and WillUpdate :smile: http://jsbin.com/xoveru/edit?js,console,output

[ovidiuch]

Sure. I think will is better since you get to access the counters of the last render, though the counters should probably be private in which case it won't make a difference (until we decide to read the counters elsewhere as well)...

What about the ES6 class?

On Monday, June 29, 2015, andrei-picus-hs [email protected] wrote:

How (or where) would you add a "before render" hook?

Reset them after DidUpdate and DidMount or before WillMount and WillUpdate [image: :smile:] http://jsbin.com/xoveru/edit?js,console,output

— Reply to this email directly or view it on GitHub https://github.com/skidding/react-component-tree/issues/12#issuecomment-116642692 .

Best regards, Ovidiu Cherecheş

[andrei-picus-hs]

the counters should probably be private

They should; they would just be used for printing out warnings in dev mode (disabled in production).

What about the ES6 class?

Well whoever's extending the ES6 class should call super() in every life cycle method they define. I'm guessing you should always do that if you're extending some React class.

[fabslab]

Is there a way to walk the React component tree if elements aren't given ref values?