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

import { openProjectDashboard } from '../utils/navigation';

export default () => {
  test.describe('create-channel suite', () => {
    test('creating a channel succeeds', async ({ page }) => {
      const projectId = await openProjectDashboard(page);
      await page.goto(
        'http://localhost:3000/main/project/' + projectId + '/channel/create',
        { waitUntil: 'domcontentloaded' },
      );
      await page.waitForTimeout(1000);
      await page.locator('input[name="name"]').click();
      await page.locator('input[name="name"]').fill('TestChannel');
      await page.getByRole('button', { name: 'Next' }).click();

      await page.getByText('Add Field').first().click();
      await page.waitForTimeout(1000);

      await page.waitForSelector('input[name="key"]', { state: 'visible' });
      await page.locator('input[name="key"]').click();
      await page.locator('input[name="key"]').fill('message');
      await page.getByRole('button', { name: 'Confirm' }).click();

      await page.getByText('Add Field').first().click();
      await page.waitForTimeout(1000);

      await page.waitForSelector('input[name="key"]', { state: 'visible' });
      await page.locator('input[name="key"]').click();
      await page.locator('input[name="key"]').fill('image');

      await page
        .locator('select[aria-hidden="true"]')
        .first()
        .selectOption('images');
      await page.waitForTimeout(1000);

      await page.getByRole('button', { name: 'Confirm' }).click();

      await page.getByRole('button', { name: 'Complete' }).click();
      await page.waitForTimeout(1000);
      await page.getByRole('button', { name: 'Start' }).click();
      await page.waitForTimeout(1000);
      await expect(
        page.getByRole('tab', { name: 'TestChannel' }).first(),
      ).toContainText('TestChannel');
    });
  });
};