no-danger-with-children false positive with newline in element

[mockdeep]

The following reports an error on the no-danger-with-children rule:

<div dangerouslySetInnerHTML={'<span>stuff</span>'}>
</div>

I would expect if there is a newline between the opening and closing tag that the rule would not complain.

[ljharb]

That's still considered "children", afaik - why not <div dangerouslySetInnerHTML={'<span>stuff</span>'} />?

[mockdeep]

Ah, I didn't realize we could do self-closing divs in jsx. Still, I don't think newlines between tags are considered children. Hacked together this quick test:

import React from 'react';
import { mount } from 'enzyme';

class Parent extends React.Component {

  render() {
    console.log(this.props.children);
    return <div>{this.props.children}</div>;
  }

}

it('does stuff', () => {
  mount(<Parent></Parent>); // => `undefined`
  mount(<Parent>
      </Parent>); // => `undefined`
  mount(<Parent />); // => `undefined`
  mount(<Parent> </Parent>); // => `' '`
  mount(<Parent>

      </Parent>); // => `undefined`
  mount(<Parent>foo</Parent>); // => `'foo'`
})

[ljharb]

Fair point - both your example and https://jsfiddle.net/ljharb/69z2wepo/80986/ implies it's a bug in eslint-plugin-react.

[mockdeep]

Ha, nice. I started typing ReactDOM and then fell back to what I knew off the top of my head.