[New] add `no-render-return-undefined`: disallow components rendering undefined #3750

akulsr0 · 2024-05-08T07:14:42Z

codecov · 2024-05-08T07:27:18Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 94.45%. Comparing base (cef8123) to head (94e9817).
Report is 2 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #3750      +/-   ##
==========================================
- Coverage   97.62%   94.45%   -3.18%     
==========================================
  Files         134      135       +1     
  Lines        9617     9708      +91     
  Branches     3488     3535      +47     
==========================================
- Hits         9389     9170     -219     
- Misses        228      538     +310

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

akulsr0 · 2024-05-16T11:16:44Z

@ljharb Let me know your thoughts on this!

docs/rules/no-render-return-undefined.md

ljharb · 2024-05-24T16:23:26Z

docs/rules/no-render-return-undefined.md

+
+<!-- end auto-generated rule header -->
+
+> In React 18, components may render undefined, and React will render nothing to the DOM instead of throwing an error. However, accidentally rendering nothing in a component could still cause surprises. This rule will warn if the `return` statement in a React Component returns undefined.


Suggested change

> In React 18, components may render undefined, and React will render nothing to the DOM instead of throwing an error. However, accidentally rendering nothing in a component could still cause surprises. This rule will warn if the `return` statement in a React Component returns undefined.

> Starting in React 18, components may render `undefined`, and React will render nothing to the DOM instead of throwing an error. However, accidentally rendering nothing in a component could still cause surprises. This rule will warn if the `return` statement in a React Component returns `undefined`.

ljharb · 2024-05-24T16:23:35Z

docs/rules/no-render-return-undefined.md

