Add some `Fake`s for easier interaction snapshot testing
Summary: `Fake` components are simplified so snapshots are stable and reliable, and references are exported so that interactions like `onRefresh` and `onScroll` can be called manually. Currently there is just one global export for each class, but we may change this in the future if we need to manage multiple `Fake`s of the same type in one render tree. Right now these must be installed explicitly, but I might move them into `__mocks__` folders if it seems reasonable to make them defaults. Reviewed By: cpojer Differential Revision: D4318207 fbshipit-source-id: 62802353a98b09ca1c80804ef7201ea63091f94a
This commit is contained in:
parent
ab89b7195d
commit
5537055bf8
|
@ -152,7 +152,7 @@ const RefreshControl = React.createClass({
|
|||
return (
|
||||
<NativeRefreshControl
|
||||
{...this.props}
|
||||
ref={ref => this._nativeRef = ref}
|
||||
ref={ref => {this._nativeRef = ref;}}
|
||||
onRefresh={this._onRefresh}
|
||||
/>
|
||||
);
|
||||
|
|
|
@ -0,0 +1,29 @@
|
|||
/**
|
||||
* Copyright (c) 2015-present, Facebook, Inc.
|
||||
* All rights reserved.
|
||||
*
|
||||
* This source code is licensed under the BSD-style license found in the
|
||||
* LICENSE file in the root directory of this source tree. An additional grant
|
||||
* of patent rights can be found in the PATENTS file in the same directory.
|
||||
*
|
||||
* @flow
|
||||
*/
|
||||
'use strict';
|
||||
|
||||
const React = require('React');
|
||||
|
||||
const requireNativeComponent = require('requireNativeComponent');
|
||||
|
||||
const RCTRefreshControl = requireNativeComponent('RCTRefreshControl');
|
||||
|
||||
class RefreshControlMock extends React.Component {
|
||||
static latestRef: ?RefreshControlMock;
|
||||
componentDidMount() {
|
||||
RefreshControlMock.latestRef = this;
|
||||
}
|
||||
render() {
|
||||
return <RCTRefreshControl />;
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = RefreshControlMock;
|
|
@ -0,0 +1,33 @@
|
|||
/**
|
||||
* Copyright (c) 2013-present, Facebook, Inc.
|
||||
* All rights reserved.
|
||||
*
|
||||
* This source code is licensed under the BSD-style license found in the
|
||||
* LICENSE file in the root directory of this source tree. An additional grant
|
||||
* of patent rights can be found in the PATENTS file in the same directory.
|
||||
*
|
||||
* @flow
|
||||
*/
|
||||
'use strict';
|
||||
|
||||
const React = require('React');
|
||||
const View = require('View');
|
||||
|
||||
const requireNativeComponent = require('requireNativeComponent');
|
||||
|
||||
const RCTScrollView = requireNativeComponent('RCTScrollView');
|
||||
|
||||
class ScrollViewMock extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<RCTScrollView>
|
||||
{this.props.refreshControl}
|
||||
<View>
|
||||
{this.props.children}
|
||||
</View>
|
||||
</RCTScrollView>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = ScrollViewMock;
|
|
@ -0,0 +1,60 @@
|
|||
/**
|
||||
* Copyright (c) 2013-present, Facebook, Inc.
|
||||
* All rights reserved.
|
||||
*
|
||||
* This source code is licensed under the BSD-style license found in the
|
||||
* LICENSE file in the root directory of this source tree. An additional grant
|
||||
* of patent rights can be found in the PATENTS file in the same directory.
|
||||
*
|
||||
* @flow
|
||||
*/
|
||||
'use strict';
|
||||
|
||||
const ListViewDataSource = require('ListViewDataSource');
|
||||
const React = require('React');
|
||||
const ScrollView = require('ScrollView');
|
||||
const StaticRenderer = require('StaticRenderer');
|
||||
const View = require('View');
|
||||
|
||||
class ListViewMock extends React.Component {
|
||||
static latestRef: ?ListViewMock;
|
||||
static defaultProps = {
|
||||
renderScrollComponent: (props) => <ScrollView {...props} />,
|
||||
}
|
||||
componentDidMount() {
|
||||
ListViewMock.latestRef = this;
|
||||
}
|
||||
render() {
|
||||
const {dataSource, renderFooter, renderHeader} = this.props;
|
||||
const rows = [renderHeader && renderHeader()];
|
||||
const allRowIDs = dataSource.rowIdentities;
|
||||
for (let sectionIdx = 0; sectionIdx < allRowIDs.length; sectionIdx++) {
|
||||
const sectionID = dataSource.sectionIdentities[sectionIdx];
|
||||
const rowIDs = allRowIDs[sectionIdx];
|
||||
for (let rowIdx = 0; rowIdx < rowIDs.length; rowIdx++) {
|
||||
const rowID = rowIDs[rowIdx];
|
||||
rows.push(
|
||||
<StaticRenderer
|
||||
key={rowID}
|
||||
shouldUpdate={true}
|
||||
render={this.props.renderRow.bind(
|
||||
null,
|
||||
dataSource.getRowData(sectionIdx, rowIdx),
|
||||
sectionID,
|
||||
rowID
|
||||
)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
renderFooter && rows.push(renderFooter());
|
||||
return (
|
||||
<View>
|
||||
{this.props.renderScrollComponent({children: rows})}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
static DataSource = ListViewDataSource;
|
||||
}
|
||||
|
||||
module.exports = ListViewMock;
|
|
@ -33,17 +33,13 @@ jest
|
|||
.mock('TextInput', () => mockComponent('TextInput'))
|
||||
.mock('Modal', () => mockComponent('Modal'))
|
||||
.mock('View', () => mockComponent('View'))
|
||||
.mock('ScrollView', () => mockComponent('ScrollView'))
|
||||
.mock('RefreshControl', () => require.requireMock('RefreshControlMock'))
|
||||
.mock('ScrollView', () => require.requireMock('ScrollViewMock'))
|
||||
.mock(
|
||||
'ActivityIndicator',
|
||||
() => mockComponent('ActivityIndicator'),
|
||||
)
|
||||
.mock('ListView', () => {
|
||||
const RealListView = require.requireActual('ListView');
|
||||
const ListView = mockComponent('ListView');
|
||||
ListView.prototype.render = RealListView.prototype.render;
|
||||
return ListView;
|
||||
})
|
||||
.mock('ListView', () => require.requireMock('ListViewMock'))
|
||||
.mock('ListViewDataSource', () => {
|
||||
const DataSource = require.requireActual('ListViewDataSource');
|
||||
DataSource.prototype.toJSON = function() {
|
||||
|
|
Loading…
Reference in New Issue