diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-05-26 21:07:33 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-05-26 21:07:33 +0300 |
commit | b8915a9ca99371b33e3d0f337d10df860201769f (patch) | |
tree | 83b005b91ac624a2fbf7381072999ac743dd5f28 /spec/frontend/profile | |
parent | a8c410f8a115b82a614b81cfd1036498838a5a5b (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/profile')
-rw-r--r-- | spec/frontend/profile/components/snippets/snippet_row_spec.js | 119 | ||||
-rw-r--r-- | spec/frontend/profile/mock_data.js | 4 |
2 files changed, 119 insertions, 4 deletions
diff --git a/spec/frontend/profile/components/snippets/snippet_row_spec.js b/spec/frontend/profile/components/snippets/snippet_row_spec.js index 0c0e262bd9a..68f06ace226 100644 --- a/spec/frontend/profile/components/snippets/snippet_row_spec.js +++ b/spec/frontend/profile/components/snippets/snippet_row_spec.js @@ -1,3 +1,11 @@ +import { GlAvatar, GlSprintf, GlIcon } from '@gitlab/ui'; +import { getIdFromGraphQLId } from '~/graphql_shared/utils'; +import { + VISIBILITY_LEVEL_PRIVATE_STRING, + VISIBILITY_LEVEL_INTERNAL_STRING, + VISIBILITY_LEVEL_PUBLIC_STRING, +} from '~/visibility_level/constants'; +import { SNIPPET_VISIBILITY } from '~/snippets/constants'; import SnippetRow from '~/profile/components/snippets/snippet_row.vue'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; import { MOCK_USER, MOCK_SNIPPET } from 'jest/profile/mock_data'; @@ -16,16 +24,123 @@ describe('UserProfileSnippetRow', () => { ...defaultProps, ...props, }, + stubs: { + GlSprintf, + }, }); }; + const findGlAvatar = () => wrapper.findComponent(GlAvatar); + const findSnippetUrl = () => wrapper.findByTestId('snippet-url'); + const findSnippetId = () => wrapper.findByTestId('snippet-id'); + const findSnippetCreatedAt = () => wrapper.findByTestId('snippet-created-at'); + const findSnippetAuthor = () => wrapper.findByTestId('snippet-author'); + const findSnippetBlob = () => wrapper.findByTestId('snippet-blob'); + const findSnippetComments = () => wrapper.findByTestId('snippet-comments'); + const findSnippetVisibility = () => wrapper.findByTestId('snippet-visibility'); + const findSnippetUpdatedAt = () => wrapper.findByTestId('snippet-updated-at'); + describe('template', () => { beforeEach(() => { createComponent(); }); - it('renders snippet title', () => { - expect(wrapper.text()).toBe(MOCK_SNIPPET.title); + it('renders GlAvatar with user avatar', () => { + expect(findGlAvatar().exists()).toBe(true); + expect(findGlAvatar().attributes('src')).toBe(MOCK_USER.avatarUrl); + }); + + it('renders Snippet Url with snippet webUrl', () => { + expect(findSnippetUrl().exists()).toBe(true); + expect(findSnippetUrl().attributes('href')).toBe(MOCK_SNIPPET.webUrl); + }); + + it('renders Snippet ID correctly formatted', () => { + expect(findSnippetId().exists()).toBe(true); + expect(findSnippetId().text()).toBe(`$${getIdFromGraphQLId(MOCK_SNIPPET.id)}`); + }); + + it('renders Snippet Created At with correct date string', () => { + expect(findSnippetCreatedAt().exists()).toBe(true); + expect(findSnippetCreatedAt().attributes('time')).toBe(MOCK_SNIPPET.createdAt.toString()); + }); + + it('renders Snippet Author with profileLink', () => { + expect(findSnippetAuthor().exists()).toBe(true); + expect(findSnippetAuthor().attributes('href')).toBe(`/${MOCK_USER.username}`); + }); + + it('renders Snippet Updated At with correct date string', () => { + expect(findSnippetUpdatedAt().exists()).toBe(true); + expect(findSnippetUpdatedAt().attributes('time')).toBe(MOCK_SNIPPET.updatedAt.toString()); + }); + }); + + describe.each` + nodes | hasOpacity | tooltip + ${[]} | ${true} | ${'0 files'} + ${[{ name: 'file.txt' }]} | ${false} | ${'1 file'} + ${[{ name: 'file.txt' }, { name: 'file2.txt' }]} | ${false} | ${'2 files'} + `('Blob Icon', ({ nodes, hasOpacity, tooltip }) => { + describe(`when blobs length ${nodes.length}`, () => { + beforeEach(() => { + createComponent({ snippet: { ...MOCK_SNIPPET, blobs: { nodes } } }); + }); + + it(`does${hasOpacity ? '' : ' not'} render icon with opacity`, () => { + expect(findSnippetBlob().findComponent(GlIcon).props('name')).toBe('documents'); + expect(findSnippetBlob().classes('gl-opacity-5')).toBe(hasOpacity); + }); + + it('renders text and tooltip correctly', () => { + expect(findSnippetBlob().text()).toBe(nodes.length.toString()); + expect(findSnippetBlob().attributes('title')).toBe(tooltip); + }); + }); + }); + + describe.each` + nodes | hasOpacity + ${[]} | ${true} + ${[{ id: 'note/1' }]} | ${false} + ${[{ id: 'note/1' }, { id: 'note/2' }]} | ${false} + `('Comments Icon', ({ nodes, hasOpacity }) => { + describe(`when comments length ${nodes.length}`, () => { + beforeEach(() => { + createComponent({ snippet: { ...MOCK_SNIPPET, notes: { nodes } } }); + }); + + it(`does${hasOpacity ? '' : ' not'} render icon with opacity`, () => { + expect(findSnippetComments().findComponent(GlIcon).props('name')).toBe('comments'); + expect(findSnippetComments().classes('gl-opacity-5')).toBe(hasOpacity); + }); + + it('renders text correctly', () => { + expect(findSnippetComments().text()).toBe(nodes.length.toString()); + }); + + it('renders link to comments correctly', () => { + expect(findSnippetComments().attributes('href')).toBe(`${MOCK_SNIPPET.webUrl}#notes`); + }); + }); + }); + + describe.each` + visibilityLevel + ${VISIBILITY_LEVEL_PUBLIC_STRING} + ${VISIBILITY_LEVEL_PRIVATE_STRING} + ${VISIBILITY_LEVEL_INTERNAL_STRING} + `('Visibility Icon', ({ visibilityLevel }) => { + describe(`when visibilityLevel is ${visibilityLevel}`, () => { + beforeEach(() => { + createComponent({ snippet: { ...MOCK_SNIPPET, visibilityLevel } }); + }); + + it(`renders the ${SNIPPET_VISIBILITY[visibilityLevel].icon} icon`, () => { + expect(findSnippetVisibility().findComponent(GlIcon).props('name')).toBe( + SNIPPET_VISIBILITY[visibilityLevel].icon, + ); + }); }); }); }); diff --git a/spec/frontend/profile/mock_data.js b/spec/frontend/profile/mock_data.js index 74387af5be7..856534aebd3 100644 --- a/spec/frontend/profile/mock_data.js +++ b/spec/frontend/profile/mock_data.js @@ -45,10 +45,10 @@ const getMockSnippet = (id) => { }, ], }, - commenters: { + notes: { nodes: [ { - id: 'git://gitlab/User/1', + id: 'git://gitlab/Note/1', }, ], }, |