Valid self reference jsx element.

[xeodou]

Please check the information here #839

I'm trying to include xo in one of our projects, i hit the issue exactly the same as @pfhayes . And after dig into the codebase, i found we have a self reference linked jsx element and that cause the issue, Like this

class Foo extends React.createClass {
   render() {
       return <this.Bar  className='demo' />
   }
}

That's cause the issue. I don't think it's a best practice, but at least it shouldn't crash the workflow.

[ljharb]

could you also add examples with an SFC, and with a class-based component?

[xeodou]

Sure.

[xeodou]

By the way, SFC is short for self-closing component right ?

[ljharb]

no - it's for "stateless functional component" - ie, a function that takes props and returns JSX

[xeodou]

ah, Thanks. I know 'stateless functional component' , just have no idea what does SFC meaning. Thanks for point out

[ljharb]

hmm - why would "foo" lowercase catch "Foo", which is a distinct property in JS?

[xeodou]

Let me check the test.

[xeodou]

I think i just forget remove the line options: [{forbid: ['style', 'foo']}], it shouldn't relate to forbid option.

[xeodou]

hi @ljharb I just made some changes, Are there what you expect ?

[ljharb]

LGTM! I'll let other collabs take a look first tho.

[EvHaus]

LGTM

[xeodou]

Cool. Thanks @ljharb and @EvNaverniouk

[xeodou]

Hi @ljharb When can you merge the pull request ?

[xeodou]

Hi @ljharb @EvNaverniouk , Do we have any other issue here for merge the PR ?