// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. import {Image} from 'react-native'; import {shallow} from 'enzyme'; import React from 'react'; const originalGetSizeFn = Image.getSize; import Preferences from '@mm-redux/constants/preferences'; import AttachmentImage from './index'; describe('AttachmentImage', () => { const baseProps = { deviceHeight: 256, deviceWidth: 128, imageMetadata: {width: 32, height: 32}, imageUrl: 'https://images.com/image.png', theme: Preferences.THEMES.default, }; afterEach(() => { Image.getSize = originalGetSizeFn; }); test('it matches snapshot', () => { const wrapper = shallow(); expect(wrapper).toMatchSnapshot(); }); test('it sets state based on props', () => { const wrapper = shallow(); const state = wrapper.state(); expect(state.hasImage).toBe(true); expect(state.imageUri).toBe('https://images.com/image.png'); expect(state.originalWidth).toBe(32); }); test('it does not render image if no imageUrl is provided', () => { const props = {...baseProps, imageUrl: null, imageMetadata: null}; const wrapper = shallow(); const state = wrapper.state(); expect(state.hasImage).toBe(false); expect(state.imageUri).toBe(null); }); test('it calls Image.getSize if metadata is not present', () => { const getSizeFn = jest.fn((_, callback) => { callback(64, 64); }); Image.getSize = getSizeFn; const props = {...baseProps, imageMetadata: null}; const wrapper = shallow(); const state = wrapper.state(); expect(state.hasImage).toBe(true); expect(state.imageUri).toBe('https://images.com/image.png'); expect(state.originalWidth).toBe(64); expect(getSizeFn).toHaveBeenCalled(); }); test('it updates image when imageUrl prop changes', () => { const wrapper = shallow(); wrapper.setProps({ imageUrl: 'https://someothersite.com/picture.png', imageMetadata: { width: 96, height: 96, }, }); const state = wrapper.state(); expect(state.hasImage).toBe(true); expect(state.imageUri).toBe('https://someothersite.com/picture.png'); expect(state.originalWidth).toBe(96); }); test('it does not update image when an unrelated prop changes', () => { const wrapper = shallow(); wrapper.setProps({ theme: {...Preferences.THEMES.default}, }); const state = wrapper.state(); expect(state.hasImage).toBe(true); expect(state.imageUri).toBe('https://images.com/image.png'); expect(state.originalWidth).toBe(32); }); });