dashboard/shell/edit/__tests__/ui.cattle.io.navlink.test.ts

111 lines
3.8 KiB
TypeScript

/* eslint-disable jest/no-hooks */
import { mount } from '@vue/test-utils';
import Navlink from '@shell/edit/ui.cattle.io.navlink.vue';
import { _CREATE } from '@shell/config/query-params';
import CruResource from '@shell/components/CruResource';
describe('view: ui.cattle.io.navlink should', () => {
const name = 'test';
const url = 'http://test.com';
let wrapper: any;
const requiredSetup = () => ({
// Remove all these mocks after migration to Vue 2.7/3 due mixin logic
mocks: {
$store: {
getters: {
currentStore: () => 'current_store',
'current_store/schemaFor': jest.fn(),
'current_store/all': jest.fn(),
'i18n/t': (val) => val,
'i18n/exists': jest.fn(),
}
},
$route: { query: { AS: '' } },
$router: { applyQuery: jest.fn() },
},
propsData: {
metadata: { namespace: 'test' },
spec: { template: {} },
targetInfo: { mode: 'all' },
value: {},
mode: _CREATE,
},
});
beforeEach(() => {
wrapper = mount(Navlink, { ...requiredSetup() });
});
afterEach(() => {
wrapper.destroy();
});
it('have "Create" button disabled before fields are filled in', () => {
const saveButton = wrapper.find('[data-testid="form-save"]').element as HTMLInputElement;
expect(saveButton.disabled).toBe(true);
});
it('have "Create" button disabled when Link type is URL and only name is filled in', async() => {
const saveButton = wrapper.find('[data-testid="form-save"]').element as HTMLInputElement;
const nameField = wrapper.find('[data-testid="Navlink-name-field"]').find('input');
nameField.setValue(name);
await wrapper.vm.$nextTick();
expect(saveButton.disabled).toBe(true);
});
it('have "Create" button enabled when Link type is URL and all required fields are filled in', async() => {
const saveButton = wrapper.find('[data-testid="form-save"]').element as HTMLInputElement;
const nameField = wrapper.find('[data-testid="Navlink-name-field"]').find('input');
const urlField = wrapper.find('[data-testid="Navlink-url-field"]');
nameField.setValue(name);
urlField.setValue(url);
await wrapper.vm.$nextTick();
expect(saveButton.disabled).toBe(false);
});
it('have "Create" button disabled when Link type is Service and and only name is filled in', async() => {
const saveButton = wrapper.find('[data-testid="form-save"]').element as HTMLInputElement;
const nameField = wrapper.find('[data-testid="Navlink-name-field"]').find('input');
const rg = wrapper.find('[data-testid="Navlink-link-radiogroup"]');
const serviceBttn = rg.findAll('.radio-label').at(1);
nameField.setValue(name);
serviceBttn.trigger('click');
await wrapper.vm.$nextTick();
expect(saveButton.disabled).toBe(true);
});
it('have "Create" button enabled when Link type is Service and and all required fields are filled in', async() => {
const nameField = wrapper.find('[data-testid="Navlink-name-field"]').find('input');
const rg = wrapper.find('[data-testid="Navlink-link-radiogroup"]');
const serviceBttn = rg.findAll('.radio-label').at(1);
nameField.setValue(name);
serviceBttn.trigger('click');
await wrapper.vm.$nextTick();
const schemeField = wrapper.find('[data-testid="Navlink-scheme-field"]');
const serviceField = wrapper.find('[data-testid="Navlink-currentService-field"]');
schemeField.find('button').trigger('click');
await wrapper.trigger('keydown.down');
await wrapper.trigger('keydown.enter');
serviceField.find('button').trigger('click');
await wrapper.trigger('keydown.down');
await wrapper.trigger('keydown.enter');
expect(CruResource.computed.canSave()).toBe(true);
});
});