diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-05-08 18:18:11 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-05-08 18:18:11 +0300 |
commit | dcc56fe601580b5d8f6c3da32550c6523f2baff3 (patch) | |
tree | f68c28bf7c8715de7242464b344620ae5c394036 /spec/frontend/ml | |
parent | 571b02efc9442e73538c3438eb593a83d7807779 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/ml')
3 files changed, 58 insertions, 75 deletions
diff --git a/spec/frontend/ml/experiment_tracking/routes/experiments/index/components/ml_experiments_index_spec.js b/spec/frontend/ml/experiment_tracking/routes/experiments/index/components/ml_experiments_index_spec.js index 017db647ac6..0c83be1822e 100644 --- a/spec/frontend/ml/experiment_tracking/routes/experiments/index/components/ml_experiments_index_spec.js +++ b/spec/frontend/ml/experiment_tracking/routes/experiments/index/components/ml_experiments_index_spec.js @@ -1,8 +1,9 @@ import { GlEmptyState, GlLink, GlTableLite } from '@gitlab/ui'; import MlExperimentsIndexApp from '~/ml/experiment_tracking/routes/experiments/index'; -import IncubationAlert from '~/vue_shared/components/incubation/incubation_alert.vue'; import Pagination from '~/vue_shared/components/incubation/pagination.vue'; +import ModelExperimentsHeader from '~/ml/experiment_tracking/components/model_experiments_header.vue'; import { mountExtended } from 'helpers/vue_test_utils_helper'; +import { TITLE_LABEL } from '~/ml/experiment_tracking/routes/experiments/index/translations'; import { startCursor, firstExperiment, @@ -14,11 +15,10 @@ import { let wrapper; const createWrapper = (defaultExperiments = [], pageInfo = defaultPageInfo) => { wrapper = mountExtended(MlExperimentsIndexApp, { - propsData: { experiments: defaultExperiments, pageInfo }, + propsData: { experiments: defaultExperiments, pageInfo, emptyStateSvgPath: 'path' }, }); }; -const findAlert = () => wrapper.findComponent(IncubationAlert); const findPagination = () => wrapper.findComponent(Pagination); const findEmptyState = () => wrapper.findComponent(GlEmptyState); const findTable = () => wrapper.findComponent(GlTableLite); @@ -28,6 +28,7 @@ const findNthTableRow = (idx) => findTableRows().at(idx); const findColumnInRow = (row, col) => findNthTableRow(row).findAll('td').at(col); const hrefInRowAndColumn = (row, col) => findColumnInRow(row, col).findComponent(GlLink).attributes().href; +const findTitleHeader = () => wrapper.findComponent(ModelExperimentsHeader); describe('MlExperimentsIndex', () => { describe('empty state', () => { @@ -44,12 +45,18 @@ describe('MlExperimentsIndex', () => { it('does not show pagination', () => { expect(findPagination().exists()).toBe(false); }); + + it('does not render header', () => { + expect(findTitleHeader().exists()).toBe(false); + }); }); - it('displays IncubationAlert', () => { - createWrapper(experiments); + describe('Title header', () => { + beforeEach(() => createWrapper(experiments)); - expect(findAlert().exists()).toBe(true); + it('has the right title', () => { + expect(findTitleHeader().props('pageTitle')).toBe(TITLE_LABEL); + }); }); describe('experiments table', () => { diff --git a/spec/frontend/ml/experiment_tracking/routes/experiments/show/components/experiment_header_spec.js b/spec/frontend/ml/experiment_tracking/routes/experiments/show/components/experiment_header_spec.js deleted file mode 100644 index b56755043fb..00000000000 --- a/spec/frontend/ml/experiment_tracking/routes/experiments/show/components/experiment_header_spec.js +++ /dev/null @@ -1,55 +0,0 @@ -import { GlButton } from '@gitlab/ui'; -import { mountExtended } from 'helpers/vue_test_utils_helper'; -import ExperimentHeader from '~/ml/experiment_tracking/routes/experiments/show/components/experiment_header.vue'; -import DeleteButton from '~/ml/experiment_tracking/components/delete_button.vue'; -import setWindowLocation from 'helpers/set_window_location_helper'; -import * as urlHelpers from '~/lib/utils/url_utility'; -import { MOCK_EXPERIMENT } from '../mock_data'; - -const DELETE_INFO = { - deletePath: '/delete', - deleteConfirmationText: 'MODAL_BODY', - actionPrimaryText: 'Delete!', - modalTitle: 'MODAL_TITLE', -}; - -describe('~/ml/experiment_tracking/routes/experiments/show/components/experiment_header.vue', () => { - let wrapper; - - const createWrapper = () => { - wrapper = mountExtended(ExperimentHeader, { - propsData: { title: MOCK_EXPERIMENT.name, deleteInfo: DELETE_INFO }, - }); - }; - - const findDeleteButton = () => wrapper.findComponent(DeleteButton); - const findButton = () => wrapper.findComponent(GlButton); - - beforeEach(createWrapper); - - describe('Delete', () => { - it('shows delete button', () => { - expect(findDeleteButton().exists()).toBe(true); - }); - - it('passes the right props', () => { - expect(findDeleteButton().props()).toMatchObject(DELETE_INFO); - }); - }); - - describe('CSV download', () => { - it('shows download CSV button', () => { - expect(findDeleteButton().exists()).toBe(true); - }); - - it('calls the action to download the CSV', () => { - setWindowLocation('https://blah.com/something/1?name=query&orderBy=name'); - jest.spyOn(urlHelpers, 'visitUrl').mockImplementation(() => {}); - - findButton().vm.$emit('click'); - - expect(urlHelpers.visitUrl).toHaveBeenCalledTimes(1); - expect(urlHelpers.visitUrl).toHaveBeenCalledWith('/something/1.csv?name=query&orderBy=name'); - }); - }); -}); diff --git a/spec/frontend/ml/experiment_tracking/routes/experiments/show/ml_experiments_show_spec.js b/spec/frontend/ml/experiment_tracking/routes/experiments/show/ml_experiments_show_spec.js index 38b3d96ed11..5961babc5f8 100644 --- a/spec/frontend/ml/experiment_tracking/routes/experiments/show/ml_experiments_show_spec.js +++ b/spec/frontend/ml/experiment_tracking/routes/experiments/show/ml_experiments_show_spec.js @@ -1,7 +1,8 @@ -import { GlAlert, GlTableLite, GlLink, GlEmptyState } from '@gitlab/ui'; -import { mountExtended } from 'helpers/vue_test_utils_helper'; +import { GlTableLite, GlLink, GlEmptyState, GlButton } from '@gitlab/ui'; +import { mount } from '@vue/test-utils'; import MlExperimentsShow from '~/ml/experiment_tracking/routes/experiments/show/ml_experiments_show.vue'; -import ExperimentHeader from '~/ml/experiment_tracking/routes/experiments/show/components/experiment_header.vue'; +import DeleteButton from '~/ml/experiment_tracking/components/delete_button.vue'; +import ModelExperimentsHeader from '~/ml/experiment_tracking/components/model_experiments_header.vue'; import RegistrySearch from '~/vue_shared/components/registry/registry_search.vue'; import Pagination from '~/vue_shared/components/incubation/pagination.vue'; import setWindowLocation from 'helpers/set_window_location_helper'; @@ -17,9 +18,10 @@ describe('MlExperimentsShow', () => { paramNames = [], pageInfo = MOCK_PAGE_INFO, experiment = MOCK_EXPERIMENT, + emptyStateSvgPath = 'path', ) => { - wrapper = mountExtended(MlExperimentsShow, { - propsData: { experiment, candidates, metricNames, paramNames, pageInfo }, + wrapper = mount(MlExperimentsShow, { + propsData: { experiment, candidates, metricNames, paramNames, pageInfo, emptyStateSvgPath }, }); }; @@ -27,7 +29,6 @@ describe('MlExperimentsShow', () => { createWrapper(MOCK_CANDIDATES, ['rmse', 'auc', 'mae'], ['l1_ratio'], pageInfo); }; - const findAlert = () => wrapper.findComponent(GlAlert); const findPagination = () => wrapper.findComponent(Pagination); const findEmptyState = () => wrapper.findComponent(GlEmptyState); const findRegistrySearch = () => wrapper.findComponent(RegistrySearch); @@ -36,17 +37,13 @@ describe('MlExperimentsShow', () => { const findTableRows = () => findTable().findAll('tbody > tr'); const findNthTableRow = (idx) => findTableRows().at(idx); const findColumnInRow = (row, col) => findNthTableRow(row).findAll('td').at(col); - const findExperimentHeader = () => wrapper.findComponent(ExperimentHeader); + const findExperimentHeader = () => wrapper.findComponent(ModelExperimentsHeader); + const findDeleteButton = () => wrapper.findComponent(DeleteButton); + const findDownloadButton = () => findExperimentHeader().findComponent(GlButton); const hrefInRowAndColumn = (row, col) => findColumnInRow(row, col).findComponent(GlLink).attributes().href; - it('shows incubation warning', () => { - createWrapper(); - - expect(findAlert().exists()).toBe(true); - }); - describe('default inputs', () => { beforeEach(() => { createWrapper(); @@ -65,7 +62,7 @@ describe('MlExperimentsShow', () => { }); it('passes the correct title to experiment header', () => { - expect(findExperimentHeader().props('title')).toBe(MOCK_EXPERIMENT.name); + expect(findExperimentHeader().props('pageTitle')).toBe(MOCK_EXPERIMENT.name); }); it('does not show table', () => { @@ -84,6 +81,40 @@ describe('MlExperimentsShow', () => { }); }); + describe('Delete', () => { + beforeEach(() => { + createWrapper(); + }); + + it('shows delete button', () => { + expect(findDeleteButton().exists()).toBe(true); + }); + + it('passes the right props', () => { + expect(findDeleteButton().props('deletePath')).toBe(MOCK_EXPERIMENT.path); + }); + }); + + describe('CSV download', () => { + beforeEach(() => { + createWrapper(); + }); + + it('shows download CSV button', () => { + expect(findDownloadButton().exists()).toBe(true); + }); + + it('calls the action to download the CSV', () => { + setWindowLocation('https://blah.com/something/1?name=query&orderBy=name'); + jest.spyOn(urlHelpers, 'visitUrl').mockImplementation(() => {}); + + findDownloadButton().vm.$emit('click'); + + expect(urlHelpers.visitUrl).toHaveBeenCalledTimes(1); + expect(urlHelpers.visitUrl).toHaveBeenCalledWith('/something/1.csv?name=query&orderBy=name'); + }); + }); + describe('Search', () => { it('shows search box', () => { createWrapper(); |