Best JavaScript code snippet using playwright-internal
ReactFiberHooks.new.js
Source:ReactFiberHooks.new.js
...1403 const startRef = updateRef();1404 const start = (startRef.current );1405 return [start, isPending];1406}1407function rerenderTransition() {1408 const [isPending] = rerenderState(false);1409 const startRef = updateRef();1410 const start = (startRef.current );1411 return [start, isPending];1412}1413let isUpdatingOpaqueValueInRenderPhase = false;1414export function getIsUpdatingOpaqueValueInRenderPhaseInDEV() {1415 if (__DEV__) {1416 return isUpdatingOpaqueValueInRenderPhase;1417 }1418}1419function warnOnOpaqueIdentifierAccessInDEV(fiber) {1420 if (__DEV__) {1421 // TODO: Should warn in effects and callbacks, too1422 const name = getComponentName(fiber.type) || 'Unknown';1423 if (getIsRendering() && !didWarnAboutUseOpaqueIdentifier[name]) {1424 console.error(1425 'The object passed back from useOpaqueIdentifier is meant to be ' +1426 'passed through to attributes only. Do not read the ' +1427 'value directly.',1428 );1429 didWarnAboutUseOpaqueIdentifier[name] = true;1430 }1431 }1432}1433function mountOpaqueIdentifier() {1434 const makeId = __DEV__1435 ? makeClientIdInDEV.bind(1436 null,1437 warnOnOpaqueIdentifierAccessInDEV.bind(null, currentlyRenderingFiber),1438 )1439 : makeClientId;1440 if (getIsHydrating()) {1441 let didUpgrade = false;1442 const fiber = currentlyRenderingFiber;1443 const readValue = () => {1444 if (!didUpgrade) {1445 // Only upgrade once. This works even inside the render phase because1446 // the update is added to a shared queue, which outlasts the1447 // in-progress render.1448 didUpgrade = true;1449 if (__DEV__) {1450 isUpdatingOpaqueValueInRenderPhase = true;1451 setId(makeId());1452 isUpdatingOpaqueValueInRenderPhase = false;1453 warnOnOpaqueIdentifierAccessInDEV(fiber);1454 } else {1455 setId(makeId());1456 }1457 }1458 invariant(1459 false,1460 'The object passed back from useOpaqueIdentifier is meant to be ' +1461 'passed through to attributes only. Do not read the value directly.',1462 );1463 };1464 const id = makeOpaqueHydratingObject(readValue);1465 const setId = mountState(id)[1];1466 if ((currentlyRenderingFiber.mode & BlockingMode) === NoMode) {1467 if (__DEV__ && enableDoubleInvokingEffects) {1468 currentlyRenderingFiber.flags |=1469 MountPassiveDevEffect | PassiveEffect | PassiveStaticEffect;1470 } else {1471 currentlyRenderingFiber.flags |= PassiveEffect | PassiveStaticEffect;1472 }1473 pushEffect(1474 HookHasEffect | HookPassive,1475 () => {1476 setId(makeId());1477 },1478 undefined,1479 null,1480 );1481 }1482 return id;1483 } else {1484 const id = makeId();1485 mountState(id);1486 return id;1487 }1488}1489function updateOpaqueIdentifier() {1490 const id = updateState(undefined)[0];1491 return id;1492}1493function rerenderOpaqueIdentifier() {1494 const id = rerenderState(undefined)[0];1495 return id;1496}1497function dispatchAction (1498 fiber ,1499 queue ,1500 action ,1501) {1502 if (__DEV__) {1503 if (typeof arguments[3] === 'function') {1504 console.error(1505 "State updates from the useState() and useReducer() Hooks don't support the " +1506 'second callback argument. To execute a side effect after ' +1507 'rendering, declare it in the component body with useEffect().',1508 );1509 }1510 }1511 const eventTime = requestEventTime();1512 const lane = requestUpdateLane(fiber);1513 const update = {1514 lane,1515 action,1516 eagerReducer: null,1517 eagerState: null,1518 next: (null ),1519 };1520 // Append the update to the end of the list.1521 const pending = queue.pending;1522 if (pending === null) {1523 // This is the first update. Create a circular list.1524 update.next = update;1525 } else {1526 update.next = pending.next;1527 pending.next = update;1528 }1529 queue.pending = update;1530 const alternate = fiber.alternate;1531 if (1532 fiber === currentlyRenderingFiber ||1533 (alternate !== null && alternate === currentlyRenderingFiber)1534 ) {1535 // This is a render phase update. Stash it in a lazily-created map of1536 // queue -> linked list of updates. After this render pass, we'll restart1537 // and apply the stashed updates on top of the work-in-progress hook.1538 didScheduleRenderPhaseUpdateDuringThisPass = didScheduleRenderPhaseUpdate = true;1539 } else {1540 if (1541 fiber.lanes === NoLanes &&1542 (alternate === null || alternate.lanes === NoLanes)1543 ) {1544 // The queue is currently empty, which means we can eagerly compute the1545 // next state before entering the render phase. If the new state is the1546 // same as the current state, we may be able to bail out entirely.1547 const lastRenderedReducer = queue.lastRenderedReducer;1548 if (lastRenderedReducer !== null) {1549 let prevDispatcher;1550 if (__DEV__) {1551 prevDispatcher = ReactCurrentDispatcher.current;1552 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1553 }1554 try {1555 const currentState = (queue.lastRenderedState );1556 const eagerState = lastRenderedReducer(currentState, action);1557 // Stash the eagerly computed state, and the reducer used to compute1558 // it, on the update object. If the reducer hasn't changed by the1559 // time we enter the render phase, then the eager state can be used1560 // without calling the reducer again.1561 update.eagerReducer = lastRenderedReducer;1562 update.eagerState = eagerState;1563 if (is(eagerState, currentState)) {1564 // Fast path. We can bail out without scheduling React to re-render.1565 // It's still possible that we'll need to rebase this update later,1566 // if the component re-renders for a different reason and by that1567 // time the reducer has changed.1568 return;1569 }1570 } catch (error) {1571 // Suppress the error. It will throw again in the render phase.1572 } finally {1573 if (__DEV__) {1574 ReactCurrentDispatcher.current = prevDispatcher;1575 }1576 }1577 }1578 }1579 if (__DEV__) {1580 // $FlowExpectedError - jest isn't a global, and isn't recognized outside of tests1581 if (typeof jest !== 'undefined') {1582 warnIfNotScopedWithMatchingAct(fiber);1583 warnIfNotCurrentlyActingUpdatesInDev(fiber);1584 }1585 }1586 scheduleUpdateOnFiber(fiber, lane, eventTime);1587 }1588 if (__DEV__) {1589 if (enableDebugTracing) {1590 if (fiber.mode & DebugTracingMode) {1591 const name = getComponentName(fiber.type) || 'Unknown';1592 logStateUpdateScheduled(name, lane, action);1593 }1594 }1595 }1596 if (enableSchedulingProfiler) {1597 markStateUpdateScheduled(fiber, lane);1598 }1599}1600export const ContextOnlyDispatcher = {1601 readContext,1602 useCallback: throwInvalidHookError,1603 useContext: throwInvalidHookError,1604 useEffect: throwInvalidHookError,1605 useImperativeHandle: throwInvalidHookError,1606 useLayoutEffect: throwInvalidHookError,1607 useMemo: throwInvalidHookError,1608 useReducer: throwInvalidHookError,1609 useRef: throwInvalidHookError,1610 useState: throwInvalidHookError,1611 useDebugValue: throwInvalidHookError,1612 useDeferredValue: throwInvalidHookError,1613 useTransition: throwInvalidHookError,1614 useMutableSource: throwInvalidHookError,1615 useOpaqueIdentifier: throwInvalidHookError,1616 unstable_isNewReconciler: enableNewReconciler,1617};1618const HooksDispatcherOnMount = {1619 readContext,1620 useCallback: mountCallback,1621 useContext: readContext,1622 useEffect: mountEffect,1623 useImperativeHandle: mountImperativeHandle,1624 useLayoutEffect: mountLayoutEffect,1625 useMemo: mountMemo,1626 useReducer: mountReducer,1627 useRef: mountRef,1628 useState: mountState,1629 useDebugValue: mountDebugValue,1630 useDeferredValue: mountDeferredValue,1631 useTransition: mountTransition,1632 useMutableSource: mountMutableSource,1633 useOpaqueIdentifier: mountOpaqueIdentifier,1634 unstable_isNewReconciler: enableNewReconciler,1635};1636const HooksDispatcherOnUpdate = {1637 readContext,1638 useCallback: updateCallback,1639 useContext: readContext,1640 useEffect: updateEffect,1641 useImperativeHandle: updateImperativeHandle,1642 useLayoutEffect: updateLayoutEffect,1643 useMemo: updateMemo,1644 useReducer: updateReducer,1645 useRef: updateRef,1646 useState: updateState,1647 useDebugValue: updateDebugValue,1648 useDeferredValue: updateDeferredValue,1649 useTransition: updateTransition,1650 useMutableSource: updateMutableSource,1651 useOpaqueIdentifier: updateOpaqueIdentifier,1652 unstable_isNewReconciler: enableNewReconciler,1653};1654const HooksDispatcherOnRerender = {1655 readContext,1656 useCallback: updateCallback,1657 useContext: readContext,1658 useEffect: updateEffect,1659 useImperativeHandle: updateImperativeHandle,1660 useLayoutEffect: updateLayoutEffect,1661 useMemo: updateMemo,1662 useReducer: rerenderReducer,1663 useRef: updateRef,1664 useState: rerenderState,1665 useDebugValue: updateDebugValue,1666 useDeferredValue: rerenderDeferredValue,1667 useTransition: rerenderTransition,1668 useMutableSource: updateMutableSource,1669 useOpaqueIdentifier: rerenderOpaqueIdentifier,1670 unstable_isNewReconciler: enableNewReconciler,1671};1672let HooksDispatcherOnMountInDEV = null;1673let HooksDispatcherOnMountWithHookTypesInDEV = null;1674let HooksDispatcherOnUpdateInDEV = null;1675let HooksDispatcherOnRerenderInDEV = null;1676let InvalidNestedHooksDispatcherOnMountInDEV = null;1677let InvalidNestedHooksDispatcherOnUpdateInDEV = null;1678let InvalidNestedHooksDispatcherOnRerenderInDEV = null;1679if (__DEV__) {1680 const warnInvalidContextAccess = () => {1681 console.error(1682 'Context can only be read while React is rendering. ' +1683 'In classes, you can read it in the render method or getDerivedStateFromProps. ' +1684 'In function components, you can read it directly in the function body, but not ' +1685 'inside Hooks like useReducer() or useMemo().',1686 );1687 };1688 const warnInvalidHookAccess = () => {1689 console.error(1690 'Do not call Hooks inside useEffect(...), useMemo(...), or other built-in Hooks. ' +1691 'You can only call Hooks at the top level of your React function. ' +1692 'For more information, see ' +1693 'https://reactjs.org/link/rules-of-hooks',1694 );1695 };1696 HooksDispatcherOnMountInDEV = {1697 readContext (1698 context ,1699 observedBits ,1700 ) {1701 return readContext(context, observedBits);1702 },1703 useCallback (callback , deps ) {1704 currentHookNameInDev = 'useCallback';1705 mountHookTypesDev();1706 checkDepsAreArrayDev(deps);1707 return mountCallback(callback, deps);1708 },1709 useContext (1710 context ,1711 observedBits ,1712 ) {1713 currentHookNameInDev = 'useContext';1714 mountHookTypesDev();1715 return readContext(context, observedBits);1716 },1717 useEffect(1718 create ,1719 deps ,1720 ) {1721 currentHookNameInDev = 'useEffect';1722 mountHookTypesDev();1723 checkDepsAreArrayDev(deps);1724 return mountEffect(create, deps);1725 },1726 useImperativeHandle (1727 ref ,1728 create ,1729 deps ,1730 ) {1731 currentHookNameInDev = 'useImperativeHandle';1732 mountHookTypesDev();1733 checkDepsAreArrayDev(deps);1734 return mountImperativeHandle(ref, create, deps);1735 },1736 useLayoutEffect(1737 create ,1738 deps ,1739 ) {1740 currentHookNameInDev = 'useLayoutEffect';1741 mountHookTypesDev();1742 checkDepsAreArrayDev(deps);1743 return mountLayoutEffect(create, deps);1744 },1745 useMemo (create , deps ) {1746 currentHookNameInDev = 'useMemo';1747 mountHookTypesDev();1748 checkDepsAreArrayDev(deps);1749 const prevDispatcher = ReactCurrentDispatcher.current;1750 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1751 try {1752 return mountMemo(create, deps);1753 } finally {1754 ReactCurrentDispatcher.current = prevDispatcher;1755 }1756 },1757 useReducer (1758 reducer ,1759 initialArg ,1760 init ,1761 ) {1762 currentHookNameInDev = 'useReducer';1763 mountHookTypesDev();1764 const prevDispatcher = ReactCurrentDispatcher.current;1765 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1766 try {1767 return mountReducer(reducer, initialArg, init);1768 } finally {1769 ReactCurrentDispatcher.current = prevDispatcher;1770 }1771 },1772 useRef (initialValue ) {1773 currentHookNameInDev = 'useRef';1774 mountHookTypesDev();1775 return mountRef(initialValue);1776 },1777 useState (1778 initialState ,1779 ) {1780 currentHookNameInDev = 'useState';1781 mountHookTypesDev();1782 const prevDispatcher = ReactCurrentDispatcher.current;1783 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1784 try {1785 return mountState(initialState);1786 } finally {1787 ReactCurrentDispatcher.current = prevDispatcher;1788 }1789 },1790 useDebugValue (value , formatterFn ) {1791 currentHookNameInDev = 'useDebugValue';1792 mountHookTypesDev();1793 return mountDebugValue(value, formatterFn);1794 },1795 useDeferredValue (value ) {1796 currentHookNameInDev = 'useDeferredValue';1797 mountHookTypesDev();1798 return mountDeferredValue(value);1799 },1800 useTransition() {1801 currentHookNameInDev = 'useTransition';1802 mountHookTypesDev();1803 return mountTransition();1804 },1805 useMutableSource (1806 source ,1807 getSnapshot ,1808 subscribe ,1809 ) {1810 currentHookNameInDev = 'useMutableSource';1811 mountHookTypesDev();1812 return mountMutableSource(source, getSnapshot, subscribe);1813 },1814 useOpaqueIdentifier() {1815 currentHookNameInDev = 'useOpaqueIdentifier';1816 mountHookTypesDev();1817 return mountOpaqueIdentifier();1818 },1819 unstable_isNewReconciler: enableNewReconciler,1820 };1821 HooksDispatcherOnMountWithHookTypesInDEV = {1822 readContext (1823 context ,1824 observedBits ,1825 ) {1826 return readContext(context, observedBits);1827 },1828 useCallback (callback , deps ) {1829 currentHookNameInDev = 'useCallback';1830 updateHookTypesDev();1831 return mountCallback(callback, deps);1832 },1833 useContext (1834 context ,1835 observedBits ,1836 ) {1837 currentHookNameInDev = 'useContext';1838 updateHookTypesDev();1839 return readContext(context, observedBits);1840 },1841 useEffect(1842 create ,1843 deps ,1844 ) {1845 currentHookNameInDev = 'useEffect';1846 updateHookTypesDev();1847 return mountEffect(create, deps);1848 },1849 useImperativeHandle (1850 ref ,1851 create ,1852 deps ,1853 ) {1854 currentHookNameInDev = 'useImperativeHandle';1855 updateHookTypesDev();1856 return mountImperativeHandle(ref, create, deps);1857 },1858 useLayoutEffect(1859 create ,1860 deps ,1861 ) {1862 currentHookNameInDev = 'useLayoutEffect';1863 updateHookTypesDev();1864 return mountLayoutEffect(create, deps);1865 },1866 useMemo (create , deps ) {1867 currentHookNameInDev = 'useMemo';1868 updateHookTypesDev();1869 const prevDispatcher = ReactCurrentDispatcher.current;1870 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1871 try {1872 return mountMemo(create, deps);1873 } finally {1874 ReactCurrentDispatcher.current = prevDispatcher;1875 }1876 },1877 useReducer (1878 reducer ,1879 initialArg ,1880 init ,1881 ) {1882 currentHookNameInDev = 'useReducer';1883 updateHookTypesDev();1884 const prevDispatcher = ReactCurrentDispatcher.current;1885 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1886 try {1887 return mountReducer(reducer, initialArg, init);1888 } finally {1889 ReactCurrentDispatcher.current = prevDispatcher;1890 }1891 },1892 useRef (initialValue ) {1893 currentHookNameInDev = 'useRef';1894 updateHookTypesDev();1895 return mountRef(initialValue);1896 },1897 useState (1898 initialState ,1899 ) {1900 currentHookNameInDev = 'useState';1901 updateHookTypesDev();1902 const prevDispatcher = ReactCurrentDispatcher.current;1903 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1904 try {1905 return mountState(initialState);1906 } finally {1907 ReactCurrentDispatcher.current = prevDispatcher;1908 }1909 },1910 useDebugValue (value , formatterFn ) {1911 currentHookNameInDev = 'useDebugValue';1912 updateHookTypesDev();1913 return mountDebugValue(value, formatterFn);1914 },1915 useDeferredValue (value ) {1916 currentHookNameInDev = 'useDeferredValue';1917 updateHookTypesDev();1918 return mountDeferredValue(value);1919 },1920 useTransition() {1921 currentHookNameInDev = 'useTransition';1922 updateHookTypesDev();1923 return mountTransition();1924 },1925 useMutableSource (1926 source ,1927 getSnapshot ,1928 subscribe ,1929 ) {1930 currentHookNameInDev = 'useMutableSource';1931 updateHookTypesDev();1932 return mountMutableSource(source, getSnapshot, subscribe);1933 },1934 useOpaqueIdentifier() {1935 currentHookNameInDev = 'useOpaqueIdentifier';1936 updateHookTypesDev();1937 return mountOpaqueIdentifier();1938 },1939 unstable_isNewReconciler: enableNewReconciler,1940 };1941 HooksDispatcherOnUpdateInDEV = {1942 readContext (1943 context ,1944 observedBits ,1945 ) {1946 return readContext(context, observedBits);1947 },1948 useCallback (callback , deps ) {1949 currentHookNameInDev = 'useCallback';1950 updateHookTypesDev();1951 return updateCallback(callback, deps);1952 },1953 useContext (1954 context ,1955 observedBits ,1956 ) {1957 currentHookNameInDev = 'useContext';1958 updateHookTypesDev();1959 return readContext(context, observedBits);1960 },1961 useEffect(1962 create ,1963 deps ,1964 ) {1965 currentHookNameInDev = 'useEffect';1966 updateHookTypesDev();1967 return updateEffect(create, deps);1968 },1969 useImperativeHandle (1970 ref ,1971 create ,1972 deps ,1973 ) {1974 currentHookNameInDev = 'useImperativeHandle';1975 updateHookTypesDev();1976 return updateImperativeHandle(ref, create, deps);1977 },1978 useLayoutEffect(1979 create ,1980 deps ,1981 ) {1982 currentHookNameInDev = 'useLayoutEffect';1983 updateHookTypesDev();1984 return updateLayoutEffect(create, deps);1985 },1986 useMemo (create , deps ) {1987 currentHookNameInDev = 'useMemo';1988 updateHookTypesDev();1989 const prevDispatcher = ReactCurrentDispatcher.current;1990 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1991 try {1992 return updateMemo(create, deps);1993 } finally {1994 ReactCurrentDispatcher.current = prevDispatcher;1995 }1996 },1997 useReducer (1998 reducer ,1999 initialArg ,2000 init ,2001 ) {2002 currentHookNameInDev = 'useReducer';2003 updateHookTypesDev();2004 const prevDispatcher = ReactCurrentDispatcher.current;2005 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2006 try {2007 return updateReducer(reducer, initialArg, init);2008 } finally {2009 ReactCurrentDispatcher.current = prevDispatcher;2010 }2011 },2012 useRef (initialValue ) {2013 currentHookNameInDev = 'useRef';2014 updateHookTypesDev();2015 return updateRef(initialValue);2016 },2017 useState (2018 initialState ,2019 ) {2020 currentHookNameInDev = 'useState';2021 updateHookTypesDev();2022 const prevDispatcher = ReactCurrentDispatcher.current;2023 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2024 try {2025 return updateState(initialState);2026 } finally {2027 ReactCurrentDispatcher.current = prevDispatcher;2028 }2029 },2030 useDebugValue (value , formatterFn ) {2031 currentHookNameInDev = 'useDebugValue';2032 updateHookTypesDev();2033 return updateDebugValue(value, formatterFn);2034 },2035 useDeferredValue (value ) {2036 currentHookNameInDev = 'useDeferredValue';2037 updateHookTypesDev();2038 return updateDeferredValue(value);2039 },2040 useTransition() {2041 currentHookNameInDev = 'useTransition';2042 updateHookTypesDev();2043 return updateTransition();2044 },2045 useMutableSource (2046 source ,2047 getSnapshot ,2048 subscribe ,2049 ) {2050 currentHookNameInDev = 'useMutableSource';2051 updateHookTypesDev();2052 return updateMutableSource(source, getSnapshot, subscribe);2053 },2054 useOpaqueIdentifier() {2055 currentHookNameInDev = 'useOpaqueIdentifier';2056 updateHookTypesDev();2057 return updateOpaqueIdentifier();2058 },2059 unstable_isNewReconciler: enableNewReconciler,2060 };2061 HooksDispatcherOnRerenderInDEV = {2062 readContext (2063 context ,2064 observedBits ,2065 ) {2066 return readContext(context, observedBits);2067 },2068 useCallback (callback , deps ) {2069 currentHookNameInDev = 'useCallback';2070 updateHookTypesDev();2071 return updateCallback(callback, deps);2072 },2073 useContext (2074 context ,2075 observedBits ,2076 ) {2077 currentHookNameInDev = 'useContext';2078 updateHookTypesDev();2079 return readContext(context, observedBits);2080 },2081 useEffect(2082 create ,2083 deps ,2084 ) {2085 currentHookNameInDev = 'useEffect';2086 updateHookTypesDev();2087 return updateEffect(create, deps);2088 },2089 useImperativeHandle (2090 ref ,2091 create ,2092 deps ,2093 ) {2094 currentHookNameInDev = 'useImperativeHandle';2095 updateHookTypesDev();2096 return updateImperativeHandle(ref, create, deps);2097 },2098 useLayoutEffect(2099 create ,2100 deps ,2101 ) {2102 currentHookNameInDev = 'useLayoutEffect';2103 updateHookTypesDev();2104 return updateLayoutEffect(create, deps);2105 },2106 useMemo (create , deps ) {2107 currentHookNameInDev = 'useMemo';2108 updateHookTypesDev();2109 const prevDispatcher = ReactCurrentDispatcher.current;2110 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnRerenderInDEV;2111 try {2112 return updateMemo(create, deps);2113 } finally {2114 ReactCurrentDispatcher.current = prevDispatcher;2115 }2116 },2117 useReducer (2118 reducer ,2119 initialArg ,2120 init ,2121 ) {2122 currentHookNameInDev = 'useReducer';2123 updateHookTypesDev();2124 const prevDispatcher = ReactCurrentDispatcher.current;2125 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnRerenderInDEV;2126 try {2127 return rerenderReducer(reducer, initialArg, init);2128 } finally {2129 ReactCurrentDispatcher.current = prevDispatcher;2130 }2131 },2132 useRef (initialValue ) {2133 currentHookNameInDev = 'useRef';2134 updateHookTypesDev();2135 return updateRef(initialValue);2136 },2137 useState (2138 initialState ,2139 ) {2140 currentHookNameInDev = 'useState';2141 updateHookTypesDev();2142 const prevDispatcher = ReactCurrentDispatcher.current;2143 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnRerenderInDEV;2144 try {2145 return rerenderState(initialState);2146 } finally {2147 ReactCurrentDispatcher.current = prevDispatcher;2148 }2149 },2150 useDebugValue (value , formatterFn ) {2151 currentHookNameInDev = 'useDebugValue';2152 updateHookTypesDev();2153 return updateDebugValue(value, formatterFn);2154 },2155 useDeferredValue (value ) {2156 currentHookNameInDev = 'useDeferredValue';2157 updateHookTypesDev();2158 return rerenderDeferredValue(value);2159 },2160 useTransition() {2161 currentHookNameInDev = 'useTransition';2162 updateHookTypesDev();2163 return rerenderTransition();2164 },2165 useMutableSource (2166 source ,2167 getSnapshot ,2168 subscribe ,2169 ) {2170 currentHookNameInDev = 'useMutableSource';2171 updateHookTypesDev();2172 return updateMutableSource(source, getSnapshot, subscribe);2173 },2174 useOpaqueIdentifier() {2175 currentHookNameInDev = 'useOpaqueIdentifier';2176 updateHookTypesDev();2177 return rerenderOpaqueIdentifier();2178 },2179 unstable_isNewReconciler: enableNewReconciler,2180 };2181 InvalidNestedHooksDispatcherOnMountInDEV = {2182 readContext (2183 context ,2184 observedBits ,2185 ) {2186 warnInvalidContextAccess();2187 return readContext(context, observedBits);2188 },2189 useCallback (callback , deps ) {2190 currentHookNameInDev = 'useCallback';2191 warnInvalidHookAccess();2192 mountHookTypesDev();2193 return mountCallback(callback, deps);2194 },2195 useContext (2196 context ,2197 observedBits ,2198 ) {2199 currentHookNameInDev = 'useContext';2200 warnInvalidHookAccess();2201 mountHookTypesDev();2202 return readContext(context, observedBits);2203 },2204 useEffect(2205 create ,2206 deps ,2207 ) {2208 currentHookNameInDev = 'useEffect';2209 warnInvalidHookAccess();2210 mountHookTypesDev();2211 return mountEffect(create, deps);2212 },2213 useImperativeHandle (2214 ref ,2215 create ,2216 deps ,2217 ) {2218 currentHookNameInDev = 'useImperativeHandle';2219 warnInvalidHookAccess();2220 mountHookTypesDev();2221 return mountImperativeHandle(ref, create, deps);2222 },2223 useLayoutEffect(2224 create ,2225 deps ,2226 ) {2227 currentHookNameInDev = 'useLayoutEffect';2228 warnInvalidHookAccess();2229 mountHookTypesDev();2230 return mountLayoutEffect(create, deps);2231 },2232 useMemo (create , deps ) {2233 currentHookNameInDev = 'useMemo';2234 warnInvalidHookAccess();2235 mountHookTypesDev();2236 const prevDispatcher = ReactCurrentDispatcher.current;2237 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;2238 try {2239 return mountMemo(create, deps);2240 } finally {2241 ReactCurrentDispatcher.current = prevDispatcher;2242 }2243 },2244 useReducer (2245 reducer ,2246 initialArg ,2247 init ,2248 ) {2249 currentHookNameInDev = 'useReducer';2250 warnInvalidHookAccess();2251 mountHookTypesDev();2252 const prevDispatcher = ReactCurrentDispatcher.current;2253 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;2254 try {2255 return mountReducer(reducer, initialArg, init);2256 } finally {2257 ReactCurrentDispatcher.current = prevDispatcher;2258 }2259 },2260 useRef (initialValue ) {2261 currentHookNameInDev = 'useRef';2262 warnInvalidHookAccess();2263 mountHookTypesDev();2264 return mountRef(initialValue);2265 },2266 useState (2267 initialState ,2268 ) {2269 currentHookNameInDev = 'useState';2270 warnInvalidHookAccess();2271 mountHookTypesDev();2272 const prevDispatcher = ReactCurrentDispatcher.current;2273 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;2274 try {2275 return mountState(initialState);2276 } finally {2277 ReactCurrentDispatcher.current = prevDispatcher;2278 }2279 },2280 useDebugValue (value , formatterFn ) {2281 currentHookNameInDev = 'useDebugValue';2282 warnInvalidHookAccess();2283 mountHookTypesDev();2284 return mountDebugValue(value, formatterFn);2285 },2286 useDeferredValue (value ) {2287 currentHookNameInDev = 'useDeferredValue';2288 warnInvalidHookAccess();2289 mountHookTypesDev();2290 return mountDeferredValue(value);2291 },2292 useTransition() {2293 currentHookNameInDev = 'useTransition';2294 warnInvalidHookAccess();2295 mountHookTypesDev();2296 return mountTransition();2297 },2298 useMutableSource (2299 source ,2300 getSnapshot ,2301 subscribe ,2302 ) {2303 currentHookNameInDev = 'useMutableSource';2304 warnInvalidHookAccess();2305 mountHookTypesDev();2306 return mountMutableSource(source, getSnapshot, subscribe);2307 },2308 useOpaqueIdentifier() {2309 currentHookNameInDev = 'useOpaqueIdentifier';2310 warnInvalidHookAccess();2311 mountHookTypesDev();2312 return mountOpaqueIdentifier();2313 },2314 unstable_isNewReconciler: enableNewReconciler,2315 };2316 InvalidNestedHooksDispatcherOnUpdateInDEV = {2317 readContext (2318 context ,2319 observedBits ,2320 ) {2321 warnInvalidContextAccess();2322 return readContext(context, observedBits);2323 },2324 useCallback (callback , deps ) {2325 currentHookNameInDev = 'useCallback';2326 warnInvalidHookAccess();2327 updateHookTypesDev();2328 return updateCallback(callback, deps);2329 },2330 useContext (2331 context ,2332 observedBits ,2333 ) {2334 currentHookNameInDev = 'useContext';2335 warnInvalidHookAccess();2336 updateHookTypesDev();2337 return readContext(context, observedBits);2338 },2339 useEffect(2340 create ,2341 deps ,2342 ) {2343 currentHookNameInDev = 'useEffect';2344 warnInvalidHookAccess();2345 updateHookTypesDev();2346 return updateEffect(create, deps);2347 },2348 useImperativeHandle (2349 ref ,2350 create ,2351 deps ,2352 ) {2353 currentHookNameInDev = 'useImperativeHandle';2354 warnInvalidHookAccess();2355 updateHookTypesDev();2356 return updateImperativeHandle(ref, create, deps);2357 },2358 useLayoutEffect(2359 create ,2360 deps ,2361 ) {2362 currentHookNameInDev = 'useLayoutEffect';2363 warnInvalidHookAccess();2364 updateHookTypesDev();2365 return updateLayoutEffect(create, deps);2366 },2367 useMemo (create , deps ) {2368 currentHookNameInDev = 'useMemo';2369 warnInvalidHookAccess();2370 updateHookTypesDev();2371 const prevDispatcher = ReactCurrentDispatcher.current;2372 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2373 try {2374 return updateMemo(create, deps);2375 } finally {2376 ReactCurrentDispatcher.current = prevDispatcher;2377 }2378 },2379 useReducer (2380 reducer ,2381 initialArg ,2382 init ,2383 ) {2384 currentHookNameInDev = 'useReducer';2385 warnInvalidHookAccess();2386 updateHookTypesDev();2387 const prevDispatcher = ReactCurrentDispatcher.current;2388 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2389 try {2390 return updateReducer(reducer, initialArg, init);2391 } finally {2392 ReactCurrentDispatcher.current = prevDispatcher;2393 }2394 },2395 useRef (initialValue ) {2396 currentHookNameInDev = 'useRef';2397 warnInvalidHookAccess();2398 updateHookTypesDev();2399 return updateRef(initialValue);2400 },2401 useState (2402 initialState ,2403 ) {2404 currentHookNameInDev = 'useState';2405 warnInvalidHookAccess();2406 updateHookTypesDev();2407 const prevDispatcher = ReactCurrentDispatcher.current;2408 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2409 try {2410 return updateState(initialState);2411 } finally {2412 ReactCurrentDispatcher.current = prevDispatcher;2413 }2414 },2415 useDebugValue (value , formatterFn ) {2416 currentHookNameInDev = 'useDebugValue';2417 warnInvalidHookAccess();2418 updateHookTypesDev();2419 return updateDebugValue(value, formatterFn);2420 },2421 useDeferredValue (value ) {2422 currentHookNameInDev = 'useDeferredValue';2423 warnInvalidHookAccess();2424 updateHookTypesDev();2425 return updateDeferredValue(value);2426 },2427 useTransition() {2428 currentHookNameInDev = 'useTransition';2429 warnInvalidHookAccess();2430 updateHookTypesDev();2431 return updateTransition();2432 },2433 useMutableSource (2434 source ,2435 getSnapshot ,2436 subscribe ,2437 ) {2438 currentHookNameInDev = 'useMutableSource';2439 warnInvalidHookAccess();2440 updateHookTypesDev();2441 return updateMutableSource(source, getSnapshot, subscribe);2442 },2443 useOpaqueIdentifier() {2444 currentHookNameInDev = 'useOpaqueIdentifier';2445 warnInvalidHookAccess();2446 updateHookTypesDev();2447 return updateOpaqueIdentifier();2448 },2449 unstable_isNewReconciler: enableNewReconciler,2450 };2451 InvalidNestedHooksDispatcherOnRerenderInDEV = {2452 readContext (2453 context ,2454 observedBits ,2455 ) {2456 warnInvalidContextAccess();2457 return readContext(context, observedBits);2458 },2459 useCallback (callback , deps ) {2460 currentHookNameInDev = 'useCallback';2461 warnInvalidHookAccess();2462 updateHookTypesDev();2463 return updateCallback(callback, deps);2464 },2465 useContext (2466 context ,2467 observedBits ,2468 ) {2469 currentHookNameInDev = 'useContext';2470 warnInvalidHookAccess();2471 updateHookTypesDev();2472 return readContext(context, observedBits);2473 },2474 useEffect(2475 create ,2476 deps ,2477 ) {2478 currentHookNameInDev = 'useEffect';2479 warnInvalidHookAccess();2480 updateHookTypesDev();2481 return updateEffect(create, deps);2482 },2483 useImperativeHandle (2484 ref ,2485 create ,2486 deps ,2487 ) {2488 currentHookNameInDev = 'useImperativeHandle';2489 warnInvalidHookAccess();2490 updateHookTypesDev();2491 return updateImperativeHandle(ref, create, deps);2492 },2493 useLayoutEffect(2494 create ,2495 deps ,2496 ) {2497 currentHookNameInDev = 'useLayoutEffect';2498 warnInvalidHookAccess();2499 updateHookTypesDev();2500 return updateLayoutEffect(create, deps);2501 },2502 useMemo (create , deps ) {2503 currentHookNameInDev = 'useMemo';2504 warnInvalidHookAccess();2505 updateHookTypesDev();2506 const prevDispatcher = ReactCurrentDispatcher.current;2507 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2508 try {2509 return updateMemo(create, deps);2510 } finally {2511 ReactCurrentDispatcher.current = prevDispatcher;2512 }2513 },2514 useReducer (2515 reducer ,2516 initialArg ,2517 init ,2518 ) {2519 currentHookNameInDev = 'useReducer';2520 warnInvalidHookAccess();2521 updateHookTypesDev();2522 const prevDispatcher = ReactCurrentDispatcher.current;2523 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2524 try {2525 return rerenderReducer(reducer, initialArg, init);2526 } finally {2527 ReactCurrentDispatcher.current = prevDispatcher;2528 }2529 },2530 useRef (initialValue ) {2531 currentHookNameInDev = 'useRef';2532 warnInvalidHookAccess();2533 updateHookTypesDev();2534 return updateRef(initialValue);2535 },2536 useState (2537 initialState ,2538 ) {2539 currentHookNameInDev = 'useState';2540 warnInvalidHookAccess();2541 updateHookTypesDev();2542 const prevDispatcher = ReactCurrentDispatcher.current;2543 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2544 try {2545 return rerenderState(initialState);2546 } finally {2547 ReactCurrentDispatcher.current = prevDispatcher;2548 }2549 },2550 useDebugValue (value , formatterFn ) {2551 currentHookNameInDev = 'useDebugValue';2552 warnInvalidHookAccess();2553 updateHookTypesDev();2554 return updateDebugValue(value, formatterFn);2555 },2556 useDeferredValue (value ) {2557 currentHookNameInDev = 'useDeferredValue';2558 warnInvalidHookAccess();2559 updateHookTypesDev();2560 return rerenderDeferredValue(value);2561 },2562 useTransition() {2563 currentHookNameInDev = 'useTransition';2564 warnInvalidHookAccess();2565 updateHookTypesDev();2566 return rerenderTransition();2567 },2568 useMutableSource (2569 source ,2570 getSnapshot ,2571 subscribe ,2572 ) {2573 currentHookNameInDev = 'useMutableSource';2574 warnInvalidHookAccess();2575 updateHookTypesDev();2576 return updateMutableSource(source, getSnapshot, subscribe);2577 },2578 useOpaqueIdentifier() {2579 currentHookNameInDev = 'useOpaqueIdentifier';2580 warnInvalidHookAccess();...
ReactFiberHooks.old.js
Source:ReactFiberHooks.old.js
...1368 const startRef = updateRef();1369 const start = (startRef.current );1370 return [start, isPending];1371}1372function rerenderTransition() {1373 const [isPending] = rerenderState(false);1374 const startRef = updateRef();1375 const start = (startRef.current );1376 return [start, isPending];1377}1378let isUpdatingOpaqueValueInRenderPhase = false;1379export function getIsUpdatingOpaqueValueInRenderPhaseInDEV() {1380 if (__DEV__) {1381 return isUpdatingOpaqueValueInRenderPhase;1382 }1383}1384function warnOnOpaqueIdentifierAccessInDEV(fiber) {1385 if (__DEV__) {1386 // TODO: Should warn in effects and callbacks, too1387 const name = getComponentName(fiber.type) || 'Unknown';1388 if (getIsRendering() && !didWarnAboutUseOpaqueIdentifier[name]) {1389 console.error(1390 'The object passed back from useOpaqueIdentifier is meant to be ' +1391 'passed through to attributes only. Do not read the ' +1392 'value directly.',1393 );1394 didWarnAboutUseOpaqueIdentifier[name] = true;1395 }1396 }1397}1398function mountOpaqueIdentifier() {1399 const makeId = __DEV__1400 ? makeClientIdInDEV.bind(1401 null,1402 warnOnOpaqueIdentifierAccessInDEV.bind(null, currentlyRenderingFiber),1403 )1404 : makeClientId;1405 if (getIsHydrating()) {1406 let didUpgrade = false;1407 const fiber = currentlyRenderingFiber;1408 const readValue = () => {1409 if (!didUpgrade) {1410 // Only upgrade once. This works even inside the render phase because1411 // the update is added to a shared queue, which outlasts the1412 // in-progress render.1413 didUpgrade = true;1414 if (__DEV__) {1415 isUpdatingOpaqueValueInRenderPhase = true;1416 setId(makeId());1417 isUpdatingOpaqueValueInRenderPhase = false;1418 warnOnOpaqueIdentifierAccessInDEV(fiber);1419 } else {1420 setId(makeId());1421 }1422 }1423 invariant(1424 false,1425 'The object passed back from useOpaqueIdentifier is meant to be ' +1426 'passed through to attributes only. Do not read the value directly.',1427 );1428 };1429 const id = makeOpaqueHydratingObject(readValue);1430 const setId = mountState(id)[1];1431 if ((currentlyRenderingFiber.mode & BlockingMode) === NoMode) {1432 currentlyRenderingFiber.flags |= UpdateEffect | PassiveEffect;1433 pushEffect(1434 HookHasEffect | HookPassive,1435 () => {1436 setId(makeId());1437 },1438 undefined,1439 null,1440 );1441 }1442 return id;1443 } else {1444 const id = makeId();1445 mountState(id);1446 return id;1447 }1448}1449function updateOpaqueIdentifier() {1450 const id = updateState(undefined)[0];1451 return id;1452}1453function rerenderOpaqueIdentifier() {1454 const id = rerenderState(undefined)[0];1455 return id;1456}1457function dispatchAction (1458 fiber ,1459 queue ,1460 action ,1461) {1462 if (__DEV__) {1463 if (typeof arguments[3] === 'function') {1464 console.error(1465 "State updates from the useState() and useReducer() Hooks don't support the " +1466 'second callback argument. To execute a side effect after ' +1467 'rendering, declare it in the component body with useEffect().',1468 );1469 }1470 }1471 const eventTime = requestEventTime();1472 const lane = requestUpdateLane(fiber);1473 const update = {1474 lane,1475 action,1476 eagerReducer: null,1477 eagerState: null,1478 next: (null ),1479 };1480 // Append the update to the end of the list.1481 const pending = queue.pending;1482 if (pending === null) {1483 // This is the first update. Create a circular list.1484 update.next = update;1485 } else {1486 update.next = pending.next;1487 pending.next = update;1488 }1489 queue.pending = update;1490 const alternate = fiber.alternate;1491 if (1492 fiber === currentlyRenderingFiber ||1493 (alternate !== null && alternate === currentlyRenderingFiber)1494 ) {1495 // This is a render phase update. Stash it in a lazily-created map of1496 // queue -> linked list of updates. After this render pass, we'll restart1497 // and apply the stashed updates on top of the work-in-progress hook.1498 didScheduleRenderPhaseUpdateDuringThisPass = didScheduleRenderPhaseUpdate = true;1499 } else {1500 if (1501 fiber.lanes === NoLanes &&1502 (alternate === null || alternate.lanes === NoLanes)1503 ) {1504 // The queue is currently empty, which means we can eagerly compute the1505 // next state before entering the render phase. If the new state is the1506 // same as the current state, we may be able to bail out entirely.1507 const lastRenderedReducer = queue.lastRenderedReducer;1508 if (lastRenderedReducer !== null) {1509 let prevDispatcher;1510 if (__DEV__) {1511 prevDispatcher = ReactCurrentDispatcher.current;1512 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1513 }1514 try {1515 const currentState = (queue.lastRenderedState );1516 const eagerState = lastRenderedReducer(currentState, action);1517 // Stash the eagerly computed state, and the reducer used to compute1518 // it, on the update object. If the reducer hasn't changed by the1519 // time we enter the render phase, then the eager state can be used1520 // without calling the reducer again.1521 update.eagerReducer = lastRenderedReducer;1522 update.eagerState = eagerState;1523 if (is(eagerState, currentState)) {1524 // Fast path. We can bail out without scheduling React to re-render.1525 // It's still possible that we'll need to rebase this update later,1526 // if the component re-renders for a different reason and by that1527 // time the reducer has changed.1528 return;1529 }1530 } catch (error) {1531 // Suppress the error. It will throw again in the render phase.1532 } finally {1533 if (__DEV__) {1534 ReactCurrentDispatcher.current = prevDispatcher;1535 }1536 }1537 }1538 }1539 if (__DEV__) {1540 // $FlowExpectedError - jest isn't a global, and isn't recognized outside of tests1541 if ('undefined' !== typeof jest) {1542 warnIfNotScopedWithMatchingAct(fiber);1543 warnIfNotCurrentlyActingUpdatesInDev(fiber);1544 }1545 }1546 scheduleUpdateOnFiber(fiber, lane, eventTime);1547 }1548 if (__DEV__) {1549 if (enableDebugTracing) {1550 if (fiber.mode & DebugTracingMode) {1551 const name = getComponentName(fiber.type) || 'Unknown';1552 logStateUpdateScheduled(name, lane, action);1553 }1554 }1555 }1556 if (enableSchedulingProfiler) {1557 markStateUpdateScheduled(fiber, lane);1558 }1559}1560export const ContextOnlyDispatcher = {1561 readContext,1562 useCallback: throwInvalidHookError,1563 useContext: throwInvalidHookError,1564 useEffect: throwInvalidHookError,1565 useImperativeHandle: throwInvalidHookError,1566 useLayoutEffect: throwInvalidHookError,1567 useMemo: throwInvalidHookError,1568 useReducer: throwInvalidHookError,1569 useRef: throwInvalidHookError,1570 useState: throwInvalidHookError,1571 useDebugValue: throwInvalidHookError,1572 useDeferredValue: throwInvalidHookError,1573 useTransition: throwInvalidHookError,1574 useMutableSource: throwInvalidHookError,1575 useOpaqueIdentifier: throwInvalidHookError,1576 unstable_isNewReconciler: enableNewReconciler,1577};1578const HooksDispatcherOnMount = {1579 readContext,1580 useCallback: mountCallback,1581 useContext: readContext,1582 useEffect: mountEffect,1583 useImperativeHandle: mountImperativeHandle,1584 useLayoutEffect: mountLayoutEffect,1585 useMemo: mountMemo,1586 useReducer: mountReducer,1587 useRef: mountRef,1588 useState: mountState,1589 useDebugValue: mountDebugValue,1590 useDeferredValue: mountDeferredValue,1591 useTransition: mountTransition,1592 useMutableSource: mountMutableSource,1593 useOpaqueIdentifier: mountOpaqueIdentifier,1594 unstable_isNewReconciler: enableNewReconciler,1595};1596const HooksDispatcherOnUpdate = {1597 readContext,1598 useCallback: updateCallback,1599 useContext: readContext,1600 useEffect: updateEffect,1601 useImperativeHandle: updateImperativeHandle,1602 useLayoutEffect: updateLayoutEffect,1603 useMemo: updateMemo,1604 useReducer: updateReducer,1605 useRef: updateRef,1606 useState: updateState,1607 useDebugValue: updateDebugValue,1608 useDeferredValue: updateDeferredValue,1609 useTransition: updateTransition,1610 useMutableSource: updateMutableSource,1611 useOpaqueIdentifier: updateOpaqueIdentifier,1612 unstable_isNewReconciler: enableNewReconciler,1613};1614const HooksDispatcherOnRerender = {1615 readContext,1616 useCallback: updateCallback,1617 useContext: readContext,1618 useEffect: updateEffect,1619 useImperativeHandle: updateImperativeHandle,1620 useLayoutEffect: updateLayoutEffect,1621 useMemo: updateMemo,1622 useReducer: rerenderReducer,1623 useRef: updateRef,1624 useState: rerenderState,1625 useDebugValue: updateDebugValue,1626 useDeferredValue: rerenderDeferredValue,1627 useTransition: rerenderTransition,1628 useMutableSource: updateMutableSource,1629 useOpaqueIdentifier: rerenderOpaqueIdentifier,1630 unstable_isNewReconciler: enableNewReconciler,1631};1632let HooksDispatcherOnMountInDEV = null;1633let HooksDispatcherOnMountWithHookTypesInDEV = null;1634let HooksDispatcherOnUpdateInDEV = null;1635let HooksDispatcherOnRerenderInDEV = null;1636let InvalidNestedHooksDispatcherOnMountInDEV = null;1637let InvalidNestedHooksDispatcherOnUpdateInDEV = null;1638let InvalidNestedHooksDispatcherOnRerenderInDEV = null;1639if (__DEV__) {1640 const warnInvalidContextAccess = () => {1641 console.error(1642 'Context can only be read while React is rendering. ' +1643 'In classes, you can read it in the render method or getDerivedStateFromProps. ' +1644 'In function components, you can read it directly in the function body, but not ' +1645 'inside Hooks like useReducer() or useMemo().',1646 );1647 };1648 const warnInvalidHookAccess = () => {1649 console.error(1650 'Do not call Hooks inside useEffect(...), useMemo(...), or other built-in Hooks. ' +1651 'You can only call Hooks at the top level of your React function. ' +1652 'For more information, see ' +1653 'https://reactjs.org/link/rules-of-hooks',1654 );1655 };1656 HooksDispatcherOnMountInDEV = {1657 readContext (1658 context ,1659 observedBits ,1660 ) {1661 return readContext(context, observedBits);1662 },1663 useCallback (callback , deps ) {1664 currentHookNameInDev = 'useCallback';1665 mountHookTypesDev();1666 checkDepsAreArrayDev(deps);1667 return mountCallback(callback, deps);1668 },1669 useContext (1670 context ,1671 observedBits ,1672 ) {1673 currentHookNameInDev = 'useContext';1674 mountHookTypesDev();1675 return readContext(context, observedBits);1676 },1677 useEffect(1678 create ,1679 deps ,1680 ) {1681 currentHookNameInDev = 'useEffect';1682 mountHookTypesDev();1683 checkDepsAreArrayDev(deps);1684 return mountEffect(create, deps);1685 },1686 useImperativeHandle (1687 ref ,1688 create ,1689 deps ,1690 ) {1691 currentHookNameInDev = 'useImperativeHandle';1692 mountHookTypesDev();1693 checkDepsAreArrayDev(deps);1694 return mountImperativeHandle(ref, create, deps);1695 },1696 useLayoutEffect(1697 create ,1698 deps ,1699 ) {1700 currentHookNameInDev = 'useLayoutEffect';1701 mountHookTypesDev();1702 checkDepsAreArrayDev(deps);1703 return mountLayoutEffect(create, deps);1704 },1705 useMemo (create , deps ) {1706 currentHookNameInDev = 'useMemo';1707 mountHookTypesDev();1708 checkDepsAreArrayDev(deps);1709 const prevDispatcher = ReactCurrentDispatcher.current;1710 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1711 try {1712 return mountMemo(create, deps);1713 } finally {1714 ReactCurrentDispatcher.current = prevDispatcher;1715 }1716 },1717 useReducer (1718 reducer ,1719 initialArg ,1720 init ,1721 ) {1722 currentHookNameInDev = 'useReducer';1723 mountHookTypesDev();1724 const prevDispatcher = ReactCurrentDispatcher.current;1725 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1726 try {1727 return mountReducer(reducer, initialArg, init);1728 } finally {1729 ReactCurrentDispatcher.current = prevDispatcher;1730 }1731 },1732 useRef (initialValue ) {1733 currentHookNameInDev = 'useRef';1734 mountHookTypesDev();1735 return mountRef(initialValue);1736 },1737 useState (1738 initialState ,1739 ) {1740 currentHookNameInDev = 'useState';1741 mountHookTypesDev();1742 const prevDispatcher = ReactCurrentDispatcher.current;1743 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1744 try {1745 return mountState(initialState);1746 } finally {1747 ReactCurrentDispatcher.current = prevDispatcher;1748 }1749 },1750 useDebugValue (value , formatterFn ) {1751 currentHookNameInDev = 'useDebugValue';1752 mountHookTypesDev();1753 return mountDebugValue(value, formatterFn);1754 },1755 useDeferredValue (value ) {1756 currentHookNameInDev = 'useDeferredValue';1757 mountHookTypesDev();1758 return mountDeferredValue(value);1759 },1760 useTransition() {1761 currentHookNameInDev = 'useTransition';1762 mountHookTypesDev();1763 return mountTransition();1764 },1765 useMutableSource (1766 source ,1767 getSnapshot ,1768 subscribe ,1769 ) {1770 currentHookNameInDev = 'useMutableSource';1771 mountHookTypesDev();1772 return mountMutableSource(source, getSnapshot, subscribe);1773 },1774 useOpaqueIdentifier() {1775 currentHookNameInDev = 'useOpaqueIdentifier';1776 mountHookTypesDev();1777 return mountOpaqueIdentifier();1778 },1779 unstable_isNewReconciler: enableNewReconciler,1780 };1781 HooksDispatcherOnMountWithHookTypesInDEV = {1782 readContext (1783 context ,1784 observedBits ,1785 ) {1786 return readContext(context, observedBits);1787 },1788 useCallback (callback , deps ) {1789 currentHookNameInDev = 'useCallback';1790 updateHookTypesDev();1791 return mountCallback(callback, deps);1792 },1793 useContext (1794 context ,1795 observedBits ,1796 ) {1797 currentHookNameInDev = 'useContext';1798 updateHookTypesDev();1799 return readContext(context, observedBits);1800 },1801 useEffect(1802 create ,1803 deps ,1804 ) {1805 currentHookNameInDev = 'useEffect';1806 updateHookTypesDev();1807 return mountEffect(create, deps);1808 },1809 useImperativeHandle (1810 ref ,1811 create ,1812 deps ,1813 ) {1814 currentHookNameInDev = 'useImperativeHandle';1815 updateHookTypesDev();1816 return mountImperativeHandle(ref, create, deps);1817 },1818 useLayoutEffect(1819 create ,1820 deps ,1821 ) {1822 currentHookNameInDev = 'useLayoutEffect';1823 updateHookTypesDev();1824 return mountLayoutEffect(create, deps);1825 },1826 useMemo (create , deps ) {1827 currentHookNameInDev = 'useMemo';1828 updateHookTypesDev();1829 const prevDispatcher = ReactCurrentDispatcher.current;1830 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1831 try {1832 return mountMemo(create, deps);1833 } finally {1834 ReactCurrentDispatcher.current = prevDispatcher;1835 }1836 },1837 useReducer (1838 reducer ,1839 initialArg ,1840 init ,1841 ) {1842 currentHookNameInDev = 'useReducer';1843 updateHookTypesDev();1844 const prevDispatcher = ReactCurrentDispatcher.current;1845 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1846 try {1847 return mountReducer(reducer, initialArg, init);1848 } finally {1849 ReactCurrentDispatcher.current = prevDispatcher;1850 }1851 },1852 useRef (initialValue ) {1853 currentHookNameInDev = 'useRef';1854 updateHookTypesDev();1855 return mountRef(initialValue);1856 },1857 useState (1858 initialState ,1859 ) {1860 currentHookNameInDev = 'useState';1861 updateHookTypesDev();1862 const prevDispatcher = ReactCurrentDispatcher.current;1863 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1864 try {1865 return mountState(initialState);1866 } finally {1867 ReactCurrentDispatcher.current = prevDispatcher;1868 }1869 },1870 useDebugValue (value , formatterFn ) {1871 currentHookNameInDev = 'useDebugValue';1872 updateHookTypesDev();1873 return mountDebugValue(value, formatterFn);1874 },1875 useDeferredValue (value ) {1876 currentHookNameInDev = 'useDeferredValue';1877 updateHookTypesDev();1878 return mountDeferredValue(value);1879 },1880 useTransition() {1881 currentHookNameInDev = 'useTransition';1882 updateHookTypesDev();1883 return mountTransition();1884 },1885 useMutableSource (1886 source ,1887 getSnapshot ,1888 subscribe ,1889 ) {1890 currentHookNameInDev = 'useMutableSource';1891 updateHookTypesDev();1892 return mountMutableSource(source, getSnapshot, subscribe);1893 },1894 useOpaqueIdentifier() {1895 currentHookNameInDev = 'useOpaqueIdentifier';1896 updateHookTypesDev();1897 return mountOpaqueIdentifier();1898 },1899 unstable_isNewReconciler: enableNewReconciler,1900 };1901 HooksDispatcherOnUpdateInDEV = {1902 readContext (1903 context ,1904 observedBits ,1905 ) {1906 return readContext(context, observedBits);1907 },1908 useCallback (callback , deps ) {1909 currentHookNameInDev = 'useCallback';1910 updateHookTypesDev();1911 return updateCallback(callback, deps);1912 },1913 useContext (1914 context ,1915 observedBits ,1916 ) {1917 currentHookNameInDev = 'useContext';1918 updateHookTypesDev();1919 return readContext(context, observedBits);1920 },1921 useEffect(1922 create ,1923 deps ,1924 ) {1925 currentHookNameInDev = 'useEffect';1926 updateHookTypesDev();1927 return updateEffect(create, deps);1928 },1929 useImperativeHandle (1930 ref ,1931 create ,1932 deps ,1933 ) {1934 currentHookNameInDev = 'useImperativeHandle';1935 updateHookTypesDev();1936 return updateImperativeHandle(ref, create, deps);1937 },1938 useLayoutEffect(1939 create ,1940 deps ,1941 ) {1942 currentHookNameInDev = 'useLayoutEffect';1943 updateHookTypesDev();1944 return updateLayoutEffect(create, deps);1945 },1946 useMemo (create , deps ) {1947 currentHookNameInDev = 'useMemo';1948 updateHookTypesDev();1949 const prevDispatcher = ReactCurrentDispatcher.current;1950 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1951 try {1952 return updateMemo(create, deps);1953 } finally {1954 ReactCurrentDispatcher.current = prevDispatcher;1955 }1956 },1957 useReducer (1958 reducer ,1959 initialArg ,1960 init ,1961 ) {1962 currentHookNameInDev = 'useReducer';1963 updateHookTypesDev();1964 const prevDispatcher = ReactCurrentDispatcher.current;1965 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1966 try {1967 return updateReducer(reducer, initialArg, init);1968 } finally {1969 ReactCurrentDispatcher.current = prevDispatcher;1970 }1971 },1972 useRef (initialValue ) {1973 currentHookNameInDev = 'useRef';1974 updateHookTypesDev();1975 return updateRef(initialValue);1976 },1977 useState (1978 initialState ,1979 ) {1980 currentHookNameInDev = 'useState';1981 updateHookTypesDev();1982 const prevDispatcher = ReactCurrentDispatcher.current;1983 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1984 try {1985 return updateState(initialState);1986 } finally {1987 ReactCurrentDispatcher.current = prevDispatcher;1988 }1989 },1990 useDebugValue (value , formatterFn ) {1991 currentHookNameInDev = 'useDebugValue';1992 updateHookTypesDev();1993 return updateDebugValue(value, formatterFn);1994 },1995 useDeferredValue (value ) {1996 currentHookNameInDev = 'useDeferredValue';1997 updateHookTypesDev();1998 return updateDeferredValue(value);1999 },2000 useTransition() {2001 currentHookNameInDev = 'useTransition';2002 updateHookTypesDev();2003 return updateTransition();2004 },2005 useMutableSource (2006 source ,2007 getSnapshot ,2008 subscribe ,2009 ) {2010 currentHookNameInDev = 'useMutableSource';2011 updateHookTypesDev();2012 return updateMutableSource(source, getSnapshot, subscribe);2013 },2014 useOpaqueIdentifier() {2015 currentHookNameInDev = 'useOpaqueIdentifier';2016 updateHookTypesDev();2017 return updateOpaqueIdentifier();2018 },2019 unstable_isNewReconciler: enableNewReconciler,2020 };2021 HooksDispatcherOnRerenderInDEV = {2022 readContext (2023 context ,2024 observedBits ,2025 ) {2026 return readContext(context, observedBits);2027 },2028 useCallback (callback , deps ) {2029 currentHookNameInDev = 'useCallback';2030 updateHookTypesDev();2031 return updateCallback(callback, deps);2032 },2033 useContext (2034 context ,2035 observedBits ,2036 ) {2037 currentHookNameInDev = 'useContext';2038 updateHookTypesDev();2039 return readContext(context, observedBits);2040 },2041 useEffect(2042 create ,2043 deps ,2044 ) {2045 currentHookNameInDev = 'useEffect';2046 updateHookTypesDev();2047 return updateEffect(create, deps);2048 },2049 useImperativeHandle (2050 ref ,2051 create ,2052 deps ,2053 ) {2054 currentHookNameInDev = 'useImperativeHandle';2055 updateHookTypesDev();2056 return updateImperativeHandle(ref, create, deps);2057 },2058 useLayoutEffect(2059 create ,2060 deps ,2061 ) {2062 currentHookNameInDev = 'useLayoutEffect';2063 updateHookTypesDev();2064 return updateLayoutEffect(create, deps);2065 },2066 useMemo (create , deps ) {2067 currentHookNameInDev = 'useMemo';2068 updateHookTypesDev();2069 const prevDispatcher = ReactCurrentDispatcher.current;2070 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnRerenderInDEV;2071 try {2072 return updateMemo(create, deps);2073 } finally {2074 ReactCurrentDispatcher.current = prevDispatcher;2075 }2076 },2077 useReducer (2078 reducer ,2079 initialArg ,2080 init ,2081 ) {2082 currentHookNameInDev = 'useReducer';2083 updateHookTypesDev();2084 const prevDispatcher = ReactCurrentDispatcher.current;2085 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnRerenderInDEV;2086 try {2087 return rerenderReducer(reducer, initialArg, init);2088 } finally {2089 ReactCurrentDispatcher.current = prevDispatcher;2090 }2091 },2092 useRef (initialValue ) {2093 currentHookNameInDev = 'useRef';2094 updateHookTypesDev();2095 return updateRef(initialValue);2096 },2097 useState (2098 initialState ,2099 ) {2100 currentHookNameInDev = 'useState';2101 updateHookTypesDev();2102 const prevDispatcher = ReactCurrentDispatcher.current;2103 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnRerenderInDEV;2104 try {2105 return rerenderState(initialState);2106 } finally {2107 ReactCurrentDispatcher.current = prevDispatcher;2108 }2109 },2110 useDebugValue (value , formatterFn ) {2111 currentHookNameInDev = 'useDebugValue';2112 updateHookTypesDev();2113 return updateDebugValue(value, formatterFn);2114 },2115 useDeferredValue (value ) {2116 currentHookNameInDev = 'useDeferredValue';2117 updateHookTypesDev();2118 return rerenderDeferredValue(value);2119 },2120 useTransition() {2121 currentHookNameInDev = 'useTransition';2122 updateHookTypesDev();2123 return rerenderTransition();2124 },2125 useMutableSource (2126 source ,2127 getSnapshot ,2128 subscribe ,2129 ) {2130 currentHookNameInDev = 'useMutableSource';2131 updateHookTypesDev();2132 return updateMutableSource(source, getSnapshot, subscribe);2133 },2134 useOpaqueIdentifier() {2135 currentHookNameInDev = 'useOpaqueIdentifier';2136 updateHookTypesDev();2137 return rerenderOpaqueIdentifier();2138 },2139 unstable_isNewReconciler: enableNewReconciler,2140 };2141 InvalidNestedHooksDispatcherOnMountInDEV = {2142 readContext (2143 context ,2144 observedBits ,2145 ) {2146 warnInvalidContextAccess();2147 return readContext(context, observedBits);2148 },2149 useCallback (callback , deps ) {2150 currentHookNameInDev = 'useCallback';2151 warnInvalidHookAccess();2152 mountHookTypesDev();2153 return mountCallback(callback, deps);2154 },2155 useContext (2156 context ,2157 observedBits ,2158 ) {2159 currentHookNameInDev = 'useContext';2160 warnInvalidHookAccess();2161 mountHookTypesDev();2162 return readContext(context, observedBits);2163 },2164 useEffect(2165 create ,2166 deps ,2167 ) {2168 currentHookNameInDev = 'useEffect';2169 warnInvalidHookAccess();2170 mountHookTypesDev();2171 return mountEffect(create, deps);2172 },2173 useImperativeHandle (2174 ref ,2175 create ,2176 deps ,2177 ) {2178 currentHookNameInDev = 'useImperativeHandle';2179 warnInvalidHookAccess();2180 mountHookTypesDev();2181 return mountImperativeHandle(ref, create, deps);2182 },2183 useLayoutEffect(2184 create ,2185 deps ,2186 ) {2187 currentHookNameInDev = 'useLayoutEffect';2188 warnInvalidHookAccess();2189 mountHookTypesDev();2190 return mountLayoutEffect(create, deps);2191 },2192 useMemo (create , deps ) {2193 currentHookNameInDev = 'useMemo';2194 warnInvalidHookAccess();2195 mountHookTypesDev();2196 const prevDispatcher = ReactCurrentDispatcher.current;2197 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;2198 try {2199 return mountMemo(create, deps);2200 } finally {2201 ReactCurrentDispatcher.current = prevDispatcher;2202 }2203 },2204 useReducer (2205 reducer ,2206 initialArg ,2207 init ,2208 ) {2209 currentHookNameInDev = 'useReducer';2210 warnInvalidHookAccess();2211 mountHookTypesDev();2212 const prevDispatcher = ReactCurrentDispatcher.current;2213 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;2214 try {2215 return mountReducer(reducer, initialArg, init);2216 } finally {2217 ReactCurrentDispatcher.current = prevDispatcher;2218 }2219 },2220 useRef (initialValue ) {2221 currentHookNameInDev = 'useRef';2222 warnInvalidHookAccess();2223 mountHookTypesDev();2224 return mountRef(initialValue);2225 },2226 useState (2227 initialState ,2228 ) {2229 currentHookNameInDev = 'useState';2230 warnInvalidHookAccess();2231 mountHookTypesDev();2232 const prevDispatcher = ReactCurrentDispatcher.current;2233 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;2234 try {2235 return mountState(initialState);2236 } finally {2237 ReactCurrentDispatcher.current = prevDispatcher;2238 }2239 },2240 useDebugValue (value , formatterFn ) {2241 currentHookNameInDev = 'useDebugValue';2242 warnInvalidHookAccess();2243 mountHookTypesDev();2244 return mountDebugValue(value, formatterFn);2245 },2246 useDeferredValue (value ) {2247 currentHookNameInDev = 'useDeferredValue';2248 warnInvalidHookAccess();2249 mountHookTypesDev();2250 return mountDeferredValue(value);2251 },2252 useTransition() {2253 currentHookNameInDev = 'useTransition';2254 warnInvalidHookAccess();2255 mountHookTypesDev();2256 return mountTransition();2257 },2258 useMutableSource (2259 source ,2260 getSnapshot ,2261 subscribe ,2262 ) {2263 currentHookNameInDev = 'useMutableSource';2264 warnInvalidHookAccess();2265 mountHookTypesDev();2266 return mountMutableSource(source, getSnapshot, subscribe);2267 },2268 useOpaqueIdentifier() {2269 currentHookNameInDev = 'useOpaqueIdentifier';2270 warnInvalidHookAccess();2271 mountHookTypesDev();2272 return mountOpaqueIdentifier();2273 },2274 unstable_isNewReconciler: enableNewReconciler,2275 };2276 InvalidNestedHooksDispatcherOnUpdateInDEV = {2277 readContext (2278 context ,2279 observedBits ,2280 ) {2281 warnInvalidContextAccess();2282 return readContext(context, observedBits);2283 },2284 useCallback (callback , deps ) {2285 currentHookNameInDev = 'useCallback';2286 warnInvalidHookAccess();2287 updateHookTypesDev();2288 return updateCallback(callback, deps);2289 },2290 useContext (2291 context ,2292 observedBits ,2293 ) {2294 currentHookNameInDev = 'useContext';2295 warnInvalidHookAccess();2296 updateHookTypesDev();2297 return readContext(context, observedBits);2298 },2299 useEffect(2300 create ,2301 deps ,2302 ) {2303 currentHookNameInDev = 'useEffect';2304 warnInvalidHookAccess();2305 updateHookTypesDev();2306 return updateEffect(create, deps);2307 },2308 useImperativeHandle (2309 ref ,2310 create ,2311 deps ,2312 ) {2313 currentHookNameInDev = 'useImperativeHandle';2314 warnInvalidHookAccess();2315 updateHookTypesDev();2316 return updateImperativeHandle(ref, create, deps);2317 },2318 useLayoutEffect(2319 create ,2320 deps ,2321 ) {2322 currentHookNameInDev = 'useLayoutEffect';2323 warnInvalidHookAccess();2324 updateHookTypesDev();2325 return updateLayoutEffect(create, deps);2326 },2327 useMemo (create , deps ) {2328 currentHookNameInDev = 'useMemo';2329 warnInvalidHookAccess();2330 updateHookTypesDev();2331 const prevDispatcher = ReactCurrentDispatcher.current;2332 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2333 try {2334 return updateMemo(create, deps);2335 } finally {2336 ReactCurrentDispatcher.current = prevDispatcher;2337 }2338 },2339 useReducer (2340 reducer ,2341 initialArg ,2342 init ,2343 ) {2344 currentHookNameInDev = 'useReducer';2345 warnInvalidHookAccess();2346 updateHookTypesDev();2347 const prevDispatcher = ReactCurrentDispatcher.current;2348 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2349 try {2350 return updateReducer(reducer, initialArg, init);2351 } finally {2352 ReactCurrentDispatcher.current = prevDispatcher;2353 }2354 },2355 useRef (initialValue ) {2356 currentHookNameInDev = 'useRef';2357 warnInvalidHookAccess();2358 updateHookTypesDev();2359 return updateRef(initialValue);2360 },2361 useState (2362 initialState ,2363 ) {2364 currentHookNameInDev = 'useState';2365 warnInvalidHookAccess();2366 updateHookTypesDev();2367 const prevDispatcher = ReactCurrentDispatcher.current;2368 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2369 try {2370 return updateState(initialState);2371 } finally {2372 ReactCurrentDispatcher.current = prevDispatcher;2373 }2374 },2375 useDebugValue (value , formatterFn ) {2376 currentHookNameInDev = 'useDebugValue';2377 warnInvalidHookAccess();2378 updateHookTypesDev();2379 return updateDebugValue(value, formatterFn);2380 },2381 useDeferredValue (value ) {2382 currentHookNameInDev = 'useDeferredValue';2383 warnInvalidHookAccess();2384 updateHookTypesDev();2385 return updateDeferredValue(value);2386 },2387 useTransition() {2388 currentHookNameInDev = 'useTransition';2389 warnInvalidHookAccess();2390 updateHookTypesDev();2391 return updateTransition();2392 },2393 useMutableSource (2394 source ,2395 getSnapshot ,2396 subscribe ,2397 ) {2398 currentHookNameInDev = 'useMutableSource';2399 warnInvalidHookAccess();2400 updateHookTypesDev();2401 return updateMutableSource(source, getSnapshot, subscribe);2402 },2403 useOpaqueIdentifier() {2404 currentHookNameInDev = 'useOpaqueIdentifier';2405 warnInvalidHookAccess();2406 updateHookTypesDev();2407 return updateOpaqueIdentifier();2408 },2409 unstable_isNewReconciler: enableNewReconciler,2410 };2411 InvalidNestedHooksDispatcherOnRerenderInDEV = {2412 readContext (2413 context ,2414 observedBits ,2415 ) {2416 warnInvalidContextAccess();2417 return readContext(context, observedBits);2418 },2419 useCallback (callback , deps ) {2420 currentHookNameInDev = 'useCallback';2421 warnInvalidHookAccess();2422 updateHookTypesDev();2423 return updateCallback(callback, deps);2424 },2425 useContext (2426 context ,2427 observedBits ,2428 ) {2429 currentHookNameInDev = 'useContext';2430 warnInvalidHookAccess();2431 updateHookTypesDev();2432 return readContext(context, observedBits);2433 },2434 useEffect(2435 create ,2436 deps ,2437 ) {2438 currentHookNameInDev = 'useEffect';2439 warnInvalidHookAccess();2440 updateHookTypesDev();2441 return updateEffect(create, deps);2442 },2443 useImperativeHandle (2444 ref ,2445 create ,2446 deps ,2447 ) {2448 currentHookNameInDev = 'useImperativeHandle';2449 warnInvalidHookAccess();2450 updateHookTypesDev();2451 return updateImperativeHandle(ref, create, deps);2452 },2453 useLayoutEffect(2454 create ,2455 deps ,2456 ) {2457 currentHookNameInDev = 'useLayoutEffect';2458 warnInvalidHookAccess();2459 updateHookTypesDev();2460 return updateLayoutEffect(create, deps);2461 },2462 useMemo (create , deps ) {2463 currentHookNameInDev = 'useMemo';2464 warnInvalidHookAccess();2465 updateHookTypesDev();2466 const prevDispatcher = ReactCurrentDispatcher.current;2467 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2468 try {2469 return updateMemo(create, deps);2470 } finally {2471 ReactCurrentDispatcher.current = prevDispatcher;2472 }2473 },2474 useReducer (2475 reducer ,2476 initialArg ,2477 init ,2478 ) {2479 currentHookNameInDev = 'useReducer';2480 warnInvalidHookAccess();2481 updateHookTypesDev();2482 const prevDispatcher = ReactCurrentDispatcher.current;2483 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2484 try {2485 return rerenderReducer(reducer, initialArg, init);2486 } finally {2487 ReactCurrentDispatcher.current = prevDispatcher;2488 }2489 },2490 useRef (initialValue ) {2491 currentHookNameInDev = 'useRef';2492 warnInvalidHookAccess();2493 updateHookTypesDev();2494 return updateRef(initialValue);2495 },2496 useState (2497 initialState ,2498 ) {2499 currentHookNameInDev = 'useState';2500 warnInvalidHookAccess();2501 updateHookTypesDev();2502 const prevDispatcher = ReactCurrentDispatcher.current;2503 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2504 try {2505 return rerenderState(initialState);2506 } finally {2507 ReactCurrentDispatcher.current = prevDispatcher;2508 }2509 },2510 useDebugValue (value , formatterFn ) {2511 currentHookNameInDev = 'useDebugValue';2512 warnInvalidHookAccess();2513 updateHookTypesDev();2514 return updateDebugValue(value, formatterFn);2515 },2516 useDeferredValue (value ) {2517 currentHookNameInDev = 'useDeferredValue';2518 warnInvalidHookAccess();2519 updateHookTypesDev();2520 return rerenderDeferredValue(value);2521 },2522 useTransition() {2523 currentHookNameInDev = 'useTransition';2524 warnInvalidHookAccess();2525 updateHookTypesDev();2526 return rerenderTransition();2527 },2528 useMutableSource (2529 source ,2530 getSnapshot ,2531 subscribe ,2532 ) {2533 currentHookNameInDev = 'useMutableSource';2534 warnInvalidHookAccess();2535 updateHookTypesDev();2536 return updateMutableSource(source, getSnapshot, subscribe);2537 },2538 useOpaqueIdentifier() {2539 currentHookNameInDev = 'useOpaqueIdentifier';2540 warnInvalidHookAccess();...
ReactFiberHooks.js
Source:ReactFiberHooks.js
...1101 config,1102 ]);1103 return [start, isPending];1104}1105function rerenderTransition(1106 config: SuspenseConfig | void | null,1107): [(() => void) => void, boolean] {1108 const [isPending, setPending] = rerenderState(false);1109 const start = updateCallback(startTransition.bind(null, setPending, config), [1110 setPending,1111 config,1112 ]);1113 return [start, isPending];1114}1115function dispatchAction<S, A>(1116 fiber: Fiber,1117 queue: UpdateQueue<S, A>,1118 action: A,1119) {1120 if (true) {1121 if (typeof arguments[3] === 'function') {1122 console.error(1123 "State updates from the useState() and useReducer() Hooks don't support the " +1124 'second callback argument. To execute a side effect after ' +1125 'rendering, declare it in the component body with useEffect().',1126 );1127 }1128 }1129 const currentTime = requestCurrentTimeForUpdate();1130 const suspenseConfig = requestCurrentSuspenseConfig();1131 const expirationTime = computeExpirationForFiber(1132 currentTime,1133 fiber,1134 suspenseConfig,1135 );1136 const update: Update<S, A> = {1137 expirationTime,1138 suspenseConfig,1139 action,1140 eagerReducer: null,1141 eagerState: null,1142 next: (null: any),1143 };1144 if (true) {1145 update.priority = getCurrentPriorityLevel();1146 }1147 // Append the update to the end of the list.1148 const pending = queue.pending;1149 if (pending === null) {1150 // This is the first update. Create a circular list.1151 update.next = update;1152 } else {1153 update.next = pending.next;1154 pending.next = update;1155 }1156 queue.pending = update;1157 const alternate = fiber.alternate;1158 if (1159 fiber === currentlyRenderingFiber ||1160 (alternate !== null && alternate === currentlyRenderingFiber)1161 ) {1162 // This is a render phase update. Stash it in a lazily-created map of1163 // queue -> linked list of updates. After this render pass, we'll restart1164 // and apply the stashed updates on top of the work-in-progress hook.1165 didScheduleRenderPhaseUpdate = true;1166 update.expirationTime = renderExpirationTime;1167 currentlyRenderingFiber.expirationTime = renderExpirationTime;1168 } else {1169 if (1170 fiber.expirationTime === NoWork &&1171 (alternate === null || alternate.expirationTime === NoWork)1172 ) {1173 // The queue is currently empty, which means we can eagerly compute the1174 // next state before entering the render phase. If the new state is the1175 // same as the current state, we may be able to bail out entirely.1176 const lastRenderedReducer = queue.lastRenderedReducer;1177 if (lastRenderedReducer !== null) {1178 let prevDispatcher;1179 if (true) {1180 prevDispatcher = ReactCurrentDispatcher.current;1181 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1182 }1183 try {1184 const currentState: S = (queue.lastRenderedState: any);1185 const eagerState = lastRenderedReducer(currentState, action);1186 // Stash the eagerly computed state, and the reducer used to compute1187 // it, on the update object. If the reducer hasn't changed by the1188 // time we enter the render phase, then the eager state can be used1189 // without calling the reducer again.1190 update.eagerReducer = lastRenderedReducer;1191 update.eagerState = eagerState;1192 if (is(eagerState, currentState)) {1193 // Fast path. We can bail out without scheduling React to re-render.1194 // It's still possible that we'll need to rebase this update later,1195 // if the component re-renders for a different reason and by that1196 // time the reducer has changed.1197 return;1198 }1199 } catch (error) {1200 // Suppress the error. It will throw again in the render phase.1201 } finally {1202 if (true) {1203 ReactCurrentDispatcher.current = prevDispatcher;1204 }1205 }1206 }1207 }1208 if (true) {1209 // $FlowExpectedError - jest isn't a global, and isn't recognized outside of tests1210 if ('undefined' !== typeof jest) {1211 warnIfNotScopedWithMatchingAct(fiber);1212 warnIfNotCurrentlyActingUpdatesInDev(fiber);1213 }1214 }1215 scheduleWork(fiber, expirationTime);1216 }1217}1218export const ContextOnlyDispatcher: Dispatcher = {1219 readContext,1220 useCallback: throwInvalidHookError,1221 useContext: throwInvalidHookError,1222 useEffect: throwInvalidHookError,1223 useImperativeHandle: throwInvalidHookError,1224 useLayoutEffect: throwInvalidHookError,1225 useMemo: throwInvalidHookError,1226 useReducer: throwInvalidHookError,1227 useRef: throwInvalidHookError,1228 useState: throwInvalidHookError,1229 useDebugValue: throwInvalidHookError,1230 useResponder: throwInvalidHookError,1231 useDeferredValue: throwInvalidHookError,1232 useTransition: throwInvalidHookError,1233};1234const HooksDispatcherOnMount: Dispatcher = {1235 readContext,1236 useCallback: mountCallback,1237 useContext: readContext,1238 useEffect: mountEffect,1239 useImperativeHandle: mountImperativeHandle,1240 useLayoutEffect: mountLayoutEffect,1241 useMemo: mountMemo,1242 useReducer: mountReducer,1243 useRef: mountRef,1244 useState: mountState,1245 useDebugValue: mountDebugValue,1246 useResponder: createDeprecatedResponderListener,1247 useDeferredValue: mountDeferredValue,1248 useTransition: mountTransition,1249};1250const HooksDispatcherOnUpdate: Dispatcher = {1251 readContext,1252 useCallback: updateCallback,1253 useContext: readContext,1254 useEffect: updateEffect,1255 useImperativeHandle: updateImperativeHandle,1256 useLayoutEffect: updateLayoutEffect,1257 useMemo: updateMemo,1258 useReducer: updateReducer,1259 useRef: updateRef,1260 useState: updateState,1261 useDebugValue: updateDebugValue,1262 useResponder: createDeprecatedResponderListener,1263 useDeferredValue: updateDeferredValue,1264 useTransition: updateTransition,1265};1266const HooksDispatcherOnRerender: Dispatcher = {1267 readContext,1268 useCallback: updateCallback,1269 useContext: readContext,1270 useEffect: updateEffect,1271 useImperativeHandle: updateImperativeHandle,1272 useLayoutEffect: updateLayoutEffect,1273 useMemo: updateMemo,1274 useReducer: rerenderReducer,1275 useRef: updateRef,1276 useState: rerenderState,1277 useDebugValue: updateDebugValue,1278 useResponder: createDeprecatedResponderListener,1279 useDeferredValue: rerenderDeferredValue,1280 useTransition: rerenderTransition,1281};1282let HooksDispatcherOnMountInDEV: Dispatcher | null = null;1283let HooksDispatcherOnMountWithHookTypesInDEV: Dispatcher | null = null;1284let HooksDispatcherOnUpdateInDEV: Dispatcher | null = null;1285let HooksDispatcherOnRerenderInDEV: Dispatcher | null = null;1286let InvalidNestedHooksDispatcherOnMountInDEV: Dispatcher | null = null;1287let InvalidNestedHooksDispatcherOnUpdateInDEV: Dispatcher | null = null;1288let InvalidNestedHooksDispatcherOnRerenderInDEV: Dispatcher | null = null;1289if (true) {1290 const warnInvalidContextAccess = () => {1291 console.error(1292 'Context can only be read while React is rendering. ' +1293 'In classes, you can read it in the render method or getDerivedStateFromProps. ' +1294 'In function components, you can read it directly in the function body, but not ' +1295 'inside Hooks like useReducer() or useMemo().',1296 );1297 };1298 const warnInvalidHookAccess = () => {1299 console.error(1300 'Do not call Hooks inside useEffect(...), useMemo(...), or other built-in Hooks. ' +1301 'You can only call Hooks at the top level of your React function. ' +1302 'For more information, see ' +1303 'https://fb.me/rules-of-hooks',1304 );1305 };1306 HooksDispatcherOnMountInDEV = {1307 readContext<T>(1308 context: ReactContext<T>,1309 observedBits: void | number | boolean,1310 ): T {1311 return readContext(context, observedBits);1312 },1313 useCallback<T>(callback: T, deps: Array<mixed> | void | null): T {1314 currentHookNameInDev = 'useCallback';1315 mountHookTypesDev();1316 checkDepsAreArrayDev(deps);1317 return mountCallback(callback, deps);1318 },1319 useContext<T>(1320 context: ReactContext<T>,1321 observedBits: void | number | boolean,1322 ): T {1323 currentHookNameInDev = 'useContext';1324 mountHookTypesDev();1325 return readContext(context, observedBits);1326 },1327 useEffect(1328 create: () => (() => void) | void,1329 deps: Array<mixed> | void | null,1330 ): void {1331 currentHookNameInDev = 'useEffect';1332 mountHookTypesDev();1333 checkDepsAreArrayDev(deps);1334 return mountEffect(create, deps);1335 },1336 useImperativeHandle<T>(1337 ref: {|current: T | null|} | ((inst: T | null) => mixed) | null | void,1338 create: () => T,1339 deps: Array<mixed> | void | null,1340 ): void {1341 currentHookNameInDev = 'useImperativeHandle';1342 mountHookTypesDev();1343 checkDepsAreArrayDev(deps);1344 return mountImperativeHandle(ref, create, deps);1345 },1346 useLayoutEffect(1347 create: () => (() => void) | void,1348 deps: Array<mixed> | void | null,1349 ): void {1350 currentHookNameInDev = 'useLayoutEffect';1351 mountHookTypesDev();1352 checkDepsAreArrayDev(deps);1353 return mountLayoutEffect(create, deps);1354 },1355 useMemo<T>(create: () => T, deps: Array<mixed> | void | null): T {1356 currentHookNameInDev = 'useMemo';1357 mountHookTypesDev();1358 checkDepsAreArrayDev(deps);1359 const prevDispatcher = ReactCurrentDispatcher.current;1360 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1361 try {1362 return mountMemo(create, deps);1363 } finally {1364 ReactCurrentDispatcher.current = prevDispatcher;1365 }1366 },1367 useReducer<S, I, A>(1368 reducer: (S, A) => S,1369 initialArg: I,1370 init?: I => S,1371 ): [S, Dispatch<A>] {1372 currentHookNameInDev = 'useReducer';1373 mountHookTypesDev();1374 const prevDispatcher = ReactCurrentDispatcher.current;1375 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1376 try {1377 return mountReducer(reducer, initialArg, init);1378 } finally {1379 ReactCurrentDispatcher.current = prevDispatcher;1380 }1381 },1382 useRef<T>(initialValue: T): {|current: T|} {1383 currentHookNameInDev = 'useRef';1384 mountHookTypesDev();1385 return mountRef(initialValue);1386 },1387 useState<S>(1388 initialState: (() => S) | S,1389 ): [S, Dispatch<BasicStateAction<S>>] {1390 currentHookNameInDev = 'useState';1391 mountHookTypesDev();1392 const prevDispatcher = ReactCurrentDispatcher.current;1393 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1394 try {1395 return mountState(initialState);1396 } finally {1397 ReactCurrentDispatcher.current = prevDispatcher;1398 }1399 },1400 useDebugValue<T>(value: T, formatterFn: ?(value: T) => mixed): void {1401 currentHookNameInDev = 'useDebugValue';1402 mountHookTypesDev();1403 return mountDebugValue(value, formatterFn);1404 },1405 useResponder<E, C>(1406 responder: ReactEventResponder<E, C>,1407 props,1408 ): ReactEventResponderListener<E, C> {1409 currentHookNameInDev = 'useResponder';1410 mountHookTypesDev();1411 return createDeprecatedResponderListener(responder, props);1412 },1413 useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {1414 currentHookNameInDev = 'useDeferredValue';1415 mountHookTypesDev();1416 return mountDeferredValue(value, config);1417 },1418 useTransition(1419 config: SuspenseConfig | void | null,1420 ): [(() => void) => void, boolean] {1421 currentHookNameInDev = 'useTransition';1422 mountHookTypesDev();1423 return mountTransition(config);1424 },1425 };1426 HooksDispatcherOnMountWithHookTypesInDEV = {1427 readContext<T>(1428 context: ReactContext<T>,1429 observedBits: void | number | boolean,1430 ): T {1431 return readContext(context, observedBits);1432 },1433 useCallback<T>(callback: T, deps: Array<mixed> | void | null): T {1434 currentHookNameInDev = 'useCallback';1435 updateHookTypesDev();1436 return mountCallback(callback, deps);1437 },1438 useContext<T>(1439 context: ReactContext<T>,1440 observedBits: void | number | boolean,1441 ): T {1442 currentHookNameInDev = 'useContext';1443 updateHookTypesDev();1444 return readContext(context, observedBits);1445 },1446 useEffect(1447 create: () => (() => void) | void,1448 deps: Array<mixed> | void | null,1449 ): void {1450 currentHookNameInDev = 'useEffect';1451 updateHookTypesDev();1452 return mountEffect(create, deps);1453 },1454 useImperativeHandle<T>(1455 ref: {|current: T | null|} | ((inst: T | null) => mixed) | null | void,1456 create: () => T,1457 deps: Array<mixed> | void | null,1458 ): void {1459 currentHookNameInDev = 'useImperativeHandle';1460 updateHookTypesDev();1461 return mountImperativeHandle(ref, create, deps);1462 },1463 useLayoutEffect(1464 create: () => (() => void) | void,1465 deps: Array<mixed> | void | null,1466 ): void {1467 currentHookNameInDev = 'useLayoutEffect';1468 updateHookTypesDev();1469 return mountLayoutEffect(create, deps);1470 },1471 useMemo<T>(create: () => T, deps: Array<mixed> | void | null): T {1472 currentHookNameInDev = 'useMemo';1473 updateHookTypesDev();1474 const prevDispatcher = ReactCurrentDispatcher.current;1475 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1476 try {1477 return mountMemo(create, deps);1478 } finally {1479 ReactCurrentDispatcher.current = prevDispatcher;1480 }1481 },1482 useReducer<S, I, A>(1483 reducer: (S, A) => S,1484 initialArg: I,1485 init?: I => S,1486 ): [S, Dispatch<A>] {1487 currentHookNameInDev = 'useReducer';1488 updateHookTypesDev();1489 const prevDispatcher = ReactCurrentDispatcher.current;1490 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1491 try {1492 return mountReducer(reducer, initialArg, init);1493 } finally {1494 ReactCurrentDispatcher.current = prevDispatcher;1495 }1496 },1497 useRef<T>(initialValue: T): {|current: T|} {1498 currentHookNameInDev = 'useRef';1499 updateHookTypesDev();1500 return mountRef(initialValue);1501 },1502 useState<S>(1503 initialState: (() => S) | S,1504 ): [S, Dispatch<BasicStateAction<S>>] {1505 currentHookNameInDev = 'useState';1506 updateHookTypesDev();1507 const prevDispatcher = ReactCurrentDispatcher.current;1508 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1509 try {1510 return mountState(initialState);1511 } finally {1512 ReactCurrentDispatcher.current = prevDispatcher;1513 }1514 },1515 useDebugValue<T>(value: T, formatterFn: ?(value: T) => mixed): void {1516 currentHookNameInDev = 'useDebugValue';1517 updateHookTypesDev();1518 return mountDebugValue(value, formatterFn);1519 },1520 useResponder<E, C>(1521 responder: ReactEventResponder<E, C>,1522 props,1523 ): ReactEventResponderListener<E, C> {1524 currentHookNameInDev = 'useResponder';1525 updateHookTypesDev();1526 return createDeprecatedResponderListener(responder, props);1527 },1528 useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {1529 currentHookNameInDev = 'useDeferredValue';1530 updateHookTypesDev();1531 return mountDeferredValue(value, config);1532 },1533 useTransition(1534 config: SuspenseConfig | void | null,1535 ): [(() => void) => void, boolean] {1536 currentHookNameInDev = 'useTransition';1537 updateHookTypesDev();1538 return mountTransition(config);1539 },1540 };1541 HooksDispatcherOnUpdateInDEV = {1542 readContext<T>(1543 context: ReactContext<T>,1544 observedBits: void | number | boolean,1545 ): T {1546 return readContext(context, observedBits);1547 },1548 useCallback<T>(callback: T, deps: Array<mixed> | void | null): T {1549 currentHookNameInDev = 'useCallback';1550 updateHookTypesDev();1551 return updateCallback(callback, deps);1552 },1553 useContext<T>(1554 context: ReactContext<T>,1555 observedBits: void | number | boolean,1556 ): T {1557 currentHookNameInDev = 'useContext';1558 updateHookTypesDev();1559 return readContext(context, observedBits);1560 },1561 useEffect(1562 create: () => (() => void) | void,1563 deps: Array<mixed> | void | null,1564 ): void {1565 currentHookNameInDev = 'useEffect';1566 updateHookTypesDev();1567 return updateEffect(create, deps);1568 },1569 useImperativeHandle<T>(1570 ref: {|current: T | null|} | ((inst: T | null) => mixed) | null | void,1571 create: () => T,1572 deps: Array<mixed> | void | null,1573 ): void {1574 currentHookNameInDev = 'useImperativeHandle';1575 updateHookTypesDev();1576 return updateImperativeHandle(ref, create, deps);1577 },1578 useLayoutEffect(1579 create: () => (() => void) | void,1580 deps: Array<mixed> | void | null,1581 ): void {1582 currentHookNameInDev = 'useLayoutEffect';1583 updateHookTypesDev();1584 return updateLayoutEffect(create, deps);1585 },1586 useMemo<T>(create: () => T, deps: Array<mixed> | void | null): T {1587 currentHookNameInDev = 'useMemo';1588 updateHookTypesDev();1589 const prevDispatcher = ReactCurrentDispatcher.current;1590 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1591 try {1592 return updateMemo(create, deps);1593 } finally {1594 ReactCurrentDispatcher.current = prevDispatcher;1595 }1596 },1597 useReducer<S, I, A>(1598 reducer: (S, A) => S,1599 initialArg: I,1600 init?: I => S,1601 ): [S, Dispatch<A>] {1602 currentHookNameInDev = 'useReducer';1603 updateHookTypesDev();1604 const prevDispatcher = ReactCurrentDispatcher.current;1605 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1606 try {1607 return updateReducer(reducer, initialArg, init);1608 } finally {1609 ReactCurrentDispatcher.current = prevDispatcher;1610 }1611 },1612 useRef<T>(initialValue: T): {|current: T|} {1613 currentHookNameInDev = 'useRef';1614 updateHookTypesDev();1615 return updateRef(initialValue);1616 },1617 useState<S>(1618 initialState: (() => S) | S,1619 ): [S, Dispatch<BasicStateAction<S>>] {1620 currentHookNameInDev = 'useState';1621 updateHookTypesDev();1622 const prevDispatcher = ReactCurrentDispatcher.current;1623 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1624 try {1625 return updateState(initialState);1626 } finally {1627 ReactCurrentDispatcher.current = prevDispatcher;1628 }1629 },1630 useDebugValue<T>(value: T, formatterFn: ?(value: T) => mixed): void {1631 currentHookNameInDev = 'useDebugValue';1632 updateHookTypesDev();1633 return updateDebugValue(value, formatterFn);1634 },1635 useResponder<E, C>(1636 responder: ReactEventResponder<E, C>,1637 props,1638 ): ReactEventResponderListener<E, C> {1639 currentHookNameInDev = 'useResponder';1640 updateHookTypesDev();1641 return createDeprecatedResponderListener(responder, props);1642 },1643 useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {1644 currentHookNameInDev = 'useDeferredValue';1645 updateHookTypesDev();1646 return updateDeferredValue(value, config);1647 },1648 useTransition(1649 config: SuspenseConfig | void | null,1650 ): [(() => void) => void, boolean] {1651 currentHookNameInDev = 'useTransition';1652 updateHookTypesDev();1653 return updateTransition(config);1654 },1655 };1656 HooksDispatcherOnRerenderInDEV = {1657 readContext<T>(1658 context: ReactContext<T>,1659 observedBits: void | number | boolean,1660 ): T {1661 return readContext(context, observedBits);1662 },1663 useCallback<T>(callback: T, deps: Array<mixed> | void | null): T {1664 currentHookNameInDev = 'useCallback';1665 updateHookTypesDev();1666 return updateCallback(callback, deps);1667 },1668 useContext<T>(1669 context: ReactContext<T>,1670 observedBits: void | number | boolean,1671 ): T {1672 currentHookNameInDev = 'useContext';1673 updateHookTypesDev();1674 return readContext(context, observedBits);1675 },1676 useEffect(1677 create: () => (() => void) | void,1678 deps: Array<mixed> | void | null,1679 ): void {1680 currentHookNameInDev = 'useEffect';1681 updateHookTypesDev();1682 return updateEffect(create, deps);1683 },1684 useImperativeHandle<T>(1685 ref: {|current: T | null|} | ((inst: T | null) => mixed) | null | void,1686 create: () => T,1687 deps: Array<mixed> | void | null,1688 ): void {1689 currentHookNameInDev = 'useImperativeHandle';1690 updateHookTypesDev();1691 return updateImperativeHandle(ref, create, deps);1692 },1693 useLayoutEffect(1694 create: () => (() => void) | void,1695 deps: Array<mixed> | void | null,1696 ): void {1697 currentHookNameInDev = 'useLayoutEffect';1698 updateHookTypesDev();1699 return updateLayoutEffect(create, deps);1700 },1701 useMemo<T>(create: () => T, deps: Array<mixed> | void | null): T {1702 currentHookNameInDev = 'useMemo';1703 updateHookTypesDev();1704 const prevDispatcher = ReactCurrentDispatcher.current;1705 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnRerenderInDEV;1706 try {1707 return updateMemo(create, deps);1708 } finally {1709 ReactCurrentDispatcher.current = prevDispatcher;1710 }1711 },1712 useReducer<S, I, A>(1713 reducer: (S, A) => S,1714 initialArg: I,1715 init?: I => S,1716 ): [S, Dispatch<A>] {1717 currentHookNameInDev = 'useReducer';1718 updateHookTypesDev();1719 const prevDispatcher = ReactCurrentDispatcher.current;1720 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnRerenderInDEV;1721 try {1722 return rerenderReducer(reducer, initialArg, init);1723 } finally {1724 ReactCurrentDispatcher.current = prevDispatcher;1725 }1726 },1727 useRef<T>(initialValue: T): {|current: T|} {1728 currentHookNameInDev = 'useRef';1729 updateHookTypesDev();1730 return updateRef(initialValue);1731 },1732 useState<S>(1733 initialState: (() => S) | S,1734 ): [S, Dispatch<BasicStateAction<S>>] {1735 currentHookNameInDev = 'useState';1736 updateHookTypesDev();1737 const prevDispatcher = ReactCurrentDispatcher.current;1738 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnRerenderInDEV;1739 try {1740 return rerenderState(initialState);1741 } finally {1742 ReactCurrentDispatcher.current = prevDispatcher;1743 }1744 },1745 useDebugValue<T>(value: T, formatterFn: ?(value: T) => mixed): void {1746 currentHookNameInDev = 'useDebugValue';1747 updateHookTypesDev();1748 return updateDebugValue(value, formatterFn);1749 },1750 useResponder<E, C>(1751 responder: ReactEventResponder<E, C>,1752 props,1753 ): ReactEventResponderListener<E, C> {1754 currentHookNameInDev = 'useResponder';1755 updateHookTypesDev();1756 return createDeprecatedResponderListener(responder, props);1757 },1758 useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {1759 currentHookNameInDev = 'useDeferredValue';1760 updateHookTypesDev();1761 return rerenderDeferredValue(value, config);1762 },1763 useTransition(1764 config: SuspenseConfig | void | null,1765 ): [(() => void) => void, boolean] {1766 currentHookNameInDev = 'useTransition';1767 updateHookTypesDev();1768 return rerenderTransition(config);1769 },1770 };1771 InvalidNestedHooksDispatcherOnMountInDEV = {1772 readContext<T>(1773 context: ReactContext<T>,1774 observedBits: void | number | boolean,1775 ): T {1776 warnInvalidContextAccess();1777 return readContext(context, observedBits);1778 },1779 useCallback<T>(callback: T, deps: Array<mixed> | void | null): T {1780 currentHookNameInDev = 'useCallback';1781 warnInvalidHookAccess();1782 mountHookTypesDev();1783 return mountCallback(callback, deps);1784 },1785 useContext<T>(1786 context: ReactContext<T>,1787 observedBits: void | number | boolean,1788 ): T {1789 currentHookNameInDev = 'useContext';1790 warnInvalidHookAccess();1791 mountHookTypesDev();1792 return readContext(context, observedBits);1793 },1794 useEffect(1795 create: () => (() => void) | void,1796 deps: Array<mixed> | void | null,1797 ): void {1798 currentHookNameInDev = 'useEffect';1799 warnInvalidHookAccess();1800 mountHookTypesDev();1801 return mountEffect(create, deps);1802 },1803 useImperativeHandle<T>(1804 ref: {|current: T | null|} | ((inst: T | null) => mixed) | null | void,1805 create: () => T,1806 deps: Array<mixed> | void | null,1807 ): void {1808 currentHookNameInDev = 'useImperativeHandle';1809 warnInvalidHookAccess();1810 mountHookTypesDev();1811 return mountImperativeHandle(ref, create, deps);1812 },1813 useLayoutEffect(1814 create: () => (() => void) | void,1815 deps: Array<mixed> | void | null,1816 ): void {1817 currentHookNameInDev = 'useLayoutEffect';1818 warnInvalidHookAccess();1819 mountHookTypesDev();1820 return mountLayoutEffect(create, deps);1821 },1822 useMemo<T>(create: () => T, deps: Array<mixed> | void | null): T {1823 currentHookNameInDev = 'useMemo';1824 warnInvalidHookAccess();1825 mountHookTypesDev();1826 const prevDispatcher = ReactCurrentDispatcher.current;1827 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1828 try {1829 return mountMemo(create, deps);1830 } finally {1831 ReactCurrentDispatcher.current = prevDispatcher;1832 }1833 },1834 useReducer<S, I, A>(1835 reducer: (S, A) => S,1836 initialArg: I,1837 init?: I => S,1838 ): [S, Dispatch<A>] {1839 currentHookNameInDev = 'useReducer';1840 warnInvalidHookAccess();1841 mountHookTypesDev();1842 const prevDispatcher = ReactCurrentDispatcher.current;1843 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1844 try {1845 return mountReducer(reducer, initialArg, init);1846 } finally {1847 ReactCurrentDispatcher.current = prevDispatcher;1848 }1849 },1850 useRef<T>(initialValue: T): {|current: T|} {1851 currentHookNameInDev = 'useRef';1852 warnInvalidHookAccess();1853 mountHookTypesDev();1854 return mountRef(initialValue);1855 },1856 useState<S>(1857 initialState: (() => S) | S,1858 ): [S, Dispatch<BasicStateAction<S>>] {1859 currentHookNameInDev = 'useState';1860 warnInvalidHookAccess();1861 mountHookTypesDev();1862 const prevDispatcher = ReactCurrentDispatcher.current;1863 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnMountInDEV;1864 try {1865 return mountState(initialState);1866 } finally {1867 ReactCurrentDispatcher.current = prevDispatcher;1868 }1869 },1870 useDebugValue<T>(value: T, formatterFn: ?(value: T) => mixed): void {1871 currentHookNameInDev = 'useDebugValue';1872 warnInvalidHookAccess();1873 mountHookTypesDev();1874 return mountDebugValue(value, formatterFn);1875 },1876 useResponder<E, C>(1877 responder: ReactEventResponder<E, C>,1878 props,1879 ): ReactEventResponderListener<E, C> {1880 currentHookNameInDev = 'useResponder';1881 warnInvalidHookAccess();1882 mountHookTypesDev();1883 return createDeprecatedResponderListener(responder, props);1884 },1885 useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {1886 currentHookNameInDev = 'useDeferredValue';1887 warnInvalidHookAccess();1888 mountHookTypesDev();1889 return mountDeferredValue(value, config);1890 },1891 useTransition(1892 config: SuspenseConfig | void | null,1893 ): [(() => void) => void, boolean] {1894 currentHookNameInDev = 'useTransition';1895 warnInvalidHookAccess();1896 mountHookTypesDev();1897 return mountTransition(config);1898 },1899 };1900 InvalidNestedHooksDispatcherOnUpdateInDEV = {1901 readContext<T>(1902 context: ReactContext<T>,1903 observedBits: void | number | boolean,1904 ): T {1905 warnInvalidContextAccess();1906 return readContext(context, observedBits);1907 },1908 useCallback<T>(callback: T, deps: Array<mixed> | void | null): T {1909 currentHookNameInDev = 'useCallback';1910 warnInvalidHookAccess();1911 updateHookTypesDev();1912 return updateCallback(callback, deps);1913 },1914 useContext<T>(1915 context: ReactContext<T>,1916 observedBits: void | number | boolean,1917 ): T {1918 currentHookNameInDev = 'useContext';1919 warnInvalidHookAccess();1920 updateHookTypesDev();1921 return readContext(context, observedBits);1922 },1923 useEffect(1924 create: () => (() => void) | void,1925 deps: Array<mixed> | void | null,1926 ): void {1927 currentHookNameInDev = 'useEffect';1928 warnInvalidHookAccess();1929 updateHookTypesDev();1930 return updateEffect(create, deps);1931 },1932 useImperativeHandle<T>(1933 ref: {|current: T | null|} | ((inst: T | null) => mixed) | null | void,1934 create: () => T,1935 deps: Array<mixed> | void | null,1936 ): void {1937 currentHookNameInDev = 'useImperativeHandle';1938 warnInvalidHookAccess();1939 updateHookTypesDev();1940 return updateImperativeHandle(ref, create, deps);1941 },1942 useLayoutEffect(1943 create: () => (() => void) | void,1944 deps: Array<mixed> | void | null,1945 ): void {1946 currentHookNameInDev = 'useLayoutEffect';1947 warnInvalidHookAccess();1948 updateHookTypesDev();1949 return updateLayoutEffect(create, deps);1950 },1951 useMemo<T>(create: () => T, deps: Array<mixed> | void | null): T {1952 currentHookNameInDev = 'useMemo';1953 warnInvalidHookAccess();1954 updateHookTypesDev();1955 const prevDispatcher = ReactCurrentDispatcher.current;1956 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1957 try {1958 return updateMemo(create, deps);1959 } finally {1960 ReactCurrentDispatcher.current = prevDispatcher;1961 }1962 },1963 useReducer<S, I, A>(1964 reducer: (S, A) => S,1965 initialArg: I,1966 init?: I => S,1967 ): [S, Dispatch<A>] {1968 currentHookNameInDev = 'useReducer';1969 warnInvalidHookAccess();1970 updateHookTypesDev();1971 const prevDispatcher = ReactCurrentDispatcher.current;1972 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1973 try {1974 return updateReducer(reducer, initialArg, init);1975 } finally {1976 ReactCurrentDispatcher.current = prevDispatcher;1977 }1978 },1979 useRef<T>(initialValue: T): {|current: T|} {1980 currentHookNameInDev = 'useRef';1981 warnInvalidHookAccess();1982 updateHookTypesDev();1983 return updateRef(initialValue);1984 },1985 useState<S>(1986 initialState: (() => S) | S,1987 ): [S, Dispatch<BasicStateAction<S>>] {1988 currentHookNameInDev = 'useState';1989 warnInvalidHookAccess();1990 updateHookTypesDev();1991 const prevDispatcher = ReactCurrentDispatcher.current;1992 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;1993 try {1994 return updateState(initialState);1995 } finally {1996 ReactCurrentDispatcher.current = prevDispatcher;1997 }1998 },1999 useDebugValue<T>(value: T, formatterFn: ?(value: T) => mixed): void {2000 currentHookNameInDev = 'useDebugValue';2001 warnInvalidHookAccess();2002 updateHookTypesDev();2003 return updateDebugValue(value, formatterFn);2004 },2005 useResponder<E, C>(2006 responder: ReactEventResponder<E, C>,2007 props,2008 ): ReactEventResponderListener<E, C> {2009 currentHookNameInDev = 'useResponder';2010 warnInvalidHookAccess();2011 updateHookTypesDev();2012 return createDeprecatedResponderListener(responder, props);2013 },2014 useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {2015 currentHookNameInDev = 'useDeferredValue';2016 warnInvalidHookAccess();2017 updateHookTypesDev();2018 return updateDeferredValue(value, config);2019 },2020 useTransition(2021 config: SuspenseConfig | void | null,2022 ): [(() => void) => void, boolean] {2023 currentHookNameInDev = 'useTransition';2024 warnInvalidHookAccess();2025 updateHookTypesDev();2026 return updateTransition(config);2027 },2028 };2029 InvalidNestedHooksDispatcherOnRerenderInDEV = {2030 readContext<T>(2031 context: ReactContext<T>,2032 observedBits: void | number | boolean,2033 ): T {2034 warnInvalidContextAccess();2035 return readContext(context, observedBits);2036 },2037 useCallback<T>(callback: T, deps: Array<mixed> | void | null): T {2038 currentHookNameInDev = 'useCallback';2039 warnInvalidHookAccess();2040 updateHookTypesDev();2041 return updateCallback(callback, deps);2042 },2043 useContext<T>(2044 context: ReactContext<T>,2045 observedBits: void | number | boolean,2046 ): T {2047 currentHookNameInDev = 'useContext';2048 warnInvalidHookAccess();2049 updateHookTypesDev();2050 return readContext(context, observedBits);2051 },2052 useEffect(2053 create: () => (() => void) | void,2054 deps: Array<mixed> | void | null,2055 ): void {2056 currentHookNameInDev = 'useEffect';2057 warnInvalidHookAccess();2058 updateHookTypesDev();2059 return updateEffect(create, deps);2060 },2061 useImperativeHandle<T>(2062 ref: {|current: T | null|} | ((inst: T | null) => mixed) | null | void,2063 create: () => T,2064 deps: Array<mixed> | void | null,2065 ): void {2066 currentHookNameInDev = 'useImperativeHandle';2067 warnInvalidHookAccess();2068 updateHookTypesDev();2069 return updateImperativeHandle(ref, create, deps);2070 },2071 useLayoutEffect(2072 create: () => (() => void) | void,2073 deps: Array<mixed> | void | null,2074 ): void {2075 currentHookNameInDev = 'useLayoutEffect';2076 warnInvalidHookAccess();2077 updateHookTypesDev();2078 return updateLayoutEffect(create, deps);2079 },2080 useMemo<T>(create: () => T, deps: Array<mixed> | void | null): T {2081 currentHookNameInDev = 'useMemo';2082 warnInvalidHookAccess();2083 updateHookTypesDev();2084 const prevDispatcher = ReactCurrentDispatcher.current;2085 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2086 try {2087 return updateMemo(create, deps);2088 } finally {2089 ReactCurrentDispatcher.current = prevDispatcher;2090 }2091 },2092 useReducer<S, I, A>(2093 reducer: (S, A) => S,2094 initialArg: I,2095 init?: I => S,2096 ): [S, Dispatch<A>] {2097 currentHookNameInDev = 'useReducer';2098 warnInvalidHookAccess();2099 updateHookTypesDev();2100 const prevDispatcher = ReactCurrentDispatcher.current;2101 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2102 try {2103 return rerenderReducer(reducer, initialArg, init);2104 } finally {2105 ReactCurrentDispatcher.current = prevDispatcher;2106 }2107 },2108 useRef<T>(initialValue: T): {|current: T|} {2109 currentHookNameInDev = 'useRef';2110 warnInvalidHookAccess();2111 updateHookTypesDev();2112 return updateRef(initialValue);2113 },2114 useState<S>(2115 initialState: (() => S) | S,2116 ): [S, Dispatch<BasicStateAction<S>>] {2117 currentHookNameInDev = 'useState';2118 warnInvalidHookAccess();2119 updateHookTypesDev();2120 const prevDispatcher = ReactCurrentDispatcher.current;2121 ReactCurrentDispatcher.current = InvalidNestedHooksDispatcherOnUpdateInDEV;2122 try {2123 return rerenderState(initialState);2124 } finally {2125 ReactCurrentDispatcher.current = prevDispatcher;2126 }2127 },2128 useDebugValue<T>(value: T, formatterFn: ?(value: T) => mixed): void {2129 currentHookNameInDev = 'useDebugValue';2130 warnInvalidHookAccess();2131 updateHookTypesDev();2132 return updateDebugValue(value, formatterFn);2133 },2134 useResponder<E, C>(2135 responder: ReactEventResponder<E, C>,2136 props,2137 ): ReactEventResponderListener<E, C> {2138 currentHookNameInDev = 'useResponder';2139 warnInvalidHookAccess();2140 updateHookTypesDev();2141 return createDeprecatedResponderListener(responder, props);2142 },2143 useDeferredValue<T>(value: T, config: TimeoutConfig | void | null): T {2144 currentHookNameInDev = 'useDeferredValue';2145 warnInvalidHookAccess();2146 updateHookTypesDev();2147 return rerenderDeferredValue(value, config);2148 },2149 useTransition(2150 config: SuspenseConfig | void | null,2151 ): [(() => void) => void, boolean] {2152 currentHookNameInDev = 'useTransition';2153 warnInvalidHookAccess();2154 updateHookTypesDev();2155 return rerenderTransition(config);2156 },2157 };...
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch();4 const context = await browser.newContext();5 const page = await context.newPage();6 await page.rerenderTransition();7 await browser.close();8})();
Using AI Code Generation
1const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement');2const { chromium } = require('playwright');3(async () => {4 const browser = await chromium.launch();5 const page = await browser.newPage();6 await rerenderTransition(page);7 await browser.close();8})();9const { test, expect } = require('@playwright/test');10test('my test', async ({ page }) => {11 await page.goto('
Using AI Code Generation
1const { rerenderTransition } = require('@playwright/test/lib/server/frames');2const { test } = require('@playwright/test');3test('My test', async ({ page }) => {4 await rerenderTransition(page.mainFrame());5});6### `rerenderTransition(frame)`
Using AI Code Generation
1const { _electron } = require('playwright');2const { rerenderTransition } = _electron;3rerenderTransition();4const { _chromium } = require('playwright');5const { rerenderTransition } = _chromium;6rerenderTransition();7const { _webkit } = require('playwright');8const { rerenderTransition } = _webkit;9rerenderTransition();10### `rerenderTransition(options)`11const { _electron } = require('playwright');12const { rerenderTransition } = _electron;13(async () => {14 const browser = await electron.launch();15 const context = await browser.newContext();16 const page = await context.newPage();17 await rerenderTransition();18 await browser.close();19})();20const { _electron } = require('playwright');21const { rerenderTransition } = _electron;22(async () => {23 const browser = await electron.launch();24 const context = await browser.newContext();25 const page = await context.newPage();26 await rerenderTransition({ duration: 5000 });27 await browser.close();28})();29const { _electron } = require('playwright');30const { rerenderTransition }
Using AI Code Generation
1const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement');2async function test() {3 await rerenderTransition(page);4}5test();6const { Page } = require('playwright/lib/server/page');7Page.prototype.rerenderTransition = async function() {8 await this._frameManager.mainFrame()._evaluateExpression('document.body.style.transition = "none"', false);9};10module.exports = {11 use: {12 viewport: { width: 1280, height: 720 },13 },14};15{16 "scripts": {17 },18 "dependencies": {19 }20}21const { disableTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement');22async function test() {23 await disableTransition(page);24}25test();26const { Page } = require('playwright/lib/server/page');27Page.prototype.disableTransition = async function() {28 await this._frameManager.mainFrame()._evaluateExpression('document.body.style.transition = "none"', false);29};30module.exports = {31 use: {32 viewport: { width: 1280, height: 720 },33 },34};35{36 "scripts": {
Using AI Code Generation
1const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement.js');2await rerenderTransition(page, 'transitionName');3const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement.js');4await rerenderTransition(page, 'transitionName');5const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement.js');6await rerenderTransition(page, 'transitionName');7const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement.js');8await rerenderTransition(page, 'transitionName');9const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement.js');10await rerenderTransition(page, 'transitionName');11const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement.js');12await rerenderTransition(page, 'transitionName');13const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement.js');14await rerenderTransition(page, 'transitionName');15const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement.js');16await rerenderTransition(page, 'transitionName');17const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement.js');18await rerenderTransition(page, 'transitionName');19const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement.js');20await rerenderTransition(page, 'transitionName');21const { rerenderTransition } = require('playwright/lib/server/supplements/rec
Using AI Code Generation
1const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement');2await rerenderTransition(page, 'a', 'click');3const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement');4const { test } = require('@playwright/test');5test('test', async ({ page }) => {6 await rerenderTransition(page, 'a', 'click');7});8const { rerenderTransition } = require('playwright/lib/server/supplements/recorder/recorderSupplement');9const { test } = require('@playwright/test');10test('test', async ({ page }) => {11 await rerenderTransition(page, 'a', 'click');12});
LambdaTest’s Playwright tutorial will give you a broader idea about the Playwright automation framework, its unique features, and use cases with examples to exceed your understanding of Playwright testing. This tutorial will give A to Z guidance, from installing the Playwright framework to some best practices and advanced concepts.
Get 100 minutes of automation test minutes FREE!!