rename useImperativeMethods -> useImperativeHandle (#14565)

Author: Sunil Pai

packages/react-debug-tools/src/ReactDebugHooks.js

@@ -54,7 +54,7 @@ function getPrimitiveStackCache(): Map<string, Array<any>> {
       Dispatcher.useRef(null);
       Dispatcher.useLayoutEffect(() => {});
       Dispatcher.useEffect(() => {});
-      Dispatcher.useImperativeMethods(undefined, () => null);
+      Dispatcher.useImperativeHandle(undefined, () => null);
       Dispatcher.useCallback(() => {});
       Dispatcher.useMemo(() => null);
     } finally {
@@ -159,7 +159,7 @@ function useEffect(
   hookLog.push({primitive: 'Effect', stackError: new Error(), value: create});
 }
 
-function useImperativeMethods<T>(
+function useImperativeHandle<T>(
   ref: {current: T | null} | ((inst: T | null) => mixed) | null | void,
   create: () => T,
   inputs: Array<mixed> | void | null,
@@ -174,7 +174,7 @@ function useImperativeMethods<T>(
     instance = ref.current;
   }
   hookLog.push({
-    primitive: 'ImperativeMethods',
+    primitive: 'ImperativeHandle',
     stackError: new Error(),
     value: instance,
   });
@@ -205,7 +205,7 @@ const Dispatcher = {
   useCallback,
   useContext,
   useEffect,
-  useImperativeMethods,
+  useImperativeHandle,
   useLayoutEffect,
   useMemo,
   useReducer,

packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.internal.js

@@ -82,7 +82,7 @@ describe('ReactHooksInspectionIntergration', () => {
       React.useLayoutEffect(effect);
       React.useEffect(effect);
 
-      React.useImperativeMethods(
+      React.useImperativeHandle(
         outsideRef,
         () => {
           // Return a function so that jest treats them as non-equal.
@@ -118,7 +118,7 @@ describe('ReactHooksInspectionIntergration', () => {
       {name: 'Ref', value: 'c', subHooks: []},
       {name: 'LayoutEffect', value: effect, subHooks: []},
       {name: 'Effect', value: effect, subHooks: []},
-      {name: 'ImperativeMethods', value: outsideRef.current, subHooks: []},
+      {name: 'ImperativeHandle', value: outsideRef.current, subHooks: []},
       {name: 'Memo', value: 'ab', subHooks: []},
       {name: 'Callback', value: updateStates, subHooks: []},
     ]);
@@ -134,7 +134,7 @@ describe('ReactHooksInspectionIntergration', () => {
       {name: 'Ref', value: 'C', subHooks: []},
       {name: 'LayoutEffect', value: effect, subHooks: []},
       {name: 'Effect', value: effect, subHooks: []},
-      {name: 'ImperativeMethods', value: outsideRef.current, subHooks: []},
+      {name: 'ImperativeHandle', value: outsideRef.current, subHooks: []},
       {name: 'Memo', value: 'Ab', subHooks: []},
       {name: 'Callback', value: updateStates, subHooks: []},
     ]);
@@ -165,7 +165,7 @@ describe('ReactHooksInspectionIntergration', () => {
   it('should inspect forwardRef', () => {
     let obj = function() {};
     let Foo = React.forwardRef(function(props, ref) {
-      React.useImperativeMethods(ref, () => obj);
+      React.useImperativeHandle(ref, () => obj);
       return <div />;
     });
     let ref = React.createRef();
@@ -174,7 +174,7 @@ describe('ReactHooksInspectionIntergration', () => {
     let childFiber = renderer.root.findByType(Foo)._currentFiber();
     let tree = ReactDebugTools.inspectHooksOfFiber(childFiber);
     expect(tree).toEqual([
-      {name: 'ImperativeMethods', value: obj, subHooks: []},
+      {name: 'ImperativeHandle', value: obj, subHooks: []},
     ]);
   });
 

packages/react-dom/src/__tests__/ReactDOMServerIntegrationHooks-test.internal.js

@@ -24,7 +24,7 @@ let useContext;
 let useCallback;
 let useMemo;
 let useRef;
-let useImperativeMethods;
+let useImperativeHandle;
 let useLayoutEffect;
 let forwardRef;
 let yieldedValues;
@@ -48,7 +48,7 @@ function initModules() {
   useCallback = React.useCallback;
   useMemo = React.useMemo;
   useRef = React.useRef;
-  useImperativeMethods = React.useImperativeMethods;
+  useImperativeHandle = React.useImperativeHandle;
   useLayoutEffect = React.useLayoutEffect;
   forwardRef = React.forwardRef;
 
@@ -529,10 +529,10 @@ describe('ReactDOMServerHooks', () => {
     });
   });
 
-  describe('useImperativeMethods', () => {
+  describe('useImperativeHandle', () => {
     it('should not be invoked on the server', async () => {
       function Counter(props, ref) {
-        useImperativeMethods(ref, () => {
+        useImperativeHandle(ref, () => {
           throw new Error('should not be invoked');
         });
         return <Text text={props.label + ': ' + ref.current} />;

packages/react-dom/src/server/ReactPartialRendererHooks.js

@@ -347,8 +347,8 @@ export const Dispatcher = {
   useLayoutEffect,
   // Callbacks are passed as they are in the server environment.
   useCallback: identity,
-  // useImperativeMethods is not run in the server environment
-  useImperativeMethods: noop,
+  // useImperativeHandle is not run in the server environment
+  useImperativeHandle: noop,
   // Effects are not run in the server environment.
   useEffect: noop,
 };

packages/react-reconciler/src/ReactFiberDispatcher.js

@@ -12,7 +12,7 @@ import {
   useCallback,
   useContext,
   useEffect,
-  useImperativeMethods,
+  useImperativeHandle,
   useLayoutEffect,
   useMemo,
   useReducer,
@@ -25,7 +25,7 @@ export const Dispatcher = {
   useCallback,
   useContext,
   useEffect,
-  useImperativeMethods,
+  useImperativeHandle,
   useLayoutEffect,
   useMemo,
   useReducer,

packages/react-reconciler/src/ReactFiberHooks.js

@@ -557,7 +557,7 @@ function useEffectImpl(fiberEffectTag, hookEffectTag, create, inputs): void {
   );
 }
 
-export function useImperativeMethods<T>(
+export function useImperativeHandle<T>(
   ref: {current: T | null} | ((inst: T | null) => mixed) | null | void,
   create: () => T,
   inputs: Array<mixed> | void | null,

packages/react-reconciler/src/__tests__/ReactHooksWithNoopRenderer-test.internal.js

@@ -23,7 +23,7 @@ let useLayoutEffect;
 let useCallback;
 let useMemo;
 let useRef;
-let useImperativeMethods;
+let useImperativeHandle;
 let forwardRef;
 let flushPassiveEffects;
 let memo;
@@ -71,7 +71,7 @@ describe('ReactHooksWithNoopRenderer', () => {
     useCallback = React.useCallback;
     useMemo = React.useMemo;
     useRef = React.useRef;
-    useImperativeMethods = React.useImperativeMethods;
+    useImperativeHandle = React.useImperativeHandle;
     forwardRef = React.forwardRef;
     memo = React.memo;
   });
@@ -88,7 +88,7 @@ describe('ReactHooksWithNoopRenderer', () => {
   it('resumes after an interruption', () => {
     function Counter(props, ref) {
       const [count, updateCount] = useState(0);
-      useImperativeMethods(ref, () => ({updateCount}));
+      useImperativeHandle(ref, () => ({updateCount}));
       return <Text text={props.label + ': ' + count} />;
     }
     Counter = forwardRef(Counter);
@@ -172,7 +172,7 @@ describe('ReactHooksWithNoopRenderer', () => {
     it('simple mount and update', () => {
       function Counter(props, ref) {
         const [count, updateCount] = useState(0);
-        useImperativeMethods(ref, () => ({updateCount}));
+        useImperativeHandle(ref, () => ({updateCount}));
         return <Text text={'Count: ' + count} />;
       }
       Counter = forwardRef(Counter);
@@ -196,7 +196,7 @@ describe('ReactHooksWithNoopRenderer', () => {
           ReactNoop.yield('getInitialState');
           return props.initialState;
         });
-        useImperativeMethods(ref, () => ({updateCount}));
+        useImperativeHandle(ref, () => ({updateCount}));
         return <Text text={'Count: ' + count} />;
       }
       Counter = forwardRef(Counter);
@@ -214,7 +214,7 @@ describe('ReactHooksWithNoopRenderer', () => {
       function Counter(props, ref) {
         const [count, updateCount] = useState(0);
         const [label, updateLabel] = useState('Count');
-        useImperativeMethods(ref, () => ({updateCount, updateLabel}));
+        useImperativeHandle(ref, () => ({updateCount, updateLabel}));
         return <Text text={label + ': ' + count} />;
       }
       Counter = forwardRef(Counter);
@@ -444,7 +444,7 @@ describe('ReactHooksWithNoopRenderer', () => {
       function Counter({row: newRow}, ref) {
         let [reducer, setReducer] = useState(() => reducerA);
         let [count, dispatch] = useReducer(reducer, 0);
-        useImperativeMethods(ref, () => ({dispatch}));
+        useImperativeHandle(ref, () => ({dispatch}));
         if (count < 20) {
           dispatch('increment');
           // Swap reducers each time we increment
@@ -505,7 +505,7 @@ describe('ReactHooksWithNoopRenderer', () => {
 
       function Counter(props, ref) {
         const [count, dispatch] = useReducer(reducer, 0);
-        useImperativeMethods(ref, () => ({dispatch}));
+        useImperativeHandle(ref, () => ({dispatch}));
         return <Text text={'Count: ' + count} />;
       }
       Counter = forwardRef(Counter);
@@ -546,7 +546,7 @@ describe('ReactHooksWithNoopRenderer', () => {
 
       function Counter(props, ref) {
         const [count, dispatch] = useReducer(reducer, 0, initialAction);
-        useImperativeMethods(ref, () => ({dispatch}));
+        useImperativeHandle(ref, () => ({dispatch}));
         return <Text text={'Count: ' + count} />;
       }
       Counter = forwardRef(Counter);
@@ -576,7 +576,7 @@ describe('ReactHooksWithNoopRenderer', () => {
 
       function Counter(props, ref) {
         const [count, dispatch] = useReducer(reducer, 0);
-        useImperativeMethods(ref, () => ({dispatch}));
+        useImperativeHandle(ref, () => ({dispatch}));
         return <Text text={'Count: ' + count} />;
       }
 

packages/react/src/React.js

@@ -32,7 +32,7 @@ import {
   useCallback,
   useContext,
   useEffect,
-  useImperativeMethods,
+  useImperativeHandle,
   useLayoutEffect,
   useMemo,
   useReducer,
@@ -98,7 +98,7 @@ if (enableHooks) {
   React.useCallback = useCallback;
   React.useContext = useContext;
   React.useEffect = useEffect;
-  React.useImperativeMethods = useImperativeMethods;
+  React.useImperativeHandle = useImperativeHandle;
   React.useLayoutEffect = useLayoutEffect;
   React.useMemo = useMemo;
   React.useReducer = useReducer;

packages/react/src/ReactHooks.js

@@ -102,11 +102,11 @@ export function useMemo(
   return dispatcher.useMemo(create, inputs);
 }
 
-export function useImperativeMethods<T>(
+export function useImperativeHandle<T>(
   ref: {current: T | null} | ((inst: T | null) => mixed) | null | void,
   create: () => T,
   inputs: Array<mixed> | void | null,
 ): void {
   const dispatcher = resolveDispatcher();
-  return dispatcher.useImperativeMethods(ref, create, inputs);
+  return dispatcher.useImperativeHandle(ref, create, inputs);
 }