Skip to content

Commit

Permalink
Clean up console.log tests (facebook#28693)
Browse files Browse the repository at this point in the history
Followups to facebook#28680

One of these test don't need to use `console.log`. 

The others are specifically testing `console.log` behavior, so I added a
comment.
  • Loading branch information
rickhanlonii authored and AndyPengc12 committed Apr 15, 2024
1 parent 6b4013c commit 2a5e792
Show file tree
Hide file tree
Showing 3 changed files with 20 additions and 34 deletions.
4 changes: 4 additions & 0 deletions packages/react-client/src/__tests__/ReactFlight-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -2108,6 +2108,7 @@ describe('ReactFlight', () => {
throw new Error('err');
}

// These tests are specifically testing console.log.
// Assign to `mockConsoleLog` so we can still inspect it when `console.log`
// is overridden by the test modules. The original function will be restored
// after this test finishes by `jest.restoreAllMocks()`.
Expand All @@ -2127,6 +2128,9 @@ describe('ReactFlight', () => {
transport = ReactNoopFlightServer.render({root: <ServerComponent />});
}).toErrorDev('err');

expect(mockConsoleLog).toHaveBeenCalledTimes(1);
expect(mockConsoleLog.mock.calls[0][0]).toBe('hi');
expect(mockConsoleLog.mock.calls[0][1].prop).toBe(123);
mockConsoleLog.mockClear();

// The error should not actually get logged because we're not awaiting the root
Expand Down
19 changes: 9 additions & 10 deletions packages/react-dom/src/__tests__/ReactDOMComponent-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,14 +17,18 @@ describe('ReactDOMComponent', () => {
const ReactFeatureFlags = require('shared/ReactFeatureFlags');

let act;
let assertLog;
let Scheduler;

beforeEach(() => {
jest.resetModules();
React = require('react');
ReactDOM = require('react-dom');
ReactDOMClient = require('react-dom/client');
ReactDOMServer = require('react-dom/server');
Scheduler = require('scheduler');
act = require('internal-test-utils').act;
assertLog = require('internal-test-utils').assertLog;
});

afterEach(() => {
Expand Down Expand Up @@ -1611,7 +1615,6 @@ describe('ReactDOMComponent', () => {
});

it('should work error event on <source> element', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});
const container = document.createElement('div');
const root = ReactDOMClient.createRoot(container);
await act(() => {
Expand All @@ -1620,7 +1623,7 @@ describe('ReactDOMComponent', () => {
<source
src="http://example.org/video"
type="video/mp4"
onError={e => console.log('onError called')}
onError={e => Scheduler.log('onError called')}
/>
</video>,
);
Expand All @@ -1631,8 +1634,7 @@ describe('ReactDOMComponent', () => {
container.getElementsByTagName('source')[0].dispatchEvent(errorEvent);

if (__DEV__) {
expect(console.log).toHaveBeenCalledTimes(1);
expect(console.log.mock.calls[0][0]).toContain('onError called');
assertLog(['onError called']);
}
});

Expand Down Expand Up @@ -1921,16 +1923,15 @@ describe('ReactDOMComponent', () => {
});

it('should work load and error events on <image> element in SVG', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});
const container = document.createElement('div');
const root = ReactDOMClient.createRoot(container);
await act(() => {
root.render(
<svg>
<image
xlinkHref="http://example.org/image"
onError={e => console.log('onError called')}
onLoad={e => console.log('onLoad called')}
onError={e => Scheduler.log('onError called')}
onLoad={e => Scheduler.log('onLoad called')}
/>
</svg>,
);
Expand All @@ -1946,9 +1947,7 @@ describe('ReactDOMComponent', () => {
container.getElementsByTagName('image')[0].dispatchEvent(loadEvent);

if (__DEV__) {
expect(console.log).toHaveBeenCalledTimes(2);
expect(console.log.mock.calls[0][0]).toContain('onError called');
expect(console.log.mock.calls[1][0]).toContain('onLoad called');
assertLog(['onError called', 'onLoad called']);
}
});

Expand Down
31 changes: 7 additions & 24 deletions packages/react/src/__tests__/ReactStrictMode-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -1146,12 +1146,17 @@ describe('context legacy', () => {
React = require('react');
ReactDOMClient = require('react-dom/client');
act = require('internal-test-utils').act;

// These tests are specifically testing console.log.
spyOnDevAndProd(console, 'log').mockImplementation(() => {});
});

afterEach(() => {
console.log.mockRestore();
});

if (ReactFeatureFlags.consoleManagedByDevToolsDuringStrictMode) {
it('does not disable logs for class double render', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let count = 0;
class Foo extends React.Component {
render() {
Expand Down Expand Up @@ -1179,8 +1184,6 @@ describe('context legacy', () => {
});

it('does not disable logs for class double ctor', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let count = 0;
class Foo extends React.Component {
constructor(props) {
Expand Down Expand Up @@ -1211,8 +1214,6 @@ describe('context legacy', () => {
});

it('does not disable logs for class double getDerivedStateFromProps', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let count = 0;
class Foo extends React.Component {
state = {};
Expand Down Expand Up @@ -1244,8 +1245,6 @@ describe('context legacy', () => {
});

it('does not disable logs for class double shouldComponentUpdate', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let count = 0;
class Foo extends React.Component {
state = {};
Expand Down Expand Up @@ -1285,8 +1284,6 @@ describe('context legacy', () => {
});

it('does not disable logs for class state updaters', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let inst;
let count = 0;
class Foo extends React.Component {
Expand Down Expand Up @@ -1323,8 +1320,6 @@ describe('context legacy', () => {
});

it('does not disable logs for function double render', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let count = 0;
function Foo() {
count++;
Expand All @@ -1350,8 +1345,6 @@ describe('context legacy', () => {
});
} else {
it('disable logs for class double render', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let count = 0;
class Foo extends React.Component {
render() {
Expand Down Expand Up @@ -1379,8 +1372,6 @@ describe('context legacy', () => {
});

it('disables logs for class double ctor', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let count = 0;
class Foo extends React.Component {
constructor(props) {
Expand Down Expand Up @@ -1411,8 +1402,6 @@ describe('context legacy', () => {
});

it('disable logs for class double getDerivedStateFromProps', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let count = 0;
class Foo extends React.Component {
state = {};
Expand Down Expand Up @@ -1444,8 +1433,6 @@ describe('context legacy', () => {
});

it('disable logs for class double shouldComponentUpdate', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let count = 0;
class Foo extends React.Component {
state = {};
Expand Down Expand Up @@ -1484,8 +1471,6 @@ describe('context legacy', () => {
});

it('disable logs for class state updaters', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let inst;
let count = 0;
class Foo extends React.Component {
Expand Down Expand Up @@ -1522,8 +1507,6 @@ describe('context legacy', () => {
});

it('disable logs for function double render', async () => {
spyOnDevAndProd(console, 'log').mockImplementation(() => {});

let count = 0;
function Foo() {
count++;
Expand Down

0 comments on commit 2a5e792

Please sign in to comment.