Árbol de suites
- Suites anidadas en la barra lateral.
- + Nueva suite abre un único diálogo con selector de Suite padre (obligatorio). El valor por defecto es Raíz del proyecto; puedes elegir cualquier suite del árbol antes de guardar. El menú de acciones de una suite también abre el mismo diálogo con esa suite preseleccionada como padre.
- Editar suite (menú de acciones de una suite o icono de edición en la barra de ruta) permite cambiar el nombre, la descripción y la suite padre. El selector se inicializa con el padre actual (o Raíz del proyecto si la suite es raíz). No puedes elegir la suite que editas ni ninguna de sus descendientes; el backend rechaza ciclos si el árbol cambió mientras el diálogo estaba abierto.
Contraer barras de navegación (escritorio)
En escritorio, cada columna de navegación tiene su propio control de contracción. El estado se guarda en el navegador y se restaura al recargar.
- La barra lateral del proyecto (nombre, enlaces de Tests, Ajustes) se contrae a una mini-barra solo con iconos (~3,5 rem). Pasa el cursor o enfoca con teclado un icono para ver la etiqueta en un tooltip.
- El árbol de suites (esta columna) no tiene iconos por suite, así que se contrae a una franja fina con un control de expandir, no a una mini-barra. La columna sigue montada para que el diseño no salte.
- Contraer una barra no afecta a las demás: puedes ocultar la barra del proyecto y dejar el árbol de suites abierto, o al revés.
Usa el chevron en la cabecera de cada barra para contraer; cuando esté contraída, usa el chevron (barras de proyecto/workspace/usuario) o el control de expandir (árbol de suites) para volver a la vista completa.
Casos de prueba
- Creación rápida o editor completo.
- Panel de detalle con Propiedades y Pasos.
URLs compartibles (display IDs)
El navegador usa display IDs legibles en lugar de ULIDs internos en los enlaces del repositorio:
- Suite en la ruta:
/projects/{códigoProyecto}/suites/{códigoProyecto}-S{númeroSuite}(por ejemplo/projects/ACME/suites/ACME-S2). - Caso en la query:
?case={códigoProyecto}-{númeroCaso}(por ejemplo?case=ACME-14).
Al abrir un caso desde la vista raíz del proyecto, la URL incluye la suite en la ruta y el parámetro ?case= para que el enlace se pueda copiar y, al recargar, vuelva al mismo panel de detalle dentro de esa suite.
Los casos sin suite usan /projects/{códigoProyecto}/unassigned?case={códigoProyecto}-{númeroCaso}.
Los display IDs inválidos o inexistentes se manejan sin ruido: suites desconocidas muestran página no encontrada; un ?case= desconocido deja el panel cerrado sin toasts de error.
- Título, descripción, suite y pasos se editan en el editor; la clasificación (prioridad, severidad, estado, tipo, capa, comportamiento, estado de automatización, “is flaky” y los campos personalizados de la organización) se renderiza dinámicamente según los campos visibles para el proyecto y se persiste mediante el endpoint dedicado de custom-field-values.
Secciones del editor
El editor agrupa los inputs en hasta cuatro secciones, en este orden. Cada sección visible muestra un rótulo NN · ETIQUETA donde NN es el índice actual (01, 02, …) según las secciones que se renderizan; los números se recalculan cuando una sección opcional no aparece.
- BASIC (
01 · BÁSICOcuando es la primera sección) — título, descripción, suite, milestone y los campos enum/checkbox de sistema (prioridad, severidad, estado, tipo, capa, comportamiento, estado de automatización, is flaky) en el orden del producto. - EXTRA — campos personalizados de la organización aplicables al proyecto (título Campos Personalizados). La sección y su separador no se renderizan cuando el proyecto no tiene campos personalizados visibles; las secciones siguientes se renumeran.
- CONDITIONS — precondiciones y postcondiciones como párrafos. La sección colapsa cuando ambas están fuera de alcance. Cuando solo una es visible, el título y la descripción de la sección se adaptan (por ejemplo Precondiciones / Estado del sistema antes del caso. en lugar del copy combinado “Pre y post”). Las secciones siguientes se renumeran.
- STEPS — los pasos manuales del caso (siempre visible; su número depende de cuántas secciones opcionales preceden).
Al guardar se ejecuta un POST /api/v1/projects/:projectUlid/test-cases ligero (o PATCH /api/v1/test-cases/:caseUlid en edición), seguido del PUT de pasos si cambiaron y finalmente PUT /api/v1/test-cases/:caseUlid/custom-field-values para el bloque dinámico de clasificación. Si una etapa falla, las anteriores quedan aplicadas y el editor muestra un error de éxito parcial para reintentar solo la etapa fallida.
Panel de detalle — General
La pestaña General muestra descripción, precondiciones, postcondiciones y pasos. Las secciones de precondiciones y postcondiciones aparecen solo cuando ese campo de sistema es visible para el proyecto del caso—la misma lista de definiciones con alcance por proyecto que usa el editor. Un campo oculto por alcance de proyecto no muestra encabezado, placeholder vacío ni valor almacenado en las vistas de solo lectura (panel colapsado y diálogo expandido). Los valores no se borran en el servidor; volver a vincular el campo al proyecto restaura su visualización.
Panel de detalle — Propiedades
La pestaña Propiedades renderiza el bloque Clasificación de forma dinámica. La primera fila es Suite: un selector jerárquico de ancho completo. El valor Raíz del proyecto significa que el caso no pertenece a ninguna suite (aparece en Casos sin suite en la barra lateral). Cambiar la suite desde aquí envía un PATCH ligero del caso, actualiza la actividad del workspace y revierte el selector si falla la petición.
Debajo van los campos de sistema (prioridad, severidad, estado, tipo, capa, comportamiento, estado de automatización, is flaky) y después los campos personalizados ordenados por título, en una cuadrícula de dos columnas. Las ediciones inline de campos personalizados envían el PUT /custom-field-values completo y mergean la respuesta del servidor; un error revierte solo el campo afectado.
La sección Trazabilidad conserva el milestone; ya no muestra una fila de solo lectura para la suite (la suite vive en Clasificación). El diálogo expandido del panel repite el mismo orden.
Icono de estado
Cada fila de caso muestra un pequeño icono en el extremo derecho cuando el Estado del caso no es Activo. El icono y su color coinciden con la opción de estado configurada para ese caso (por ejemplo, un círculo de trazos para Borrador o un indicador de advertencia para Obsoleto). Cuando el Estado es Activo o no está configurado, el espacio queda vacío y no se muestra nada — solo los estados no Activos requieren atención visual.
- El icono aparece para cualquier opción de estado cuya clave de sistema no sea
status_active, incluyendo opciones de estado personalizadas que tengan un icono asignado. - Las opciones de estado personalizadas sin icono asignado no muestran nada aunque no sean Activas.
- Al pasar el cursor sobre el icono se muestra un tooltip con el nombre de la opción.
Pasos
Cada paso tiene acción y campos opcionales de datos / resultado esperado. Guarda con Guardar al editar pasos en el panel de detalle.
Imágenes en pasos
Al editar pasos (editor completo o modo Editar del bloque Pasos en el panel), usa Añadir imagen en la fila del paso para adjuntar una o más capturas (PNG, JPEG o WebP). Puedes elegir varios archivos a la vez. Las miniaturas aparecen bajo ADJUNTOS en esa fila; quita una con el control × antes de guardar.
- Editar caso existente — el stage funciona de inmediato porque el caso ya tiene ID.
- Crear caso nuevo — añade imágenes después del primer guardado (el control permanece deshabilitado hasta que exista el caso), o guarda una vez y vuelve a adjuntar.
- Modo lectura — expande un paso en el panel de detalle para ver ADJUNTOS con una cuadrícula de miniaturas cuando hay imágenes.
Las imágenes se almacenan en WebP (completa + miniatura) y se muestran con las mismas URLs públicas de assets que los avatares de proyecto.
Navegación por teclado en pestañas
Las tiras de pestañas de la aplicación (paneles de detalle, vistas de ejecución, planes y otras superficies con pestañas) siguen el patrón estándar de teclado WAI-ARIA Tabs.
Moverse entre pestañas
| Tecla | Acción |
|---|---|
ArrowRight | Avanzar a la siguiente pestaña (da la vuelta de la última a la primera). |
ArrowLeft | Retroceder a la pestaña anterior (da la vuelta de la primera a la última). |
Home | Ir directamente a la primera pestaña. |
End | Ir directamente a la última pestaña. |
La selección sigue al foco de forma automática: al presionar una tecla de flecha, el foco se mueve y la pestaña queda activa.
Orden de tabulación
Solo la pestaña activa forma parte del orden de tabulación de la página. Al presionar Tab se omiten las pestañas inactivas y el foco avanza al siguiente elemento interactivo tras la tira. Para acceder a otra pestaña, enfoca primero la pestaña activa con Tab y luego usa ArrowRight o ArrowLeft para navegar.
Selección masiva
Pasa el cursor sobre cualquier fila de caso o banda de suite para revelar una casilla. Al seleccionar al menos un caso aparece una barra de acciones masivas debajo de la barra de filtros con el contador de la selección, Editar y Duplicar (visibles pero aún no activas), Ejecutar, Eliminar y Limpiar selección.
- Las casillas de suite son de tres estados. Una banda de suite se muestra marcada cuando todos los casos de su subárbol recursivo (incluidas sub-suites contraídas) están seleccionados, indeterminada cuando solo algunos lo están, y sin marcar en el resto de casos. Marcar una banda de suite selecciona o deselecciona todo su subárbol en una sola acción.
- La banda “Casos sin suite” ofrece su propia casilla para casos huérfanos; nunca se trata como una suite eliminable.
- La selección persiste al filtrar. Seleccionar casos y luego acotar la lista con búsqueda o filtros mantiene cada caso seleccionado dentro del contador de la barra masiva, aunque quede oculto. Al limpiar el filtro, vuelve a aparecer seleccionado.
- Las suites vacías no muestran casilla — no hay nada que seleccionar.
Eliminación masiva
Activar Eliminar abre una confirmación que resume cuántas suites se eliminarán y cuántos casos se archivarán, y luego:
- Los casos sueltos seleccionados (no cubiertos por una suite totalmente seleccionada) se archivan primero.
- Las suites totalmente seleccionadas de nivel superior se eliminan — esto reutiliza el comportamiento existente de eliminación de suites, que archiva cada caso del subárbol de esa suite. Una suite cuyo padre también está totalmente seleccionado no se elimina por separado; solo se elimina la de nivel superior.
Si un paso falla a mitad de camino, el proceso se detiene de inmediato, se muestra el error y tu selección no se limpia — el repositorio se actualiza para que veas qué cambió y puedas reintentar. Si todo se completa con éxito, la selección se limpia y el listado se actualiza. Si el caso que tenías abierto en el panel de detalle formaba parte de la selección eliminada, el panel se cierra.
Ejecución masiva
Seleccionar casos y activar Ejecutar te lleva a la pantalla Ejecuciones del proyecto con el modal de nueva ejecución ya abierto y esos casos preseleccionados — todavía puedes añadir o quitar casos antes de crear la ejecución. Consulta la sección “Crear una ejecución desde una selección del repositorio” de la guía Ejecuciones de prueba para más detalle.
Papelera
Los casos archivados van a la Papelera para restaurar o eliminar según permisos.