83 lines
2.3 KiB
JavaScript
83 lines
2.3 KiB
JavaScript
import { GlEmptyState, GlButton } from '@gitlab/ui';
|
|
import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
|
|
import ClustersEmptyState from '~/clusters_list/components/clusters_empty_state.vue';
|
|
import ClusterStore from '~/clusters_list/store';
|
|
|
|
const clustersEmptyStateImage = 'path/to/svg';
|
|
const newClusterPath = '/path/to/connect/cluster';
|
|
const emptyStateHelpText = 'empty state text';
|
|
|
|
describe('ClustersEmptyStateComponent', () => {
|
|
let wrapper;
|
|
|
|
const defaultProvideData = {
|
|
clustersEmptyStateImage,
|
|
newClusterPath,
|
|
};
|
|
|
|
const findButton = () => wrapper.findComponent(GlButton);
|
|
const findEmptyStateText = () => wrapper.findByTestId('clusters-empty-state-text');
|
|
|
|
const createWrapper = ({
|
|
provideData = { emptyStateHelpText: null },
|
|
isChildComponent = false,
|
|
canAddCluster = true,
|
|
} = {}) => {
|
|
wrapper = shallowMountExtended(ClustersEmptyState, {
|
|
store: ClusterStore({ canAddCluster }),
|
|
propsData: { isChildComponent },
|
|
provide: { ...defaultProvideData, ...provideData },
|
|
stubs: { GlEmptyState },
|
|
});
|
|
};
|
|
|
|
beforeEach(() => {
|
|
createWrapper();
|
|
});
|
|
|
|
afterEach(() => {
|
|
wrapper.destroy();
|
|
});
|
|
|
|
describe('when the component is loaded independently', () => {
|
|
it('should render the action button', () => {
|
|
expect(findButton().exists()).toBe(true);
|
|
});
|
|
});
|
|
|
|
describe('when the help text is not provided', () => {
|
|
it('should not render the empty state text', () => {
|
|
expect(findEmptyStateText().exists()).toBe(false);
|
|
});
|
|
});
|
|
|
|
describe('when the component is loaded as a child component', () => {
|
|
beforeEach(() => {
|
|
createWrapper({ isChildComponent: true });
|
|
});
|
|
|
|
it('should not render the action button', () => {
|
|
expect(findButton().exists()).toBe(false);
|
|
});
|
|
});
|
|
|
|
describe('when the help text is provided', () => {
|
|
beforeEach(() => {
|
|
createWrapper({ provideData: { emptyStateHelpText } });
|
|
});
|
|
|
|
it('should show the empty state text', () => {
|
|
expect(findEmptyStateText().text()).toBe(emptyStateHelpText);
|
|
});
|
|
});
|
|
|
|
describe('when the user cannot add clusters', () => {
|
|
beforeEach(() => {
|
|
createWrapper({ canAddCluster: false });
|
|
});
|
|
it('should disable the button', () => {
|
|
expect(findButton().props('disabled')).toBe(true);
|
|
});
|
|
});
|
|
});
|