diff --git a/app/javascript/dashboard/components/widgets/Thumbnail.spec.js b/app/javascript/dashboard/components/widgets/Thumbnail.spec.js index c10cd3d16..bcb881d09 100644 --- a/app/javascript/dashboard/components/widgets/Thumbnail.spec.js +++ b/app/javascript/dashboard/components/widgets/Thumbnail.spec.js @@ -2,8 +2,8 @@ import { mount } from '@vue/test-utils'; import Avatar from './Avatar.vue'; import Thumbnail from './Thumbnail.vue'; -describe(`when there are NO errors loading the thumbnail`, () => { - it(`should render the agent thumbnail`, () => { +describe('Thumbnail.vue', () => { + it('should render the agent thumbnail if valid image is passed', () => { const wrapper = mount(Thumbnail, { propsData: { src: 'https://some_valid_url.com', @@ -14,14 +14,12 @@ describe(`when there are NO errors loading the thumbnail`, () => { }; }, }); - expect(wrapper.find('#image').exists()).toBe(true); + expect(wrapper.find('.user-thumbnail').exists()).toBe(true); const avatarComponent = wrapper.findComponent(Avatar); expect(avatarComponent.exists()).toBe(false); }); -}); -describe(`when there ARE errors loading the thumbnail`, () => { - it(`should render the agent avatar`, () => { + it('should render the avatar component if invalid image is passed', () => { const wrapper = mount(Thumbnail, { propsData: { src: 'https://some_invalid_url.com', @@ -32,19 +30,17 @@ describe(`when there ARE errors loading the thumbnail`, () => { }; }, }); - expect(wrapper.find('#image').exists()).toBe(false); + expect(wrapper.find('.avatar-container').exists()).toBe(true); const avatarComponent = wrapper.findComponent(Avatar); expect(avatarComponent.exists()).toBe(true); }); -}); -describe(`when Avatar shows`, () => { - it(`initials shold correspond to username`, () => { + it('should the initial of the name if no image is passed', () => { const wrapper = mount(Avatar, { propsData: { username: 'Angie Rojas', }, }); - expect(wrapper.find('span').text()).toBe('AR'); + expect(wrapper.find('div').text()).toBe('AR'); }); });