# Seguridad de Fórmulas Matemáticas - Documentación

## Resumen de Cambios de Seguridad

Se han implementado protecciones contra vulnerabilidades XSS en el sistema de renderizado de fórmulas matemáticas KaTeX.

## Issues Corregidos

- **Issue 94**: XSS en KaTeX sin trust:false (MathFormula.tsx:54-60)
- **Issue 96**: Input de usuario renderizado sin sanitización (AnswerInput.tsx:201-207)
- **Issue 97**: Fórmulas desde API sin validación (ExerciseSolver.tsx:220-224)
- **Issue 98**: Patrones peligrosos no bloqueados (\href, \htmlData, etc.)

## Archivos Modificados

### 1. MathFormula.tsx
**Cambios implementados:**
- ✅ Agregado `trust: false` y `strict: true` a opciones KaTeX
- ✅ Implementada función `validateFormula()` con blacklist de patrones peligrosos
- ✅ Limitado tamaño de fórmula a 5000 caracteres
- ✅ Agregado `maxSize: 500` y `maxExpand: 1000`
- ✅ Mostrar fórmula original cuando hay error de seguridad
- ✅ Descripción accesible mejorada para screen readers

**Funciones exportadas:**
```typescript
// Validar fórmula antes de renderizar
validateFormula(formula: string): { isValid: boolean; error?: string }

// Escapar HTML básico
escapeHtml(unsafe: string): string
```

### 2. AnswerInput.tsx
**Cambios implementados:**
- ✅ Validar fórmula antes de renderizar en preview
- ✅ Mostrar error con icono de alerta si contiene comandos bloqueados
- ✅ No renderizar MathFormula si la validación falla

### 3. ExerciseSolver.tsx
**Cambios implementados:**
- ✅ Sanitizar solutionSteps antes de renderizar con `escapeHtml()`
- ✅ Validar que latexFormula no contiene código malicioso
- ✅ Escapar cualquier texto dinámico de la API

## Comandos Bloqueados (Blacklisted)

Los siguientes comandos LaTeX son **bloqueados** por seguridad:

### 1. XSS via URLs
- `\href{javascript:...}` - Ejecución de JavaScript
- `\href{data:...}` - Data URIs
- `\href{vbscript:...}` - VBScript
- `\url{...}` - URLs potencialmente peligrosas

### 2. Inyección HTML
- `\htmlData` - Atributos data arbitrarios
- `\htmlStyle` - Inyección de CSS
- `\htmlId` - Manipulación de IDs
- `\htmlClass` - Manipulación de clases
- `\cssId` - IDs CSS

### 3. Inclusión de Archivos (LFI)
- `\input` - Incluir archivos externos
- `\include` - Incluir archivos
- `\includegraphics` - Incluir imágenes
- `\verbatiminput` - Input verbatim
- `\lstinputlisting` - Listado de código

### 4. Macros Peligrosos
- `\def` - Definiciones de macros
- `\newcommand` - Nuevos comandos
- `\renewcommand` - Reemplazar comandos
- `\let` - Asignación de macros
- `\global` - Definiciones globales
- `\edef` - Definiciones expandidas
- `\xdef` - Definiciones globales expandidas
- `\gdef` - Definiciones globales

### 5. Scripts y Ejecución
- `\write18` - Ejecución de shell
- `\immediate` - Ejecución inmediata
- `\openout` - Abrir archivos para escritura
- `\read` - Leer archivos
- `\special` - Comandos especiales del driver

### 6. Unicode y Obfuscación
- `\catcode` - Categorías de caracteres
- Caracteres de control ASCII (\x00-\x1f)
- Unicode bi-directional override (CVE-2021-42574)

### 7. Otras amenazas
- `\char` con valores hexadecimales - Obfuscación
- SVG/MathML injection via comandos personalizados

## Comandos Permitidos (Whitelist)

Los siguientes comandos matemáticos están **permitidos**:

### Operadores Básicos
- Fracciones: `\frac`, `\dfrac`, `\tfrac`
- Raíces: `\sqrt`, `\sqrt[]`
- Sumatorias/Integrales: `\sum`, `\prod`, `\int`, `\oint`, `\iint`, `\iiint`
- Límites: `\lim`, `\to`, `\infty`

### Operadores Aritméticos
- `\pm`, `\mp`, `\times`, `\div`, `\cdot`, `\circ`
- `\leq`, `\geq`, `\neq`, `\approx`, `\equiv`
- `\in`, `\notin`, `\subset`, `\supset`, `\cup`, `\cap`

### Delimitadores
- `\left`, `\right`, `\langle`, `\rangle`
- `\lceil`, `\rceil`, `\lfloor`, `\rfloor`
- `\big`, `\Big`, `\bigg`, `\Bigg`

### Espaciado
- `\quad`, `\qquad`, `\;`, `\,`, `\!`, `\ `, `\~`
- `\hspace`, `\vspace`

### Texto y Estilos
- `\text`, `\textbf`, `\textit`, `\texttt`
- `\mathbf`, `\mathit`, `\mathrm`, `\mathsf`, `\mathtt`
- `\mathcal`, `\mathfrak`, `\mathbb`, `\textup`, `\textrm`

