Documento de prueba de diagramas Mermaid

Documentation Testing

Este documento es un archivo de prueba diseñado específicamente para verificar la funcionalidad de renderizado de diagramas Mermaid en la plataforma CZON. Muestra ejemplos de múltiples tipos de diagramas, como diagramas de flujo, diagramas de secuencia, diagramas de Gantt, diagramas de clases, diagramas de estado y gráficos circulares, e incluye una prueba de sintaxis errónea para validar el mecanismo de manejo de errores. A través de estos ejemplos, el documento tiene como objetivo garantizar que la plataforma CZON pueda analizar y mostrar correctamente los diagramas Mermaid, apoyando así a los usuarios en la creación y compartición de contenido visual complejo. El documento también explica brevemente el propósito de las pruebas y los tipos de diagramas incluidos, ayudando a los lectores a comprender su valor central.
📅 2024-01-01
  • Mermaid
  • Prueba de diagramas
  • CZON
  • Diagrama de flujo
  • Diagrama de secuencia
  • Diagrama de Gantt
  • Diagrama de clases
  • Diagrama de estado

Prueba de diagramas Mermaid

Este es un archivo de prueba para verificar la funcionalidad de renderizado de diagramas Mermaid en CZON.

Ejemplo de diagrama de flujo

graph TD
    A[Inicio] --> B{¿Continuar?}
    B -->|Sí| C[Ejecutar acción]
    B -->|No| D[Fin]
    C --> E[Verificar resultado]
    E --> F{¿Éxito?}
    F -->|Sí| G[Completado]
    F -->|No| H[Reintentar]
    H --> C
    G --> D

Ejemplo de diagrama de secuencia

sequenceDiagram
    participant Usuario
    participant Sistema
    participant BaseDeDatos

    Usuario->>Sistema: Enviar solicitud
    Sistema->>BaseDeDatos: Consultar datos
    BaseDeDatos-->>Sistema: Devolver resultados
    Sistema-->>Usuario: Mostrar resultados

Ejemplo de diagrama de Gantt

gantt
    title Cronograma del proyecto
    dateFormat  YYYY-MM-DD
    section Diseño
    Análisis de requisitos     :done,    des1, 2024-01-01, 7d
    Diseño de prototipo        :active,  des2, 2024-01-08, 5d
    Diseño detallado           :         des3, after des2, 5d
    section Desarrollo
    Desarrollo frontend        :         dev1, after des3, 10d
    Desarrollo backend         :         dev2, after des3, 15d
    section Pruebas
    Pruebas unitarias          :         test1, after dev1, 5d
    Pruebas de integración     :         test2, after dev2, 5d

Ejemplo de diagrama de clases

classDiagram
    class Animal {
        +String nombre
        +int edad
        +void comer()
        +void dormir()
    }
    class Perro {
        +void ladrar()
    }
    class Gato {
        +void maullar()
    }

    Animal <|-- Perro
    Animal <|-- Gato

Ejemplo de diagrama de estado

stateDiagram-v2
    [*] --> Inactivo
    Inactivo --> Procesando : Iniciar procesamiento
    Procesando --> Éxito : Procesamiento exitoso
    Procesando --> Error : Fallo en el procesamiento
    Éxito --> [*]
    Error --> [*]

Ejemplo de gráfico circular

pie title Uso de navegadores
    "Chrome" : 65.2
    "Firefox" : 15.3
    "Safari" : 12.5
    "Edge" : 5.2
    "Otros" : 1.8

Prueba de sintaxis errónea (debería mostrar un mensaje de error)

graph TD
    A --> B
    // Falta definición de flecha aquí
    C --> D

Este archivo de prueba incluye múltiples tipos de diagramas Mermaid para verificar que la integración de Mermaid en CZON funcione correctamente.

See Also