mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-04 23:20:07 +00:00
4ec6223189
Added `with { type: 'json' }` assertions to all JSON imports to ensure compatibility with Node.js ES modules and Playwright environments. This follows the current ESM specification where JSON imports require explicit type assertions.
Affected areas:
- Tailwind config
- i18n locale imports (36 files)
- Test fixtures and spec files
- API client feature flags
- Core color palettes
References:
- https://nodejs.org/api/esm.html
- https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import/with
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-authored-by: Claude <noreply@anthropic.com>
83 lines
2.1 KiB
TypeScript
83 lines
2.1 KiB
TypeScript
import { mount } from '@vue/test-utils'
|
|
import { createPinia } from 'pinia'
|
|
import PrimeVue from 'primevue/config'
|
|
import Tag from 'primevue/tag'
|
|
import Tooltip from 'primevue/tooltip'
|
|
import { describe, expect, it } from 'vitest'
|
|
import { createI18n } from 'vue-i18n'
|
|
|
|
import enMessages from '@/locales/en/main.json' with { type: 'json' }
|
|
|
|
import ManagerHeader from './ManagerHeader.vue'
|
|
|
|
const i18n = createI18n({
|
|
legacy: false,
|
|
locale: 'en',
|
|
messages: {
|
|
en: enMessages
|
|
}
|
|
})
|
|
|
|
describe('ManagerHeader', () => {
|
|
const createWrapper = () => {
|
|
return mount(ManagerHeader, {
|
|
global: {
|
|
plugins: [createPinia(), PrimeVue, i18n],
|
|
directives: {
|
|
tooltip: Tooltip
|
|
},
|
|
components: {
|
|
Tag
|
|
}
|
|
}
|
|
})
|
|
}
|
|
|
|
it('renders the component title', () => {
|
|
const wrapper = createWrapper()
|
|
|
|
expect(wrapper.find('h2').text()).toBe(
|
|
enMessages.manager.discoverCommunityContent
|
|
)
|
|
})
|
|
|
|
it('displays the legacy manager UI tag', () => {
|
|
const wrapper = createWrapper()
|
|
|
|
const tag = wrapper.find('[data-pc-name="tag"]')
|
|
expect(tag.exists()).toBe(true)
|
|
expect(tag.text()).toContain(enMessages.manager.legacyManagerUI)
|
|
})
|
|
|
|
it('applies info severity to the tag', () => {
|
|
const wrapper = createWrapper()
|
|
|
|
const tag = wrapper.find('[data-pc-name="tag"]')
|
|
expect(tag.classes()).toContain('p-tag-info')
|
|
})
|
|
|
|
it('displays info icon in the tag', () => {
|
|
const wrapper = createWrapper()
|
|
|
|
const icon = wrapper.find('.pi-info-circle')
|
|
expect(icon.exists()).toBe(true)
|
|
})
|
|
|
|
it('has cursor-help class on the tag', () => {
|
|
const wrapper = createWrapper()
|
|
|
|
const tag = wrapper.find('[data-pc-name="tag"]')
|
|
expect(tag.classes()).toContain('cursor-help')
|
|
})
|
|
|
|
it('has proper structure with flex container', () => {
|
|
const wrapper = createWrapper()
|
|
|
|
const flexContainer = wrapper.find('.flex.justify-end.ml-auto.pr-4')
|
|
expect(flexContainer.exists()).toBe(true)
|
|
|
|
const tag = flexContainer.find('[data-pc-name="tag"]')
|
|
expect(tag.exists()).toBe(true)
|
|
})
|
|
})
|