feat: public API, SEO and existing surfaces

web/visual/localizationSurfacesStates.ts

@@ -0,0 +1,51 @@
+import type { Page } from 'playwright'
+import { openOverflow, settle, state, type Setup } from './editorLocalizationStates'
+import { seoState } from './localizationMetadataStates'
+import type { VisualState } from './states'
+
+async function openDetails(page: Page) {
+	const width = page.viewportSize()?.width ?? 0
+	if (width < 1024) {
+		await page
+			.getByRole('button', { name: /^Details/ })
+			.first()
+			.click()
+		await page.getByRole('dialog').waitFor()
+	}
+	await page
+		.getByText('Public API URL', { exact: true })
+		.locator('visible=true')
+		.first()
+		.waitFor()
+	await settle(page)
+}
+
+async function openMenu(page: Page) {
+	await openOverflow(page)
+}
+
+async function copyApiUrl(page: Page) {
+	await page.evaluate(() => {
+		Object.defineProperty(navigator, 'clipboard', {
+			value: { writeText: async () => undefined },
+			configurable: true,
+		})
+	})
+	await openDetails(page)
+	await page.getByRole('button', { name: 'Copy the public API URL' }).first().click()
+	await page.getByText('API URL copied', { exact: true }).waitFor()
+	await settle(page)
+}
+
+const PATTERN = 'https://journal.example.com/{lang}/{slug}'
+const french: Setup = { suggestion: false }
+
+export const surfacesStates: Record<string, VisualState> = {
+	'loc.l12.home': { path: '/home', skip: 'clock-sensitive' },
+	'loc.l12.homeFr': { path: '/home', skip: 'clock-sensitive' },
+	'loc.l12.activity': { path: '/activity', skip: 'clock-sensitive' },
+	'loc.l12.menu': state(french, openMenu),
+	'loc.l12.apiCopy': state(french, copyApiUrl),
+	'loc.l12.seoPreview': seoState(french, PATTERN, 'fr_FR', true),
+	'loc.l12.siteFallback': seoState(french, PATTERN, 'fr_FR', true),
+}