curo1305
df53cef3b7
- Add max-h-[90vh] overflow-y-auto to ShareModal, CloudCredentialModal, FolderDeleteModal, and DocumentView cloud-delete modal panels - Add responsive px-4 sm:px-6 to DocumentPreviewModal header for narrow viewports - Add data-test attributes to all modal panels for testability - Confirm @tailwindcss/forms active in tailwind.config.js (no drift found) - Audit forms: focus:outline-none focus:ring-2 pattern is consistent throughout - Add 4 test files covering mobile-safe modal classes and form baseline: ShareModal.mobile.test.js, CloudCredentialModal.mobile.test.js, FolderDeleteModal.mobile.test.js, DocumentPreviewModal.mobile.test.js VISUAL-02, RESP-04
53 lines
1.8 KiB
JavaScript
53 lines
1.8 KiB
JavaScript
import { describe, it, expect, vi, beforeEach } from 'vitest'
|
|
import { mount } from '@vue/test-utils'
|
|
import { createPinia, setActivePinia } from 'pinia'
|
|
|
|
vi.mock('../../../api/client.js', () => ({
|
|
getConnectionConfig: vi.fn().mockResolvedValue({ connection_username: '', server_url: '' }),
|
|
connectWebDav: vi.fn(),
|
|
}))
|
|
|
|
import CloudCredentialModal from '../CloudCredentialModal.vue'
|
|
|
|
const globalStubs = {
|
|
AppIcon: true,
|
|
}
|
|
|
|
const testProvider = { key: 'webdav', label: 'WebDAV' }
|
|
|
|
beforeEach(() => {
|
|
setActivePinia(createPinia())
|
|
vi.clearAllMocks()
|
|
})
|
|
|
|
describe('RESP-04: CloudCredentialModal mobile-safe panel', () => {
|
|
it('panel has max-h-[90vh] class for mobile scroll safety', () => {
|
|
const wrapper = mount(CloudCredentialModal, {
|
|
props: { show: true, provider: testProvider, existing: null },
|
|
global: { stubs: globalStubs },
|
|
})
|
|
const panel = wrapper.find('[data-test="cloud-credential-modal-panel"]')
|
|
expect(panel.exists()).toBe(true)
|
|
expect(panel.classes()).toContain('max-h-[90vh]')
|
|
})
|
|
|
|
it('panel has overflow-y-auto class for mobile scroll', () => {
|
|
const wrapper = mount(CloudCredentialModal, {
|
|
props: { show: true, provider: testProvider, existing: null },
|
|
global: { stubs: globalStubs },
|
|
})
|
|
const panel = wrapper.find('[data-test="cloud-credential-modal-panel"]')
|
|
expect(panel.classes()).toContain('overflow-y-auto')
|
|
})
|
|
|
|
it('panel not rendered when show=false', () => {
|
|
const wrapper = mount(CloudCredentialModal, {
|
|
props: { show: false, provider: testProvider, existing: null },
|
|
global: { stubs: globalStubs },
|
|
})
|
|
// When show=false the v-if hides the entire overlay
|
|
const panel = wrapper.find('[data-test="cloud-credential-modal-panel"]')
|
|
expect(panel.exists()).toBe(false)
|
|
})
|
|
})
|