// @ts-nocheck
/**
 * E2E — agregar el primer producto a una oferta nueva.
 *
 * Regresión del 2026-08-03: "cuando agrega un producto no refresca la pantalla,
 * debo refrescar para que aparezca la línea". Pasaba solo con el PRIMER
 * producto: initTableDetalle() deriva las columnas de las claves de la primera
 * fila, así que una oferta sin detalle inicializaba la tabla sin columnas, y el
 * append posterior metía el dato sin dibujar nada.
 *
 * El test crea su propia oferta (no toca las del cliente) y la deja creada:
 * borrarla es responsabilidad de quien corre la suite, o se limpia por SQL.
 */
import { test, expect } from '../fixtures/fixtures';

const PLU = process.env.E2E_PLU || '10';

async function contarFilasDetalle(page) {
  // La fila de "No se encontraron registros" no cuenta.
  return await page.locator('#tableDetalle tbody tr:not(.no-records-found)').count();
}

test('el primer producto de una oferta nueva aparece sin refrescar', async ({ page, appPage }) => {
  const errores: string[] = [];
  page.on('pageerror', (e) => errores.push('pageerror: ' + String(e)));
  page.on('console', (m) => { if (m.type() === 'error') errores.push('console.error: ' + m.text()); });

  // Mismos valores por defecto que el resto de la suite: sin ellos, un entorno sin las
  // variables puestas manda undefined a fill() y el test revienta por la causa equivocada.
  const adminUser = process.env.E2E_ADMIN_USER || 'admin';
  const adminPassword = process.env.E2E_ADMIN_PASSWORD || '';
  await appPage.login(adminUser, adminPassword);
  await page.goto('oferta/ofertasBootstrap', { waitUntil: 'domcontentloaded' });
  await page.waitForSelector('#table tbody tr', { timeout: 60000 });

  // --- Crear una oferta nueva por la UI ---
  await page.evaluate(() => (window as any).modificar(0));
  await expect(page.locator('#editModal')).toBeVisible({ timeout: 30000 });
  await page.waitForTimeout(1500);

  // Fechas relativas: con fechas fijas el test empieza a fallar solo cuando la de inicio
  // queda en el pasado y la UI la rechaza.
  const iso = (d: Date) => d.toISOString().slice(0, 10);
  const hoy = new Date();
  const enUnMes = new Date(hoy.getTime() + 28 * 24 * 60 * 60 * 1000);
  const fechaInicio = iso(hoy);
  const fechaFinal = iso(enUnMes);

  await page.fill('#obs', `PRUEBA CLAUDE ${fechaInicio} borrar`);
  // Los campos de fecha son datepicker: fill() los deja vacios.
  await page.evaluate(({ inicio, final }) => {
    const $ = (window as any).$;
    $('#fechaInicio').val(inicio).trigger('change').trigger('changeDate');
    $('#fechaFinal').val(final).trigger('change').trigger('changeDate');
  }, { inicio: fechaInicio, final: fechaFinal });
  await page.keyboard.press('Escape');
  await page.selectOption('#tipoOferta', 'descuento');
  await page.fill('#descuento', '10');
  // Tienda concreta: con "Todas" el backend rechaza el producto.
  await page.evaluate(() => {
    const $ = (window as any).$;
    const opciones = $('#tiendas option').map((i, o) => o.value).get().filter((v) => v && v !== '0');
    $('#tiendas').val([opciones[0]]);
    $('#tiendas').selectpicker('refresh');
  });

  await page.click('#oferta_submit');
  // Al guardar avisa con bootbox y reabre el modal sobre la oferta creada.
  await page.waitForTimeout(3000);
  const okBtn = page.locator('.bootbox .btn-primary').first();
  if (await okBtn.count()) await okBtn.click();
  await page.waitForTimeout(3000);

  const idCreada = await page.inputValue('#idoferta');
  console.log('>>> oferta creada:', idCreada);
  expect(Number(idCreada), 'debe haberse creado la oferta').toBeGreaterThan(0);

  // --- Agregar el PRIMER producto ---
  const swSinExist = page.locator('#sinexistencias');
  if (await swSinExist.count()) await swSinExist.check({ force: true });
  const swSinDesc = page.locator('#sindescuento');
  if (await swSinDesc.count()) await swSinDesc.check({ force: true });

  const antes = await contarFilasDetalle(page);
  console.log('>>> filas de detalle ANTES:', antes);

  await page.fill('#plu', PLU);
  await page.click('#agregarplu');
  await page.waitForTimeout(7000);

  const dialogo = page.locator('.bootbox-body');
  if (await dialogo.count()) console.log('>>> dialogo:', (await dialogo.first().innerText()).slice(0, 160));

  const diag = await page.evaluate(() => {
    const $ = (window as any).$;
    const $el = $('#tableDetalle');
    const inicializada = !!$el.data('bootstrap.table');
    let datos = null;
    try { datos = ($el.bootstrapTable('getData') || []).length; } catch (e) { datos = 'error: ' + e.message; }
    return {
      inicializada,
      filasEnDatos: datos,
      contenedorVisible: $('#tabla-detalle').is(':visible'),
      tablaVisible: $el.is(':visible'),
      thead: $el.find('thead th').length,
      tbodyTr: $el.find('tbody tr').length,
      idoferta: $('#idoferta').val(),
      tipoOferta: $('#tipoOferta').val(),
    };
  });
  console.log('>>> DIAGNOSTICO:', JSON.stringify(diag));

  const despues = await contarFilasDetalle(page);
  console.log('>>> filas de detalle DESPUES (sin refrescar):', despues);
  await page.screenshot({ path: 'playwright-report/repro-primer-producto.png', fullPage: true });

  console.log('>>> errores JS:', JSON.stringify(errores));
  console.log('>>> ID_OFERTA_A_BORRAR=' + idCreada);

  expect(despues, 'la linea debe aparecer sin refrescar').toBeGreaterThan(antes);
});
