mattermost-mobile/app/components/fade.test.js
Courtney Pattison ce5c30e9ca [MM-9454] Added fade to send button (#2677)
* [MM-9454] Added jest-enzyme to devDependencies

* [MM-9454] Refactored SendButton as component

* [MM-9454] Added fade to SendButton

* [MM-9454] Changed Fade to PureComponent
2019-04-29 07:54:00 -07:00

78 lines
2.3 KiB
JavaScript

// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react';
import {Animated, Text} from 'react-native';
import {shallow} from 'enzyme';
import Fade, {FADE_DURATION} from './fade';
jest.useFakeTimers();
describe('Fade', () => {
const baseProps = {
visible: true,
disabled: true,
};
function getWrapper(props = {}) {
const dummyText = 'text';
return shallow(
<Fade
{...baseProps}
{...props}
>
<Text>{dummyText}</Text>
</Fade>
);
}
function getAnimValue(begin, end) {
const animValue = new Animated.Value(begin);
animValue.setValue(end);
animValue.stopTracking();
return animValue;
}
test('should render {opacity: 1}', () => {
const wrapper = getWrapper({visible: true});
expect(wrapper.getElement()).toMatchSnapshot();
expect(wrapper).toHaveStyle('opacity', new Animated.Value(1));
});
test('should render {opacity: 0}', () => {
const wrapper = getWrapper({visible: false});
expect(wrapper.getElement()).toMatchSnapshot();
expect(wrapper).toHaveStyle('opacity', new Animated.Value(0));
});
test('should change opacity from 1 to 0', () => {
const wrapper = getWrapper({visible: true});
expect(wrapper).toHaveStyle('opacity', new Animated.Value(1));
wrapper.setProps({visible: false});
jest.advanceTimersByTime(FADE_DURATION);
expect(wrapper).toHaveStyle('opacity', getAnimValue(1, 0));
});
test('should not change opacity when disabled flag is switched', () => {
const wrapper = getWrapper({disabled: false});
expect(wrapper).toHaveStyle('opacity', new Animated.Value(1));
wrapper.setProps({disabled: true});
expect(wrapper).toHaveStyle('opacity', new Animated.Value(1));
});
test('should not change opacity when props stay the same', () => {
const wrapper = getWrapper({visible: true});
expect(wrapper).toHaveStyle('opacity', new Animated.Value(1));
wrapper.setProps({visible: true});
expect(wrapper).toHaveStyle('opacity', new Animated.Value(1));
});
});