122 lines
7.1 KiB
JavaScript
122 lines
7.1 KiB
JavaScript
import { expect, test } from '@playwright/test'
|
|
|
|
const runtime = {
|
|
id: 'container-a',
|
|
alias: 'account-a',
|
|
name: 'account-a',
|
|
state: 'running',
|
|
status: 'Up',
|
|
image_version: '148.0.0.1',
|
|
fingerprint: { seed: 1000 },
|
|
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.route('**/api/gateways', route => route.fulfill({ json: [] }))
|
|
await page.route('**/api/browser-images', route => route.fulfill({ json: [] }))
|
|
await page.route('**/api/phase-a/accounts', route => route.fulfill({ json: [] }))
|
|
await page.route('**/api/network-exits', route => route.fulfill({ json: [] }))
|
|
await page.setViewportSize({ width: 900, height: 800 })
|
|
await page.goto('/#/browsers')
|
|
|
|
await expect(page.getByRole('button', { name: '收起导航' }).first()).toBeVisible()
|
|
const createButton = page.getByRole('button', { name: '创建环境' })
|
|
await expect(createButton).toBeVisible()
|
|
expect(await page.evaluate(() => document.documentElement.scrollWidth)).toBeLessThanOrEqual(900)
|
|
const box = await createButton.boundingBox()
|
|
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] }))
|
|
await page.route('**/api/gateways', route => route.fulfill({ json: [] }))
|
|
await page.route('**/api/browser-images', route => route.fulfill({ json: [] }))
|
|
await page.route('**/api/phase-a/accounts', route => route.fulfill({ json: [] }))
|
|
await page.route('**/api/network-exits', route => route.fulfill({ json: [] }))
|
|
const endpoint = page.getByText('http://account-a:9222')
|
|
|
|
await page.setViewportSize({ width: 900, height: 800 })
|
|
await page.goto('/#/browsers')
|
|
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)
|
|
})
|
|
|
|
test('keeps account and network-exit pages inside 599px, 900px and 1280px', async ({ page }) => {
|
|
const accountKey = 'a'.repeat(128)
|
|
const credentialID = 'c'.repeat(128)
|
|
const hostname = [63, 63, 63, 61].map(length => 'h'.repeat(length)).join('.')
|
|
const account = { id: 'account-a', platform: 'mock', platform_account_key: accountKey, authorization_kind: 'owned', authorization_status: 'authorized', runtime_status: 'paused', version: 1, credential_reference: { id: credentialID, provider: 'os_keyring' } }
|
|
const binding = { alias: 'env-a', name: '店铺环境', account_id: 'account-a', network_exit_id: 'exit-a', network_exit_health: 'healthy', binding_version: 1, schedule_status: 'blocked', schedule_block_reason: 'account_paused' }
|
|
const networkExit = { id: 'exit-a', protocol: 'socks5', host: hostname, port: 1080, health_status: 'healthy', credential_reference: { id: credentialID, provider: 'os_keyring' } }
|
|
await page.route('**/api/phase-a/accounts', route => route.fulfill({ json: [account] }))
|
|
await page.route('**/api/phase-a/accounts/account-a', route => route.fulfill({ json: account }))
|
|
await page.route('**/api/phase-a/drafts?account_id=account-a', route => route.fulfill({ json: [] }))
|
|
await page.route('**/api/browsers', route => route.fulfill({ json: [binding] }))
|
|
await page.route('**/api/network-exits', route => route.fulfill({ json: [networkExit] }))
|
|
|
|
for (const path of ['/#/accounts', '/#/accounts/account-a', '/#/network-exits']) {
|
|
for (const width of [599, 900, 1280]) {
|
|
await page.setViewportSize({ width, height: 900 })
|
|
await page.goto(path)
|
|
await expect(page.getByRole('heading', { level: 1 })).toBeVisible()
|
|
expect(await page.evaluate(() => document.documentElement.scrollWidth)).toBeLessThanOrEqual(width)
|
|
}
|
|
}
|
|
})
|
|
|
|
test('opens account detail at the phase A route', async ({ page }) => {
|
|
const account = { id: 'account-a', platform: 'mock', platform_account_key: 'shop-a', authorization_kind: 'owned', authorization_status: 'authorized', runtime_status: 'paused', version: 1, credential_reference: { id: 'credential-a', provider: 'os_keyring' } }
|
|
await page.route('**/api/phase-a/accounts', route => route.fulfill({ json: [account] }))
|
|
await page.route('**/api/phase-a/accounts/account-a', route => route.fulfill({ json: account }))
|
|
await page.route('**/api/browsers', route => route.fulfill({ json: [] }))
|
|
await page.route('**/api/phase-a/drafts?account_id=account-a', route => route.fulfill({ json: [] }))
|
|
await page.setViewportSize({ width: 599, height: 900 })
|
|
await page.goto('/#/accounts')
|
|
|
|
await page.getByRole('link', { name: '查看账号' }).click()
|
|
await expect(page).toHaveURL(/#\/accounts\/account-a$/)
|
|
await expect(page.getByRole('heading', { level: 1, name: 'shop-a' })).toBeVisible()
|
|
expect(await page.evaluate(() => document.documentElement.scrollWidth)).toBeLessThanOrEqual(599)
|
|
})
|
|
|
|
test('keeps draft review responsive and restores focus after dialog close and successful save', async ({ page }) => {
|
|
const account = { id: 'account-a', platform: 'mock', platform_account_key: 'shop-a', authorization_status: 'authorized', runtime_status: 'active', version: 2 }
|
|
const draft = {
|
|
id: 'draft-a', account_id: 'account-a', version: 1, content: 'x'.repeat(1000), account,
|
|
versions: [{ id: 'draft-a', account_id: 'account-a', version: 1, content: 'x'.repeat(1000) }],
|
|
confirmations: [], tasks: [],
|
|
}
|
|
const binding = { alias: 'env-a', name: '店铺环境', account_id: 'account-a', network_exit_id: 'exit-a', network_exit_health: 'healthy', binding_version: 4, schedule_status: 'ready', schedule_block_reason: '' }
|
|
await page.route('**/api/phase-a/drafts/draft-a', route => route.fulfill({ json: draft }))
|
|
await page.route('**/api/browsers', route => route.fulfill({ json: [binding] }))
|
|
await page.route('**/api/phase-a/confirmations', route => route.fulfill({ json: { id: 'confirmation-a' } }))
|
|
|
|
for (const width of [599, 900, 1280]) {
|
|
await page.setViewportSize({ width, height: 900 })
|
|
await page.goto('/#/drafts/draft-a')
|
|
await expect(page.getByRole('heading', { level: 1, name: '草稿核对' })).toBeVisible()
|
|
expect(await page.evaluate(() => document.documentElement.scrollWidth)).toBeLessThanOrEqual(width)
|
|
}
|
|
|
|
await page.setViewportSize({ width: 599, height: 900 })
|
|
await page.getByRole('checkbox', { name: /我已核对当前账号/ }).check()
|
|
const trigger = page.getByRole('button', { name: '确认当前快照' })
|
|
await trigger.click()
|
|
await expect(page.getByRole('dialog', { name: '确认草稿版本' })).toBeVisible()
|
|
await page.keyboard.press('Escape')
|
|
await expect(page.getByRole('dialog')).toBeHidden()
|
|
await expect(trigger).toBeFocused()
|
|
|
|
await trigger.click()
|
|
await page.getByRole('button', { name: '保存确认' }).click()
|
|
await expect(page.getByRole('dialog')).toBeHidden()
|
|
await expect(trigger).toBeFocused()
|
|
})
|