4c8594d330
* Add linter rules for import order and type member delimiters * Remove unneeded group * Group all app/* imports before the internal imports * Move app/ imports before parent imports * Separate @node_modules imports into a different group * Substitute app paths by aliases * Fix @node_modules import order and add test related modules * Add aliases for types and test, and group import types
101 lines
3.5 KiB
JavaScript
101 lines
3.5 KiB
JavaScript
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
|
// See LICENSE.txt for license information.
|
|
|
|
import {shallow} from 'enzyme';
|
|
import React from 'react';
|
|
|
|
import Preferences from '@mm-redux/constants/preferences';
|
|
|
|
import ProgressiveImage from './progressive_image';
|
|
|
|
jest.useFakeTimers();
|
|
|
|
describe('ProgressiveImage', () => {
|
|
test('should match snapshot for Image', () => {
|
|
const baseProps = {
|
|
isBackgroundImage: false,
|
|
imageUri: 'https://images.com/image.png',
|
|
onError: jest.fn(),
|
|
resizeMethod: 'auto',
|
|
resizeMode: 'contain',
|
|
theme: Preferences.THEMES.default,
|
|
tintDefaultSource: false,
|
|
defaultSource: undefined,
|
|
};
|
|
|
|
const wrapper = shallow(<ProgressiveImage {...baseProps}/>);
|
|
expect(wrapper.getElement()).toMatchSnapshot();
|
|
});
|
|
|
|
test('should match snapshot for Default Image', () => {
|
|
const baseProps = {
|
|
isBackgroundImage: false,
|
|
defaultSource: 'https://images.com/image.png',
|
|
onError: jest.fn(),
|
|
resizeMethod: 'auto',
|
|
resizeMode: 'contain',
|
|
theme: Preferences.THEMES.default,
|
|
tintDefaultSource: false,
|
|
};
|
|
|
|
const wrapper = shallow(<ProgressiveImage {...baseProps}/>);
|
|
expect(wrapper.getElement()).toMatchSnapshot();
|
|
});
|
|
|
|
test('should match snapshot for BackgroundImage', () => {
|
|
const baseProps = {
|
|
isBackgroundImage: true,
|
|
imageUri: 'https://images.com/image.png',
|
|
onError: jest.fn(),
|
|
resizeMethod: 'auto',
|
|
resizeMode: 'contain',
|
|
theme: Preferences.THEMES.default,
|
|
tintDefaultSource: false,
|
|
defaultSource: null,
|
|
};
|
|
|
|
const wrapper = shallow(<ProgressiveImage {...baseProps}/>);
|
|
expect(wrapper.getElement()).toMatchSnapshot();
|
|
});
|
|
});
|
|
|
|
describe('MiniPreview', () => {
|
|
test('should show mini preview when supported & image not in viewport', () => {
|
|
const baseProps = {
|
|
isBackgroundImage: false,
|
|
imageUri: 'https://images.com/image.png',
|
|
onError: jest.fn(),
|
|
resizeMethod: 'auto',
|
|
resizeMode: 'contain',
|
|
theme: Preferences.THEMES.default,
|
|
tintDefaultSource: false,
|
|
defaultSource: null,
|
|
inViewPort: false,
|
|
thumbnailUri: 'somebase64data',
|
|
};
|
|
const wrapper = shallow(<ProgressiveImage {...baseProps}/>);
|
|
expect(wrapper.find({testID: 'progressive_image.miniPreview'}).length).toEqual(1);
|
|
});
|
|
|
|
test('should load and show high res image with animation when component comes into viewport', () => {
|
|
const baseProps = {
|
|
isBackgroundImage: false,
|
|
imageUri: 'https://images.com/image.png',
|
|
onError: jest.fn(),
|
|
resizeMethod: 'auto',
|
|
resizeMode: 'contain',
|
|
theme: Preferences.THEMES.default,
|
|
tintDefaultSource: false,
|
|
defaultSource: null,
|
|
inViewPort: false,
|
|
thumbnailUri: 'somebase64data',
|
|
};
|
|
const wrapper = shallow(<ProgressiveImage {...baseProps}/>);
|
|
const selectHighResImage = () => wrapper.find({testID: 'progressive_image.highResImage'});
|
|
expect(selectHighResImage().length).toEqual(0);
|
|
wrapper.setProps({
|
|
inViewPort: true,
|
|
});
|
|
expect(selectHighResImage().length).toEqual(1);
|
|
});
|
|
});
|