Merge pull request 'auto: PR for feat/image-opt-2nd' (#81 ) from feat/image-opt-2nd into main

Reviewed-on: #81
auto: PR for feat/export-css-tokens-deep (#83 )
2025-11-17 10:43:45 +00:00 · 2025-11-17 10:41:27 +00:00 · 2025-11-17 08:46:18 +00:00 · 2025-11-17 08:35:54 +00:00 · 2025-11-17 01:19:13 +00:00 · 2025-11-16 16:50:28 +00:00
9 changed files with 0 additions and 646 deletions
@@ -248,49 +248,6 @@
  - 이동하지 않은 축은 기존 좌표 유지하여 비의도 축 보정 방지
 - 결과: 전체 테스트 그린(168 파일 / 295 테스트)

-### CI E2E 수정: 마퀴 시작 판정 완화 (2025-11-17)
- 원인: 빈 영역 드래그 시에도 마퀴가 시작해야 하나, 캔버스 data-testid 직접 비교로 인해 실제 히트박스에서 시작 누락 → aria-live "선택 0개" 유지
- 조치: `components/wysiwyg/Canvas.tsx`의 `onMouseDown`에서 객체/핸들 근접 여부 검사(`closest`)로 판정 완화, 객체/핸들이 아닌 영역이면 항상 마퀴 시작
- 결과: E2E 라이브리전 멀티선택 문구 안정화, 전체 테스트 그린 유지
-
-### E2E 스모크: 그룹 드래그 스냅 델타 동일 적용 (2025-11-17)
- 테스트: `tests/e2e/wysiwyg-group-drag.e2e.ts`
-  - 마퀴로 2개 선택 후, 선택 중 하나를 +16px 드래그 → 8px 스냅 반영 동일 델타로 양 객체 이동 검증
- 기대/결과: 스냅된 델타(dx)가 선택 전체에 동일하게 적용됨 확인
-
-### E2E 스모크 확장: 그룹 리사이즈(E)/회전(15°) + 가이드 라이브리전 (2025-11-17)
- 테스트: `tests/e2e/wysiwyg-group-resize-rotate.e2e.ts`
-  - 그룹 E 핸들 리사이즈: 좌표 고정, width만 스냅 증가, 두 객체 동일 증분
-  - 회전 핸들: 15° 단위 스냅, 드래그 중 라이브리전에 가이드 좌표 문구 포함
- 결과: 그룹 액션 스냅/가이드 UX 안정화 스모크 통과
-
-### 이미지 최적화 옵션 2차 TDD (2025-11-17)
- 테스트: `lib/exporter/image.responsive.options.matrix.test.ts`
-  - loading/decoding/fetchpriority 적용
-  - srcset + autoSizes + preset 동시 제공 시 preset 우선
-  - explicit sizes가 있으면 preset/autoSizes보다 우선
- 구현 상태: `lib/exporter/html.ts`의 기존 로직이 요구사항 충족(우선순위: explicit > preset > default(autoSizes))
-
-### Export CSS 토큰 딥 회귀 (폼/테마) (2025-11-17)
- 테스트: `lib/wysiwyg/export.style.tokens.form.deep.test.ts`
-  - 토큰 존재: `--ring`, `--ring-offset`, `--disabled-bg`, `--disabled-fg`
-  - 사용 검증: `:focus-visible` 링/오프셋, `:disabled` BG, `[readonly]` FG
-  - 테마 프리셋: `[data-theme="light|dark"]`에서 `--bg` 제공, `.frame{background:var(--bg)}` 유지
- 결과: 토큰/참조/테마 오버라이드 회귀 보강, 전체 테스트 그린(170 파일/300 테스트)
-
-### 스냅 우선순위 E2E (에지 > 센터 > 그리드) (2025-11-17)
- 테스트: `tests/e2e/wysiwyg-snap-priority.e2e.ts`
-  - 에지 스냅 우선: 인접 객체 에지 정렬이 그리드보다 우선 적용
-  - 센터 스냅 우선: 중심 정렬 후보 시 그리드보다 센터 스냅 우선
-  - 그리드 단독: 인접 후보가 없을 때 13px → 16px 그리드 스냅
- 결과: 스냅 우선순위 정책(에지 > 센터 > 그리드) 회귀 스모크 확보
-
-### 회전 후 스냅 유지 E2E (에지 > 그리드) (2025-11-17)
- 테스트: `tests/e2e/wysiwyg-rotate-snap.e2e.ts`
-  - 객체를 15° 회전 후 드래그해도 에지 스냅이 그리드보다 우선 적용됨 검증
-  - 드래그 중 라이브리전 가이드 텍스트 노출 확인(가이드 x/y)
- 결과: 회전 상태에서도 스냅 우선순위 일관성 확보, 라이브리전 가이드 동작 스모크 통과
-
 ## 목표
 - 비개발자도 사용 가능한 단일 페이지 랜딩 페이지 빌더.
 - 결과물: 정적 ZIP(HTML/CSS/JS) 다운로드. 이미지: 외부 URL 또는 로컬 업로드(서버 저장 없음, ZIP에 패키징). 폰트는 외부 CDN 허용.
@@ -1,65 +0,0 @@
-import { describe, it, expect } from 'vitest'
-import { exportFrame } from '@/lib/wysiwyg/export'
-import type { Frame } from '@/lib/wysiwyg/schema'
-
-function frameWithForm(): Frame {
-  return {
-    id: 'f', width: 600, height: 400, background: '#ffffff',
-    layers: [
-      {
-        id: 'base', name: 'Base', visible: true, locked: false, objects: [
-          { id: 't1', type: 'input', x: 40, y: 40, width: 200, height: 32, rotate: 0, zIndex: 0, props: { name: 'email', label: 'Email', placeholder: '', required: true, help: 'We never share your email.' } },
-          { id: 't2', type: 'select', x: 40, y: 100, width: 200, height: 32, rotate: 0, zIndex: 0, props: { name: 'country', label: 'Country', options: ['KR','US'], defaultValue: 'KR', help: 'Pick one' } },
-          { id: 't3', type: 'textarea', x: 40, y: 160, width: 280, height: 80, rotate: 0, zIndex: 0, props: { name: 'msg', label: 'Message', placeholder: '', rows: 3, required: false, help: 'Optional' } },
-          { id: 't4', type: 'radio', x: 320, y: 40, width: 200, height: 90, rotate: 0, zIndex: 0, props: { name: 'plan', legend: 'Plan', options: ['Basic','Pro'], defaultValue: 'Basic', required: false, help: 'Choose your plan' } },
-          { id: 't5', type: 'checkbox', x: 320, y: 150, width: 200, height: 60, rotate: 0, zIndex: 0, props: { name: 'agree', legend: 'Agree to terms', options: ['Yes'], defaultValues: [], required: false, help: 'You must agree' } },
-        ]
-      }
-    ],
-  }
-}
-
-describe('wysiwyg export - a11y matrix for form controls', () => {
-  it('label/for + aria-describedby for input/select/textarea', () => {
-    const out = exportFrame(frameWithForm())
-    const html = out.html
-    // input
-    expect(html).toMatch(/<label for="t1-control">Email<\/label>/)
-    expect(html).toMatch(/<input[^>]*id="t1-control"[^>]*name="email"[^>]*required/)
-    expect(html).toMatch(/<small id="t1-control-help">We never share your email\.<\/small>/)
-    expect(html).toMatch(/<input[^>]*aria-describedby="t1-control-help"/)
-    // select
-    expect(html).toMatch(/<label for="t2-control">Country<\/label>/)
-    expect(html).toMatch(/<select[^>]*id="t2-control"[^>]*name="country"[^>]*aria-describedby="t2-control-help"/)
-    expect(html).toMatch(/<small id="t2-control-help">Pick one<\/small>/)
-    // textarea
-    expect(html).toMatch(/<label for="t3-control">Message<\/label>/)
-    expect(html).toMatch(/<textarea[^>]*id="t3-control"[^>]*name="msg"[^>]*aria-describedby="t3-control-help"/)
-    expect(html).toMatch(/<small id="t3-control-help">Optional<\/small>/)
-  })
-
-  it('fieldset/legend present for radio group with help items', () => {
-    const out = exportFrame(frameWithForm())
-    const html = out.html
-    // fieldset/legend exist (current implementation does not add aria-describedby on fieldset)
-    expect(html).toMatch(/<fieldset id="t4">/)
-    expect(html).toMatch(/<legend>Plan<\/legend>/)
-    // individual radio inputs share name and carry required if set on group (not set here), and pattern/max if present
-    expect(html).toMatch(/<input type="radio" id="t4-0" name="plan" value="Basic" checked/)
-    expect(html).toMatch(/<label for="t4-0">Basic<\/label>/)
-    expect(html).toMatch(/<input type="radio" id="t4-1" name="plan" value="Pro"/)
-    expect(html).toMatch(/<label for="t4-1">Pro<\/label>/)
-    // help element exists (small)
-    expect(html).toMatch(/<small id="t4-help">Choose your plan<\/small>/)
-  })
-  
-  it('fieldset/legend present for checkbox group with help items', () => {
-    const out = exportFrame(frameWithForm())
-    const html = out.html
-    expect(html).toMatch(/<fieldset id="t5">/)
-    expect(html).toMatch(/<legend>Agree to terms<\/legend>/)
-    expect(html).toMatch(/<input type="checkbox" id="t5-0" name="agree" value="Yes"/)
-    expect(html).toMatch(/<label for="t5-0">Yes<\/label>/)
-    expect(html).toMatch(/<small id="t5-help">You must agree<\/small>/)
-  })
-})
@@ -1,35 +0,0 @@
-import { describe, it, expect } from 'vitest'
-import { exportFrame } from '@/lib/wysiwyg/export'
-import type { Frame } from '@/lib/wysiwyg/schema'
-
-function baseFrame(): Frame {
-  return {
-    id: 'f', width: 400, height: 300, background: '#111111',
-    layers: [{ id: 'l1', name: 'Base', visible: true, locked: false, objects: [] }],
-  }
-}
-
-describe('wysiwyg export - form tokens deep regression', () => {
-  it('contains ring/disabled tokens and applies across selectors', () => {
-    const out = exportFrame(baseFrame())
-    const css = out.css
-    // tokens
-    expect(css).toMatch(/:root[^}]*--ring:/)
-    expect(css).toMatch(/:root[^}]*--ring-offset:/)
-    expect(css).toMatch(/:root[^}]*--disabled-bg:/)
-    expect(css).toMatch(/:root[^}]*--disabled-fg:/)
-    // usages
-    expect(css).toMatch(/:focus-visible\s*{[^}]*outline:2px solid var\(--ring\)/)
-    expect(css).toMatch(/:focus-visible\s*{[^}]*outline-offset:var\(--ring-offset\)/)
-    expect(css).toMatch(/input:disabled,select:disabled,textarea:disabled\s*{[^}]*background:var\(--disabled-bg\)/)
-    expect(css).toMatch(/input\[readonly\],select\[readonly\],textarea\[readonly\]\s*{[^}]*color:var\(--disabled-fg\)/)
-  })
-
-  it('themes define overrides without breaking base var() usage', () => {
-    const out = exportFrame(baseFrame())
-    const css = out.css
-    expect(css).toMatch(/\[data-theme="light"\][^{]*{[^}]*--bg:/)
-    expect(css).toMatch(/\[data-theme="dark"\][^{]*{[^}]*--bg:/)
-    expect(css).toMatch(/\.frame\s*{[^}]*background:var\(--bg\)/)
-  })
-})
@@ -1,64 +0,0 @@
-import { test, expect } from '@playwright/test'
-
-const wysiwygUrl = '/en/wysiwyg'
-
-async function getLefts(page: import('@playwright/test').Page) {
-  const els = page.locator('[data-testid^="obj-text-"]')
-  const count = await els.count()
-  const results: number[] = []
-  for (let i = 0; i < count; i++) {
-    const style = await els.nth(i).evaluate((n) => (n as HTMLElement).style.left || '0')
-    results.push(parseInt(style || '0', 10))
-  }
-  return results
-}
-
-test.describe('WYSIWYG - Group rotate then drag with snap and live region', () => {
-  test('after rotating multiselect, dragging group by 13px snaps to 16px; live region says 선택 2개', 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()
-
-    // Marquee select both
-    const cbox = await canvas.boundingBox()
-    if (!cbox) throw new Error('canvas not found')
-    await page.mouse.move(cbox.x + 40, cbox.y + 40)
-    await page.mouse.down()
-    await page.mouse.move(cbox.x + 260, cbox.y + 160)
-    await page.mouse.up()
-
-    const live = page.getByTestId('aria-live')
-    await expect(live).toContainText(/선택\s*2개/)
-
-    // Rotate ~15deg via 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)
-    await expect(live).toContainText(/가이드\s*x=|y=/)
-    await page.mouse.up()
-
-    const before = await getLefts(page)
-
-    // Drag group by ~13px on X; expect grid snap to 16
-    const target = page.locator('[data-testid^="obj-text-"]').nth(1)
-    const tbox = await target.boundingBox()
-    if (!tbox) throw new Error('target not found')
-    await page.mouse.move(tbox.x + 5, tbox.y + 5)
-    await page.mouse.down()
-    await page.mouse.move(tbox.x + 5 + 13, tbox.y + 5)
-    await page.mouse.up()
-
-    const after = await getLefts(page)
-    const dx = after[1] - before[1]
-    expect(dx).toBe(16)
-    expect(after[0] - before[0]).toBe(16)
-  })
-})
@@ -1,113 +0,0 @@
-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))
-  const height = await el.evaluate((n) => parseInt((n as HTMLElement).style.height || '0', 10))
-  return { left, top, width, height }
-}
-
-function snap8(v: number) { return Math.round(v / 8) * 8 }
-
-test.describe('WYSIWYG - Group rotate then resize (N/S) with snap', () => {
-  test('rotate ~15°, then group resize S by +16 (snap) — heights grow equally, top unchanged', 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()
-
-    // marquee select both
-    const cbox = await canvas.boundingBox()
-    if (!cbox) throw new Error('canvas not found')
-    await page.mouse.move(cbox.x + 40, cbox.y + 40)
-    await page.mouse.down()
-    await page.mouse.move(cbox.x + 260, cbox.y + 160)
-    await page.mouse.up()
-
-    // rotate to ~15°
-    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)
-    await page.mouse.up()
-
-    const b0 = await getBox(page, 0)
-    const b1 = await getBox(page, 1)
-
-    // resize south edge of the second by +16px
-    const target = page.locator('[data-testid^="obj-text-"]').nth(1)
-    const tbox = await target.boundingBox()
-    if (!tbox) throw new Error('target not found')
-    await page.mouse.move(tbox.x + 5, tbox.y + tbox.height - 3)
-    await page.mouse.down()
-    await page.mouse.move(tbox.x + 5, tbox.y + tbox.height + 16)
-    await page.mouse.up()
-
-    const a0 = await getBox(page, 0)
-    const a1 = await getBox(page, 1)
-
-    const dh = snap8(b1.height + 16) - b1.height
-    expect(a0.top).toBe(b0.top)
-    expect(a1.top).toBe(b1.top)
-    expect(a0.height).toBe(b0.height + dh)
-    expect(a1.height).toBe(b1.height + dh)
-  })
-
-  test('rotate ~15°, then group resize N by +16 (snap) — heights grow equally, top shifts equally', 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()
-
-    // marquee select both
-    const cbox = await canvas.boundingBox()
-    if (!cbox) throw new Error('canvas not found')
-    await page.mouse.move(cbox.x + 40, cbox.y + 40)
-    await page.mouse.down()
-    await page.mouse.move(cbox.x + 260, cbox.y + 160)
-    await page.mouse.up()
-
-    // rotate to ~15°
-    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)
-    await page.mouse.up()
-
-    const b0 = await getBox(page, 0)
-    const b1 = await getBox(page, 1)
-
-    // resize north edge of the first by -16px (drag up)
-    const first = page.locator('[data-testid^="obj-text-"]').first()
-    const fbox = await first.boundingBox()
-    if (!fbox) throw new Error('first not found')
-    await page.mouse.move(fbox.x + 5, fbox.y + 3)
-    await page.mouse.down()
-    await page.mouse.move(fbox.x + 5, fbox.y - 16)
-    await page.mouse.up()
-
-    const a0 = await getBox(page, 0)
-    const a1 = await getBox(page, 1)
-
-    const dh = snap8(b0.height + 16) - b0.height
-    const dy = a0.top - b0.top
-    expect(a0.height).toBe(b0.height + dh)
-    expect(a1.height).toBe(b1.height + dh)
-    expect(dy).toBeLessThanOrEqual(-16)
-    expect(a1.top - b1.top).toBe(dy)
-  })
-})
@@ -1,114 +0,0 @@
-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))
-  const height = await el.evaluate((n) => parseInt((n as HTMLElement).style.height || '0', 10))
-  return { left, top, width, height }
-}
-
-function snap8(v: number) { return Math.round(v / 8) * 8 }
-
-test.describe('WYSIWYG - Group rotate then resize (E/W) with snap', () => {
-  test('rotate ~15°, then group resize E by +16 (snap) — widths grow equally, left unchanged', 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()
-
-    // marquee select both
-    const cbox = await canvas.boundingBox()
-    if (!cbox) throw new Error('canvas not found')
-    await page.mouse.move(cbox.x + 40, cbox.y + 40)
-    await page.mouse.down()
-    await page.mouse.move(cbox.x + 260, cbox.y + 160)
-    await page.mouse.up()
-
-    // rotate via handle to ~15°
-    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)
-    await page.mouse.up()
-
-    const b0 = await getBox(page, 0)
-    const b1 = await getBox(page, 1)
-
-    // resize east handle of the second by +16px (should snap to +16)
-    const target = page.locator('[data-testid^="obj-text-"]').nth(1)
-    const tbox = await target.boundingBox()
-    if (!tbox) throw new Error('target not found')
-    await page.mouse.move(tbox.x + tbox.width - 5, tbox.y + 5)
-    await page.mouse.down()
-    await page.mouse.move(tbox.x + tbox.width + 16, tbox.y + 5)
-    await page.mouse.up()
-
-    const a0 = await getBox(page, 0)
-    const a1 = await getBox(page, 1)
-
-    const dw = snap8(b1.width + 16) - b1.width
-    expect(a0.left).toBe(b0.left)
-    expect(a1.left).toBe(b1.left)
-    expect(a0.width).toBe(b0.width + dw)
-    expect(a1.width).toBe(b1.width + dw)
-  })
-
-  test('rotate ~15°, then group resize W by +16 (snap) — widths grow equally, left shifts equally', 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()
-
-    // marquee select both
-    const cbox = await canvas.boundingBox()
-    if (!cbox) throw new Error('canvas not found')
-    await page.mouse.move(cbox.x + 40, cbox.y + 40)
-    await page.mouse.down()
-    await page.mouse.move(cbox.x + 260, cbox.y + 160)
-    await page.mouse.up()
-
-    // rotate via handle to ~15°
-    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)
-    await page.mouse.up()
-
-    const b0 = await getBox(page, 0)
-    const b1 = await getBox(page, 1)
-
-    // resize west handle of the first by -16px (drag left)
-    const first = page.locator('[data-testid^="obj-text-"]').first()
-    const fbox = await first.boundingBox()
-    if (!fbox) throw new Error('first not found')
-    await page.mouse.move(fbox.x + 5, fbox.y + 5) // move inside to be safe
-    await page.mouse.move(fbox.x + 2, fbox.y + 5)
-    await page.mouse.down()
-    await page.mouse.move(fbox.x - 16, fbox.y + 5)
-    await page.mouse.up()
-
-    const a0 = await getBox(page, 0)
-    const a1 = await getBox(page, 1)
-
-    const dw = snap8(b0.width + 16) - b0.width
-    const dx = a0.left - b0.left
-    expect(a0.width).toBe(b0.width + dw)
-    expect(a1.width).toBe(b1.width + dw)
-    expect(dx).toBeLessThanOrEqual(-16)
-    expect(a1.left - b1.left).toBe(dx)
-  })
-})
@@ -1,59 +0,0 @@
-import { test, expect } from '@playwright/test'
-
-const wysiwygUrl = '/en/wysiwyg'
-
-test.describe('WYSIWYG - Guides toggle with group rotate + snap + live region', () => {
-  test('guides ON: after multiselect and rotate, dragging snaps and aria-live shows guides + selection', 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()
-
-    // Turn on Guides
-    const guidesBtn = page.getByRole('button', { name: /Guides/i })
-    await guidesBtn.click()
-
-    // Marquee select both
-    const cbox = await canvas.boundingBox()
-    if (!cbox) throw new Error('canvas not found')
-    await page.mouse.move(cbox.x + 40, cbox.y + 40)
-    await page.mouse.down()
-    await page.mouse.move(cbox.x + 260, cbox.y + 160)
-    await page.mouse.up()
-
-    const live = page.getByTestId('aria-live')
-    await expect(live).toContainText(/선택\s*2개/)
-
-    // Rotate ~15deg
-    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)
-    await expect(live).toContainText(/가이드\s*x=|y=/)
-    await page.mouse.up()
-
-    // Drag group by ~13px on X to verify grid snap still applies with guides
-    const target = page.locator('[data-testid^="obj-text-"]').nth(1)
-    const tbox = await target.boundingBox()
-    if (!tbox) throw new Error('target not found')
-
-    // Read before
-    const leftsBefore = await page.locator('[data-testid^="obj-text-"]').evaluateAll((nodes) => nodes.map(n => parseInt((n as HTMLElement).style.left || '0', 10)))
-
-    await page.mouse.move(tbox.x + 5, tbox.y + 5)
-    await page.mouse.down()
-    await page.mouse.move(tbox.x + 5 + 13, tbox.y + 5)
-    await page.mouse.up()
-
-    const leftsAfter = await page.locator('[data-testid^="obj-text-"]').evaluateAll((nodes) => nodes.map(n => parseInt((n as HTMLElement).style.left || '0', 10)))
-    const dx = leftsAfter[1] - leftsBefore[1]
-    expect(dx).toBe(16)
-    expect(leftsAfter[0] - leftsBefore[0]).toBe(16)
-  })
-})
@@ -1,55 +0,0 @@
-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)
-  })
-})
@@ -1,98 +0,0 @@
-import { test, expect } from '@playwright/test'
-
-const wysiwygUrl = '/en/wysiwyg'
-
-// Helper to read left/top/width from inline styles
-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 - Snap priority (edge > center > grid)', () => {
-  test('dragging near another object prefers edge snap over grid', async ({ page }) => {
-    await page.goto(wysiwygUrl)
-    const canvas = page.getByTestId('wysiwyg-canvas')
-    await expect(canvas).toBeVisible()
-
-    // Add two text objects
-    const addText = page.getByRole('button', { name: /^Add Text$/i })
-    await addText.click()
-    await addText.click()
-
-    // Marquee select the second to get its bbox and then drag it near the first one's right edge
-    const first = page.locator('[data-testid^="obj-text-"]').first()
-    const second = page.locator('[data-testid^="obj-text-"]').nth(1)
-
-    const b1 = await first.boundingBox()
-    const b2 = await second.boundingBox()
-    if (!b1 || !b2) throw new Error('objects not found')
-
-    // Drag second so that its left aligns to first.right (edge snapping scenario)
-    // move handle point from second.x+5 to target x = first.right - 2 (close enough to trigger snap)
-    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()
-
-    // Read inline left/width to verify alignment: second.left ~= first.left + first.width
-    const s = await getBox(page, 1)
-    const f = await getBox(page, 0)
-    const expectedLeft = f.left + f.width
-    // Allow small tolerance (±1) due to rounding during drag
-    expect(Math.abs(s.left - expectedLeft)).toBeLessThanOrEqual(1)
-  })
-
-  test('dragging near another object prefers center snap over grid', 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)
-    const b1 = await first.boundingBox()
-    const b2 = await second.boundingBox()
-    if (!b1 || !b2) throw new Error('objects not found')
-
-    // Target the center alignment: move second so its centerX ~= first.centerX
-    const firstCenterX = b1.x + b1.width / 2
-    await page.mouse.move(b2.x + b2.width / 2, b2.y + 5)
-    await page.mouse.down()
-    await page.mouse.move(firstCenterX, b2.y + 5)
-    await page.mouse.up()
-
-    const f = await getBox(page, 0)
-    const s = await getBox(page, 1)
-    const sCenter = s.left + Math.round((await second.evaluate((n)=>parseInt((n as HTMLElement).style.width||'0',10))) / 2)
-    expect(Math.abs(sCenter - (f.left + f.width / 2))).toBeLessThanOrEqual(1)
-  })
-
-  test('when no nearby objects, grid snapping applies (13px → 16px)', 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()
-
-    const obj = page.locator('[data-testid^="obj-text-"]').first()
-    const b = await obj.boundingBox()
-    if (!b) throw new Error('object not found')
-
-    const before = await getBox(page, 0)
-    await page.mouse.move(b.x + 5, b.y + 5)
-    await page.mouse.down()
-    await page.mouse.move(b.x + 5 + 13, b.y + 5)
-    await page.mouse.up()
-
-    const after = await getBox(page, 0)
-    expect(after.left - before.left).toBe(16)
-  })
-})
Author	SHA1	Message	Date
jaybe	f594a389fd	Merge pull request 'auto: PR for feat/image-opt-2nd' (#81 ) from feat/image-opt-2nd into main CI / test (push) Failing after 14m29s Details Reviewed-on: #81	2025-11-17 10:43:45 +00:00
jaybe	fc0134ffb5	auto: PR for feat/export-css-tokens-deep (#83 ) CI / test (push) Failing after 1m5s Details Automated PR created on push to feat/export-css-tokens-deep Reviewed-on: #83 Co-authored-by: Jaybe <master@jaybe.dev> Co-committed-by: Jaybe <master@jaybe.dev>	2025-11-17 10:41:27 +00:00
jaybe	4d5477f9ff	Merge pull request 'auto: PR for feat/style-tokens-regression' (#77 ) from feat/style-tokens-regression into main CI / test (push) Successful in 1m0s Details	2025-11-17 08:46:18 +00:00
jaybe	59f84a7149	Merge pull request 'auto: PR for feat/wysiwyg-polish' (#76 ) from feat/wysiwyg-polish into main CI / test (push) Successful in 59s Details	2025-11-17 08:35:54 +00:00
jaybe	cee57c8fcd	Merge pull request 'auto: PR for feat/wysiwyg-route' (#75 ) from feat/wysiwyg-route into main CI / test (push) Successful in 57s Details	2025-11-17 01:19:13 +00:00
jaybe	2e7fc18fb4	Merge pull request 'auto: PR for feat/wysiwyg-moveable-integration' (#74 ) from feat/wysiwyg-moveable-integration into main CI / test (push) Successful in 53s Details	2025-11-16 16:50:28 +00:00
jaybe	928cf744e6	Merge pull request 'auto: PR for feat/wysiwyg-moveable-integration' (#73 ) from feat/wysiwyg-moveable-integration into main CI / test (push) Successful in 52s Details	2025-11-16 16:31:02 +00:00
jaybe	d4280ef04c	Merge pull request 'auto: PR for feat/wysiwyg-moveable-integration' (#72 ) from feat/wysiwyg-moveable-integration into main CI / test (push) Successful in 1m21s Details	2025-11-16 14:36:29 +00:00
jaybe	258cf1dc00	Merge pull request 'auto: PR for feat/wysiwyg-moveable-integration' (#71 ) from feat/wysiwyg-moveable-integration into main CI / test (push) Successful in 1m8s Details	2025-11-16 14:23:23 +00:00
jaybe	e9655c19cc	Merge pull request 'auto: PR for feat/verify-integrity-cli' (#70 ) from feat/verify-integrity-cli into main CI / test (push) Successful in 54s Details	2025-11-16 11:59:58 +00:00
jaybe	029b5a1fac	Merge pull request 'auto: PR for feat/verify-integrity-cli' (#69 ) from feat/verify-integrity-cli into main CI / test (push) Successful in 55s Details	2025-11-16 11:53:56 +00:00
jaybe	03d8d84a3c	Merge pull request 'auto: PR for feat/verify-integrity-cli' (#68 ) from feat/verify-integrity-cli into main CI / test (push) Successful in 54s Details	2025-11-16 11:26:04 +00:00
jaybe	d202cde689	Merge pull request 'auto: PR for feat/image-optimization' (#67 ) from feat/image-optimization into main CI / test (push) Successful in 52s Details	2025-11-16 11:20:30 +00:00
jaybe	3c5fdba5c6	Merge pull request 'auto: PR for feat/export-bundle-integrity' (#66 ) from feat/export-bundle-integrity into main CI / test (push) Successful in 55s Details	2025-11-16 04:13:28 +00:00
jaybe	f7d161fef6	Merge pull request 'auto: PR for feat/export-bundle-integrity' (#65 ) from feat/export-bundle-integrity into main CI / test (push) Successful in 57s Details	2025-11-16 04:09:33 +00:00
jaybe	9faef5c827	Merge pull request 'auto: PR for feat/export-bundle-phase7-perf-seo' (#64 ) from feat/export-bundle-phase7-perf-seo into main CI / test (push) Successful in 54s Details	2025-11-16 01:57:40 +00:00
jaybe	38066e3030	Merge pull request 'auto: PR for feat/export-bundle-phase6' (#63 ) from feat/export-bundle-phase6 into main CI / test (push) Successful in 1m1s Details	2025-11-15 06:16:04 +00:00
jaybe	7f6b463520	Merge pull request 'auto: PR for feat/export-bundle-phase6' (#62 ) from feat/export-bundle-phase6 into main CI / test (push) Successful in 56s Details	2025-11-15 06:03:00 +00:00
jaybe	d074adda9a	Merge pull request 'auto: PR for feat/assets-metadata-extend' (#61 ) from feat/assets-metadata-extend into main CI / test (push) Successful in 1m0s Details	2025-11-15 04:50:01 +00:00
jaybe	294297eef7	Merge pull request 'auto: PR for feat/export-assets-metadata' (#60 ) from feat/export-assets-metadata into main CI / test (push) Successful in 1m24s Details	2025-11-15 04:40:15 +00:00
jaybe	ab2fd6070a	Merge pull request 'auto: PR for feat/export-options-ui-polish' (#59 ) from feat/export-options-ui-polish into main CI / test (push) Successful in 1m6s Details	2025-11-15 04:29:25 +00:00
jaybe	3c919adae5	Merge pull request 'auto: PR for feat/manifest-robots-restore' (#58 ) from feat/manifest-robots-restore into main CI / test (push) Successful in 53s Details	2025-11-15 04:26:18 +00:00