diff options
Diffstat (limited to 'spec/frontend/environments/new_environment_folder_spec.js')
-rw-r--r-- | spec/frontend/environments/new_environment_folder_spec.js | 34 |
1 files changed, 28 insertions, 6 deletions
diff --git a/spec/frontend/environments/new_environment_folder_spec.js b/spec/frontend/environments/new_environment_folder_spec.js index 27d27d5869a..6823c88a5a1 100644 --- a/spec/frontend/environments/new_environment_folder_spec.js +++ b/spec/frontend/environments/new_environment_folder_spec.js @@ -1,10 +1,13 @@ import VueApollo from 'vue-apollo'; -import Vue from 'vue'; +import Vue, { nextTick } from 'vue'; import { GlCollapse, GlIcon } from '@gitlab/ui'; +import waitForPromises from 'helpers/wait_for_promises'; import createMockApollo from 'helpers/mock_apollo_helper'; import { mountExtended } from 'helpers/vue_test_utils_helper'; +import { stubTransition } from 'helpers/stub_transition'; import { __, s__ } from '~/locale'; import EnvironmentsFolder from '~/environments/components/new_environment_folder.vue'; +import EnvironmentItem from '~/environments/components/new_environment_item.vue'; import { resolvedEnvironmentsApp, resolvedFolder } from './graphql/mock_data'; Vue.use(VueApollo); @@ -25,13 +28,20 @@ describe('~/environments/components/new_environments_folder.vue', () => { }; const createWrapper = (propsData, apolloProvider) => - mountExtended(EnvironmentsFolder, { apolloProvider, propsData }); + mountExtended(EnvironmentsFolder, { + apolloProvider, + propsData, + stubs: { transition: stubTransition() }, + }); - beforeEach(() => { + beforeEach(async () => { environmentFolderMock = jest.fn(); [nestedEnvironment] = resolvedEnvironmentsApp.environments; environmentFolderMock.mockReturnValue(resolvedFolder); wrapper = createWrapper({ nestedEnvironment }, createApolloProvider()); + + await nextTick(); + await waitForPromises(); folderName = wrapper.findByText(nestedEnvironment.name); button = wrapper.findByRole('button', { name: __('Expand') }); }); @@ -57,7 +67,8 @@ describe('~/environments/components/new_environments_folder.vue', () => { const link = findLink(); expect(collapse.attributes('visible')).toBeUndefined(); - expect(icons.wrappers.map((i) => i.props('name'))).toEqual(['angle-right', 'folder-o']); + const iconNames = icons.wrappers.map((i) => i.props('name')).slice(0, 2); + expect(iconNames).toEqual(['angle-right', 'folder-o']); expect(folderName.classes('gl-font-weight-bold')).toBe(false); expect(link.exists()).toBe(false); }); @@ -68,10 +79,21 @@ describe('~/environments/components/new_environments_folder.vue', () => { const link = findLink(); expect(button.attributes('aria-label')).toBe(__('Collapse')); - expect(collapse.attributes('visible')).toBe('true'); - expect(icons.wrappers.map((i) => i.props('name'))).toEqual(['angle-down', 'folder-open']); + expect(collapse.attributes('visible')).toBe('visible'); + const iconNames = icons.wrappers.map((i) => i.props('name')).slice(0, 2); + expect(iconNames).toEqual(['angle-down', 'folder-open']); expect(folderName.classes('gl-font-weight-bold')).toBe(true); expect(link.attributes('href')).toBe(nestedEnvironment.latest.folderPath); }); + + it('displays all environments when opened', async () => { + await button.trigger('click'); + + const names = resolvedFolder.environments.map((e) => + expect.stringMatching(e.nameWithoutType), + ); + const environments = wrapper.findAllComponents(EnvironmentItem).wrappers.map((w) => w.text()); + expect(environments).toEqual(expect.arrayContaining(names)); + }); }); }); |