+
+> In React 18, components may render undefined, and React will render nothing to the DOM instead of throwing an error. However, accidentally rendering nothing in a component could still cause surprises. This rule will warn if the `return` statement in a React Component returns undefined.
+
+Issue: [#3020](https://github.com/jsx-eslint/eslint-plugin-react/issues/3020)


i'm not sure linking to the issue is needed

ljharb · 2024-05-24T16:23:42Z

docs/rules/no-render-return-undefined.md

+
+## Rule Details
+
+This rule will warn if the `return` statement in a React component returns undefined.


Suggested change

This rule will warn if the `return` statement in a React component returns undefined.

This rule will warn if the `return` statement in a React component returns `undefined`.

ljharb · 2024-05-24T16:24:02Z

docs/rules/no-render-return-undefined.md

+
+This rule will warn if the `return` statement in a React component returns undefined.
+
+Examples of **incorrect** code for this rule:


let's add one that uses void

ljharb · 2024-05-24T16:26:44Z

lib/rules/no-render-return-undefined.js

+  },
+
+  create(context) {
+    function getReturnValue(returnNode) {


can this take context and be defined at module level instead?

ljharb · 2024-05-24T16:27:05Z

lib/rules/no-render-return-undefined.js

+        }
+        case 'ConditionalExpression': {
+          const possibleReturnValue = [getReturnValue(returnNode.consequent), getReturnValue(returnNode.alternate)];
+          const returnsUndefined = possibleReturnValue.some((val) => val === undefined);


Suggested change

const returnsUndefined = possibleReturnValue.some((val) => val === undefined);

const returnsUndefined = possibleReturnValue.some((val) => typeof val === 'undefined');

ljharb · 2024-05-24T16:27:39Z

lib/rules/no-render-return-undefined.js

+        case 'ConditionalExpression': {
+          const possibleReturnValue = [getReturnValue(returnNode.consequent), getReturnValue(returnNode.alternate)];
+          const returnsUndefined = possibleReturnValue.some((val) => val === undefined);
+          if (returnsUndefined) return undefined;


Suggested change

if (returnsUndefined) return undefined;

if (returnsUndefined) return;

ljharb · 2024-05-24T16:33:08Z

lib/rules/no-render-return-undefined.js

+
+      return !returnStatement
+          || returnIdentifierName === 'undefined'
+          || returnIdentifierValue === undefined


Suggested change

|| returnIdentifierValue === undefined

|| typeof returnIdentifierValue === 'undefined'

ljharb · 2024-05-24T16:34:22Z

package.json

@@ -15,7 +15,7 @@
    "test": "npm run unit-test",
    "posttest": "aud --production",
    "type-check": "tsc",
-    "unit-test": "istanbul cover node_modules/mocha/bin/_mocha tests/lib/**/*.js tests/util/**/*.js tests/index.js",
+    "unit-test": "istanbul cover node_modules/mocha/bin/_mocha tests/lib/rules/no-render-return-undefined.js",


commenting here to ensure this doesn't get merged. fwiw you can npx mocha tests/lib/rules/no-render-return-undefined.js to run just that one file locally :-)

akulsr0 · 2024-05-29T14:42:31Z

I've pushed the review changes

akulsr0 · 2024-06-20T09:57:47Z

Bumping this up!

ljharb

There's still some unaddressed comments on the docs.

ljharb · 2024-06-20T20:45:49Z

lib/rules/index.js

@@ -105,4 +105,5 @@ module.exports = {
  'static-property-placement': require('./static-property-placement'),
  'style-prop-object': require('./style-prop-object'),
  'void-dom-elements-no-children': require('./void-dom-elements-no-children'),
+  'no-render-return-undefined': require('./no-render-return-undefined'),


let's sort this alphabetically

[Feat] no-render-return-undefined: initital commit

499e261

akulsr0 added 4 commits May 8, 2024 14:27

chore: add more test cases

86d7ac8

chore: add test cases

61981c7

chore: add tc for class components

34b6a94

chore: handle returning call expressions

56e7436

akulsr0 marked this pull request as ready for review May 15, 2024 10:35

chore: handle returning logical expressions

9202a30

ljharb marked this pull request as draft May 15, 2024 17:23

docs: add rule documentation

639f15f

chore: handle map callbacks

8aec646

akulsr0 marked this pull request as ready for review May 18, 2024 14:50

ljharb added the new rule label May 24, 2024

ljharb requested changes May 24, 2024

View reviewed changes

ljharb marked this pull request as draft May 24, 2024 16:34

refactor: pr review changes

d1814c1

akulsr0 force-pushed the akul/no-render-return-undefined branch from 6d3cfec to d1814c1 Compare May 25, 2024 05:13

akulsr0 added 3 commits May 25, 2024 17:01

Merge branch 'master' into akul/no-render-return-undefined

7905adf

fix: failing tests

b7ca1dd

chore: pr review change

f4983ae

akulsr0 marked this pull request as ready for review June 6, 2024 16:31

ljharb requested changes Jun 20, 2024

View reviewed changes

ljharb marked this pull request as draft June 20, 2024 20:47

ljharb changed the title ~~[Feat] no-render-return-undefined: disallow components rendering undefined~~ [New] add no-render-return-undefined: disallow components rendering undefined Jun 20, 2024

akulsr0 added 2 commits June 21, 2024 08:11

refactor: sort rules index alphabetically

0b56b09

Merge branch 'master' into akul/no-render-return-undefined

94e9817

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[New] add `no-render-return-undefined`: disallow components rendering undefined #3750

[New] add `no-render-return-undefined`: disallow components rendering undefined #3750

akulsr0 commented May 8, 2024 •

edited

Loading

codecov bot commented May 8, 2024 •

edited

Loading

akulsr0 commented May 16, 2024

ljharb May 24, 2024

ljharb May 24, 2024

ljharb May 24, 2024

ljharb May 24, 2024

ljharb May 24, 2024

ljharb May 24, 2024

ljharb May 24, 2024

ljharb May 24, 2024

ljharb May 24, 2024

akulsr0 commented May 29, 2024

akulsr0 commented Jun 20, 2024

ljharb left a comment

ljharb Jun 20, 2024


		<!-- end auto-generated rule header -->

		> In React 18, components may render undefined, and React will render nothing to the DOM instead of throwing an error. However, accidentally rendering nothing in a component could still cause surprises. This rule will warn if the `return` statement in a React Component returns undefined.

	> In React 18, components may render undefined, and React will render nothing to the DOM instead of throwing an error. However, accidentally rendering nothing in a component could still cause surprises. This rule will warn if the `return` statement in a React Component returns undefined.
	> Starting in React 18, components may render `undefined`, and React will render nothing to the DOM instead of throwing an error. However, accidentally rendering nothing in a component could still cause surprises. This rule will warn if the `return` statement in a React Component returns `undefined`.


		> In React 18, components may render undefined, and React will render nothing to the DOM instead of throwing an error. However, accidentally rendering nothing in a component could still cause surprises. This rule will warn if the `return` statement in a React Component returns undefined.

		Issue: [#3020](https://github.com/jsx-eslint/eslint-plugin-react/issues/3020)


		## Rule Details

		This rule will warn if the `return` statement in a React component returns undefined.


		This rule will warn if the `return` statement in a React component returns undefined.

		Examples of incorrect code for this rule:

	const returnsUndefined = possibleReturnValue.some((val) => val === undefined);
	const returnsUndefined = possibleReturnValue.some((val) => typeof val === 'undefined');

	if (returnsUndefined) return undefined;
	if (returnsUndefined) return;

	\|\| returnIdentifierValue === undefined
	\|\| typeof returnIdentifierValue === 'undefined'

[New] add no-render-return-undefined: disallow components rendering undefined #3750

Are you sure you want to change the base?

[New] add no-render-return-undefined: disallow components rendering undefined #3750

Conversation

akulsr0 commented May 8, 2024 • edited Loading

codecov bot commented May 8, 2024 • edited Loading

Codecov Report

akulsr0 commented May 16, 2024

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

akulsr0 commented May 29, 2024

akulsr0 commented Jun 20, 2024

ljharb left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

[New] add `no-render-return-undefined`: disallow components rendering undefined #3750

[New] add `no-render-return-undefined`: disallow components rendering undefined #3750

akulsr0 commented May 8, 2024 •

edited

Loading

codecov bot commented May 8, 2024 •

edited

Loading