import { afterAll, beforeAll, expect, test } from '../fixtures.mjs';

test.beforeAll(beforeAll);
test.afterAll(afterAll);

// @ts-expect-error: `util` is not using types in playwright
test('Template list page navigation and basic functionality', async ({
  page,
  util,
}) => {
  try {
    // Navigate to templates page
    await page.goto('/');
    await page.waitForURL('**/#/templates');

    // Check if we're on the templates page
    await expect(page.getByText('模板列表')).toBeVisible();

    // Check if "No templates" message is visible initially
    await expect(page.getByText('暂无模板，请先创建模板。')).toBeVisible();

    // Check if "Create Template" button is visible
    await expect(page.getByText('创建模板')).toBeVisible();

    await util.captureScreenshot(page, 'template-list-no-templates');
  } catch (error) {
    throw await util.onTestError(error);
  }
});

// @ts-expect-error: `util` is not using types in playwright
test('Create template page navigation and functionality', async ({
  page,
  util,
}) => {
  try {
    // Navigate to templates page
    await page.goto('/');
    await page.waitForURL('**/#/templates');

    // Click create template button
    await page.getByText('创建模板').click();
    await page.waitForURL('**/#/create-template');

    // Check if we're on the create template page
    await expect(page.getByText('创建模板')).toBeVisible();

    // Check if form elements are visible
    await expect(page.getByLabel('模板名称 *')).toBeVisible();
    await expect(page.getByLabel('模板描述')).toBeVisible();

    await util.captureScreenshot(page, 'create-template-page');
  } catch (error) {
    throw await util.onTestError(error);
  }
});

// @ts-expect-error: `util` is not using types in playwright
test('Add files and directories to template', async ({ page, util }) => {
  try {
    // Navigate to create template page
    await page.goto('/#/create-template');

    // Fill in template name and description
    await page.getByLabel('模板名称 *').fill('Test Template');
    await page.getByLabel('模板描述').fill('This is a test template');

    // Add a file
    await page.getByText('添加文件').click();

    // Wait for dialog to appear and fill in file details
    await page
      .locator('[data-testid="add-file-path-input"]')
      .fill('src/index.js');
    await page
      .locator('[data-testid="add-file-content-input"]')
      .fill('console.log("Hello World");');
    await page.getByText('添加').click();

    // Add a directory
    await page.getByText('添加目录').click();

    // Wait for dialog to appear and fill in directory details
    await page
      .locator('[data-testid="add-dir-path-input"]')
      .fill('src/components');
    await page.getByText('添加').click();

    // Verify items were added to the tables
    await expect(page.getByText('src/index.js')).toBeVisible();
    await expect(page.getByText('src/components')).toBeVisible();

    await util.captureScreenshot(page, 'template-with-content');
  } catch (error) {
    throw await util.onTestError(error);
  }
});

// @ts-expect-error: `util` is not using types in playwright
test('Template creation and listing', async ({ page, util }) => {
  try {
    // Navigate to create template page
    await page.goto('/#/create-template');

    // Fill in template name and description
    await page.getByLabel('模板名称 *').fill('Test Template');
    await page.getByLabel('模板描述').fill('This is a test template');

    // Add a file
    await page.getByText('添加文件').click();
    await page
      .locator('[data-testid="add-file-path-input"]')
      .fill('src/index.js');
    await page
      .locator('[data-testid="add-file-content-input"]')
      .fill('console.log("Hello World");');
    await page.getByText('添加').click();

    // Save template
    await page.getByText('保存模板').click();

    // Wait for redirect to templates page
    await page.waitForURL('**/#/templates');

    // Check if the created template is listed
    await expect(page.getByText('Test Template')).toBeVisible();
    await expect(page.getByText('This is a test template')).toBeVisible();

    await util.captureScreenshot(page, 'template-list-with-template');
  } catch (error) {
    throw await util.onTestError(error);
  }
});

// @ts-expect-error: `util` is not using types in playwright
test('View template details', async ({ page, util }) => {
  try {
    // Navigate to templates page
    await page.goto('/#/templates');

    // Wait for template to appear and click view button
    // First we need to create a template for this test
    if (await page.getByText('暂无模板，请先创建模板。').isVisible()) {
      await page.getByText('创建模板').click();

      // Create a test template
      await page.getByLabel('模板名称 *').fill('View Test Template');
      await page.getByLabel('模板描述').fill('Template for view test');

      await page.getByText('添加文件').click();
      await page
        .locator('[data-testid="add-file-path-input"]')
        .fill('src/test.js');
      await page
        .locator('[data-testid="add-file-content-input"]')
        .fill('console.log("Test");');
      await page.getByText('添加').click();

      await page.getByText('保存模板').click();
      await page.waitForURL('**/#/templates');
    }

    // Wait for template to appear and click view button
    await page.getByRole('button', { name: '查看' }).click();

    // Check if template detail dialog appears
    await expect(page.getByText('模板详情')).toBeVisible();
    await expect(page.getByText('src/test.js')).toBeVisible();

    await util.captureScreenshot(page, 'template-detail-view');
  } catch (error) {
    throw await util.onTestError(error);
  }
});