/**
 * 編集モーダルを開いてスクリーンショットを保存するだけのスペック。
 * UI をこちらで確認しながらスタイル調整するために使う。
 *
 * 実行: npm run test:e2e:screenshot
 * 出力: tests/e2e/screenshots/docs-edit-modal.png
 */

import path from 'path';
import fs from 'fs';
import { fileURLToPath } from 'url';
import { waitForAppReady } from '../helpers/wait-for-app.js';

const __dirname = path.dirname(fileURLToPath(import.meta.url));
const SCREENSHOT_DIR = path.resolve(__dirname, '../screenshots');
const SCREENSHOT_PATH = path.join(SCREENSHOT_DIR, 'docs-edit-modal.png');

describe('編集モーダル スクリーンショット取得', () => {
  before(async function () {
    this.timeout(45000);
    await waitForAppReady(browser);
    const navDocs = await $('button[data-panel="docs"]');
    await navDocs.click();
    const panel = await $('#panel-docs');
    await panel.waitForDisplayed({ timeout: 5000 });
    const addBtn = await $('#docs-add-btn');
    await addBtn.waitForDisplayed({ timeout: 3000 });
    await addBtn.click();
    const modal = await $('#docs-edit-modal');
    await modal.waitForDisplayed({ timeout: 5000 });
    await browser.pause(1500);
  });

  it('スクリーンショットを保存する', async () => {
    fs.mkdirSync(SCREENSHOT_DIR, { recursive: true });
    await browser.saveScreenshot(SCREENSHOT_PATH);
    console.log('[screenshot] 保存先:', SCREENSHOT_PATH);
  });
});