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

test('test', async ({ page }) => {
  await page.goto('https://credicorpbank-dev.appianportals.com/b45e2d4c-8847-47d9-ac1f-2c518647614b-informaci-n-tarjeta-der-cr-dit?$sp=AAAAAgAAAAAAAAABAAAAEKeGkvNzdXNBf7IgspZSROmfhD-37E-tMHHQ7uT4voeQvwi8f0BEMqTcqkjXK_rrVMR52uL1ai7E5ixMTsd-m_kqa9H4tQ', { waitUntil: 'load' });
  // await page.goto('https://credicorpbank-dev.appianportals.com/b45e2d4c-8847-47d9-ac1f-2c518647614b-informaci-n-tarjeta-der-cr-dit?$sp=AAAAAgAAAAAAAAABAAAAEDX7QOBaa4GVPUkTCYJtaLj1mf876n_vFqOiLZo6ardIYsC-mI8oyvrVxZor3Tt6p4sg8B-UdK0ZQORVl5pJF-fCIJbJ0A', { waitUntil: 'load' });
  await page.getByText('En mi residencia').click();
  await page.getByRole('combobox').click();
  await page.getByText('De lunes a viernes 8:00 a. m').click();
  await page.getByText('Si', { exact: true }).click();
  await page.getByLabel('Plan seguro').click();
  await page.getByText('Hasta $1,000 (Costo: $1.52)').click();
  await page.getByText('No').click();

  // await expect(page.locator('.FieldLayout---input_below > [data-testid="ParagraphText-paragraph"]')).toContainText("Si");

  await page.getByText('En mi lugar de trabajo').click();
  await page.getByText('En otro lugar').click();

  const provinciaElement = page.locator('div').filter({ hasText: /^ProvinciaSeleccione su Provincia$/ }).getByLabel('Provincia');
  await expect(provinciaElement).toBeVisible();
  await provinciaElement.click();

  await page.getByPlaceholder('Buscar').fill('colon');
  await page.getByRole('option', { name: 'COLON' }).click();
  await page.getByLabel('Distrito').click();
  await page.getByRole('option', { name: 'COLON' }).locator('div').click();
  await page.getByLabel('Corregimiento').click();
  await page.getByText('SABANITAS').click();

  await page.getByLabel('Detalla la dirección').fill('address');

  // const cardDiv = page.locator('[data-testid="CardLayout-cardDiv"]');
  // const backgroundColor = await cardDiv.evaluate((el) => getComputedStyle(el).backgroundColor);
  // expect(backgroundColor).toBe('rgb(83, 172, 77)');

  
});