* [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
78 lines
2.3 KiB
JavaScript
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));
|
|
});
|
|
});
|