mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
fe82f402a9
Summary: This diff makes a few changes to how errors and warnings are handled in LogBox: - Soft errors continue to notify the user collapsed. - Fatal errors pop up full screen over the content, but are dismissible. - Syntax errors pop up full screen, and are **not** dismissible. - Removed the "Reload" button on fatals, and added back the dismiss/close. - Removed all buttons from syntax errors so users are encouraged to fix it and safe without reloading. To do this we needed to: - Move the selectedLogIndex state out of the component and up to the rest of the log state. - Change the way popping a log works, it's now done by setting selectedLogIndex at log time instead of deriving it at render time, that means `selectedLogIndex` is now the sole state value for deciding if the log inspector is open or not - Whenever the state is updated, find a syntax error if it's there, instead of doing this at render time Changelog: [Internal] Reviewed By: cpojer Differential Revision: D18421089 fbshipit-source-id: d2c4937f666f1302ed1a7b1b9c6679b0509136c5
246 lines
5.9 KiB
JavaScript
246 lines
5.9 KiB
JavaScript
/**
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @format
|
|
* @emails oncall+react_native
|
|
* @flow
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
const React = require('react');
|
|
const LogBoxContainer = require('../LogBoxContainer').default;
|
|
const LogBoxLog = require('../../Data/LogBoxLog').default;
|
|
const render = require('../../../../jest/renderer');
|
|
|
|
describe('LogBoxContainer', () => {
|
|
it('should render null with no logs', () => {
|
|
const output = render.shallowRender(
|
|
<LogBoxContainer
|
|
onDismiss={() => {}}
|
|
onDismissWarns={() => {}}
|
|
onDismissErrors={() => {}}
|
|
setSelectedLog={() => {}}
|
|
selectedLogIndex={-1}
|
|
logs={new Set()}
|
|
/>,
|
|
);
|
|
|
|
expect(output).toMatchSnapshot();
|
|
});
|
|
|
|
it('should render null with no selected log and disabled', () => {
|
|
const output = render.shallowRender(
|
|
<LogBoxContainer
|
|
isDisabled
|
|
onDismiss={() => {}}
|
|
onDismissWarns={() => {}}
|
|
onDismissErrors={() => {}}
|
|
setSelectedLog={() => {}}
|
|
selectedLogIndex={-1}
|
|
logs={
|
|
new Set([
|
|
new LogBoxLog(
|
|
'warn',
|
|
{
|
|
content: 'Some kind of message',
|
|
substitutions: [],
|
|
},
|
|
[],
|
|
'Some kind of message',
|
|
[],
|
|
),
|
|
])
|
|
}
|
|
/>,
|
|
);
|
|
|
|
expect(output).toMatchSnapshot();
|
|
});
|
|
|
|
it('should render the latest warning notification', () => {
|
|
const output = render.shallowRender(
|
|
<LogBoxContainer
|
|
onDismiss={() => {}}
|
|
onDismissWarns={() => {}}
|
|
onDismissErrors={() => {}}
|
|
setSelectedLog={() => {}}
|
|
selectedLogIndex={-1}
|
|
logs={
|
|
new Set([
|
|
new LogBoxLog(
|
|
'warn',
|
|
{
|
|
content: 'Some kind of message',
|
|
substitutions: [],
|
|
},
|
|
[],
|
|
'Some kind of message',
|
|
[],
|
|
),
|
|
new LogBoxLog(
|
|
'warn',
|
|
{
|
|
content: 'Some kind of message (latest)',
|
|
substitutions: [],
|
|
},
|
|
[],
|
|
'Some kind of message (latest)',
|
|
[],
|
|
),
|
|
])
|
|
}
|
|
/>,
|
|
);
|
|
|
|
expect(output).toMatchSnapshot();
|
|
});
|
|
|
|
it('should render the latest error notification', () => {
|
|
const output = render.shallowRender(
|
|
<LogBoxContainer
|
|
onDismiss={() => {}}
|
|
onDismissWarns={() => {}}
|
|
onDismissErrors={() => {}}
|
|
setSelectedLog={() => {}}
|
|
selectedLogIndex={-1}
|
|
logs={
|
|
new Set([
|
|
new LogBoxLog(
|
|
'error',
|
|
{
|
|
content: 'Some kind of message',
|
|
substitutions: [],
|
|
},
|
|
[],
|
|
'Some kind of message',
|
|
[],
|
|
),
|
|
new LogBoxLog(
|
|
'error',
|
|
{
|
|
content: 'Some kind of message (latest)',
|
|
substitutions: [],
|
|
},
|
|
[],
|
|
'Some kind of message (latest)',
|
|
[],
|
|
),
|
|
])
|
|
}
|
|
/>,
|
|
);
|
|
|
|
expect(output).toMatchSnapshot();
|
|
});
|
|
|
|
it('should render both an error and warning notification', () => {
|
|
const output = render.shallowRender(
|
|
<LogBoxContainer
|
|
onDismiss={() => {}}
|
|
onDismissWarns={() => {}}
|
|
onDismissErrors={() => {}}
|
|
setSelectedLog={() => {}}
|
|
selectedLogIndex={-1}
|
|
logs={
|
|
new Set([
|
|
new LogBoxLog(
|
|
'warn',
|
|
{
|
|
content: 'Some kind of message',
|
|
substitutions: [],
|
|
},
|
|
[],
|
|
'Some kind of message',
|
|
[],
|
|
),
|
|
new LogBoxLog(
|
|
'error',
|
|
{
|
|
content: 'Some kind of message (latest)',
|
|
substitutions: [],
|
|
},
|
|
[],
|
|
'Some kind of message (latest)',
|
|
[],
|
|
),
|
|
])
|
|
}
|
|
/>,
|
|
);
|
|
|
|
expect(output).toMatchSnapshot();
|
|
});
|
|
|
|
it('should render selected fatal error even when disabled', () => {
|
|
const output = render.shallowRender(
|
|
<LogBoxContainer
|
|
isDisabled
|
|
onDismiss={() => {}}
|
|
onDismissWarns={() => {}}
|
|
onDismissErrors={() => {}}
|
|
setSelectedLog={() => {}}
|
|
selectedLogIndex={0}
|
|
logs={
|
|
new Set([
|
|
new LogBoxLog(
|
|
'fatal',
|
|
{
|
|
content: 'Should be selected',
|
|
substitutions: [],
|
|
},
|
|
[],
|
|
'Some kind of message',
|
|
[],
|
|
),
|
|
])
|
|
}
|
|
/>,
|
|
);
|
|
|
|
expect(output).toMatchSnapshot();
|
|
});
|
|
|
|
it('should render selected syntax error even when disabled', () => {
|
|
const output = render.shallowRender(
|
|
<LogBoxContainer
|
|
isDisabled
|
|
onDismiss={() => {}}
|
|
onDismissWarns={() => {}}
|
|
onDismissErrors={() => {}}
|
|
setSelectedLog={() => {}}
|
|
selectedLogIndex={0}
|
|
logs={
|
|
new Set([
|
|
new LogBoxLog(
|
|
'syntax',
|
|
{
|
|
content: 'Should be selected',
|
|
substitutions: [],
|
|
},
|
|
[],
|
|
'Some kind of syntax error message',
|
|
[],
|
|
{
|
|
fileName:
|
|
'/path/to/RKJSModules/Apps/CrashReact/CrashReactApp.js',
|
|
location: {row: 199, column: 0},
|
|
content: ` 197 | });
|
|
198 |
|
|
> 199 | export default CrashReactApp;
|
|
| ^
|
|
200 |`,
|
|
},
|
|
),
|
|
])
|
|
}
|
|
/>,
|
|
);
|
|
|
|
expect(output).toMatchSnapshot();
|
|
});
|
|
});
|