Fix RulesOfHooks test case indentation
Just a small formatting fix. ghstack-source-id: c71ff02ed972f3dad5a2a6bb4842d1f1cf52813e Pull Request resolved: https://github.com/facebook/react/pull/25368
Lauren Tan committed
Sep 30, 2022 at 12:31 UTC
49ae0fad84593c4de6511a85773740d2aec919c3
1 file changed
+111
-111
packages/eslint-plugin-react-hooks/__tests__/ESLintRulesOfHooks-test.js
+111
-111
@@ -978,142 +978,142 @@ if (__EXPERIMENTAL__) {
978
tests.valid = [
979
...tests.valid,
980
`
981
- // Valid because functions created with useEvent can be called in a useEffect.
982
- function MyComponent({ theme }) {
983
- const onClick = useEvent(() => {
984
- showNotification(theme);
985
- });
986
- useEffect(() => {
987
- onClick();
988
- });
989
- }
990
- `,
991
- `
992
- // Valid because functions created with useEvent can be called in closures.
993
- function MyComponent({ theme }) {
994
- const onClick = useEvent(() => {
995
- showNotification(theme);
996
- });
997
- return <Child onClick={() => onClick()}></Child>;
998
- }
999
- `,
1000
- `
1001
- // Valid because functions created with useEvent can be called in closures.
1002
- function MyComponent({ theme }) {
1003
- const onClick = useEvent(() => {
1004
- showNotification(theme);
1005
- });
1006
- const onClick2 = () => { onClick() };
1007
- const onClick3 = useCallback(() => onClick(), []);
1008
- return <>
1009
- <Child onClick={onClick2}></Child>
1010
- <Child onClick={onClick3}></Child>
1011
- </>;
1012
- }
1013
- `,
1014
- `
1015
- // Valid because functions created with useEvent can be passed by reference in useEffect
1016
- // and useEvent.
1017
- function MyComponent({ theme }) {
1018
- const onClick = useEvent(() => {
1019
- showNotification(theme);
1020
- });
1021
- const onClick2 = useEvent(() => {
1022
- debounce(onClick);
1023
- });
1024
- useEffect(() => {
1025
- let id = setInterval(onClick, 100);
1026
- return () => clearInterval(onClick);
1027
- }, []);
1028
- return <Child onClick={() => onClick2()} />
1029
- }
1030
- `,
1031
- `
1032
- const MyComponent = ({theme}) => {
1033
- const onClick = useEvent(() => {
1034
- showNotification(theme);
1035
- });
1036
- return <Child onClick={() => onClick()}></Child>;
1037
- };
1038
- `,
1039
- `
1040
- function MyComponent({ theme }) {
1041
- const notificationService = useNotifications();
1042
- const showNotification = useEvent((text) => {
1043
- notificationService.notify(theme, text);
1044
- });
1045
- const onClick = useEvent((text) => {
1046
- showNotification(text);
1047
- });
1048
- return <Child onClick={(text) => onClick(text)} />
1049
- }
1050
- `,
981
+ // Valid because functions created with useEvent can be called in a useEffect.
982
+ function MyComponent({ theme }) {
983
+ const onClick = useEvent(() => {
984
+ showNotification(theme);
985
+ });
986
+ useEffect(() => {
987
+ onClick();
988
+ });
989
+ }
990
+ `,
991
`
1052
- function MyComponent({ theme }) {
1053
- useEffect(() => {
1054
- onClick();
1055
- });
1056
- const onClick = useEvent(() => {
1057
- showNotification(theme);
1058
- });
1059
- }
1060
- `,
1061
- ];
1062
- tests.invalid = [
1063
- ...tests.invalid,
1064
- {
1065
- code: `
992
+ // Valid because functions created with useEvent can be called in closures.
993
function MyComponent({ theme }) {
994
const onClick = useEvent(() => {
995
showNotification(theme);
996
});
1070
- return <Child onClick={onClick}></Child>;
997
+ return <Child onClick={() => onClick()}></Child>;
998
}
999
`,
1073
- errors: [useEventError('onClick')],
1074
- },
1075
- {
1076
- code: `
1077
- // This should error even though it shares an identifier name with the below
1078
- function MyComponent({theme}) {
1000
+ `
1001
+ // Valid because functions created with useEvent can be called in closures.
1002
+ function MyComponent({ theme }) {
1003
const onClick = useEvent(() => {
1080
- showNotification(theme)
1004
+ showNotification(theme);
1005
});
1082
- return <Child onClick={onClick} />
1006
+ const onClick2 = () => { onClick() };
1007
+ const onClick3 = useCallback(() => onClick(), []);
1008
+ return <>
1009
+ <Child onClick={onClick2}></Child>
1010
+ <Child onClick={onClick3}></Child>
1011
+ </>;
1012
}
1084
-
1085
- // The useEvent function shares an identifier name with the above
1086
- function MyOtherComponent({theme}) {
1013
+ `,
1014
+ `
1015
+ // Valid because functions created with useEvent can be passed by reference in useEffect
1016
+ // and useEvent.
1017
+ function MyComponent({ theme }) {
1018
const onClick = useEvent(() => {
1088
- showNotification(theme)
1019
+ showNotification(theme);
1020
});
1090
- return <Child onClick={() => onClick()} />
1021
+ const onClick2 = useEvent(() => {
1022
+ debounce(onClick);
1023
+ });
1024
+ useEffect(() => {
1025
+ let id = setInterval(onClick, 100);
1026
+ return () => clearInterval(onClick);
1027
+ }, []);
1028
+ return <Child onClick={() => onClick2()} />
1029
}
1030
`,
1093
- errors: [{...useEventError('onClick'), line: 7}],
1094
- },
1095
- {
1096
- code: `
1097
- const MyComponent = ({ theme }) => {
1031
+ `
1032
+ const MyComponent = ({theme}) => {
1033
const onClick = useEvent(() => {
1034
showNotification(theme);
1035
});
1101
- return <Child onClick={onClick}></Child>;
1036
+ return <Child onClick={() => onClick()}></Child>;
1037
+ };
1038
+ `,
1039
+ `
1040
+ function MyComponent({ theme }) {
1041
+ const notificationService = useNotifications();
1042
+ const showNotification = useEvent((text) => {
1043
+ notificationService.notify(theme, text);
1044
+ });
1045
+ const onClick = useEvent((text) => {
1046
+ showNotification(text);
1047
+ });
1048
+ return <Child onClick={(text) => onClick(text)} />
1049
}
1050
`,
1104
- errors: [useEventError('onClick')],
1105
- },
1106
- {
1107
- code: `
1108
- // Invalid because onClick is being aliased to foo but not invoked
1051
+ `
1052
function MyComponent({ theme }) {
1053
+ useEffect(() => {
1054
+ onClick();
1055
+ });
1056
const onClick = useEvent(() => {
1057
showNotification(theme);
1058
});
1113
- let foo = onClick;
1114
- return <Bar onClick={foo} />
1059
}
1060
`,
1061
+ ];
1062
+ tests.invalid = [
1063
+ ...tests.invalid,
1064
+ {
1065
+ code: `
1066
+ function MyComponent({ theme }) {
1067
+ const onClick = useEvent(() => {
1068
+ showNotification(theme);
1069
+ });
1070
+ return <Child onClick={onClick}></Child>;
1071
+ }
1072
+ `,
1073
+ errors: [useEventError('onClick')],
1074
+ },
1075
+ {
1076
+ code: `
1077
+ // This should error even though it shares an identifier name with the below
1078
+ function MyComponent({theme}) {
1079
+ const onClick = useEvent(() => {
1080
+ showNotification(theme)
1081
+ });
1082
+ return <Child onClick={onClick} />
1083
+ }
1084
+
1085
+ // The useEvent function shares an identifier name with the above
1086
+ function MyOtherComponent({theme}) {
1087
+ const onClick = useEvent(() => {
1088
+ showNotification(theme)
1089
+ });
1090
+ return <Child onClick={() => onClick()} />
1091
+ }
1092
+ `,
1093
+ errors: [{...useEventError('onClick'), line: 7}],
1094
+ },
1095
+ {
1096
+ code: `
1097
+ const MyComponent = ({ theme }) => {
1098
+ const onClick = useEvent(() => {
1099
+ showNotification(theme);
1100
+ });
1101
+ return <Child onClick={onClick}></Child>;
1102
+ }
1103
+ `,
1104
+ errors: [useEventError('onClick')],
1105
+ },
1106
+ {
1107
+ code: `
1108
+ // Invalid because onClick is being aliased to foo but not invoked
1109
+ function MyComponent({ theme }) {
1110
+ const onClick = useEvent(() => {
1111
+ showNotification(theme);
1112
+ });
1113
+ let foo = onClick;
1114
+ return <Bar onClick={foo} />
1115
+ }
1116
+ `,
1117
errors: [{...useEventError('onClick'), line: 7}],
1118
},
1119
{