El siguiente artículo está basado en la versión 2205.0 de SAP Commerce Cloud. Antes de aplicar esta solución a su proyecto, valide si una versión posterior del parche de SAP Commerce soluciona El problema que se menciona a continuación.
El problema
Normalmente, la Consola de administración Hybris (hAC) le permite importar datos del proyecto (lo que generalmente significa cargar archivos ImpEx relevantes) navegando a Plataforma -> Actualizar, luego seleccionando las casillas de verificación de las extensiones que desea importar y finalmente haciendo clic en el botón Actualizar.
Sin embargo, en la versión 2205.0 de SAP Commerce, notará que las casillas seleccionadas se ignoran y no se importan datos del proyecto. Este artículo explica el motivo por el que esto sucede y propone una solución.
El diagnóstico
Para entender por qué sucede esto, primero necesitamos saber cómo se carga y representa la lista de extensiones cuando accede a la sección Actualización de hAC. Se carga un archivo JavaScript llamado init.js cuando se accede a la página de Actualización. El archivo se encuentra en el módulo web de la extensión hAC (hybris/bin/platform/ext/hac/web/webroot/static/js/platform/init.js).
Cuando el DOM está listo, se ejecuta una función llamada loadData, que realiza una llamada Ajax al URL /hac/platform/init/data. Esta llamada es manejada por el controlador InitUpdateController (método initData), que devuelve una carga útil JSON que contiene la lista de todas las extensiones instaladas. El problema surge cuando el archivo init.js procesa esa carga útil en el controlador de éxito de la llamada Ajax.
Cada uno de los elementos de datos del proyecto recibidos se pasa a la siguiente función:
function renderProjectDataUI(projectData) {
const html = $('<div class="extensionBox" />');
const name = $("<div/>").text(projectData.name).html();
html.append($('<input type="checkbox"/>', {id: `${name}_sample`, checked: "checked"}))
.append($('<label/>', {for: `${name}_sample`}).append(name))
.append('<br/>')
.append(renderProjectOptionsUI(projectData.parameter, name));
return html;
}El objetivo de esa función es crear una casilla de verificación para cada una de las extensiones recibidas para que la UI termine pareciéndose a la imagen al comienzo de esta publicación.
Sin embargo, si inspeccionamos el código HTML generado, veremos que las entradas creadas no tienen un id:
<div id="projectData">
<div class="extensionBox inactive">
<input type="checkbox">
<label for="core_sample">core</label>
<br>
</div>
<div class="extensionBox inactive">
<input type="checkbox">
<label for="commons_sample">commons</label>
<br>
</div>Mientras que la siguiente línea tiene la intención de agregar una identificación que se lea como nombre_extensión_muestra:
html.append($('<input type="checkbox"/>', {id: `${name}_sample`, checked: "checked"}))El error se debe al mal uso de la API jQuery para crear nuevos elementos. Según el documentación jQuery, en la versión 1.4 se introduce una función para la creación de nuevos elementos HTML, que acepta como segundo argumento un objeto que contiene los diferentes atributos del elemento HTML a crear. Sin embargo, «si se pasa el segundo argumento, la cadena HTML del primer argumento debe representar un elemento simple sin atributos.
Cuando se hace clic en el botón Actualizar, se llama a la función prepareInitUpdateData para recopilar las casillas de verificación seleccionadas que indican la lista de extensiones para actualizar. Como vemos, se recoge el atributo id de cada elemento, que en este caso estará vacío:
$('#projectData input[type=checkbox]').each(function () {
if ($(this).is(':checked')) {
postData.allParameters[this.id] = "true";
}
});Luego, los datos recopilados se envían a través de Ajax a URL /hac/platform/init/execute y los recibe el controlador InitUpdateController (método initExecuteWrap), que no puede identificar las extensiones seleccionadas porque se recibe una cadena vacía en lugar de la identificación adecuada.
Solución sugerida
El comando «ant personalizar» se puede ejecutar en la carpeta de la plataforma Hybris para anular archivos de las extensiones OOTB (listas para usar) SAP Commerce con sus archivos personalizados. Este comando copia recursivamente todos los archivos de la carpeta config/customize a la carpeta bin. Por lo general, se utiliza para proporcionar parches sobre las extensiones estándar SAP Commerce de una manera que pueda integrarse fácilmente con su proceso de implementación.
Como se trata de un error temporal en la extensión SAP Commerce hAC que se modificará en futuras versiones, una solución que requiere poco esfuerzo consiste en copiar el archivo init.js en la carpeta de personalización para que pueda corregir el código y anular el archivo OOTB al ejecutar «ant personalizar».
Para eso, primero que nada vaya a la carpeta de personalización (hybris/config/customize) y cree la siguiente estructura de carpetas: platform/ext/hac/web/webroot/static/js/platform/
Luego copie el archivo init.js desde la ubicación OOTB (hybris/bin/platform/ext/hac/web/webroot/static/js/platform/init.js) en la carpeta recién creada.
Después de eso, edite el archivo init.js y cambie la siguiente línea de la función renderProjectDataUI…
html.append($('<input type="checkbox"/>', {id: `${name}_sample`, checked: "checked"}))… a la siguiente línea:
html.append($('<input/>', {id: `${name}_sample`, checked: "checked", type: "checkbox"}))Además, para tener un archivo completamente correcto, cambie esta línea…
dd.append($('<input type="text"/>', {id: parameterId, value: inputDefaultValue}));… a la siguiente línea:
dd.append($('<input/>', {id: parameterId, value: inputDefaultValue, type: "text"}));Finalmente, está listo para ejecutar el comando «ant personalizar», iniciar el servidor y verificar que los datos del proyecto se puedan importar como se esperaba. Es posible que deba borrar el caché del navegador para forzar la descarga del nuevo archivo js.
Tenga en cuenta que la solución sugerida anteriormente es válida para entornos de desarrollo e implementaciones locales o de versiones anteriores en la nube donde usted tiene control sobre el proceso de compilación, lo que le permite ejecutar el comando «personalizar hormiga».
¿Aún necesitas ayuda?
Si tú o tu equipo necesitáis ayuda con algún proyecto SAP Commerce, desde E-Turia siempre estaremos encantados de poder ayudar. Puede comunicarse con nosotros o ver los servicios comerciales disponibles: