refactor(tests): update API key management and develop page tests for improved element selection and structure

This commit is contained in:
CodingOnStar
2026-02-11 20:49:26 +08:00
parent f29e96ab4a
commit 98d0ccc120
5 changed files with 16 additions and 28 deletions

View File

@ -143,11 +143,11 @@ describe('API Key management flow', () => {
})
// Click X icon to close
const xIcon = document.body.querySelector('svg.cursor-pointer')
expect(xIcon).toBeInTheDocument()
const closeIcon = document.body.querySelector('svg.cursor-pointer')
expect(closeIcon).toBeInTheDocument()
await act(async () => {
await user.click(xIcon!)
await user.click(closeIcon!)
})
await flushUI()

View File

@ -222,20 +222,20 @@ describe('DevelopMain page flow', () => {
mode: AppModeEnum.CHAT,
}
const { container } = render(<DevelopMain appId="app-1" />)
render(<DevelopMain appId="app-1" />)
// Main container: flex column with full height
const mainDiv = container.firstChild as HTMLElement
const mainDiv = screen.getByTestId('develop-main')
expect(mainDiv.className).toContain('flex')
expect(mainDiv.className).toContain('flex-col')
expect(mainDiv.className).toContain('h-full')
// Header section with border
const header = container.querySelector('.border-b')
const header = mainDiv.querySelector('.border-b')
expect(header).toBeInTheDocument()
// Content section with overflow scroll
const content = container.querySelector('.overflow-auto')
const content = mainDiv.querySelector('.overflow-auto')
expect(content).toBeInTheDocument()
})
})

View File

@ -124,27 +124,27 @@ describe('DevelopMain', () => {
})
it('should have flex column layout', () => {
const { container } = render(<DevelopMain appId="app-123" />)
const mainContainer = container.firstChild as HTMLElement
render(<DevelopMain appId="app-123" />)
const mainContainer = screen.getByTestId('develop-main')
expect(mainContainer.className).toContain('flex')
expect(mainContainer.className).toContain('flex-col')
})
it('should have relative positioning', () => {
const { container } = render(<DevelopMain appId="app-123" />)
const mainContainer = container.firstChild as HTMLElement
render(<DevelopMain appId="app-123" />)
const mainContainer = screen.getByTestId('develop-main')
expect(mainContainer.className).toContain('relative')
})
it('should have full height', () => {
const { container } = render(<DevelopMain appId="app-123" />)
const mainContainer = container.firstChild as HTMLElement
render(<DevelopMain appId="app-123" />)
const mainContainer = screen.getByTestId('develop-main')
expect(mainContainer.className).toContain('h-full')
})
it('should have overflow-hidden', () => {
const { container } = render(<DevelopMain appId="app-123" />)
const mainContainer = container.firstChild as HTMLElement
render(<DevelopMain appId="app-123" />)
const mainContainer = screen.getByTestId('develop-main')
expect(mainContainer.className).toContain('overflow-hidden')
})
})

View File

@ -20,7 +20,7 @@ const DevelopMain = ({ appId }: IDevelopMainProps) => {
}
return (
<div className="relative flex h-full flex-col overflow-hidden">
<div data-testid="develop-main" className="relative flex h-full flex-col overflow-hidden">
<div className="flex shrink-0 items-center justify-between border-b border-solid border-b-divider-regular px-6 py-2">
<div className="text-lg font-medium text-text-primary"></div>
<ApiServer apiBaseUrl={appDetail.api_base_url} appId={appId} />

View File

@ -153,18 +153,6 @@ describe('SecretKeyGenerateModal', () => {
const closeIcon = document.body.querySelector('svg.cursor-pointer')
expect(closeIcon).toBeInTheDocument()
})
it('should have correct dimensions on close icon', async () => {
await renderModal(<SecretKeyGenerateModal {...defaultProps} />)
const closeIcon = document.body.querySelector('svg[class*="h-6"][class*="w-6"]')
expect(closeIcon).toBeInTheDocument()
})
it('should have tertiary text color on close icon', async () => {
await renderModal(<SecretKeyGenerateModal {...defaultProps} />)
const closeIcon = document.body.querySelector('svg[class*="text-text-tertiary"]')
expect(closeIcon).toBeInTheDocument()
})
})
describe('header section', () => {