Prueba: Ingresos – Editar Cotización

Objetivo

Validar que el sistema permita editar correctamente una cotización existente, modificando los datos del cliente, la descripción y los productos asociados, asegurando que los cambios se guarden exitosamente y el modal de edición se cierre al finalizar.

---

Precondiciones

• Usuario autenticado mediante el comando cy.login().
• Acceso al dashboard del sistema (/dashboard).
• Debe existir al menos una cotización registrada en el módulo “Ingresos” → “Cotizaciones”.
• Los productos utilizados en la prueba (PR577 y SH229) deben existir en la base de datos.
• El sistema debe permitir la apertura del modal de edición (#modalEditarCotizacion).

---

Pasos Generales

1. Navegar al módulo de Cotizaciones (/cliente/cotizaciones).
2. Abrir el modal de crear Cotización
3. Abrir el modal de edición de cotización correspondiente según el índice de prueba..

4. Modificar los siguientes campos:

5. Cliente

6. Descripción
7. Producto
8. Descripción del producto
9. Cantidad
10. Descuento

11. IVA

12. Guardar los cambios haciendo clic en el botón “Actualizar Cotización”.

13. Verificar que el modal se cierre correctamente

---

Resultado Esperado

• El sistema debe permitir editar la cotización sin errores.
• Los campos deben aceptar las modificaciones
• El modal de edición debe cerrarse tras guardar los cambios.
• No deben generarse excepciones ni errores en la consola del navegador.

---

Explicación Detallada del Código

Visitar el modulo de cotizaciones

cy.visit("/cliente/cotizaciones");

Explicación

• cy.visit("/cliente/cotizaciones") sitúa el test en la página de cotizaciones donde está el botón para crear nueva cotización.implementación
  

---

Definición de escenarios

const escenarios = [
  {
    cliente: "Cliente A",
    descripcion: "Desc A Modificada",
    producto: "PR577",
    productoDescripcion: "Producto prueba Modificada",
    cantidad: "3",
    descuento: "5",
    iva: "0",
  },
  {
    cliente: "Cliente B",
    descripcion: "Desc B Modificada",
    producto: "SH229",
    productoDescripcion: "Producto prueba Modificada",
    cantidad: "4",
    descuento: "15",
    iva: "5",
  },
];

Explicación

• Se define un arreglo con dos escenarios de prueba, permitiendo ejecutar el mismo flujo con diferentes datos.
  

---

Iteración y test por escenario

escenarios.forEach((escenario) => {
  it(`Editar cotización ${index + 1} para ${escenario.cliente}`, () => {
    // ... flujo ...
  });
});

Explicación

• Se recorre el arreglo de escenarios con forEach, creando dinámicamente un caso de prueba (it) por cada conjunto de datos.
• El nombre del test se genera automáticamente según el cliente y el índice
  

---

Apertura del modal de edición

cy.get('button[onclick^="abrirModalEditarCotizacion"]').eq(index).click();

cy.get("#modalEditarCotizacion").should("be.visible");

Explicación

• Se selecciona el botón correspondiente para abrir el modal según el índice (eq(index)).
• Se verifica que el modal esté visible antes de continuar, garantizando sincronización con la interfaz.
  

---

Edición de campos

cy.get('#modalEditarCotizacion input[name="cliente"]')
  .clear()
  .type(escenario.cliente);
cy.get('#modalEditarCotizacion input[name="descripcion"]')
  .clear()
  .type(escenario.descripcion);

cy.get("#modalEditarCotizacion .cotizacion-select-input").click();
cy.get(
  `#modalEditarCotizacion .cotizacion-select-option[data-codigo="${escenario.producto}"]`
).click({ force: true });

cy.get(
  '#modalEditarCotizacion input[name="productosCotizacion[1][descripcion]"]'
)
  .clear()
  .type(escenario.productoDescripcion);
cy.get('#modalEditarCotizacion input[name="productosCotizacion[1][cantidad]"]')
  .clear()
  .type(escenario.cantidad);
cy.get('#modalEditarCotizacion input[name="productosCotizacion[1][descuento]"]')
  .clear()
  .type(escenario.descuento);
cy.get(
  '#modalEditarCotizacion select[name="productosCotizacion[1][iva]"]'
).select(escenario.iva);

Explicación

• Se limpian y rellenan los campos cliente y descripción con los nuevos valores del escenario.
• Se maneja un dropdown customizado de selección de productos (no un <select> tradicional).
• Se utiliza force: true para garantizar el clic incluso si hay superposición visual.
• Se editan los campos asociados al producto: descripción, cantidad, descuento e IVA.
• Los nombres de los inputs sugieren que hay un sistema dinámico de productos dentro de la cotización.
  

---

Guardado y verificación

cy.get("#modalEditarCotizacion div.modal-footer.bg-light")
  .contains("Actualizar Cotización")
  .click();

cy.get("#modalEditarCotizacion", { timeout: 10000 }).should("not.be.visible");

Explicación

• Se localiza el botón de “Actualizar Cotización” dentro del pie del modal y se hace clic.
• Finalmente, se espera hasta 10 segundos a que el modal desaparezca, indicando que la acción fue procesada correctamente.
  

---

Resultados de la ejecución de la prueba

Escenario	Cliente Editado	Producto	Cantidad	Descuento	IVA	Estado
1	Cliente A	PR577	3	5%	0%	PASS
2	Cliente B	SH229	4	15%	5%	PASS

---