import { test, expect } from '@playwright/test'

const wysiwygUrl = '/en/wysiwyg'

async function getBox(page: import('@playwright/test').Page, nth: number) {
  const el = page.locator('[data-testid^="obj-text-"]').nth(nth)
  const left = await el.evaluate((n) => parseInt((n as HTMLElement).style.left || '0', 10))
  const top = await el.evaluate((n) => parseInt((n as HTMLElement).style.top || '0', 10))
  const width = await el.evaluate((n) => parseInt((n as HTMLElement).style.width || '0', 10))
  return { left, top, width }
}

test.describe('WYSIWYG - Rotate then drag snap priority', () => {
  test('after 15deg rotation, dragging still prefers edge over grid; live region announces guides', async ({ page }) => {
    await page.goto(wysiwygUrl)
    const canvas = page.getByTestId('wysiwyg-canvas')
    await expect(canvas).toBeVisible()

    const addText = page.getByRole('button', { name: /^Add Text$/i })
    await addText.click()
    await addText.click()

    const first = page.locator('[data-testid^="obj-text-"]').first()
    const second = page.locator('[data-testid^="obj-text-"]').nth(1)

    // Select second
    await second.click()

    // Rotate ~15deg using rotate handle
    const rotateHandle = page.locator('[data-testid^="rotate-handle-"]').first()
    const hbox = await rotateHandle.boundingBox()
    if (!hbox) throw new Error('rotate handle not found')
    await page.mouse.move(hbox.x + 5, hbox.y + 5)
    await page.mouse.down()
    await page.mouse.move(hbox.x + 40, hbox.y + 5)
    const live = page.getByTestId('aria-live')
    await expect(live).toContainText(/가이드\s*x=|y=/)
    await page.mouse.up()

    // Drag rotated second near first's right edge → should still snap by edge priority
    const b1 = await first.boundingBox()
    const b2 = await second.boundingBox()
    if (!b1 || !b2) throw new Error('objects not found')
    const targetX = b1.x + b1.width - 2
    await page.mouse.move(b2.x + 5, b2.y + 5)
    await page.mouse.down()
    await page.mouse.move(targetX, b2.y + 5)
    await page.mouse.up()

    const f = await getBox(page, 0)
    const s = await getBox(page, 1)
    const expectedLeft = f.left + f.width
    expect(Math.abs(s.left - expectedLeft)).toBeLessThanOrEqual(1)
  })
})