Capturas e inspección visual
Combina relectura estructurada, capturas renderizadas y comprobaciones de diapositivas.
La inspección visual transforma modelos en imágenes y evidencias de diseño. El Agent comprueba datos y fórmulas antes de revisar texto, figuras y páginas renderizados; puede corregirlos con Facades y verificar el nuevo estado.
Tres clases de evidencia
| Evidencia | Qué comprueba |
|---|---|
| Lectura estructurada | Valores originales, fórmulas y resultados, párrafos y propiedades. |
| PNG | Contenido visible, recortes, gráficos, colores y composición. |
| Diagnóstico de diseño | Reglas, IDs, límites y posiciones derivados del renderizado para correcciones precisas. |
Preparar estado y dependencias
Screenshot y Layout Lint reciben UnitData materializado, sin conectar destinos remotos ni interpretar changesets. En colaboración, haga pull(), espere aplicar los cálculos tras editar fórmulas y use exportUnitData(). Para Worktree exporte el borrador correcto; la aplicación puede guardar destino, revision y alcance junto al informe.
El Snapshot anfitrión no contiene todas las dependencias. Pase fuentes Sheet/Relational Table con formulaReferenceUnits y contenido hijo con embeddedUnits; Render Page materializa las dependencias antes del anfitrión. Prepare imágenes UUID con resolveUnitScreenshotImageAssets() y un resolver de aplicación. La resolución es best-effort: revise los recursos ausentes.
Del contenido a una imagen estable
univer-render-runtime sirve la Render Page creada por la aplicación y abre el navegador desde Node.js. Los plugins restauran contenido y ambos lados validan el protocolo. Cada Runtime ejecuta operaciones en una cola serial, reutilizable entre comprobaciones; su propietario llama a close().
La preparación depende del producto. Las Shapes con fórmulas esperan salir de pending y, cuando hace falta, píxeles estables durante varios fotogramas. Relational Table espera fuentes, cálculo, table/view activa y diseño DOM/Canvas estable. Salir de pending también puede significar error: compruebe valor y estado.
La implementación actual calcula un hash de UnitData anfitrión, fuentes y contenido hijo serializados. Si los datos cambian, cambia la key aunque el Unit ID sea idéntico, evitando reutilizar imágenes antiguas solo por identidad.
Elegir el alcance por producto
| Producto | Alcance y salida |
|---|---|
| Sheet | Hoja y rango A1 explícitos para PNG regional; seleccione los resultados importantes. |
| Doc | Selección o enumeración de páginas para PNG individuales. |
| Slide | Páginas desde 1 o page ID y contact sheet opcional. |
| Relational Table | Área de trabajo de la tabla/vista activa al abrir, mediante DOM + Canvas. |
| Canvases | Límites completos o region / elementIds mutuamente excluyentes, padding y evidencias. |
unit-screenshot devuelve bytes, dimensiones, identidad de página/rango y nombres sugeridos; la aplicación guarda. Scale acepta 0.1–4, con maxPages y maxPixels por imagen configurables. Duplicar la escala cuadruplica aproximadamente los píxeles; divida contenidos grandes. PDF queda fuera de esta entrada de cinco productos.
Compartir datos para captura y lint
Capture y analice los mismos datos Slide y fuentes de fórmulas. renderRuntime ya existe y slideData es el snapshot preparado. Las capacidades no escriben archivos. Consulte inspección visual AI SDK para construir la página y cerrar recursos.
import { createUnitScreenshot } from '@univer-cli/unit-screenshot'import { createUnitLayoutLint } from '@univer-cli/unit-layout-lint'const source = { unitType: 'slide' as const, unitData: slideData, formulaReferenceUnits,}const screenshot = createUnitScreenshot({ runtime: renderRuntime })const lint = createUnitLayoutLint({ runtime: renderRuntime })const capture = await screenshot.capture({ ...source, target: { kind: 'slide-pages', pages: [1], scale: 2 },})const report = await lint.lint({ ...source, pages: [1] })Slide: localizar problemas con tinta de glifos
Layout Lint utiliza datos del navegador. declared es el cuadro del modelo; ink representa los glifos realmente dibujados, con composición, alineación y rotación en coordenadas de página. Que el cuadro quepa no garantiza que sus letras quepan.
| Regla actual | Evidencia |
|---|---|
text-off-page | La tinta real del texto sale de la página. |
text-escapes-container | El texto desborda claramente un contenedor opaco menor identificado. |
text-overlaps-text | Dos áreas reales de tinta se solapan de forma significativa. |
coverage.pages y coverage.rules indican el alcance. Cada finding aporta pageId, id, text.ink y los correspondientes overflow, container u other; fingerprint estable permite comparar rondas. Actualmente son warnings para revisar con imágenes. Una lista vacía solo indica que el alcance elegido no activó esas reglas.
Canvases: comprobar rutas renderizadas
La captura Canvases añade layoutAnalysis: routes, issues y summary resueltos en el navegador. Es una entrada distinta de unit-layout-lint, exclusivo de Slide. Las rutas automáticas pueden estar sin resolver en el modelo; examine resultados con source: 'rendered'.
Los diagnósticos identifican líneas que atraviesan elementos, cruces y colisiones de flechas o etiquetas, con connectorIds, elementIds y focusBounds. Corrija los objetos, capture region o elementIds y revise de nuevo el conjunto. Así un problema visual se convierte en una edición Facade concreta.
Entregar las evidencias
Conserve resultados estructurados, alcance, páginas, imágenes y diagnósticos. Una captura no prueba la corrección de fórmulas ni lint sustituye el juicio visual. Verifique barras, foco y menús emergentes en Web y confirme las dependencias entre Units.
Complete las comprobaciones antes de Ready en Worktree. Consulte ejecución sin interfaz y cálculo de servidor y Agents y automatización.
¿Cómo es esta guía?