Commit f8a47b5b authored by Illya Klymov's avatar Illya Klymov Committed by Miguel Rincon

Replace deprecated .is() with alternate approaches

@vue/test-utils 1.x deprecated .is() on wrappers
This MR fixess cases, when .is() assertion could be substituted by

* element.tagName
* classes()
parent 11cc44f8
import { shallowMount } from '@vue/test-utils';
import SidebarItemEpicsSelect from 'ee/sidebar/components/sidebar_item_epics_select.vue';
import EpicsSelect from 'ee/vue_shared/components/sidebar/epics_select/base.vue';
import {
mockSidebarStore,
......@@ -99,7 +100,7 @@ describe('SidebarItemEpicsSelect', () => {
describe('template', () => {
it('should render epics-select component', () => {
expect(wrapper.is('epics-select-stub')).toBe(true);
expect(wrapper.find(EpicsSelect).element).toBe(wrapper.element);
expect(wrapper.attributes('blocktitle')).toBe('Epic');
expect(wrapper.text()).toBe('None');
});
......
......@@ -38,7 +38,7 @@ describe('EpicsSelect', () => {
describe('template', () => {
it('should render button element', () => {
expect(wrapper.is('button')).toBe(true);
expect(wrapper.element.tagName).toBe('BUTTON');
expect(wrapper.classes()).toEqual(
expect.arrayContaining(['dropdown-menu-toggle', 'js-epic-select', 'js-extra-options']),
);
......
......@@ -92,7 +92,7 @@ describe('ClusterFormDropdown', () => {
});
it('displays a checked GlIcon next to the item', () => {
expect(wrapper.find(GlIcon).is('.invisible')).toBe(false);
expect(wrapper.find(GlIcon).classes()).not.toContain('invisible');
expect(wrapper.find(GlIcon).props('name')).toBe('mobile-issue-close');
});
});
......
......@@ -22,7 +22,7 @@ describe('Stop Component', () => {
});
it('should render a link to open a web terminal with the provided path', () => {
expect(wrapper.is('a')).toBe(true);
expect(wrapper.element.tagName).toBe('A');
expect(wrapper.attributes('title')).toBe('Terminal');
expect(wrapper.attributes('aria-label')).toBe('Terminal');
expect(wrapper.attributes('href')).toBe(terminalPath);
......
......@@ -89,8 +89,8 @@ describe('Issuable suggestions app component', () => {
wrapper
.findAll('li')
.at(0)
.is('.gl-mb-3'),
).toBe(true);
.classes(),
).toContain('gl-mb-3');
});
});
......@@ -102,8 +102,8 @@ describe('Issuable suggestions app component', () => {
wrapper
.findAll('li')
.at(1)
.is('.gl-mb-3'),
).toBe(false);
.classes(),
).not.toContain('gl-mb-3');
});
});
});
......
......@@ -56,7 +56,7 @@ describe('LogControlButtons', () => {
});
it('click on "scroll to top" scrolls up', () => {
expect(findScrollToTop().is('[disabled]')).toBe(false);
expect(findScrollToTop().attributes('disabled')).toBeUndefined();
findScrollToTop().vm.$emit('click');
......@@ -64,7 +64,7 @@ describe('LogControlButtons', () => {
});
it('click on "scroll to bottom" scrolls down', () => {
expect(findScrollToBottom().is('[disabled]')).toBe(false);
expect(findScrollToBottom().attributes('disabled')).toBeUndefined();
findScrollToBottom().vm.$emit('click');
......
......@@ -18,7 +18,7 @@ describe('LogSimpleFilters', () => {
const findPodsDropdownItems = () =>
findPodsDropdown()
.findAll(GlDeprecatedDropdownItem)
.filter(item => !item.is('[disabled]'));
.filter(item => !('disabled' in item.attributes()));
const mockPodsLoading = () => {
state.pods.options = [];
......
......@@ -68,7 +68,7 @@ describe('dashboard invalid url parameters', () => {
it('form exists and can be submitted', () => {
expect(findForm().exists()).toBe(true);
expect(findSubmitBtn().exists()).toBe(true);
expect(findSubmitBtn().is('[disabled]')).toBe(false);
expect(findSubmitBtn().props('disabled')).toBe(false);
});
it('form has a text area with a default value', () => {
......@@ -109,7 +109,7 @@ describe('dashboard invalid url parameters', () => {
});
it('submit button is disabled', () => {
expect(findSubmitBtn().is('[disabled]')).toBe(true);
expect(findSubmitBtn().props('disabled')).toBe(true);
});
});
});
......
......@@ -50,7 +50,7 @@ describe('DuplicateDashboardForm', () => {
it('when is empty', () => {
setValue('fileName', '');
return wrapper.vm.$nextTick(() => {
expect(findByRef('fileNameFormGroup').is('.is-valid')).toBe(true);
expect(findByRef('fileNameFormGroup').classes()).toContain('is-valid');
expect(findInvalidFeedback().exists()).toBe(false);
});
});
......@@ -58,7 +58,7 @@ describe('DuplicateDashboardForm', () => {
it('when is valid', () => {
setValue('fileName', 'my_dashboard.yml');
return wrapper.vm.$nextTick(() => {
expect(findByRef('fileNameFormGroup').is('.is-valid')).toBe(true);
expect(findByRef('fileNameFormGroup').classes()).toContain('is-valid');
expect(findInvalidFeedback().exists()).toBe(false);
});
});
......@@ -66,7 +66,7 @@ describe('DuplicateDashboardForm', () => {
it('when is not valid', () => {
setValue('fileName', 'my_dashboard.exe');
return wrapper.vm.$nextTick(() => {
expect(findByRef('fileNameFormGroup').is('.is-invalid')).toBe(true);
expect(findByRef('fileNameFormGroup').classes()).toContain('is-invalid');
expect(findInvalidFeedback().text()).toBeTruthy();
});
});
......@@ -144,7 +144,7 @@ describe('DuplicateDashboardForm', () => {
return wrapper.vm.$nextTick().then(() => {
wrapper.find('form').trigger('change');
expect(findByRef('branchName').is(':focus')).toBe(true);
expect(document.activeElement).toBe(findByRef('branchName').element);
});
});
});
......
......@@ -50,7 +50,7 @@ describe('Graph group component', () => {
it('should contain a tab index for the collapse button', () => {
const groupToggle = findToggleButton();
expect(groupToggle.is('[tabindex]')).toBe(true);
expect(groupToggle.attributes('tabindex')).toBeDefined();
});
it('should show the open the group when collapseGroup is set to true', () => {
......
......@@ -39,7 +39,7 @@ describe('Linked pipeline', () => {
});
it('should render a list item as the containing element', () => {
expect(wrapper.is('li')).toBe(true);
expect(wrapper.element.tagName).toBe('LI');
});
it('should render a button', () => {
......
......@@ -117,7 +117,7 @@ describe('Registry Breadcrumb', () => {
});
it('has the same tag as the last children of the crumbs', () => {
expect(findLastCrumb().is(lastChildren.tagName)).toBe(true);
expect(findLastCrumb().element.tagName).toBe(lastChildren.tagName.toUpperCase());
});
it('has the same classes as the last children of the crumbs', () => {
......
......@@ -20,7 +20,7 @@ describe('MrWidgetContainer', () => {
it('has layout', () => {
factory();
expect(wrapper.is('.mr-widget-heading')).toBe(true);
expect(wrapper.classes()).toContain('mr-widget-heading');
expect(wrapper.contains('.mr-widget-content')).toBe(true);
});
......
......@@ -234,7 +234,8 @@ describe('DateTimePicker', () => {
});
it('unchecks quick range when text is input is clicked', () => {
const findActiveItems = () => findQuickRangeItems().filter(w => w.is('.active'));
const findActiveItems = () =>
findQuickRangeItems().filter(w => w.classes().includes('active'));
expect(findActiveItems().length).toBe(1);
......@@ -332,13 +333,13 @@ describe('DateTimePicker', () => {
expect(items.length).toBe(Object.keys(otherTimeRanges).length);
expect(items.at(0).text()).toBe('1 minute');
expect(items.at(0).is('.active')).toBe(false);
expect(items.at(0).classes()).not.toContain('active');
expect(items.at(1).text()).toBe('2 minutes');
expect(items.at(1).is('.active')).toBe(true);
expect(items.at(1).classes()).toContain('active');
expect(items.at(2).text()).toBe('5 minutes');
expect(items.at(2).is('.active')).toBe(false);
expect(items.at(2).classes()).not.toContain('active');
});
});
......
......@@ -47,7 +47,7 @@ describe('SuggestionDiffRow', () => {
},
});
expect(wrapper.is('.line_holder')).toBe(true);
expect(wrapper.classes()).toContain('line_holder');
});
it('renders the rich text when it is available', () => {
......
......@@ -17,7 +17,7 @@ describe(`TimelineEntryItem`, () => {
it('renders correctly', () => {
factory();
expect(wrapper.is('.timeline-entry')).toBe(true);
expect(wrapper.classes()).toContain('timeline-entry');
expect(wrapper.contains('.timeline-entry-inner')).toBe(true);
});
......
......@@ -27,7 +27,9 @@ describe('Ordered Layout', () => {
let wrapper;
const verifyOrder = () =>
wrapper.findAll('footer,header').wrappers.map(x => (x.is('footer') ? 'footer' : 'header'));
wrapper
.findAll('footer,header')
.wrappers.map(x => (x.element.tagName === 'FOOTER' ? 'footer' : 'header'));
const createComponent = (props = {}) => {
wrapper = mount(TestComponent, {
......
......@@ -62,7 +62,7 @@ describe('DropdownButton', () => {
describe('template', () => {
it('renders component container element', () => {
expect(wrapper.is('gl-button-stub')).toBe(true);
expect(wrapper.find(GlButton).element).toBe(wrapper.element);
});
it('renders default button text element', () => {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment