test: Enable react/no-unstable-nested-components
#34518
Conversation
eps1lon
force-pushed
the
test/no-unstable-nested-component
branch
from
bfde5b2
to
4e2156a
Compare
eps1lon
requested review from
mnajdova,
michaldudak,
siriwatknp,
hbjORbj and
danilo-leal
as code owners
| @@ -23,7 +23,7 @@ const InputInput = React.forwardRef(function InputInput( | |||
|
|
|||
| const styledInput = <InputUnstyled components={{ Root: InputRoot, Input: InputInput }} />; | |||
|
|
|||
| const PolymorphicComponentTest = () => { | |||
| const polymorphicComponentTest = () => { | |||
There was a problem hiding this comment.
The idea here is that PolymorphicComponentTest looks like a component (and therefore would allow a hooks call). But inside of it we're declaring new components which is bad. Since it's not actually a component, we adjust the name to reflect that.
| const polymorphicComponentTest = () => { | ||
| const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />; |
There was a problem hiding this comment.
| const polymorphicComponentTest = () => { | |
| const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />; | |
| const CustomComponent: React.FC<{ stringProp: string; numberProp: number }> = () => <div />; | |
| const PolymorphicComponentTest = () => { |
Would this be better? I know that it produces no difference here since we are not using polymorphicComponentTest but it seems like a component here (or polymorphicComponentTest is not needed at all).
There was a problem hiding this comment.
I usually keep things specific to a test in its scope before hoisting up. That way other tests don't start to rely on it. Up to you, what you prefer.
There was a problem hiding this comment.
I usually keep things specific to a test in its scope before hoisting up
That sounds good to me as well.
There was a problem hiding this comment.
I guess we could also disable react/no-unstable-nested-components for the TypeScript tests.
Lines 319 to 320 in 101fa0d
There was a problem hiding this comment.
It's still "invalid React". Better to write it correct everywhere.
Enables
react/no-unstable-nested-componentsThis rule is likely either going to be in the recommended preset or move to rules-of-hooks. Wanted to see how this rule performs on a medium size repo and the errors all look legitimate to me (although it's all just test-code).