refactor: 使用 Naive UI 重构后台布局与黑白双主题

src/features/subject-images/images.test.ts

@@ -6,9 +6,10 @@ import GenerateImageDialog from './components/GenerateImageDialog.vue'
 import ImageGalleryDialog from './components/ImageGalleryDialog.vue'
 import { coverImage, hasRunningImages, primaryImage, validImageSize } from './model'
 import { formFixture, imageFixture } from './testing/fixtures'
+import { expandSections } from '../../testing/naive'
 
 let wrapper: VueWrapper | undefined
-/** Reka 将弹窗挂载到 body，需要从实际弹窗找到按钮。 */
+/** Naive 将弹窗挂载到 body，需要从实际弹窗找到按钮。 */
 function button(label: string): HTMLButtonElement {
     const element = [...document.querySelectorAll('button')].find(item => item.textContent?.trim() === label)
     if (!element) throw new Error('找不到按钮：' + label)
@@ -88,7 +89,7 @@ describe('形态图片选择与操作', () => {
         await wrapper.setProps({ form: { ...form, id: 'form-db-2' } })
         await flushPromises()
         expect(width.value).toBe('')
-        expect(document.querySelector<HTMLInputElement>('#confirm-image-cost')!.checked).toBe(false)
+        expect(document.querySelector('#confirm-image-cost')!.getAttribute('aria-checked')).toBe('false')
         document.querySelector<HTMLInputElement>('#confirm-image-cost')!.click()
         await flushPromises()
         button('确认生成图片').click()
@@ -125,6 +126,7 @@ describe('形态图片选择与操作', () => {
         })
         await flushPromises()
         expect(fetcher.mock.calls).toHaveLength(1)
+        await expandSections()
         expect(document.body.textContent).toContain('<script>模型提示词</script>')
         expect(document.querySelector('[role="dialog"] script')).toBeNull()
         button('设为主参考图').click()