wp-interactivity-api
por WordPressUsa la skill de wp-interactivity-api para crear o depurar funciones de la WordPress Interactivity API en desarrollo frontend. Ayuda con directivas `data-wp-*`, `@wordpress/interactivity` store/state/actions, integración de `viewScriptModule`, hydration y comportamiento de directivas, con orientación práctica para instalación, uso y resolución de problemas específicos del repositorio.
Esta skill obtiene 82/100, lo que la convierte en una ficha sólida para usuarios que trabajan en problemas de WordPress Interactivity API. El repositorio ofrece a los agentes un disparador claro, pasos prácticos de triage y suficiente detalle de implementación y depuración para reducir la incertidumbre frente a un prompt genérico, aunque es más específica que una skill completa para construir aplicaciones de extremo a extremo.
- Cobertura explícita de disparadores para marcadores de Interactivity API como `data-wp-interactive`, `@wordpress/interactivity` y la integración de `viewScriptModule`.
- Buena orientación operativa con procedimiento, entradas requeridas y referencias de depuración para hydration, directivas y renderizado del lado del servidor.
- Notas útiles específicas de WordPress 6.9, incluidos identificadores únicos de directivas y el comportamiento obsoleto de `data-wp-ignore`.
- Algunos flujos de trabajo requieren WP-CLI y la skill asume un agente basado en sistema de archivos con bash + node, por lo que puede no encajar bien en entornos ligeros.
- No incluye comando de instalación ni scripts, así que su adopción depende de que el usuario ya sepa cómo colocar y ejecutar la skill.
Descripción general de la skill wp-interactivity-api
Qué hace esta skill
La skill wp-interactivity-api te ayuda a construir o depurar funciones de la WordPress Interactivity API sin tener que adivinar directivas, la estructura del store o cómo conectar servidor y cliente. Resulta especialmente útil cuando trabajas con marcado data-wp-*, @wordpress/interactivity, viewScriptModule o funciones wp_interactivity_*() y necesitas un camino práctico desde una interacción rota hasta una que funcione.
Para quién es
Usa la wp-interactivity-api skill si haces Frontend Development en un bloque, tema o plugin de WordPress y necesitas una interfaz interactiva que sobreviva al primer render sin problemas. Encaja muy bien cuando ya tienes un repo y necesitas ayuda para rastrear por qué falla la hidratación, por qué una directiva no se dispara o cómo estructurar correctamente una nueva región interactiva.
Por qué merece la pena instalarla
El valor principal es la rapidez para decidir: te indica qué buscar, qué entradas importan y cómo separar enfoques basados en bloques, a nivel de tema y de mejora de un plugin. Eso hace que la guía wp-interactivity-api sea más útil que un prompt genérico, porque refleja las restricciones reales de WordPress 6.9+ y la forma en que esta API está conectada.
Cómo usar la skill wp-interactivity-api
Instálala y delimítala correctamente
Usa el patrón wp-interactivity-api install desde el punto de entrada del directorio y luego aplica la skill dentro de una sesión de agente con acceso al sistema de archivos y con bash y Node disponibles. El repositorio indica compatibilidad con WordPress 6.9+ y, para algunos flujos, WP-CLI; si tu entorno no puede inspeccionar los archivos del proyecto ni ejecutar comandos de WordPress, los resultados serán más débiles.
Dale los datos iniciales adecuados
El uso de wp-interactivity-api funciona mejor cuando aportas:
- raíz del repo
- salida de triaje de
wp-project-triage - superficie afectada: frontend, editor o ambas
- versión de WordPress y cualquier restricción de módulos/build
Un prompt débil sería: “Arregla la Interactivity API.”
Un prompt más sólido sería: “Depura por qué data-wp-on--click no se dispara en este bloque en el frontend, WordPress 6.9, con scripts de módulo activados, triaje adjunto, y el problema solo aparece después de la navegación.”
Lee primero estos archivos
Empieza por SKILL.md y luego abre:
references/directives-quickref.mdpara nombres de directivas y anclas de búsquedareferences/debugging.mdpara la lista de comprobación de fallosreferences/server-side-rendering.mdpara la configuración del lado PHP y las reglas de hidratación
Si estás decidiendo si la skill encaja con la tarea actual, esos tres archivos muestran el flujo real más rápido que el árbol del repositorio por sí solo.
Sigue el flujo práctico
La skill está organizada en una secuencia sencilla:
- detectar el uso existente con búsquedas de
data-wp-interactive,@wordpress/interactivityyviewScriptModule - identificar el namespace del store y comprobar si el marcado espera el mismo nombre
- verificar el contexto renderizado en servidor y el estado inicial
- comprobar si el elemento raíz, el módulo del view script y las directivas de eventos están presentes en el HTML renderizado
- reducir el alcance hasta aislar la directiva rota o la ruta de estado afectada
Para nuevos bloques interactivos, conviene usar la plantilla oficial de scaffold en lugar de inventar la estructura desde cero.
Preguntas frecuentes de la skill wp-interactivity-api
¿Es solo para depurar?
No. La wp-interactivity-api skill cubre tanto trabajo de construcción como de depuración. Es especialmente útil cuando necesitas decidir si añadir interactividad mediante un viewScriptModule de bloque, mejorar marcado existente en un plugin o conectar comportamiento a nivel de tema de una forma que también hidrate correctamente.
¿En qué se diferencia de un prompt normal?
Un prompt normal suele omitir los detalles específicos de WordPress que realmente determinan el éxito: el nombre de la directiva, la coincidencia del namespace del store, el contexto del lado servidor y los cambios de comportamiento de WordPress 6.9. Esta skill incorpora esas comprobaciones, lo que reduce los intentos fallidos y ayuda al agente a leer primero los archivos correctos.
¿Es apta para principiantes?
Sí, si puedes describir el objetivo y señalar al agente la zona correcta del repo. No es un tutorial para aprender toda la API desde cero, pero sí ayuda a principiantes a evitar los errores de adopción más comunes: no incluir la raíz interactiva, usar namespaces que no coinciden y elegir una ruta de renderizado incorrecta.
¿Cuándo no debería usarla?
No la uses para trabajo de interfaz JavaScript no relacionado con la WordPress Interactivity API, ni cuando tu funcionalidad sea totalmente estática y no necesite directivas renderizadas en servidor. Tampoco es una buena opción si no puedes inspeccionar los archivos reales del repo, porque la skill depende de detalles específicos de marcado e integración PHP/JS.
Cómo mejorar la skill wp-interactivity-api
Aporta un contexto de origen más preciso
Los mejores resultados llegan cuando muestras la superficie actual del bloque, tema o plugin junto con la directiva o función exacta que quieres revisar. Incluye fragmentos alrededor de data-wp-interactive, data-wp-context y el namespace del store correspondiente para que el agente compare la intención con la implementación en lugar de deducirla.
Explica el modo de fallo, no solo el síntoma
Para la wp-interactivity-api skill, “el botón no hace nada” es demasiado vago. Mejor aportar entradas que nombren la rotura observable y el comportamiento esperado: “el controlador de click está enlazado, pero el estado no se actualiza después del render en servidor” o “la hidratación funciona en la primera carga, pero falla tras la navegación del lado cliente”. Eso ayuda a distinguir problemas de directivas de problemas de inicialización del estado o de carga de módulos.
Pide primero una salida de lectura del repositorio y luego itera
Un buen flujo con la wp-interactivity-api guide es pedir:
- la causa raíz más probable
- los archivos exactos que conviene inspeccionar después
- el cambio mínimo de código
- cualquier riesgo de compatibilidad con WordPress 6.9
Después, itera con el primer resultado en la mano. Si el problema es de renderizado en servidor, incluye el PHP relevante y el HTML renderizado. Si es de manejo de eventos, incluye el marcado de la directiva y el archivo de acciones del store. Así la skill deja de ser un ayudante de búsqueda y se convierte en una lista de verificación útil para implementar.