fix(web): BrowserList 状态标签 own-property 安全判断与断点 CDP 可见性断言
- Status 组件改用 Object.hasOwn 判定 statusLabels,constructor/toString/__proto__ 等原型键不再命中,仍回退「未知状态」并展示原始值 - 补充 vitest 参数化用例覆盖三个原型键 - Playwright 响应式烟测新增 900px/599px 断点 CDP endpoint 可见性断言, 确认桌面表格与移动卡片分支各自只渲染一个可见 endpoint HH-794
This commit is contained in:
@@ -30,7 +30,7 @@ const statusLabels = {
|
||||
}
|
||||
|
||||
function Status({ state }) {
|
||||
const label = statusLabels[state]
|
||||
const label = Object.hasOwn(statusLabels, state) ? statusLabels[state] : undefined
|
||||
const color = state === 'running' ? 'success.main' : state === 'exited' ? 'warning.main' : 'text.secondary'
|
||||
return <Box sx={{ display: 'inline-flex', alignItems: 'center', gap: 1, color, fontWeight: 650 }}><Box sx={{ width: 8, height: 8, borderRadius: '50%', bgcolor: 'currentColor' }} /><Box><Typography component="span" fontWeight="inherit">{label || '未知状态'}</Typography>{label ? null : <Typography component="span" variant="caption" color="text.secondary" sx={{ display: 'block' }}>{state}</Typography>}</Box></Box>
|
||||
}
|
||||
|
||||
@@ -46,6 +46,14 @@ describe('BrowserList', () => {
|
||||
expect(rawStates[0].className).toContain('MuiTypography-caption')
|
||||
})
|
||||
|
||||
it.each(['constructor', 'toString', '__proto__'])('treats prototype key %s as an unknown state', async (state) => {
|
||||
const protoRuntime = { ...runtimes[0], state }
|
||||
render(<CoreAdminContext dataProvider={provider({ getList: vi.fn().mockResolvedValue({ data: [protoRuntime], total: 1 }) })}><BrowserList /></CoreAdminContext>)
|
||||
|
||||
expect(await screen.findAllByText('未知状态')).toHaveLength(2)
|
||||
expect(screen.getAllByText(state)).toHaveLength(2)
|
||||
})
|
||||
|
||||
it('disables invalid lifecycle actions and sends explicit domain actions', async () => {
|
||||
const dataProvider = provider()
|
||||
render(<CoreAdminContext dataProvider={dataProvider}><BrowserList /></CoreAdminContext>)
|
||||
|
||||
@@ -1,5 +1,14 @@
|
||||
import { expect, test } from '@playwright/test'
|
||||
|
||||
const runtime = {
|
||||
id: 'container-a',
|
||||
name: 'account-a',
|
||||
state: 'running',
|
||||
status: 'Up',
|
||||
profile: 'creatorhub-profile-account-a',
|
||||
endpoint: 'http://account-a:9222',
|
||||
}
|
||||
|
||||
test('keeps the create form inside a 900px viewport', async ({ page }) => {
|
||||
await page.route('**/api/browsers', route => route.fulfill({ json: [] }))
|
||||
await page.setViewportSize({ width: 900, height: 800 })
|
||||
@@ -13,3 +22,17 @@ test('keeps the create form inside a 900px viewport', async ({ page }) => {
|
||||
expect(box).not.toBeNull()
|
||||
expect(box.x + box.width).toBeLessThanOrEqual(900)
|
||||
})
|
||||
|
||||
test('shows the CDP endpoint only in the active branch at 900px and 599px', async ({ page }) => {
|
||||
await page.route('**/api/browsers', route => route.fulfill({ json: [runtime] }))
|
||||
const endpoint = page.getByText('http://account-a:9222')
|
||||
|
||||
await page.setViewportSize({ width: 900, height: 800 })
|
||||
await page.goto('/')
|
||||
await expect(page.getByRole('cell', { name: 'http://account-a:9222' })).toBeVisible()
|
||||
await expect(endpoint.filter({ visible: true })).toHaveCount(1)
|
||||
|
||||
await page.setViewportSize({ width: 599, height: 800 })
|
||||
await expect(page.getByRole('cell', { name: 'http://account-a:9222' })).toBeHidden()
|
||||
await expect(endpoint.filter({ visible: true })).toHaveCount(1)
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user