[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

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

package.json

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.

lib/rules/index.js

ljharb · 2024-07-11T17:44:22Z

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:


ljharb · 2024-07-11T17:44:35Z

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

+function getUI() {
+  if (condition) return <h1>Hello</h1>;
+}
+function App() {
+  return getUI();
+}


Yes, I don't think we necessarily have to support this - I'm saying that the docs should be updated to reflect the caveats.

ljharb · 2024-07-11T17:46:15Z

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

+    const value = returnIdentifierVar.defs[0].node.init;
+    if (
+      returnIdentifierVar.defs[0].node


if line 35 is nullish, then line 33 will throw - i think this needs to be checked before accessing .init

ljharb · 2024-07-11T17:46:59Z

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

+        const isCalleeObjArray = calleeObjNode.defs[0].node.init.type === 'ArrayExpression';
+        const isMapCall = isCalleeObjArray && calleePropertyName === 'map';
+        if (isMapCall) {
+          const mapCallback = returnNode.arguments[0];


can you add a test for an SFC that omits return entirely?

ljharb · 2024-07-11T17:47:19Z

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

+    return value;
+  }
+
+  switch (returnNode.type) {


let's use an if/else here instead of a switch

ljharb · 2024-07-11T17:48:29Z

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

+            function App() {
+                return null;
+            }
+        `,


Suggested change

function App() {

return null;

}

`,

function App() {

return null;

}

`,

similar changes on all the code snippets

[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

lib/rules/index.js Outdated Show resolved Hide resolved

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

ljharb force-pushed the master branch from be61e18 to 380e32c Compare July 4, 2024 04:21

ljharb force-pushed the master branch from 380e32c to 51d342b Compare July 4, 2024 15:25

ljharb requested changes Jul 11, 2024

View reviewed changes

mgamis-msft mentioned this pull request Oct 24, 2024

Breakout rooms banner fix for react 17 and lower Azure/communication-ui-library#5358

Merged

3 tasks

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 Jul 11, 2024

akulsr0 commented May 29, 2024

akulsr0 commented Jun 20, 2024

ljharb left a comment

ljharb Jul 11, 2024

ljharb Jul 11, 2024

ljharb Jul 11, 2024

ljharb Jul 11, 2024

ljharb Jul 11, 2024

ljharb Jul 11, 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:

[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

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

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

[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