Mirror of upstream PR #33295

.eslintrc.js

@@ -579,6 +579,7 @@ module.exports = {
     JSONValue: 'readonly',
     JSResourceReference: 'readonly',
     MouseEventHandler: 'readonly',
+    NavigateEvent: 'readonly',
     PropagationPhases: 'readonly',
     PropertyDescriptor: 'readonly',
     React$AbstractComponent: 'readonly',
@@ -634,5 +635,6 @@ module.exports = {
     AsyncLocalStorage: 'readonly',
     async_hooks: 'readonly',
     globalThis: 'readonly',
+    navigation: 'readonly',
   },
 };

.github/workflows/compiler_discord_notify.yml

@@ -15,6 +15,7 @@ jobs:
     outputs:
       is_member_or_collaborator: ${{ steps.check_is_member_or_collaborator.outputs.is_member_or_collaborator }}
     steps:
+      - run: echo ${{ github.event.pull_request.author_association }}
       - name: Check is member or collaborator
         id: check_is_member_or_collaborator
         if: ${{ github.event.pull_request.author_association == 'MEMBER' || github.event.pull_request.author_association == 'COLLABORATOR' }}

.github/workflows/runtime_commit_artifacts.yml

@@ -332,10 +332,10 @@ jobs:
           git --no-pager diff -U0 --cached | grep '^[+-]' | head -n 100
           echo "===================="
           # Ignore REVISION or lines removing @generated headers.
-          if git diff --cached ':(exclude)*REVISION' | grep -vE "^(@@|diff|index|\-\-\-|\+\+\+|\- \* @generated SignedSource)" | grep "^[+-]" > /dev/null; then
+          if git diff --cached ':(exclude)*REVISION' ':(exclude)*/eslint-plugin-react-hooks/package.json' | grep -vE "^(@@|diff|index|\-\-\-|\+\+\+|\- \* @generated SignedSource)" | grep "^[+-]" > /dev/null; then
             echo "Changes detected"
             echo "===== Changes ====="
-            git --no-pager diff --cached ':(exclude)*REVISION' | grep -vE "^(@@|diff|index|\-\-\-|\+\+\+|\- \* @generated SignedSource)" | grep "^[+-]" | head -n 50
+            git --no-pager diff --cached ':(exclude)*REVISION' ':(exclude)*/eslint-plugin-react-hooks/package.json' | grep -vE "^(@@|diff|index|\-\-\-|\+\+\+|\- \* @generated SignedSource)" | grep "^[+-]" | head -n 50
             echo "==================="
             echo "should_commit=true" >> "$GITHUB_OUTPUT"
           else

.github/workflows/runtime_discord_notify.yml

@@ -15,6 +15,7 @@ jobs:
     outputs:
       is_member_or_collaborator: ${{ steps.check_is_member_or_collaborator.outputs.is_member_or_collaborator }}
     steps:
+      - run: echo ${{ github.event.pull_request.author_association }}
       - name: Check is member or collaborator
         id: check_is_member_or_collaborator
         if: ${{ github.event.pull_request.author_association == 'MEMBER' || github.event.pull_request.author_association == 'COLLABORATOR' }}

.github/workflows/shared_label_core_team_prs.yml

@@ -17,6 +17,7 @@ jobs:
     outputs:
       is_member_or_collaborator: ${{ steps.check_is_member_or_collaborator.outputs.is_member_or_collaborator }}
     steps:
+      - run: echo ${{ github.event.pull_request.author_association }}
       - name: Check is member or collaborator
         id: check_is_member_or_collaborator
         if: ${{ github.event.pull_request.author_association == 'MEMBER' || github.event.pull_request.author_association == 'COLLABORATOR' }}

compiler/CHANGELOG.md