### Acentos y Decoraciones
- `\underline`, `\overline`, `\hat`, `\widehat`, `\tilde`, `\widetilde`
- `\bar`, `\vec`, `\overrightarrow`, `\overleftarrow`
- `\dot`, `\ddot`, `\acute`, `\grave`, `\check`, `\breve`

### Letras Griegas
- Minúsculas: `\alpha`, `\beta`, `\gamma`, `\delta`, `\epsilon`, `\varepsilon`, `\zeta`, `\eta`, `\theta`, `\vartheta`, `\iota`, `\kappa`, `\lambda`, `\mu`, `\nu`, `\xi`, `\pi`, `\varpi`, `\rho`, `\varrho`, `\sigma`, `\varsigma`, `\tau`, `\upsilon`, `\phi`, `\varphi`, `\chi`, `\psi`, `\omega`
- Mayúsculas: `\Gamma`, `\Delta`, `\Theta`, `\Lambda`, `\Xi`, `\Pi`, `\Sigma`, `\Upsilon`, `\Phi`, `\Psi`, `\Omega`

### Funciones Matemáticas
- Trigonométricas: `\sin`, `\cos`, `\tan`, `\cot`, `\sec`, `\csc`
- Inversas: `\arcsin`, `\arccos`, `\arctan`
- Hiperbólicas: `\sinh`, `\cosh`, `\tanh`, `\coth`
- Logaritmos: `\log`, `\ln`, `\lg`, `\exp`
- Otras: `\deg`, `\arg`, `\ker`, `\dim`, `\hom`, `\det`, `\gcd`, `\lcm`

### Matrices y Casos
- `\begin`, `\end`, `\matrix`, `\pmatrix`
- `\cases`, `\hline`

### Flechas
- `\gets`, `\to`, `\leftarrow`, `\Leftarrow`, `\rightarrow`, `\Rightarrow`
- `\leftrightarrow`, `\Leftrightarrow`, `\mapsto`, `\hookrightarrow`
- `\nearrow`, `\searrow`, `\swarrow`, `\nwarrow`

### Relaciones Lógicas
- `\forall`, `\exists`, `\nexists`, `\neg`, `\wedge`, `\vee`
- `\top`, `\bot`, `\vdash`, `\models`

### Símbolos Misceláneos
- `\partial`, `\nabla`, `\aleph`, `\imath`, `\jmath`, `\ell`, `\wp`
- `\Re`, `\Im`, `\hbar`, `\hslash`, `\degree`
- `\ldots`, `\cdots`, `\vdots`, `\ddots`
- `\emptyset`, `\varnothing`, `\infty`

## Límites de Seguridad

| Límite | Valor | Descripción |
|--------|-------|-------------|
| Tamaño máximo de fórmula | 5000 caracteres | Prevenir DoS por fórmulas muy largas |
| maxSize (KaTeX) | 500 | Límite de tamaño del DOM generado |
| maxExpand (KaTeX) | 1000 | Límite de expansiones de macros |

## API de Validación

### Uso Básico

```typescript
import { validateFormula, escapeHtml } from '@/components/math/MathFormula';

// Validar una fórmula
const result = validateFormula('\\frac{1}{2}');
if (result.isValid) {
  // Renderizar fórmula
} else {
  console.error(result.error);
}

// Escapar HTML
const safe = escapeHtml('<script>alert("xss")</script>');
// Resultado: &lt;script&gt;alert(&quot;xss&quot;)&lt;/script&gt;
```

### En Componentes React

```typescript
// MathFormula automáticamente valida
<MathFormula formula={userInput} />

// Mostrar error si es inválido
<MathFormula 
  formula={formula} 
  errorComponent={<span>Invalid formula</span>}
/>
```

## Mejores Prácticas

1. **Siempre validar en cliente Y servidor**
   - El frontend valida para UX inmediata
   - El backend debe validar también antes de almacenar

2. **Nunca uses `dangerouslySetInnerHTML` sin sanitización**
   - MathFormula usa KaTeX que genera DOM seguro
   - Usar DOMPurify si es necesario renderizar HTML

3. **Try-catch alrededor de katex.render()**
   - Ya implementado en MathFormula
   - Captura errores de parsing y renderizado

4. **Mantener lista de comandos actualizada**
   - Revisar periódicamente por nuevas técnicas de ataque
   - Actualizar DANGEROUS_PATTERNS según sea necesario

## Tests de Seguridad

Los tests unitarios están en:
- `MathFormula.security.test.ts`

Para ejecutar:
```bash
npm test MathFormula.security.test.ts
```

## Referencias

- [KaTeX Security Documentation](https://katex.org/docs/security.html)
- [XSS in LaTeX/MathJax](https://security.stackexchange.com/questions/198292/xss-through-mathjax-latex)
- [CVE-2021-42574](https://cve.mitre.org/cgi-bin/cvename.cgi?name=CVE-2021-42574) - Unicode bidirectional override

## Contacto

Para reportar vulnerabilidades de seguridad, contactar al equipo de seguridad.
