71 lines
3 KiB
JavaScript
71 lines
3 KiB
JavaScript
|
// UI check for headless OpenPencil design mode: stubs the canvas store into "headless running"
|
||
|
|
// (the backend cannot report it while chatapi is down) and screenshots the Design Studio page and
|
||
|
|
// the highlighted drawer entry + tooltip. Temporary script — deleted after the run.
|
||
|
|
import { chromium } from '@playwright/test'
|
||
|
|
|
||
|
|
const out = process.argv[2] || '/home/joe/sources/wiz4apps/phase-artifacts/phase-design-headless-canvas'
|
||
|
|
const browser = await chromium.launch({ headless: true, args: ['--no-sandbox', '--disable-dev-shm-usage'] })
|
||
|
|
const page = await browser.newPage({ viewport: { width: 1440, height: 900 } })
|
||
|
|
|
||
|
|
// The app shows /login unless a session token is present. Borrow the dev token from the already
|
||
|
|
// authed tab through the debug bridge instead of logging in again (never printed here).
|
||
|
|
const bridge = await fetch('http://localhost:9000/__debug/eval', {
|
||
|
|
method: 'POST',
|
||
|
|
headers: { 'Content-Type': 'application/json' },
|
||
|
|
body: JSON.stringify({
|
||
|
|
code: "return { dev: sessionStorage.getItem('w4c-dev-token') || '', jwt: localStorage.getItem('w4c-token') || '' };",
|
||
|
|
}),
|
||
|
|
}).then((r) => r.json())
|
||
|
|
const { dev: devToken, jwt } = bridge.result ?? {}
|
||
|
|
const token = devToken || jwt
|
||
|
|
console.log('auth: tokenAquired=', Boolean(token), 'kind=', jwt ? 'jwt' : devToken ? 'dev' : 'none')
|
||
|
|
await page.addInitScript(
|
||
|
|
([dev, j]) => {
|
||
|
|
if (dev) sessionStorage.setItem('w4c-dev-token', dev)
|
||
|
|
if (j) localStorage.setItem('w4c-token', j)
|
||
|
|
},
|
||
|
|
[devToken, jwt]
|
||
|
|
)
|
||
|
|
|
||
|
|
await page.goto('http://localhost:9000/#/design-studio', { waitUntil: 'domcontentloaded' })
|
||
|
|
await page.waitForTimeout(4000)
|
||
|
|
|
||
|
|
const stubbed = await page.evaluate(async () => {
|
||
|
|
const m = await import('/src/stores/openPencilCanvasStore.ts')
|
||
|
|
const s = m.useOpenPencilCanvasStore()
|
||
|
|
s.stopPolling()
|
||
|
|
s.status = {
|
||
|
|
mode: 'headless',
|
||
|
|
connected: true,
|
||
|
|
headless: {
|
||
|
|
running: true,
|
||
|
|
startedAt: new Date(Date.now() - 95_000).toISOString(),
|
||
|
|
lastUsedAt: new Date().toISOString(),
|
||
|
|
idleSeconds: 180,
|
||
|
|
autoStart: true,
|
||
|
|
lastError: null,
|
||
|
|
},
|
||
|
|
}
|
||
|
|
return { mode: s.mode, headlessRunning: s.headlessRunning }
|
||
|
|
})
|
||
|
|
console.log('stubbed:', JSON.stringify(stubbed))
|
||
|
|
|
||
|
|
await page.waitForTimeout(700)
|
||
|
|
const iframes = await page.locator('iframe').count()
|
||
|
|
const panel = page.locator('.op-headless')
|
||
|
|
console.log('iframeCount:', iframes, 'headlessPanelVisible:', await panel.isVisible())
|
||
|
|
await page.locator('.openpencil-page').screenshot({ path: `${out}/design-studio-headless.png` })
|
||
|
|
|
||
|
|
// Drawer entry: highlight + robot icon + tooltip.
|
||
|
|
const item = page.locator('.drawer-item-headless')
|
||
|
|
console.log('highlightedDrawerItems:', await item.count())
|
||
|
|
await page.locator('.menu-headless').first().hover({ force: true })
|
||
|
|
await page.waitForTimeout(2500)
|
||
|
|
await page.locator('.menu-headless').first().hover({ force: true })
|
||
|
|
await page.waitForTimeout(1500)
|
||
|
|
const tooltip = await page.locator('.q-tooltip').first().innerText().catch(() => '(none)')
|
||
|
|
console.log('tooltip:', tooltip.replace(/\n+/g, ' | '))
|
||
|
|
await page.screenshot({ path: `${out}/drawer-headless-highlight.png` })
|
||
|
|
|
||
|
|
await browser.close()
|