@@ -1,3 +1,9 @@
+## 19.1.0-rc.2 (May 14, 2025)
+
+## babel-plugin-react-compiler
+
+* Fix for string attribute values with emoji [#33096](https://github.com/facebook/react/pull/33096) by [@josephsavona](https://github.com/josephsavona)
+
 ## 19.1.0-rc.1 (April 21, 2025)
 
 ## eslint-plugin-react-hooks

fixtures/flight/src/actions.js

@@ -2,7 +2,13 @@
 
 import {setServerState} from './ServerState.js';
 
+async function sleep(ms) {
+  return new Promise(resolve => setTimeout(resolve, ms));
+}
+
 export async function like() {
+  // Test loading state
+  await sleep(1000);
   setServerState('Liked!');
   return new Promise((resolve, reject) => resolve('Liked'));
 }
@@ -20,5 +26,7 @@ export async function greet(formData) {
 }
 
 export async function increment(n) {
+  // Test loading state
+  await sleep(1000);
   return n + 1;
 }

fixtures/view-transition/src/components/Page.js

@@ -18,6 +18,10 @@ import './Page.css';
 
 import transitions from './Transitions.module.css';
 
+async function sleep(ms) {
+  return new Promise(resolve => setTimeout(resolve, ms));
+}
+
 const a = (
   <div key="a">
     <ViewTransition>
@@ -106,7 +110,13 @@ export default function Page({url, navigate}) {
       document.body
     )
   ) : (
-    <button onClick={() => startTransition(() => setShowModal(true))}>
+    <button
+      onClick={() =>
+        startTransition(async () => {
+          await sleep(2000);
+          setShowModal(true);
+        })
+      }>
       Show Modal
     </button>
   );

packages/eslint-plugin-react-hooks/__tests__/ESLintRuleExhaustiveDeps-test.js

@@ -7746,6 +7746,34 @@ const testsFlow = {
     },
   ],
   invalid: [
+    {
+      code: normalizeIndent`
+        hook useExample(a) {
+          useEffect(() => {
+            console.log(a);
+          }, []);
+        }
+      `,
+      errors: [
+        {
+          message:
+            "React Hook useEffect has a missing dependency: 'a'. " +
+            'Either include it or remove the dependency array.',
+          suggestions: [
+            {
+              desc: 'Update the dependencies array to be: [a]',
+              output: normalizeIndent`
+                hook useExample(a) {
+                  useEffect(() => {
+                    console.log(a);
+                  }, [a]);
+                }
+              `,
+            },
+          ],
+        },
+      ],
+    },
     {
       code: normalizeIndent`
       function Foo() {
@@ -8311,7 +8339,9 @@ describe('rules-of-hooks/exhaustive-deps', () => {
     },
   };
 
-  const testsBabelEslint = {
+  const testsBabelEslint = tests;
+
+  const testsHermesParser = {
     valid: [...testsFlow.valid, ...tests.valid],
     invalid: [...testsFlow.invalid, ...tests.invalid],
   };
@@ -8336,6 +8366,33 @@ describe('rules-of-hooks/exhaustive-deps', () => {
     testsBabelEslint
   );
 
+  new ESLintTesterV7({
+    parser: require.resolve('hermes-eslint'),
+    parserOptions: {
+      sourceType: 'module',
+      enableExperimentalComponentSyntax: true,
+    },
+  }).run(
+    'eslint: v7, parser: hermes-eslint',
+    ReactHooksESLintRule,
+    testsHermesParser
+  );
+
+  new ESLintTesterV9({
+    languageOptions: {
+      ...languageOptionsV9,
+      parser: require('hermes-eslint'),
+      parserOptions: {
+        sourceType: 'module',
+        enableExperimentalComponentSyntax: true,
+      },
+    },
+  }).run(
+    'eslint: v9, parser: hermes-eslint',
+    ReactHooksESLintRule,
+    testsHermesParser
+  );
+
   const testsTypescriptEslintParser = {
     valid: [...testsTypescript.valid, ...tests.valid],
     invalid: [...testsTypescript.invalid, ...tests.invalid],

packages/eslint-plugin-react-hooks/src/rules/ExhaustiveDeps.ts

@@ -203,7 +203,13 @@ const rule = {
         let currentScope = scope.upper;
         while (currentScope) {
           pureScopes.add(currentScope);
-          if (currentScope.type === 'function') {
+          if (
+            currentScope.type === 'function' ||
+            // @ts-expect-error incorrect TS types
+            currentScope.type === 'hook' ||
+            // @ts-expect-error incorrect TS types
+            currentScope.type === 'component'
+          ) {
             break;
           }
           currentScope = currentScope.upper;

packages/react-devtools-shared/src/backend/fiber/renderer.js

@@ -50,6 +50,7 @@ import {
   gt,
   gte,
   parseSourceFromComponentStack,
+  parseSourceFromOwnerStack,
   serializeToString,
 } from 'react-devtools-shared/src/backend/utils';
 import {
@@ -5805,15 +5806,13 @@ export function attach(
   function getSourceForFiberInstance(
     fiberInstance: FiberInstance,
   ): Source | null {
-    const unresolvedSource = fiberInstance.source;
-    if (
-      unresolvedSource !== null &&
-      typeof unresolvedSource === 'object' &&
-      !isError(unresolvedSource)
-    ) {
-      // $FlowFixMe: isError should have refined it.
-      return unresolvedSource;
+    // Favor the owner source if we have one.
+    const ownerSource = getSourceForInstance(fiberInstance);
+    if (ownerSource !== null) {
+      return ownerSource;
     }
+
+    // Otherwise fallback to the throwing trick.
     const dispatcherRef = getDispatcherRef(renderer);
     const stackFrame =
       dispatcherRef == null
@@ -5824,18 +5823,15 @@ export function attach(
             dispatcherRef,
           );
     if (stackFrame === null) {
-      // If we don't find a source location by throwing, try to get one
-      // from an owned child if possible. This is the same branch as
-      // for virtual instances.
-      return getSourceForInstance(fiberInstance);
+      return null;
     }
     const source = parseSourceFromComponentStack(stackFrame);
     fiberInstance.source = source;
     return source;
   }
 
   function getSourceForInstance(instance: DevToolsInstance): Source | null {
-    let unresolvedSource = instance.source;
+    const unresolvedSource = instance.source;
     if (unresolvedSource === null) {
       // We don't have any source yet. We can try again later in case an owned child mounts later.
       // TODO: We won't have any information here if the child is filtered.
@@ -5848,7 +5844,9 @@ export function attach(
     // any intermediate utility functions. This won't point to the top of the component function
     // but it's at least somewhere within it.
     if (isError(unresolvedSource)) {
-      unresolvedSource = formatOwnerStack((unresolvedSource: any));
+      return (instance.source = parseSourceFromOwnerStack(
+        (unresolvedSource: any),
+      ));
     }
     if (typeof unresolvedSource === 'string') {
       const idx = unresolvedSource.lastIndexOf('\n');

packages/react-devtools-shared/src/backend/shared/DevToolsOwnerStack.js

@@ -13,8 +13,12 @@ export function formatOwnerStack(error: Error): string {
   const prevPrepareStackTrace = Error.prepareStackTrace;
   // $FlowFixMe[incompatible-type] It does accept undefined.
   Error.prepareStackTrace = undefined;
-  let stack = error.stack;
+  const stack = error.stack;
   Error.prepareStackTrace = prevPrepareStackTrace;
+  return formatOwnerStackString(stack);
+}
+
+export function formatOwnerStackString(stack: string): string {
   if (stack.startsWith('Error: react-stack-top-frame\n')) {
     // V8's default formatting prefixes with the error message which we
     // don't want/need.