Merge remote-tracking branch 'origin/master' into trajectory-history-source
This commit is contained in:
imccyu
@@ -23,6 +23,7 @@ import { saveFailureShot } from './support.ts'
|
||||
const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/navigation-panes', import.meta.url))
|
||||
const SEED = join(SNAPSHOT_DIR, 'seed.jsonl')
|
||||
const TRAJECTORY_EXPECTED = join(SNAPSHOT_DIR, 'trajectory.expected.md')
|
||||
const TERMINAL_EXPECTED = join(SNAPSHOT_DIR, 'terminal-card.expected.md')
|
||||
const MODE = webSnapshotMode()
|
||||
const SEED_ID = 'navigation-panes-web-e2e'
|
||||
|
||||
@@ -181,6 +182,10 @@ describe('web e2e: navigation & panes over a rich seeded session', () => {
|
||||
expect(await frame.getAttribute('data-details-collapsed')).toBeNull()
|
||||
await bashRow.click()
|
||||
await expect.poll(() => frame.getAttribute('data-details-collapsed'), { timeout: 5_000 }).toBeNull()
|
||||
// The card's own controls are outside the summary row and must not open
|
||||
// details either — the terminal card is read in place.
|
||||
await page.locator('[data-sample="bash-global"] ~ [data-terminal] [class*="_copyButton_"]').first().click()
|
||||
await expect.poll(() => frame.getAttribute('data-details-collapsed'), { timeout: 5_000 }).toBeNull()
|
||||
// Read summaries are host-open file links; they also must not open details.
|
||||
const fileLink = page.locator('[data-variant="read"] button').first()
|
||||
await fileLink.waitFor({ timeout: 10_000 })
|
||||
@@ -188,12 +193,93 @@ describe('web e2e: navigation & panes over a rich seeded session', () => {
|
||||
await expect.poll(() => frame.getAttribute('data-details-collapsed'), { timeout: 5_000 }).toBeNull()
|
||||
}, 60_000)
|
||||
|
||||
it.skipIf(MODE === 'record')('renders the bash row as a terminal card in the real browser', async () => {
|
||||
onTestFailed(() => saveFailureShot(page, 'web-e2e-navigation-terminal'))
|
||||
await page.getByRole('tab', { name: 'Chat' }).click()
|
||||
// The card is resident in the keyed bash row (no expand gesture): the
|
||||
// recorded command's own output sits in the message flow, derived from the
|
||||
// logged call/result presentations alone.
|
||||
const card = page.locator('[data-sample="bash-global"] ~ [data-terminal], [data-sample="bash-global"] [data-terminal]').first()
|
||||
await card.waitFor({ timeout: 15_000 })
|
||||
// Real layout, not jsdom's stub (which computes no geometry at all):
|
||||
// squeeze the output pane below its content width and the line must keep
|
||||
// its single row and overflow sideways instead of folding. Soft-wrapping
|
||||
// here is what shredded the column alignment this card exists to hold.
|
||||
const layout = await card.locator('[class*="_output_"]').first().evaluate((node) => {
|
||||
const pane = node as HTMLElement
|
||||
const row = pane.querySelector<HTMLElement>('[class*="_line_"]')
|
||||
if (row === null) throw new Error('output pane has no line')
|
||||
const before = row.offsetHeight
|
||||
const restore = pane.style.width
|
||||
pane.style.width = '8px'
|
||||
const squeezed = { wrapped: row.offsetHeight > before, scrollsSideways: pane.scrollWidth > pane.clientWidth }
|
||||
pane.style.width = restore
|
||||
return { whiteSpace: getComputedStyle(row).whiteSpace, overflowX: getComputedStyle(pane).overflowX, ...squeezed }
|
||||
})
|
||||
expect(layout).toEqual({ whiteSpace: 'pre', overflowX: 'auto', wrapped: false, scrollsSideways: true })
|
||||
// The run-state dot's color is the whole point of it and is the one thing
|
||||
// jsdom cannot report: --dsw-* tokens resolve only against the real theme
|
||||
// stylesheet. This command settled cleanly, so the dot must be the green
|
||||
// success token — a red one here would read as a failed command.
|
||||
const dot = await card.locator('[class*="_runState_"][data-state]').first().evaluate((node) => {
|
||||
// The token lives on body, so the probe must sit in the same cascade.
|
||||
const probe = document.createElement('span')
|
||||
probe.style.color = 'var(--dsw-alias-state-success-primary)'
|
||||
document.body.appendChild(probe)
|
||||
const success = getComputedStyle(probe).color
|
||||
probe.remove()
|
||||
return {
|
||||
state: node.getAttribute('data-state'),
|
||||
color: getComputedStyle(node as HTMLElement).color,
|
||||
success,
|
||||
// One label per card (the state is the call's), so it hangs off the
|
||||
// prompt column rather than the row the dot sits in.
|
||||
label: node.closest('[class*="_prompt_"]')?.querySelector('[class*="_runStateLabel_"]')?.textContent ?? null,
|
||||
// The dot precedes the prompt label in document order, which is what
|
||||
// puts it to the left of the `$`.
|
||||
beforePrompt: node.compareDocumentPosition(node.parentElement!.querySelector('[class*="_cwd_"]')!)
|
||||
=== Node.DOCUMENT_POSITION_FOLLOWING,
|
||||
// The dot lives in the card's OWN left padding, so it sits inside the
|
||||
// card box yet left of the prompt text. Owning the reservation as padding
|
||||
// rather than margin is what keeps a consumer's own margin from
|
||||
// cancelling it and letting a container clip the dot — geometry jsdom
|
||||
// cannot compute.
|
||||
insideCard: (node as HTMLElement).getBoundingClientRect().left
|
||||
>= (node.closest('[data-terminal]')?.getBoundingClientRect().left ?? Infinity),
|
||||
leftOfPrompt: (node as HTMLElement).getBoundingClientRect().right
|
||||
<= (node.closest('[class*="_promptLine_"]')
|
||||
?.querySelector('[class*="_cwd_"]')
|
||||
?.getBoundingClientRect().left ?? -Infinity),
|
||||
}
|
||||
})
|
||||
expect(dot.state).toBe('done')
|
||||
expect(dot.label).toBe('已完成')
|
||||
expect(dot.beforePrompt).toBe(true)
|
||||
expect(dot.insideCard).toBe(true)
|
||||
expect(dot.leftOfPrompt).toBe(true)
|
||||
// Resolved through the theme token, not a literal hex in the component.
|
||||
expect(dot.success).toMatch(/^rgb/)
|
||||
expect(dot.color).toBe(dot.success)
|
||||
// Golden of the card at rest — captured before the copy click, whose
|
||||
// confirmation label self-reverts on a timer and would not hold still.
|
||||
const snapshot = (await captureStableAria(page, '[data-terminal]', scaffold.workspaceCwd))
|
||||
.split(SEED_ID).join('{{seededId}}')
|
||||
await compareOrRefreshGolden(TERMINAL_EXPECTED, snapshot, MODE)
|
||||
// Copy writes the raw output through the browser's own clipboard, which in
|
||||
// a real page is the async Clipboard API rather than the jsdom fallback.
|
||||
await page.context().grantPermissions(['clipboard-read', 'clipboard-write'])
|
||||
await card.locator('[class*="_copyButton_"]').first().click()
|
||||
await expect.poll(() => card.locator('[class*="_copyButton_"]').first().textContent(), { timeout: 5_000 })
|
||||
.toBe('复制成功')
|
||||
expect(await page.evaluate(() => navigator.clipboard.readText())).toContain('NAVIGATION_OK')
|
||||
}, 60_000)
|
||||
|
||||
it.skipIf(MODE === 'record')('issued zero model calls and stayed clean', async () => {
|
||||
expect(tripwire.pageErrors).toEqual([])
|
||||
expect(slotErrors).toEqual([])
|
||||
expect(tripwire.warnings).toEqual([])
|
||||
await assertFixtureInventory(SNAPSHOT_DIR, [
|
||||
'seed.jsonl', 'trajectory.expected.md',
|
||||
'seed.jsonl', 'trajectory.expected.md', 'terminal-card.expected.md',
|
||||
])
|
||||
})
|
||||
})
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
- text: 已完成 {{workspace}} echo NAVIGATION_OK
|
||||
- button "复制"
|
||||
- text: NAVIGATION_OK
|
||||
306
apps/web/tests/terminal-card.snapshot.ts
Normal file
306
apps/web/tests/terminal-card.snapshot.ts
Normal file
@@ -0,0 +1,306 @@
|
||||
// @vitest-environment jsdom
|
||||
// Terminal card snapshot over the BUILT client graph (the code-mode-fixture
|
||||
// idiom: real bundles via AppWebEntry, keyless FixtureApiClient transport).
|
||||
// Opens the fixture history session and pins the `card: 'terminal'` render
|
||||
// intent at both of its conversation render sites, for both chat-row shapes:
|
||||
// turn 60's `fx-bash` on the render-site fallback row (expand-gated body) and
|
||||
// turn 65's `bash` on the keyed BashRow registration (resident body). Turn 65
|
||||
// carries what turn 60's two clean prompt rows cannot — SGR runs resolved to
|
||||
// --dsw-* tokens, output past the chat cap, a nested cwd, and a non-zero exit
|
||||
// pill; turn 60 carries the multi-line command's per-line prompt rows.
|
||||
//
|
||||
// The details panel's Output section is NOT covered here: tool rows stopped
|
||||
// being details-panel click targets, and nothing else in the assembled
|
||||
// application opens that panel, so the surface cannot be driven end to end.
|
||||
// Its terminal rendering stays pinned in ui-conversation's
|
||||
// tests/terminal-card.spec.tsx, which mounts DetailsPanel with a selection
|
||||
// directly.
|
||||
import { readFileSync } from 'node:fs'
|
||||
import { join } from 'node:path'
|
||||
import { act, cleanup, fireEvent, screen, waitFor, within } from '@testing-library/react'
|
||||
import { afterEach, beforeEach, expect, it, vi } from 'vitest'
|
||||
import type { WebBootEntry } from '@deepseek-ai/dsh-client-modules/client'
|
||||
import { AppWebEntry } from '@deepseek-ai/dsh-client-web'
|
||||
|
||||
const PLUGINS: readonly (WebBootEntry & { dir: string })[] = [
|
||||
{ id: '@deepseek-ai/dsh-client-connection', dir: 'connection', url: '/plugins/connection.js', rev: 'fx', inject: [], immediately: true },
|
||||
{ id: '@deepseek-ai/dsh-client-runtime', dir: 'runtime', url: '/plugins/runtime.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-connection'], immediately: true },
|
||||
{ id: '@deepseek-ai/dsh-client-ui-theme', dir: 'ui-theme', url: '/plugins/ui-theme.js', rev: 'fx', inject: [], immediately: true },
|
||||
{ id: '@deepseek-ai/dsh-client-locale', dir: 'locale', url: '/plugins/locale.js', rev: 'fx', inject: [], immediately: true },
|
||||
{ id: '@deepseek-ai/dsh-client-ui-layout', dir: 'ui-layout', url: '/plugins/ui-layout.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-runtime'] },
|
||||
{ id: '@deepseek-ai/dsh-client-ui-sidebar', dir: 'ui-sidebar', url: '/plugins/ui-sidebar.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout'] },
|
||||
{ id: '@deepseek-ai/dsh-client-ui-conversation', dir: 'ui-conversation', url: '/plugins/ui-conversation.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout'] },
|
||||
{
|
||||
id: '@deepseek-ai/dsh-client-ui-workspace',
|
||||
dir: 'ui-workspace',
|
||||
url: '/plugins/ui-workspace.js',
|
||||
rev: 'fx',
|
||||
inject: [
|
||||
'@deepseek-ai/dsh-client-runtime',
|
||||
'@deepseek-ai/dsh-client-ui-conversation',
|
||||
'@deepseek-ai/dsh-client-ui-sidebar',
|
||||
],
|
||||
},
|
||||
]
|
||||
|
||||
const bundles = new Map(PLUGINS.map(plugin => [
|
||||
plugin.url,
|
||||
readFileSync(join(process.cwd(), 'packages/client', plugin.dir, 'lib/client.js'), 'utf8'),
|
||||
]))
|
||||
|
||||
interface FixtureWindow extends Window {
|
||||
__DSH_BOOT__?: { rev: string; entries: WebBootEntry[] }
|
||||
__ModuleLoader__?: unknown
|
||||
}
|
||||
|
||||
class ResizeObserverStub {
|
||||
observe(): void {}
|
||||
disconnect(): void {}
|
||||
unobserve(): void {}
|
||||
}
|
||||
|
||||
const win = window as FixtureWindow
|
||||
let unmount: (() => void) | undefined
|
||||
|
||||
beforeEach(() => {
|
||||
localStorage.clear()
|
||||
document.title = 'DeepSeek Harness'
|
||||
vi.stubGlobal('ResizeObserver', ResizeObserverStub)
|
||||
vi.stubGlobal('requestAnimationFrame', (callback: FrameRequestCallback) =>
|
||||
setTimeout(() => { callback(0) }, 0) as unknown as number)
|
||||
vi.stubGlobal('cancelAnimationFrame', (id: number) => { clearTimeout(id) })
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
act(() => { unmount?.() })
|
||||
unmount = undefined
|
||||
cleanup()
|
||||
delete win.__DSH_BOOT__
|
||||
delete win.__ModuleLoader__
|
||||
document.body.innerHTML = ''
|
||||
document.head.querySelectorAll('style[data-plugin]').forEach((style) => { style.remove() })
|
||||
document.title = ''
|
||||
history.replaceState(null, '', '/')
|
||||
vi.unstubAllGlobals()
|
||||
})
|
||||
|
||||
/** Boot the complete built client graph against the populated fixture branch. */
|
||||
function boot(): void {
|
||||
history.replaceState(null, '', '/?fixture')
|
||||
const root = document.createElement('div')
|
||||
root.id = 'root'
|
||||
document.body.appendChild(root)
|
||||
win.__DSH_BOOT__ = { rev: 'fx', entries: PLUGINS.map(({ dir: _dir, ...plugin }) => plugin) }
|
||||
act(() => {
|
||||
const entry = new AppWebEntry(root, {
|
||||
fetchBundle: (url) => {
|
||||
const code = bundles.get(url)
|
||||
return code === undefined ? Promise.reject(new Error(`missing built bundle ${url}`)) : Promise.resolve(code)
|
||||
},
|
||||
executeBundle: (code) => { (0, eval)(code) },
|
||||
})
|
||||
void entry.run()
|
||||
unmount = () => { entry.dispose() }
|
||||
})
|
||||
}
|
||||
|
||||
/** Collapse decorative whitespace while preserving the text a user sees. */
|
||||
function visibleText(element: Element): string {
|
||||
return (element.textContent ?? '').replace(/\s+/g, ' ').trim()
|
||||
}
|
||||
|
||||
/**
|
||||
* Read one terminal card's user-visible state. Output lines keep their interior
|
||||
* whitespace: holding column alignment is what this card exists for, so
|
||||
* collapsing runs of spaces would hide the behavior under test.
|
||||
*/
|
||||
function readCard(card: Element) {
|
||||
const status = card.querySelector('[class*="_status_"]')
|
||||
const expander = card.querySelector('button[aria-expanded]')
|
||||
return {
|
||||
// One entry per command line: a multi-line command is one row per line.
|
||||
prompt: [...card.querySelectorAll('[class*="_promptLine_"]')].map(row =>
|
||||
`${row.querySelector('[class*="_cwd_"]')?.textContent ?? ''} ${row.querySelector('[class*="_command_"]')?.textContent ?? ''}`),
|
||||
// Dots per prompt row: exactly one, on the first row — the exit status the
|
||||
// view carries is the whole call's, so a dot per line would assert a
|
||||
// per-line outcome bash does not report.
|
||||
dotsPerPromptRow: [...card.querySelectorAll('[class*="_promptLine_"]')].map(row =>
|
||||
row.querySelectorAll('[data-state]').length),
|
||||
status: status === null ? null : status.textContent,
|
||||
copy: card.querySelector('[class*="_copyButton_"]')?.textContent ?? null,
|
||||
lines: [...card.querySelectorAll('[class*="_line_"]')].map(line => line.textContent),
|
||||
expander: expander === null ? null : {
|
||||
label: expander.getAttribute('aria-label'),
|
||||
text: expander.textContent,
|
||||
expanded: expander.getAttribute('aria-expanded'),
|
||||
},
|
||||
// The run-state dot at the head of the prompt line, by its StateDot state.
|
||||
runState: card.querySelector('[class*="_runState_"][data-state]')?.getAttribute('data-state') ?? null,
|
||||
runStateLabel: card.querySelector('[class*="_runStateLabel_"]')?.textContent ?? null,
|
||||
// Every color the ANSI parser emits resolves through a --dsw-* token, so
|
||||
// the card follows the theme instead of painting literal terminal rgb.
|
||||
// Scoped to the output lines: the run-state dot is an inline-styled span
|
||||
// too, and its geometry is not an ANSI-resolved color.
|
||||
colors: [...new Set([...card.querySelectorAll('[class*="_line_"] span[style]')]
|
||||
.map(span => span.getAttribute('style')))],
|
||||
}
|
||||
}
|
||||
|
||||
/** Open the fixture history session (the alpha log carrying both bash turns) and wait for its tail. */
|
||||
async function openFixtureSession(): Promise<void> {
|
||||
const tree = await screen.findByRole('tree', { name: 'Sessions' }, { timeout: 10_000 })
|
||||
// Anchor on the expandable Workspace group row: the title and the blank
|
||||
// session row can both read "fixture".
|
||||
const group = (await within(tree).findAllByText('fixture'))
|
||||
.map(el => el.closest<HTMLElement>('[role="treeitem"]'))
|
||||
.find(el => el?.getAttribute('aria-expanded') !== null)
|
||||
if (group === null || group === undefined) throw new Error('fixture Workspace group missing')
|
||||
if (group.getAttribute('aria-expanded') === 'false') {
|
||||
fireEvent.click(within(group).getByText('fixture'))
|
||||
await waitFor(() => {
|
||||
expect(group.getAttribute('aria-expanded')).toBe('true')
|
||||
})
|
||||
}
|
||||
fireEvent.click(await within(tree).findByText('Fixture 历史会话'))
|
||||
await waitFor(() => {
|
||||
expect(document.querySelector('[data-sample="bash-global"]')).not.toBeNull()
|
||||
}, { timeout: 10_000 })
|
||||
}
|
||||
|
||||
/** The keyed BashRow of fixture turn 65 (the one carrying the ANSI sample). */
|
||||
function keyedBashRow(): Element {
|
||||
// Anchored on the BashRow wrapper (summary row + resident card), not on the
|
||||
// summary row itself: the summary now shows the presenter's description (the
|
||||
// contract's above-card text), so the command lives only in the card below it.
|
||||
const row = [...document.querySelectorAll('[data-sample="bash-global"]')]
|
||||
.map(node => node.parentElement)
|
||||
.find((node): node is HTMLElement => node !== null && visibleText(node).includes('pnpm run check'))
|
||||
if (row === undefined) throw new Error('keyed bash row for turn 65 missing')
|
||||
return row
|
||||
}
|
||||
|
||||
/** The turn-60 fallback row, which reaches the terminal card through GenericToolCard/ToolRow. */
|
||||
function fallbackBashRow(): Element {
|
||||
const row = document.querySelector('[data-tool="fx-bash"]')
|
||||
if (row === null) throw new Error('fx-bash fallback row missing')
|
||||
return row
|
||||
}
|
||||
|
||||
it('renders the keyed bash row with a resident terminal card', async () => {
|
||||
boot()
|
||||
await openFixtureSession()
|
||||
|
||||
const row = keyedBashRow()
|
||||
const card = row.parentElement?.querySelector('[data-terminal]')
|
||||
if (card === null || card === undefined) throw new Error('keyed bash row has no resident terminal card')
|
||||
// The prompt shortens the nested cwd to its last segment, the exit pill comes
|
||||
// from the sample's authored exit status (its body deliberately carries no
|
||||
// `[exit code: N]` marker, since the real presenter consumes that one), ANSI
|
||||
// runs land on theme tokens, and the chat cap (8) collapses the middle into a
|
||||
// head/tail split with an expander between them.
|
||||
expect(readCard(card)).toMatchInlineSnapshot(`
|
||||
{
|
||||
"colors": [
|
||||
"font-weight: 700;",
|
||||
"color: var(--dsw-alias-state-success-primary);",
|
||||
"color: var(--dsw-alias-state-error-primary);",
|
||||
],
|
||||
"copy": "复制",
|
||||
"dotsPerPromptRow": [
|
||||
1,
|
||||
],
|
||||
"expander": {
|
||||
"expanded": "false",
|
||||
"label": "展开其余 13 行输出",
|
||||
"text": "… 其余 13 行",
|
||||
},
|
||||
"lines": [
|
||||
"Running 4 checks",
|
||||
"✓ typecheck 1.82s",
|
||||
"✓ lint 0.94s",
|
||||
"✓ duplication 2.10s",
|
||||
"StateDot.tsx 100% 100% 100% -",
|
||||
"markdown/Markdown.tsx 100% 100% 100% -",
|
||||
"",
|
||||
"1 of 4 checks failed",
|
||||
],
|
||||
"prompt": [
|
||||
"nested pnpm run check",
|
||||
],
|
||||
"runState": "error",
|
||||
"runStateLabel": "失败",
|
||||
"status": "退出码 1",
|
||||
}
|
||||
`)
|
||||
})
|
||||
|
||||
it('the fallback row reaches the same card through its expand control', async () => {
|
||||
boot()
|
||||
await openFixtureSession()
|
||||
|
||||
const row = fallbackBashRow()
|
||||
expect(row.querySelector('[data-terminal]')).toBeNull()
|
||||
const toggle = row.querySelector('button[aria-expanded]')
|
||||
if (toggle === null) throw new Error('fallback row expand control missing')
|
||||
fireEvent.click(toggle)
|
||||
const card = await waitFor(() => {
|
||||
const found = row.querySelector('[data-terminal]')
|
||||
if (found === null) throw new Error('terminal card missing after expanding the fallback row')
|
||||
return found
|
||||
})
|
||||
// Three plain lines under the cap: no ANSI spans, no exit pill, no expander.
|
||||
expect(readCard(card)).toMatchInlineSnapshot(`
|
||||
{
|
||||
"colors": [],
|
||||
"copy": "复制",
|
||||
"dotsPerPromptRow": [
|
||||
1,
|
||||
0,
|
||||
],
|
||||
"expander": null,
|
||||
"lines": [
|
||||
"total 2",
|
||||
"drwxr-xr-x fixture",
|
||||
"-rw-r--r-- demo.txt",
|
||||
],
|
||||
"prompt": [
|
||||
"fixture ls -la",
|
||||
"$ echo done",
|
||||
],
|
||||
"runState": "done",
|
||||
"runStateLabel": "已完成",
|
||||
"status": null,
|
||||
}
|
||||
`)
|
||||
})
|
||||
|
||||
it('the chat card expands the collapsed middle in place, without opening the details panel', async () => {
|
||||
boot()
|
||||
await openFixtureSession()
|
||||
|
||||
const card = keyedBashRow().parentElement?.querySelector('[data-terminal]')
|
||||
if (card === null || card === undefined) throw new Error('resident terminal card missing')
|
||||
const expander = card.querySelector('button[aria-expanded]')
|
||||
if (expander === null) throw new Error('height-cap expander missing')
|
||||
const capped = card.querySelectorAll('[class*="_line_"]').length
|
||||
|
||||
fireEvent.click(expander)
|
||||
await waitFor(() => {
|
||||
expect(card.querySelector('button[aria-expanded]')?.getAttribute('aria-expanded')).toBe('true')
|
||||
})
|
||||
expect({
|
||||
cappedLines: capped,
|
||||
expandedLines: card.querySelectorAll('[class*="_line_"]').length,
|
||||
expanderLabel: card.querySelector('button[aria-expanded]')?.getAttribute('aria-label'),
|
||||
// The card sits outside the summary row's click target, so toggling it
|
||||
// left the details panel shut.
|
||||
detailsOpen: screen.queryByText('Input') !== null,
|
||||
}).toMatchInlineSnapshot(`
|
||||
{
|
||||
"cappedLines": 8,
|
||||
"detailsOpen": false,
|
||||
"expandedLines": 21,
|
||||
"expanderLabel": "收起输出",
|
||||
}
|
||||
`)
|
||||
})
|
||||
Reference in New Issue
Block a user