How to use rerenderTransition method in Playwright Internal

Best JavaScript code snippet using playwright-internal

ReactFiberHooks.new.js

Source:ReactFiberHooks.new.js Github

copy

Full Screen

...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();...

Full Screen

Full Screen

ReactFiberHooks.old.js

Source:ReactFiberHooks.old.js Github

copy

Full Screen

...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();...

Full Screen

Full Screen

ReactFiberHooks.js

Source:ReactFiberHooks.js Github

copy

Full Screen

...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 };...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

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})();

Full Screen

Using AI Code Generation

copy

Full Screen

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('

Full Screen

Using AI Code Generation

copy

Full Screen

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)`

Full Screen

Using AI Code Generation

copy

Full Screen

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 }

Full Screen

Using AI Code Generation

copy

Full Screen

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": {

Full Screen

Using AI Code Generation

copy

Full Screen

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

Full Screen

Using AI Code Generation

copy

Full Screen

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});

Full Screen

Playwright tutorial

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.

Chapters:

  1. What is Playwright : Playwright is comparatively new but has gained good popularity. Get to know some history of the Playwright with some interesting facts connected with it.
  2. How To Install Playwright : Learn in detail about what basic configuration and dependencies are required for installing Playwright and run a test. Get a step-by-step direction for installing the Playwright automation framework.
  3. Playwright Futuristic Features: Launched in 2020, Playwright gained huge popularity quickly because of some obliging features such as Playwright Test Generator and Inspector, Playwright Reporter, Playwright auto-waiting mechanism and etc. Read up on those features to master Playwright testing.
  4. What is Component Testing: Component testing in Playwright is a unique feature that allows a tester to test a single component of a web application without integrating them with other elements. Learn how to perform Component testing on the Playwright automation framework.
  5. Inputs And Buttons In Playwright: Every website has Input boxes and buttons; learn about testing inputs and buttons with different scenarios and examples.
  6. Functions and Selectors in Playwright: Learn how to launch the Chromium browser with Playwright. Also, gain a better understanding of some important functions like “BrowserContext,” which allows you to run multiple browser sessions, and “newPage” which interacts with a page.
  7. Handling Alerts and Dropdowns in Playwright : Playwright interact with different types of alerts and pop-ups, such as simple, confirmation, and prompt, and different types of dropdowns, such as single selector and multi-selector get your hands-on with handling alerts and dropdown in Playright testing.
  8. Playwright vs Puppeteer: Get to know about the difference between two testing frameworks and how they are different than one another, which browsers they support, and what features they provide.
  9. Run Playwright Tests on LambdaTest: Playwright testing with LambdaTest leverages test performance to the utmost. You can run multiple Playwright tests in Parallel with the LammbdaTest test cloud. Get a step-by-step guide to run your Playwright test on the LambdaTest platform.
  10. Playwright Python Tutorial: Playwright automation framework support all major languages such as Python, JavaScript, TypeScript, .NET and etc. However, there are various advantages to Python end-to-end testing with Playwright because of its versatile utility. Get the hang of Playwright python testing with this chapter.
  11. Playwright End To End Testing Tutorial: Get your hands on with Playwright end-to-end testing and learn to use some exciting features such as TraceViewer, Debugging, Networking, Component testing, Visual testing, and many more.
  12. Playwright Video Tutorial: Watch the video tutorials on Playwright testing from experts and get a consecutive in-depth explanation of Playwright automation testing.

Run Playwright Internal automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful