customJS

Una de las principales características de los componentes generados con Web Component Factory es que es posible incorporar código JavaScript al componente, sin modificar el componente en sí. No solo eso, se puede acceder directamente a todas las constantes, variables y métodos del componente sin intermediarios. El mecanismo para hacer esto se denomina customJS

Un Web Componet tiene un ciclo de vida en el que se crea, se despliega en la pantalla (render), se modifica y se elimina. Un método clave de un Web Component es connectedCallback, que es llamado cuando el componente se despliega o “renderiza” y en la que naturalmente WCF añade todo el código que generará el HTML y CSS con la funcionalidad correspondiente. El código customJS es agregado al final de esta función, como parte integrante de la misma.

El mecanismo que utiliza WCF para añadir JavaScript por parte del usuario tiene la virtud de separar completamente el código generado por la fábrica de componentes del que el usuario agregó, pudiendo modificarse cada uno de forma totalmente independiente. Lo que sí es realmente importante hacer notar es que los cambios en el componente, sobre todo los que modifican su estructura más que su aspecto (es decir, los que cambian el HTML, no los que alteran el CSS), pueden modificar los nombres de las variables y otros identificadores, obligando a una revisión del customJS para que siga funcionando.

this

Dentro del customJS se puede acceder al componente a través de la palabra clave de JavaScript this, como en cualquier método de un objeto.

No es necesario utilizar getInstanceById ni ninguna otra función de la API para acceder a los elementos: se utilizan las constantes y variables que fueron declaradas más arriba directamente.

customJS en el editor y como URL

La interfaz de la fábrica de WCF permite editar el customJS directamente en un pequeño editor. El editor es muy sencillo y está pensado para agregar pequeñas piezas de código que sean suficientes cuando lo que se requiere son cambios menores.

Además del editor, se puede agregar customJS proporcionando una URL. La fábrica toma el contenido de la URL y lo agrega tal como viene al componente. La idea es que el programador utilice sus herramientas habituales para generar el JavaScript, y las incorpore de esta forma al código del componente.

Una vez incorporado el código, no hay ningún otro vínculo de WCF ni del componente con la URL ni con el código que contiene. El componente jamás accederá a esa URL, ni siquiera está almacenada en su código. No importa que su contenido cambie o que la URL deje de ser válida, el customJS incorporado permanecerá inalterado.

En el caso de que se genere customJS tanto a través del editor como de la URL, primero se agrega el código que viene del editor, y luego el de la URL.