-
Notifications
You must be signed in to change notification settings - Fork 376
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
test: enhance unit tests for model components coverage to 40%
- Loading branch information
Showing
6 changed files
with
290 additions
and
92 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,5 +1,40 @@ | ||
import { config } from '@vue/test-utils'; | ||
import ElementPlus from 'element-plus'; | ||
import 'element-plus/dist/index.css'; | ||
import SvgIcon from '@/components/shared/SvgIcon.vue'; | ||
import * as ElementPlusIconsVue from '@element-plus/icons-vue'; | ||
import { createI18n } from 'vue-i18n'; | ||
import { createPinia } from 'pinia' | ||
import en from '@/locales/en.js' | ||
import zh from '@/locales/zh.js' | ||
|
||
config.global.plugins = [ElementPlus]; | ||
const pinia = createPinia(); | ||
const i18n = createI18n({ | ||
legacy: false, | ||
locale: 'en', | ||
messages: { | ||
en, | ||
zh | ||
} | ||
}); | ||
|
||
config.global.plugins = [ElementPlus, i18n, pinia]; | ||
|
||
// register global components | ||
config.global.components = { | ||
SvgIcon, | ||
...ElementPlusIconsVue | ||
}; | ||
|
||
// gllbal mock | ||
|
||
// Mock window.location | ||
const mockLocation = { | ||
href: '', | ||
search: '' | ||
}; | ||
|
||
Object.defineProperty(window, 'location', { | ||
value: mockLocation, | ||
writable: true | ||
}); |
42 changes: 42 additions & 0 deletions
42
frontend/src/components/__tests__/models/ModelRelationsCard.spec.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
import { describe, it, expect, beforeEach, vi } from "vitest"; | ||
import { mount } from "@vue/test-utils"; | ||
import ModelRelationsCard from "@/components/models/ModelRelationsCard.vue"; | ||
import RepoItem from "@/components/shared/RepoItem.vue"; | ||
|
||
const createWrapper = (props) => { | ||
return mount(ModelRelationsCard, { | ||
props: { | ||
namespacePath: 'test/namespace', | ||
models: [], | ||
...props | ||
} | ||
}); | ||
}; | ||
|
||
describe("ModelRelationsCard", () => { | ||
it("mounts correctly", () => { | ||
const wrapper = createWrapper(); | ||
expect(wrapper.vm).toBeDefined(); | ||
}); | ||
|
||
it("renders correctly with props", () => { | ||
const models = [{ | ||
id: 1, | ||
name: 'Model 1', | ||
path: 'user/model-1', | ||
updated_at: '2024-03-20 10:00:00', | ||
downloads: 100 | ||
}, { | ||
id: 2, | ||
name: 'Model 2', | ||
path: 'user/model-2', | ||
updated_at: '2024-03-20 10:00:00', | ||
downloads: 200 | ||
}]; | ||
const wrapper = createWrapper({ models }); | ||
|
||
expect(wrapper.find('h3').text()).toContain('Model used to traintest/namespace'); | ||
expect(wrapper.find('.text-gray-700').text()).toBe('Model used to train'); | ||
expect(wrapper.findAllComponents(RepoItem).length).toBe(models.length); | ||
}); | ||
}); |
119 changes: 119 additions & 0 deletions
119
frontend/src/components/__tests__/models/ModelSettings.spec.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,119 @@ | ||
import { describe, it, expect, beforeEach, vi } from "vitest"; | ||
import { mount } from "@vue/test-utils"; | ||
import ModelSettings from "@/components/models/ModelSettings.vue"; | ||
import { createPinia, setActivePinia } from 'pinia'; | ||
import { ElMessage, ElMessageBox } from 'element-plus'; | ||
|
||
// Mock Element Plus components and functions | ||
vi.mock('element-plus', () => ({ | ||
ElMessage: { | ||
install: vi.fn(), | ||
error: vi.fn(), | ||
success: vi.fn(), | ||
warning: vi.fn() | ||
}, | ||
ElMessageBox: { | ||
install: vi.fn(), | ||
confirm: vi.fn() | ||
} | ||
})); | ||
|
||
// Mock the API response | ||
vi.mock('../../../packs/useFetchApi', () => ({ | ||
default: (url) => ({ | ||
post: () => ({ | ||
json: () => Promise.resolve({ | ||
data: { value: { data: { path: 'testuser/testmodel' } } }, | ||
error: { value: null } | ||
}) | ||
}), | ||
json: () => { | ||
// 根据不同的 URL 返回不同的模拟数据 | ||
if (url === '/tags') { | ||
return Promise.resolve({ | ||
data: { | ||
value: { | ||
data: [ | ||
{ name: 'tag1', category: 'industry', scope: 'model', show_name: 'Tag 1' }, | ||
{ name: 'tag2', category: 'industry', scope: 'model', show_name: 'Tag 2' }, | ||
{ name: 'tag3', category: 'other', scope: 'model', show_name: 'Tag 3' } | ||
] | ||
} | ||
}, | ||
error: { value: null } | ||
}) | ||
} | ||
// 默认返回空数据 | ||
return Promise.resolve({ | ||
data: { value: null }, | ||
error: { value: null } | ||
}) | ||
} | ||
}) | ||
})); | ||
|
||
const createWrapper = (props = {}) => { | ||
return mount(ModelSettings, { | ||
props: { | ||
path: "test/model", | ||
modelNickname: "Test Model", | ||
modelDesc: "Test Description", | ||
default_branch: "main", | ||
tagList: [], | ||
tags: { | ||
task_tags: [], | ||
other_tags: [], | ||
industry_tags: [] | ||
}, | ||
...props | ||
}, | ||
}); | ||
}; | ||
|
||
describe("ModelSettings", () => { | ||
beforeEach(() => { | ||
setActivePinia(createPinia()); | ||
}); | ||
|
||
it("mounts correctly", () => { | ||
const wrapper = createWrapper(); | ||
expect(wrapper.vm).toBeDefined(); | ||
}); | ||
|
||
it("displays model path correctly", () => { | ||
const wrapper = createWrapper(); | ||
expect(wrapper.find('.bg-gray-50').text()).toBe("test/model"); | ||
}); | ||
|
||
it.skip("updates model nickname when button is clicked", async () => { | ||
const wrapper = createWrapper(); | ||
await wrapper.setData({ theModelNickname: "New Name" }); | ||
await wrapper.find('button').trigger('click'); | ||
expect(ElMessage.success).toHaveBeenCalled(); | ||
}); | ||
|
||
it.skip("shows warning when trying to update empty nickname", async () => { | ||
const wrapper = createWrapper(); | ||
await wrapper.setData({ theModelNickname: "" }); | ||
const updateButton = wrapper.findAll('button').find(btn => btn.text() === 'all.update'); | ||
await updateButton.trigger('click'); | ||
expect(ElMessage.warning).toHaveBeenCalled(); | ||
}); | ||
|
||
it("handles tag selection correctly", async () => { | ||
const wrapper = createWrapper({ | ||
tagList: [{ name: "tag1", show_name: "Tag 1" }] | ||
}); | ||
await wrapper.vm.selectTag({ name: "tag1", show_name: "Tag 1" }); | ||
expect(wrapper.vm.selectedTags).toHaveLength(1); | ||
}); | ||
|
||
it("removes tag when close icon is clicked", async () => { | ||
const wrapper = createWrapper(); | ||
await wrapper.setData({ | ||
selectedTags: [{ name: "tag1", show_name: "Tag 1" }] | ||
}); | ||
await wrapper.vm.removeTag("tag1"); | ||
expect(wrapper.vm.selectedTags).toHaveLength(0); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.