From 7a9539767adcd482dbbd1ee7447d7bcb4be3cd9a Mon Sep 17 00:00:00 2001
From: Com <com@creator-hub.local>
Date: Fri, 28 Aug 2026 19:07:06 +0800
Subject: [PATCH] =?UTF-8?q?fix(web):=20BrowserList=20=E7=8A=B6=E6=80=81?=
 =?UTF-8?q?=E6=A0=87=E7=AD=BE=20own-property=20=E5=AE=89=E5=85=A8=E5=88=A4?=
 =?UTF-8?q?=E6=96=AD=E4=B8=8E=E6=96=AD=E7=82=B9=20CDP=20=E5=8F=AF=E8=A7=81?=
 =?UTF-8?q?=E6=80=A7=E6=96=AD=E8=A8=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Status 组件改用 Object.hasOwn 判定 statusLabels，constructor/toString/__proto__
  等原型键不再命中，仍回退「未知状态」并展示原始值
- 补充 vitest 参数化用例覆盖三个原型键
- Playwright 响应式烟测新增 900px/599px 断点 CDP endpoint 可见性断言，
  确认桌面表格与移动卡片分支各自只渲染一个可见 endpoint

HH-794
---
 web/src/BrowserList.jsx      |  2 +-
 web/src/BrowserList.test.jsx |  8 ++++++++
 web/tests/responsive.e2e.js  | 23 +++++++++++++++++++++++
 3 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/web/src/BrowserList.jsx b/web/src/BrowserList.jsx
index 04024ea..0e8d58d 100644
--- a/web/src/BrowserList.jsx
+++ b/web/src/BrowserList.jsx
@@ -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>
 }
diff --git a/web/src/BrowserList.test.jsx b/web/src/BrowserList.test.jsx
index abfafed..77f0bb8 100644
--- a/web/src/BrowserList.test.jsx
+++ b/web/src/BrowserList.test.jsx
@@ -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>)
diff --git a/web/tests/responsive.e2e.js b/web/tests/responsive.e2e.js
index 4035319..271437b 100644
--- a/web/tests/responsive.e2e.js
+++ b/web/tests/responsive.e2e.js
@@ -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)
+})