Skip to content

Commit

Permalink
Revert "Double-render function components with Hooks in DEV in Strict…
Browse files Browse the repository at this point in the history 
…Mode" (facebook#14652)

* Revert "Revert "Disallow reading context during useMemo etc" (facebook#14651)"

This reverts commit 5fce648.

* Revert "Add test coverage for readContext() on the server (facebook#14649)"

This reverts commit fe2ecd2.

* Revert "Warn about incorrect use of useImperativeHandle() (facebook#14647)"

This reverts commit 8f45a7f.

* Revert "Disallow reading context during useMemo etc (facebook#14648)"

This reverts commit 1fcbd22.

* Revert "Warn about refs on lazy function components (facebook#14645)"

This reverts commit 2a084f5.

* Revert "Fix typo (facebook#14560)"

This reverts commit b5a3df6.

* Revert "fix typo (facebook#14316)"

This reverts commit 9c146e6.

* Revert "Mention forwardRef() in <Fn ref={...} /> errors and warnings (facebook#14644)"

This reverts commit baa6d40.

* Revert "Double-render function components with Hooks in DEV in StrictMode (facebook#14643)"

This reverts commit a1414e8.
  • Loading branch information
@gaearon @jetoneza
gaearon authored and jetoneza committed Jan 23, 2019
1 parent 4c6e38d commit 0c2b751
Show file tree
Hide file tree
Showing 2 changed files with 0 additions and 273 deletions.
53 changes: 0 additions & 53 deletions packages/react-reconciler/src/ReactFiberBeginWork.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -250,23 +250,6 @@ function updateForwardRef(
ref,
renderExpirationTime,
);
if (
debugRenderPhaseSideEffects ||
(debugRenderPhaseSideEffectsForStrictMode &&
workInProgress.mode & StrictMode)
) {
// Only double-render components with Hooks
if (workInProgress.memoizedState !== null) {
renderWithHooks(
current,
workInProgress,
render,
nextProps,
ref,
renderExpirationTime,
);
}
}
setCurrentPhase(null);
} else {
nextChildren = renderWithHooks(
Expand Down Expand Up @@ -560,23 +543,6 @@ function updateFunctionComponent(
context,
renderExpirationTime,
);
if (
debugRenderPhaseSideEffects ||
(debugRenderPhaseSideEffectsForStrictMode &&
workInProgress.mode & StrictMode)
) {
// Only double-render components with Hooks
if (workInProgress.memoizedState !== null) {
renderWithHooks(
current,
workInProgress,
Component,
nextProps,
context,
renderExpirationTime,
);
}
}
setCurrentPhase(null);
} else {
nextChildren = renderWithHooks(
Expand Down Expand Up @@ -1244,25 +1210,6 @@ function mountIndeterminateComponent(
} else {
// Proceed under the assumption that this is a function component
workInProgress.tag = FunctionComponent;
if (__DEV__) {
if (
debugRenderPhaseSideEffects ||
(debugRenderPhaseSideEffectsForStrictMode &&
workInProgress.mode & StrictMode)
) {
// Only double-render components with Hooks
if (workInProgress.memoizedState !== null) {
renderWithHooks(
null,
workInProgress,
Component,
props,
context,
renderExpirationTime,
);
}
}
}
reconcileChildren(null, workInProgress, value, renderExpirationTime);
if (__DEV__) {
validateFunctionComponentInDev(workInProgress, Component);
Expand Down
220 changes: 0 additions & 220 deletions packages/react-reconciler/src/__tests__/ReactHooks-test.internal.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -699,224 +699,4 @@ describe('ReactHooks', () => {
'Hooks can only be called inside the body of a function component',
);
});

it('double-invokes components with Hooks in Strict Mode', () => {
ReactFeatureFlags.debugRenderPhaseSideEffectsForStrictMode = true;

const {useState, StrictMode} = React;
let renderCount = 0;

function NoHooks() {
renderCount++;
return <div />;
}

function HasHooks() {
useState(0);
renderCount++;
return <div />;
}

const FwdRef = React.forwardRef((props, ref) => {
renderCount++;
return <div />;
});

const FwdRefHasHooks = React.forwardRef((props, ref) => {
useState(0);
renderCount++;
return <div />;
});

const Memo = React.memo(props => {
renderCount++;
return <div />;
});

const MemoHasHooks = React.memo(props => {
useState(0);
renderCount++;
return <div />;
});

function Factory() {
return {
state: {},
render() {
renderCount++;
return <div />;
},
};
}

let renderer = ReactTestRenderer.create(null);

renderCount = 0;
renderer.update(<NoHooks />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(<NoHooks />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(
<StrictMode>
<NoHooks />
</StrictMode>,
);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(
<StrictMode>
<NoHooks />
</StrictMode>,
);
expect(renderCount).toBe(1);

renderCount = 0;
renderer.update(<FwdRef />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(<FwdRef />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(
<StrictMode>
<FwdRef />
</StrictMode>,
);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(
<StrictMode>
<FwdRef />
</StrictMode>,
);
expect(renderCount).toBe(1);

renderCount = 0;
renderer.update(<Memo arg={1} />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(<Memo arg={2} />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(
<StrictMode>
<Memo arg={1} />
</StrictMode>,
);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(
<StrictMode>
<Memo arg={2} />
</StrictMode>,
);
expect(renderCount).toBe(1);

renderCount = 0;
renderer.update(<Factory />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(<Factory />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(
<StrictMode>
<Factory />
</StrictMode>,
);
expect(renderCount).toBe(__DEV__ ? 2 : 1); // Treated like a class
renderCount = 0;
renderer.update(
<StrictMode>
<Factory />
</StrictMode>,
);
expect(renderCount).toBe(__DEV__ ? 2 : 1); // Treated like a class

renderCount = 0;
renderer.update(<HasHooks />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(<HasHooks />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(
<StrictMode>
<HasHooks />
</StrictMode>,
);
expect(renderCount).toBe(__DEV__ ? 2 : 1); // Has Hooks
renderCount = 0;
renderer.update(
<StrictMode>
<HasHooks />
</StrictMode>,
);
expect(renderCount).toBe(__DEV__ ? 2 : 1); // Has Hooks

renderCount = 0;
renderer.update(<FwdRefHasHooks />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(<FwdRefHasHooks />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(
<StrictMode>
<FwdRefHasHooks />
</StrictMode>,
);
expect(renderCount).toBe(__DEV__ ? 2 : 1); // Has Hooks
renderCount = 0;
renderer.update(
<StrictMode>
<FwdRefHasHooks />
</StrictMode>,
);
expect(renderCount).toBe(__DEV__ ? 2 : 1); // Has Hooks

renderCount = 0;
renderer.update(<MemoHasHooks arg={1} />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(<MemoHasHooks arg={2} />);
expect(renderCount).toBe(1);
renderCount = 0;
renderer.update(
<StrictMode>
<MemoHasHooks arg={1} />
</StrictMode>,
);
expect(renderCount).toBe(__DEV__ ? 2 : 1); // Has Hooks
renderCount = 0;
renderer.update(
<StrictMode>
<MemoHasHooks arg={2} />
</StrictMode>,
);
expect(renderCount).toBe(__DEV__ ? 2 : 1); // Has Hooks
});

it('double-invokes useMemo in DEV StrictMode despite []', () => {
ReactFeatureFlags.debugRenderPhaseSideEffectsForStrictMode = true;
const {useMemo, StrictMode} = React;

let useMemoCount = 0;
function BadUseMemo() {
useMemo(() => {
useMemoCount++;
}, []);
return <div />;
}

useMemoCount = 0;
ReactTestRenderer.create(
<StrictMode>
<BadUseMemo />
</StrictMode>,
);
expect(useMemoCount).toBe(__DEV__ ? 2 : 1); // Has Hooks
});
});

0 comments on commit 0c2b751

Please sign in to comment.