File size: 1,513 Bytes
7929f62 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 | /*!
* Matomo - free/libre analytics platform
*
* @link https://matomo.org
* @license https://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
*/
import { mount } from '@vue/test-utils';
import SearchInput from './SearchInput.vue';
describe('CoreHome/SearchInput', () => {
it('renders the search icon and translated placeholder', () => {
const wrapper = mount(SearchInput, {
props: {
modelValue: '',
},
});
expect(wrapper.find('.icon-search').exists()).toBe(true);
expect(wrapper.find('input').attributes('placeholder')).toBe('General_Search');
});
it('reflects the provided model value', () => {
const wrapper = mount(SearchInput, {
props: {
modelValue: 'segment',
},
});
expect((wrapper.find('input').element as HTMLInputElement).value).toBe('segment');
});
it('emits update:modelValue when the input value changes', async () => {
const wrapper = mount(SearchInput, {
props: {
modelValue: '',
},
});
await wrapper.find('input').setValue('country');
expect(wrapper.emitted('update:modelValue')?.[0]).toEqual(['country']);
});
it('clears to an empty string when the clear button is clicked', async () => {
const wrapper = mount(SearchInput, {
props: {
modelValue: 'country',
showClear: true,
},
});
await wrapper.find('.searchInputClear').trigger('click');
expect(wrapper.emitted('update:modelValue')?.[0]).toEqual(['']);
});
});
|