Tengo JavaScript en mi tema (¿ya soy famoso? ;)) que modifica el DOM agregando elementos mediante api.decorateCooked(…. Inserto varios elementos de cabecera HTML.
También tengo instalado el componente de tema DiscoTOC.
Sin embargo, agregar el habitual <div data-theme-toc="true"></div> que DiscoTOC detecta y expande no genera una tabla de contenidos que incluya los elementos que inserté dinámicamente.
Estoy pensando que esto podría ser tan simple como el orden de ejecución… si DiscoTOC busca antes de que mi JavaScript agregue más elementos…
¿Qué determina el orden de ejecución si múltiples fragmentos de código de JavaScript del tema llaman a api.cooked(?
Ten en cuenta que DiscoTOC solo se ejecuta en el contenido de las publicaciones: si insertas esos elementos fuera de las publicaciones, no los detectará.
No creo que hayamos necesitado definir el orden de ejecución de JS hasta ahora.
Lo estoy insertando dentro de la publicación, sí. Por eso sospecho que el problema es el orden de ejecución.
Algo en el código determina el orden de ejecución… ese es el punto clave para que mi componente aparezca antes que el TOC. Por ejemplo, si se ordena alfabéticamente por nombre de componente (es decir, como se muestra en la lista de componentes en el área de administración), podría intentar nombrar mi componente en consecuencia, etc.
Dicho esto, puedes establecer el orden de los inicializadores para casos de uso avanzados. Puedo colocar DiscoTOC en un inicializador con nombre para que puedas ejecutar tu código antes que DiscoTOC, pero necesito saber qué estás intentando hacer primero para darte una respuesta clara.
Tus modificaciones aquí se basan en una solicitud HTTP/AJAX, ¿correcto?
Sí, AJAX, pero usando una llamada síncrona. (Siempre me ha encantado el oxímoron de AJAX síncrono :^))
Siento que mi siguiente paso es crear un componente adecuado; por ahora, es solo algo de JS pegado en el encabezado de mi tema. Luego puedo intentar jugar con un ID elegido cuidadosamente. “_foo” o “0-foo” podrían ser todo lo que necesito.
Correcto. Si deseas usar inicializadores con nombre y el orden de inicialización, tu componente necesitará tener un inicializador en la carpeta /javascript.
Pero no te preocupes, puedo ayudarte con todo eso. Mañana te responderé con una respuesta completa.
Si no recuerdo mal, los componentes de tema se evalúan después de los complementos.
Y puedo estar equivocado, pero se cargan en orden alfabético, por lo que poner una x- delante del nombre me ha ayudado en el pasado a asegurar que un componente de tema específico se evalúe al final.
Las respuestas de otros sugieren que el nombre del componente no afecta el orden de ejecución. Acabo de renombrarlos a aa-mycomponent y x-last-DiscoTOC y no funciona. [DiscoTOC no incluye encabezados añadidos dinámicamente al DOM, sí, dentro del cuerpo de la publicación]
hmmmmmmm… tal vez lo que está mal es más que el pedido. Acabo de inspeccionar… y las cosas en el DOM que pensé que eran encabezados HTML… son en realidad etiquetas DIV con class=\"d-toc-ignore\"
Hora de que profundice más. ¿A dónde fueron mis encabezados?
Bueno, creo que podrías demostrarlo de cualquier manera probando un ejemplo muy básico.
Crea dos componentes simples, anulando o conectando lo mismo, quizás una plantilla simple con una ligera diferencia, llama a uno por un nombre que comience más tarde en el alfabeto, observa cuál termina anulando el tema.
Está muy claramente ordenado por nombre en el código aquí en el modelo:
El nombre no afecta el orden de ejecución. @merefield la línea que enlazaste afecta cómo se muestran en la interfaz de administración, pero no se usa para la ejecución real.
Esta es la línea relevante para el orden de ejecución:
Por lo tanto, se ejecutan en orden ascendente de ‘id’ en la base de datos.
La única garantía que es portable entre instancias de Discourse es que el código del tema siempre se ejecuta antes que el código del componente del tema.
Como mencionó @Johani anteriormente, si necesita ejecutar código después de que se haya cargado algún otro componente, la mejor opción probablemente sea usar un inicializador de Ember, que admite el orden. Desafortunadamente, eso no será posible de inmediato en este caso, ya que parece que DiscoTOC no está utilizando inicializadores de Ember. Actualizar DiscoTOC para usar javascript de múltiples archivos (y, por lo tanto, inicializadores de Ember) ciertamente sería pr-welcome
