mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
c4e40b81c0
Summary:
Since TouchableHighlight and TouchableOpacity are being exported using `forwardRef`, it's messing up jest's snapshots and some matchers.
This commit 4b935ae95f fixed this for components being mocked on [setup.js](https://github.com/facebook/react-native/blob/master/jest/setup.js). However, these Touchables aren't being mocked.
It resolves https://github.com/facebook/react-native/issues/27721
## Changelog
[General] [Added] - Add displayName to TouchableHighlight and TouchableOpacity
Pull Request resolved: https://github.com/facebook/react-native/pull/29531
Test Plan: Check the new snapshots.
Reviewed By: kacieb
Differential Revision: D27485269
Pulled By: yungsters
fbshipit-source-id: ba2082a4ae9f97ebe93ba92971d58c9195bdf26d
91 lines
2.2 KiB
JavaScript
91 lines
2.2 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
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
import * as React from 'react';
|
|
import Text from '../../../Text/Text';
|
|
import View from '../../View/View';
|
|
import TouchableHighlight from '../TouchableHighlight';
|
|
|
|
const render = require('../../../../jest/renderer');
|
|
|
|
describe('TouchableHighlight', () => {
|
|
it('renders correctly', () => {
|
|
const instance = render.create(
|
|
<TouchableHighlight style={{}}>
|
|
<Text>Touchable</Text>
|
|
</TouchableHighlight>,
|
|
);
|
|
|
|
expect(instance.toJSON()).toMatchSnapshot();
|
|
});
|
|
|
|
it('has displayName', () => {
|
|
expect(TouchableHighlight.displayName).toEqual('TouchableHighlight');
|
|
});
|
|
});
|
|
|
|
describe('TouchableHighlight with disabled state', () => {
|
|
it('should be disabled when disabled is true', () => {
|
|
expect(
|
|
render.create(
|
|
<TouchableHighlight disabled={true}>
|
|
<View />
|
|
</TouchableHighlight>,
|
|
),
|
|
).toMatchSnapshot();
|
|
});
|
|
|
|
it('should be disabled when disabled is true and accessibilityState is empty', () => {
|
|
expect(
|
|
render.create(
|
|
<TouchableHighlight disabled={true} accessibilityState={{}}>
|
|
<View />
|
|
</TouchableHighlight>,
|
|
),
|
|
).toMatchSnapshot();
|
|
});
|
|
|
|
it('should keep accessibilityState when disabled is true', () => {
|
|
expect(
|
|
render.create(
|
|
<TouchableHighlight
|
|
disabled={true}
|
|
accessibilityState={{checked: true}}>
|
|
<View />
|
|
</TouchableHighlight>,
|
|
),
|
|
).toMatchSnapshot();
|
|
});
|
|
|
|
it('should overwrite accessibilityState with value of disabled prop', () => {
|
|
expect(
|
|
render.create(
|
|
<TouchableHighlight
|
|
disabled={true}
|
|
accessibilityState={{disabled: false}}>
|
|
<View />
|
|
</TouchableHighlight>,
|
|
),
|
|
).toMatchSnapshot();
|
|
});
|
|
|
|
it('should disable button when accessibilityState is disabled', () => {
|
|
expect(
|
|
render.create(
|
|
<TouchableHighlight accessibilityState={{disabled: true}}>
|
|
<View />
|
|
</TouchableHighlight>,
|
|
),
|
|
).toMatchSnapshot();
|
|
});
|
|
});
|