New_Micro_Learning/frontend/e2e/phase6-builder-ai-studio.sp...

92 خطوط
5.8 KiB
TypeScript

import { expect, test } from '@playwright/test'
async function login(page: import('@playwright/test').Page) {
await page.goto('http://127.0.0.1:5173/login')
await page.getByLabel(/ایمیل|Email/).fill('designer@microlearn.test')
await page.getByLabel(/رمز عبور|Password/).fill('password')
await page.getByRole('button', { name: /ورود|Sign in/ }).click()
await expect(page).toHaveURL(/\/app\/dashboard$/)
}
test('builder uses the production authoring workspace architecture', async ({ page }) => {
await page.setViewportSize({ width: 1440, height: 900 })
await login(page)
await page.goto('http://127.0.0.1:5173/app/builder-preview')
await expect(page.getByRole('heading', { name: 'بهترین روش‌های ایمنی در محیط کار' })).toBeVisible()
await expect(page.getByRole('banner')).toContainText('ذخیره خودکار فعال است')
await expect(page.getByRole('complementary', { name: 'ساختار دوره' })).toBeVisible()
await page.getByRole('button', { name: 'افزودن', exact: true }).click()
const library = page.getByRole('dialog', { name: 'کتابخانه بلاک‌ها' })
const search = library.getByRole('searchbox', { name: 'جست‌وجوی بلاک‌ها' })
await expect(search).toBeVisible()
await search.fill('تصویر')
await expect(library.getByRole('button', { name: 'افزودن تصویر', exact: true })).toBeVisible()
await expect(library.getByRole('button', { name: 'افزودن متن', exact: true })).toHaveCount(0)
await search.fill('')
await library.getByLabel('بستن کتابخانه').click()
await page.getByRole('heading', { name: 'بهترین روش‌های ایمنی در محیط کار' }).click()
const panel = page.getByLabel('تنظیمات زمینه‌ای')
await expect(panel.getByRole('button', { name: 'محتوا' })).toBeVisible()
await expect(panel.getByRole('button', { name: 'دسترس‌پذیری' })).toBeVisible()
await panel.getByRole('button', { name: 'طراحی' }).click()
await panel.getByLabel('اندازه فونت').fill('44')
await expect(page.locator('.canvas-block.is-selected .render-heading')).toHaveCSS('font-size', '44px')
await expect(panel.getByText(/ذخیره شد · ویرایش/)).toBeVisible()
await page.evaluate(() => (document.activeElement as HTMLElement | null)?.blur())
await page.keyboard.press('/')
await expect(page.getByRole('dialog', { name: 'انتخاب بلاک' })).toBeVisible()
await page.keyboard.press('Escape')
await expect(page.getByRole('dialog', { name: 'انتخاب بلاک' })).toHaveCount(0)
await page.getByRole('heading', { name: 'بهترین روش‌های ایمنی در محیط کار' }).click()
const canvasShare = await page.evaluate(() => {
const workspace = document.querySelector('.builder-workspace')?.getBoundingClientRect()
const canvas = document.querySelector('.builder-canvas-wrap')?.getBoundingClientRect()
return workspace && canvas ? canvas.width / workspace.width : 0
})
expect(canvasShare).toBeGreaterThan(0.35)
await expect(page.getByText(/زمان تخمینی:/)).toBeVisible()
expect(await page.evaluate(() => document.documentElement.scrollWidth <= document.documentElement.clientWidth)).toBe(true)
})
test('AI Studio four-stage workflow stays usable on a narrow viewport', async ({ page }) => {
await page.setViewportSize({ width: 375, height: 812 })
await login(page)
await page.goto('http://127.0.0.1:5173/app/ai-studio')
await expect(page.getByRole('heading', { name: 'استودیوی هوش مصنوعی' })).toBeVisible()
const workflow = page.getByRole('list', { name: 'مراحل ساخت با هوش مصنوعی' })
await expect(workflow).toBeVisible()
await expect(workflow.getByText('منبع').locator('..')).toHaveAttribute('aria-current', 'step')
await expect(page.getByLabel('مخاطب')).toBeVisible()
await page.getByLabel('مخاطب').selectOption('managers')
await page.getByLabel('موضوع دوره').fill('ایمنی محیط کار')
await page.getByRole('button', { name: 'ادامه به طراحی یادگیری' }).click()
await expect(page.getByRole('heading', { name: 'طراحی دوره' })).toBeVisible()
await expect(page.getByLabel('مخاطب')).toHaveCount(0)
await expect(page.getByText('مدیران', { exact: true })).toBeVisible()
await page.getByRole('button', { name: 'ادامه به مرور درخواست' }).click()
await expect(page.getByRole('heading', { name: 'مرور درخواست' })).toBeVisible()
await expect(page.getByText('مدیران', { exact: true })).toBeVisible()
await expect(page.getByRole('button', { name: /شروع تولید/ })).toBeVisible()
expect(await page.evaluate(() => document.documentElement.scrollWidth <= document.documentElement.clientWidth)).toBe(true)
await expect(page.locator('html')).toHaveAttribute('dir', 'rtl')
await page.locator('html').evaluate(element => element.setAttribute('dir', 'ltr'))
expect(await page.evaluate(() => document.documentElement.scrollWidth <= document.documentElement.clientWidth)).toBe(true)
await page.evaluate(() => window.localStorage.setItem('microlearn.theme', 'dark'))
await page.reload()
await expect(page.locator('html')).toHaveAttribute('data-theme', 'dark')
await expect(page.locator('.ai-course-details')).toBeVisible()
const darkSurfaceColors = await page.evaluate(() => {
const step = document.querySelector('.ai-course-details')
const probe = document.createElement('div')
probe.style.background = 'var(--surface)'
document.body.append(probe)
const colors = { step: step ? getComputedStyle(step).backgroundColor : 'missing', token: getComputedStyle(probe).backgroundColor }
probe.remove()
return colors
})
expect(darkSurfaceColors.step).toBe(darkSurfaceColors.token)
})