- Track loaded font provenance and aggregate page-level face fidelity, including synthesized styles and active Inter substitutions - Add a localized warning banner with retry and affected-layer actions - Expose get_font_status through the Figma API and MCP tool registry
69 lines
3.3 KiB
TypeScript
69 lines
3.3 KiB
TypeScript
import { expect, test } from '@playwright/test'
|
|
|
|
import { CanvasHelper } from '#tests/helpers/canvas'
|
|
|
|
test('font settings popover exposes web font access without desktop-only cache actions', async ({
|
|
page
|
|
}) => {
|
|
await page.goto('/')
|
|
const canvas = new CanvasHelper(page)
|
|
await canvas.waitForInit()
|
|
|
|
await page.evaluate(() => {
|
|
const store = window.openPencil?.getStore?.()
|
|
if (!store) throw new Error('OpenPencil store not initialized')
|
|
const id = store.createShape('TEXT', 120, 120, 240, 40)
|
|
store.updateNode(id, {
|
|
characters: 'Font settings smoke',
|
|
fontFamily: 'Missing Test Sans'
|
|
})
|
|
store.select([id])
|
|
})
|
|
|
|
const typography = page.getByRole('region', { name: 'Typography' })
|
|
await expect(typography).toBeVisible()
|
|
await expect(
|
|
typography.getByRole('img', { name: /Missing font: Missing Test Sans/ })
|
|
).toBeVisible()
|
|
const fontBanner = page.getByTestId('font-status-banner')
|
|
await expect(fontBanner).toContainText('1 font face is unavailable or substituted')
|
|
await page.getByTestId('font-status-toggle').click()
|
|
await expect(page.getByTestId('font-status-issue')).toContainText(
|
|
'Missing Test Sans Regular → Inter'
|
|
)
|
|
await page.getByTestId('font-status-select').click()
|
|
await expect(page.getByTestId('font-status-banner')).toBeVisible()
|
|
const selected = await page.evaluate(() => {
|
|
const store = window.openPencil?.getStore?.()
|
|
return store ? [...store.state.selectedIds] : []
|
|
})
|
|
expect(selected).toHaveLength(1)
|
|
const fontSettings = page.getByRole('button', { name: 'Font settings' })
|
|
await expect(fontSettings).toHaveAttribute('data-test-id', 'font-settings-trigger')
|
|
await fontSettings.hover()
|
|
await expect(page.locator('[role=tooltip]').filter({ hasText: 'Font settings' })).toBeVisible()
|
|
await fontSettings.click()
|
|
await expect(page.locator('[role=tooltip]').filter({ hasText: 'Font settings' })).toHaveCount(0)
|
|
|
|
await expect(page.getByText('Allow browser access to local fonts')).toBeVisible()
|
|
await expect(page.getByTestId('font-settings-request-access')).toBeVisible()
|
|
await expect(page.getByTestId('font-settings-toggle-online-fonts')).toHaveText('Disable')
|
|
await expect(page.getByTestId('font-settings-provider-google')).toBeChecked()
|
|
await expect(page.getByTestId('font-settings-provider-fontsource')).toBeChecked()
|
|
await expect(page.getByTestId('font-settings-provider-bunny')).not.toBeChecked()
|
|
await expect(page.getByTestId('font-settings-provider-fontshare')).not.toBeChecked()
|
|
await page.getByTestId('font-settings-toggle-online-fonts').click()
|
|
await expect(page.getByTestId('font-settings-toggle-online-fonts')).toHaveText('Enable')
|
|
await expect(page.getByTestId('font-settings-provider-google')).toBeDisabled()
|
|
await page.getByTestId('font-settings-toggle-online-fonts').click()
|
|
await expect(page.getByTestId('font-settings-toggle-online-fonts')).toHaveText('Disable')
|
|
await expect(page.getByTestId('font-settings-download-fallbacks')).toHaveCount(0)
|
|
await expect(page.getByTestId('font-settings-refresh-cache')).toHaveCount(0)
|
|
await expect(page.getByTestId('font-settings-clear-cache')).toHaveCount(0)
|
|
await expect(page.getByText('Download CJK and Arabic fallbacks')).toHaveCount(0)
|
|
|
|
await page.keyboard.press('Escape')
|
|
await expect(page.getByTestId('font-settings-panel')).toBeHidden()
|
|
await expect(typography).toBeVisible()
|
|
})
|