question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

React.Children.count returns invalid number of children

See original GitHub issue

Do you want to request a feature or report a bug?

BUG

What is the current behavior?

nextProps.children false

React.Children.count(nextProps.children) 1

React.Children.toArray(nextProps.children).length 0

React.version “16.4.2”

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn’t have dependencies other than React. Paste the link to your JSFiddle (https://jsfiddle.net/Luktwrdm/) or CodeSandbox (https://codesandbox.io/s/new) example below:

What is the expected behavior?

That React.Children.count(false) behaviour is somehow aligned with React.Children.toArray(false)

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:7 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
amannncommented, May 22, 2020

I also just noticed that render prop children are not counted as children:

Children.count(() => <span>hello</span>); // 0
Children.map(() => <span>hello</span>); // []
1reaction
nhunzakercommented, Feb 12, 2019

Ah, you’re totally right, and I apologize:

image

Here’s a test case: https://codesandbox.io/s/rwk4qr61po

I think this is, indeed, a bug.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Counting React Children
This is because Children.count is counting the number of slots that children has. Whether it be false , null or undefined , it's...
Read more >
Counting React Children | The Mindless
This is because Children.count is counting the number of slots that children has. Whether it be false , null or undefined , it's...
Read more >
React.Children with non-element children
Children.count(children) only returns the count of the number of children that are valid React Components . React.Children does not ignore ...
Read more >
React Top-Level API
Returns the total number of components in children , equal to the number of times that a callback passed to map or forEach...
Read more >
A deep dive into children in React - Max Stoibers Blog
class Fullstop extends React.Component { render() { return <h1>Hello world!</h1> } }. No matter which children you pass to this component, ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found