diff options
Diffstat (limited to 'spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_a_spec.js')
-rw-r--r-- | spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_a_spec.js | 30 |
1 files changed, 23 insertions, 7 deletions
diff --git a/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_a_spec.js b/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_a_spec.js index 2154358de51..64ace341038 100644 --- a/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_a_spec.js +++ b/spec/frontend/pages/projects/learn_gitlab/components/learn_gitlab_a_spec.js @@ -1,22 +1,38 @@ -import { shallowMount } from '@vue/test-utils'; +import { GlProgressBar } from '@gitlab/ui'; +import { mount } from '@vue/test-utils'; import LearnGitlabA from '~/pages/projects/learn_gitlab/components/learn_gitlab_a.vue'; import { testActions } from './mock_data'; describe('Learn GitLab Design A', () => { let wrapper; + const createWrapper = () => { + wrapper = mount(LearnGitlabA, { propsData: { actions: testActions } }); + }; + + beforeEach(() => { + createWrapper(); + }); + afterEach(() => { wrapper.destroy(); wrapper = null; }); - const createWrapper = () => { - wrapper = shallowMount(LearnGitlabA, { propsData: { actions: testActions } }); - }; + it('renders correctly', () => { + expect(wrapper.element).toMatchSnapshot(); + }); - it('should render the loading state', () => { - createWrapper(); + it('renders the progress percentage', () => { + const text = wrapper.find('[data-testid="completion-percentage"]').text(); - expect(wrapper.element).toMatchSnapshot(); + expect(text).toBe('22% completed'); + }); + + it('renders the progress bar with correct values', () => { + const progressBar = wrapper.findComponent(GlProgressBar); + + expect(progressBar.attributes('value')).toBe('2'); + expect(progressBar.attributes('max')).toBe('9'); }); }); |