Dos Ideas. - Contribuciones del usuario [es]

Templates en Liferay

2013-08-13T11:44:02Z

Emiliano.tebes: /* Acceder al valor de una property desde un template */

Los templates nos indican cómo se va a renderizar una determinada estructura. Liferay soporta varias formas de definirlos, y en este caso usaremos [http://velocity.apache.org/ Apache Velocity].

==Acceder al valor de una property desde un template==

Liferay nos define ciertas variables a las cuales podemos acceder desde un template. Podemos encontrar un listado en la [http://www.liferay.com/es/community/wiki/-/wiki/Main/Access+Objects+from+Velocity documentación oficial]. Una de ellas es propsUtil, que nos dará acceso a las properties que necesitamos:
#set($nuestraVariable= $propsUtil.get("nombre.de.la.property"))

Templates en Liferay

2013-08-13T11:42:40Z

Emiliano.tebes: /* Acceder al valor de una property desde un template */

Los templates nos indican cómo se va a renderizar una determinada estructura. Liferay soporta varias formas de definirlos, y en este caso usaremos [http://velocity.apache.org/ Apache Velocity].

==Acceder al valor de una property desde un template==

Liferay nos define ciertas variables a las cuales podemos acceder desde un template. La documentación oficial nos brinda un [http://www.liferay.com/es/community/wiki/-/wiki/Main/Access+Objects+from+Velocity listado]. Una de ellas es propsUtil, que nos dará acceso a las properties que necesitamos:
#set($nuestraVariable= $propsUtil.get("nombre.de.la.property"))

Templates en Liferay

2013-08-13T11:40:00Z

Emiliano.tebes:

Los templates nos indican cómo se va a renderizar una determinada estructura. Liferay soporta varias formas de definirlos, y en este caso usaremos [http://velocity.apache.org/ Apache Velocity].

==Acceder al valor de una property desde un template==

Liferay nos define ciertas variables a las cuales podemos acceder desde un template. Una de ellas es propsUtil, que nos dará acceso a las properties que necesitamos:
#set($nuestraVariable= $propsUtil.get("nombre.de.la.property"))

Templates en Liferay

2013-08-13T11:38:57Z

Emiliano.tebes: Página creada con 'Los templates nos indican cómo se va a renderizar una determinada estructura. Liferay soporta varias formas de definirlos, y en este caso usaremos [http://velocity.apache.org/ …'

Los templates nos indican cómo se va a renderizar una determinada estructura. Liferay soporta varias formas de definirlos, y en este caso usaremos [http://velocity.apache.org/ Apache Velocity].

Acceder al valor de una property desde un template:

Liferay nos define ciertas variables a las cuales podemos acceder desde un template. Una de ellas es propsUtil, que nos dará acceso a las properties que necesitamos:
#set($nuestraVariable= $propsUtil.get("nombre.de.la.property"))

Liferay Portal

2013-08-13T11:31:56Z

Emiliano.tebes: /* Ver también */

[[Category:Portlet]]
Liferay Portal es un [[Administrador De Contenidos]] de [[Software Libre]] basado en Java, que cumple con la [[Portlet Specification Api]].

Entre las características principales se destacan:
* Administrador de contenidos (CMS) y una Suite de colaboración
* Varios porlets integrados listos para usar
* Herramientas de desarrollo
* Traducción a 22 idiomas
* Funciona con los principales [[Servidor de Aplicaciones]], bases de datos y sistemas operativos.

== Conceptos de estilos y disposición ==
=== Tema (Theme) ===
Vamos a ver los conceptos de Tema (Theme), Disposición (Layout).

Un '''Tema (o Theme)''' es el encargado de renderizar la página en su totalidad, e incluye los aspectos visuales generales del sitio. Un Tema incluye los JavaScript generales, los CSS, y seguramente también el logo del sitio, el menú general, el pie de página, etc. El Tema define un área donde se ubicará el contenido.

Al crear un Tema en realidad se suele "heredar" de algún tema ya existente. Liferay trae 2 temas ya preparados para heredar: "_styled" (del que suele heredarse) y "_unstyled" (que es aún más básico). Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/html/themes

=== Disposición (layout) ===
Un Tema declara un área donde se ubicará el contenido. Este área de contenido puede tener distintas disposiciones (2 columnas, 3 columnas, etc.); esta disposición se conoce como Layout. Cada página en Liferay puede tener un Layout asociado.

Liferay ya trae varios Layouts comunes declarados, y pueden crearse nuevos. Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/layouttpl

== Conceptos de gestión de contenidos ==
Liferay permite manejar dos grandes conceptos para gestionar el contenido de una página:
* Estructuras
* Listas dinámicas

=== Estructuras ===
Se pueden crear estructuras de datos para que el usuario complete y pueda cambiar facilmente contenido de la página sin tocar HTML. Una estructura tiene asociado una Plantilla (Template) que indica cómo se renderiza el contenido de una Estructura.

Por ejemplo, puede crearse una estructura Promocion, que contenga un título y una imagen. Luego, se puede crear una Plantilla para la estructura Promoción que renderiza dicha estructura mostrando la imagen y el título debajo.

Al usuario final le quedan entonces 2 pasos para completar:
1. Instanciar la estructura para agregarle datos.
2. Ubicar la estructura instanciada en alguna posición de la página.

Las estructuras, plantillas y instancias de estructras se gestionan desde el Control Panel > Site > Web Content.

=== Listas dinámicas ===
Se pueden crear listas de contenido variable, para que el usuario agregue como si de una lista se tratara. Las listas son de un tipo de dato en particular (el cual se configura al igual que una estructura), y se les asocia una plantilla para renderizar la lista (y opcionalmente, una plantilla para renderizar el formulario de ingreso de un dato de la lista).

Las listas dinámicas se gestionan desde el Control Panel > Site > Dynamic Data Lists

Leer más sobre [http://www.liferay.com/es/documentation/liferay-portal/6.1/user-guide/-/ai/make-it-pretty-creating-custom-displays Crear y estilar listas dinámicas en Liferay].

== Ver también ==
* [http://www.liferay.com Web oficial de Liferay Portal]
* [http://wiki.liferay.com/index.php/Main_Page Wiki oficial de Liferay ]
* [[Dynamic Query en Liferay]]
* [[Ejecuciones automaticas en Liferay]]
* [[Maven en Liferay]]
* [[Hooks en Liferay]]
* [[Internacionalizar un texto dentro de un theme en Liferay]]
* [[Hacer un layout responsive con bootstrap en Liferay]]
* [[Configurar el editor de texto html (CKEditor) en Liferay]]
* [[Custom Fields en Liferay]]
* [[Compatibilidades CSS en Internet Explorer]]
* [[Botones Redes Sociales]]
* [[JSON Service API en Liferay]]
* [[Templates en Liferay]]

== Componentes ==
* [[Carrusel con limite en Liferay]]
* [[Encuesta con estilos propios en Liferay]]
* [[Embeber un portlet dentro de un theme en Liferay]]
* [[Tooltip de ayuda para un componente en Liferay]]

Liferay Portal

2013-08-13T11:19:19Z

Emiliano.tebes: /* Ver también */

[[Category:Portlet]]
Liferay Portal es un [[Administrador De Contenidos]] de [[Software Libre]] basado en Java, que cumple con la [[Portlet Specification Api]].

Entre las características principales se destacan:
* Administrador de contenidos (CMS) y una Suite de colaboración
* Varios porlets integrados listos para usar
* Herramientas de desarrollo
* Traducción a 22 idiomas
* Funciona con los principales [[Servidor de Aplicaciones]], bases de datos y sistemas operativos.

== Conceptos de estilos y disposición ==
=== Tema (Theme) ===
Vamos a ver los conceptos de Tema (Theme), Disposición (Layout).

Un '''Tema (o Theme)''' es el encargado de renderizar la página en su totalidad, e incluye los aspectos visuales generales del sitio. Un Tema incluye los JavaScript generales, los CSS, y seguramente también el logo del sitio, el menú general, el pie de página, etc. El Tema define un área donde se ubicará el contenido.

Al crear un Tema en realidad se suele "heredar" de algún tema ya existente. Liferay trae 2 temas ya preparados para heredar: "_styled" (del que suele heredarse) y "_unstyled" (que es aún más básico). Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/html/themes

=== Disposición (layout) ===
Un Tema declara un área donde se ubicará el contenido. Este área de contenido puede tener distintas disposiciones (2 columnas, 3 columnas, etc.); esta disposición se conoce como Layout. Cada página en Liferay puede tener un Layout asociado.

Liferay ya trae varios Layouts comunes declarados, y pueden crearse nuevos. Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/layouttpl

== Conceptos de gestión de contenidos ==
Liferay permite manejar dos grandes conceptos para gestionar el contenido de una página:
* Estructuras
* Listas dinámicas

=== Estructuras ===
Se pueden crear estructuras de datos para que el usuario complete y pueda cambiar facilmente contenido de la página sin tocar HTML. Una estructura tiene asociado una Plantilla (Template) que indica cómo se renderiza el contenido de una Estructura.

Por ejemplo, puede crearse una estructura Promocion, que contenga un título y una imagen. Luego, se puede crear una Plantilla para la estructura Promoción que renderiza dicha estructura mostrando la imagen y el título debajo.

Al usuario final le quedan entonces 2 pasos para completar:
1. Instanciar la estructura para agregarle datos.
2. Ubicar la estructura instanciada en alguna posición de la página.

Las estructuras, plantillas y instancias de estructras se gestionan desde el Control Panel > Site > Web Content.

=== Listas dinámicas ===
Se pueden crear listas de contenido variable, para que el usuario agregue como si de una lista se tratara. Las listas son de un tipo de dato en particular (el cual se configura al igual que una estructura), y se les asocia una plantilla para renderizar la lista (y opcionalmente, una plantilla para renderizar el formulario de ingreso de un dato de la lista).

Las listas dinámicas se gestionan desde el Control Panel > Site > Dynamic Data Lists

Leer más sobre [http://www.liferay.com/es/documentation/liferay-portal/6.1/user-guide/-/ai/make-it-pretty-creating-custom-displays Crear y estilar listas dinámicas en Liferay].

== Ver también ==
* [http://www.liferay.com Web oficial de Liferay Portal]
* [http://wiki.liferay.com/index.php/Main_Page Wiki oficial de Liferay ]
* [[Dynamic Query en Liferay]]
* [[Ejecuciones automaticas en Liferay]]
* [[Maven en Liferay]]
* [[Hooks en Liferay]]
* [[Internacionalizar un texto dentro de un theme en Liferay]]
* [[Hacer un layout responsive con bootstrap en Liferay]]
* [[Configurar el editor de texto html (CKEditor) en Liferay]]
* [[Custom Fields en Liferay]]
* [[Compatibilidades CSS en Internet Explorer]]
* [[Botones Redes Sociales]]
* [[JSON Service API en Liferay]]
* [[Acceder a properties desde un template en Liferay]]

== Componentes ==
* [[Carrusel con limite en Liferay]]
* [[Encuesta con estilos propios en Liferay]]
* [[Embeber un portlet dentro de un theme en Liferay]]
* [[Tooltip de ayuda para un componente en Liferay]]

Liferay Portal

2013-08-12T19:33:10Z

Emiliano.tebes: /* Ver también */

[[Category:Portlet]]
Liferay Portal es un [[Administrador De Contenidos]] de [[Software Libre]] basado en Java, que cumple con la [[Portlet Specification Api]].

Entre las características principales se destacan:
* Administrador de contenidos (CMS) y una Suite de colaboración
* Varios porlets integrados listos para usar
* Herramientas de desarrollo
* Traducción a 22 idiomas
* Funciona con los principales [[Servidor de Aplicaciones]], bases de datos y sistemas operativos.

== Conceptos de estilos y disposición ==
=== Tema (Theme) ===
Vamos a ver los conceptos de Tema (Theme), Disposición (Layout).

Un '''Tema (o Theme)''' es el encargado de renderizar la página en su totalidad, e incluye los aspectos visuales generales del sitio. Un Tema incluye los JavaScript generales, los CSS, y seguramente también el logo del sitio, el menú general, el pie de página, etc. El Tema define un área donde se ubicará el contenido.

Al crear un Tema en realidad se suele "heredar" de algún tema ya existente. Liferay trae 2 temas ya preparados para heredar: "_styled" (del que suele heredarse) y "_unstyled" (que es aún más básico). Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/html/themes

=== Disposición (layout) ===
Un Tema declara un área donde se ubicará el contenido. Este área de contenido puede tener distintas disposiciones (2 columnas, 3 columnas, etc.); esta disposición se conoce como Layout. Cada página en Liferay puede tener un Layout asociado.

Liferay ya trae varios Layouts comunes declarados, y pueden crearse nuevos. Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/layouttpl

== Conceptos de gestión de contenidos ==
Liferay permite manejar dos grandes conceptos para gestionar el contenido de una página:
* Estructuras
* Listas dinámicas

=== Estructuras ===
Se pueden crear estructuras de datos para que el usuario complete y pueda cambiar facilmente contenido de la página sin tocar HTML. Una estructura tiene asociado una Plantilla (Template) que indica cómo se renderiza el contenido de una Estructura.

Por ejemplo, puede crearse una estructura Promocion, que contenga un título y una imagen. Luego, se puede crear una Plantilla para la estructura Promoción que renderiza dicha estructura mostrando la imagen y el título debajo.

Al usuario final le quedan entonces 2 pasos para completar:
1. Instanciar la estructura para agregarle datos.
2. Ubicar la estructura instanciada en alguna posición de la página.

Las estructuras, plantillas y instancias de estructras se gestionan desde el Control Panel > Site > Web Content.

=== Listas dinámicas ===
Se pueden crear listas de contenido variable, para que el usuario agregue como si de una lista se tratara. Las listas son de un tipo de dato en particular (el cual se configura al igual que una estructura), y se les asocia una plantilla para renderizar la lista (y opcionalmente, una plantilla para renderizar el formulario de ingreso de un dato de la lista).

Las listas dinámicas se gestionan desde el Control Panel > Site > Dynamic Data Lists

Leer más sobre [http://www.liferay.com/es/documentation/liferay-portal/6.1/user-guide/-/ai/make-it-pretty-creating-custom-displays Crear y estilar listas dinámicas en Liferay].

== Ver también ==
* [http://www.liferay.com Web oficial de Liferay Portal]
* [http://wiki.liferay.com/index.php/Main_Page Wiki oficial de Liferay ]
* [[Dynamic Query en Liferay]]
* [[Ejecuciones automaticas en Liferay]]
* [[Maven en Liferay]]
* [[Hooks en Liferay]]
* [[Internacionalizar un texto dentro de un theme en Liferay]]
* [[Hacer un layout responsive con bootstrap en Liferay]]
* [[Configurar el editor de texto html (CKEditor) en Liferay]]
* [[Custom Fields en Liferay]]
* [[Compatibilidades CSS en Internet Explorer]]
* [[Botones Redes Sociales]]
* [[JSON Service API en Liferay]]
* [[Acceder a properies desde un template en Liferay]]

== Componentes ==
* [[Carrusel con limite en Liferay]]
* [[Encuesta con estilos propios en Liferay]]
* [[Embeber un portlet dentro de un theme en Liferay]]
* [[Tooltip de ayuda para un componente en Liferay]]

Hooks en Liferay

2013-07-23T19:56:38Z

Emiliano.tebes: /* Hook de Asset Publisher */

==Qué es un Hook? ==
Es una extensión de un componente de Liferay, es decir, tomar un componente que ya posee y sobreescribir ciertas cosas para adecuarlo a nuestras necesidades.

== ¿Cómo creo un Hook? ==
Para crear un hook podemos utilizar el arquetipo de maven '''liferay-hook-archetype'''

==Hook de Asset Publisher==
Un asset publisher nos muestra publicaciones que va recolectando de distintas páginas del sitio. Tiene por default 4 formas de mostrarse:
* table
* title-list
* abstracts
* full-content

En este caso, supongamos que ninguna de estas formas nos resultan adecuadas, y que queremos mostrarlo de alguna otra manera. Para esto, debemos realizar lo siguiente:

* Crear el hook con el arquetipo de Maven.
* En la estructura del proyecto, crear un nuevo JSP en WEB-INF/jsp/html/portlet/asset_publisher/display/nuestraVista.jsp

* Esta implementación utiliza clases de Liferay para obtener los valores a mostrar (en este caso título, descripción y un link):

<code>
<%@ include file="/html/portlet/asset_publisher/init.jsp" %>
<%
List results = (List) request.getAttribute("view.jsp-results");
int assetEntryIndex = ((Integer) request.getAttribute("view.jsp-assetEntryIndex")).intValue();
AssetEntry assetEntry = (AssetEntry) request.getAttribute("view.jsp-assetEntry");
AssetRendererFactory assetRendererFactory = (AssetRendererFactory) request.getAttribute("view.jsp-assetRendererFactory");
AssetRenderer assetRenderer = (AssetRenderer) request.getAttribute("view.jsp-assetRenderer");

boolean show = ((Boolean) request.getAttribute("view.jsp-show")).booleanValue();

request.setAttribute("view.jsp-showIconLabel", true);

String title = (String) request.getAttribute("view.jsp-title");

if (Validator.isNull(title)) {
title = assetRenderer.getTitle(locale);
}

PortletURL viewFullContentURL = renderResponse.createRenderURL();

viewFullContentURL.setParameter("struts_action", "/asset_publisher/view_content");
viewFullContentURL.setParameter("assetEntryId", String.valueOf(assetEntry.getEntryId()));
viewFullContentURL.setParameter("type", assetRendererFactory.getType());

if (Validator.isNotNull(assetRenderer.getUrlTitle())) {
if (assetRenderer.getGroupId() != scopeGroupId) {
viewFullContentURL.setParameter("groupId", String.valueOf(assetRenderer.getGroupId()));
}

viewFullContentURL.setParameter("urlTitle", assetRenderer.getUrlTitle());
}

String summary = StringUtil.shorten(assetRenderer.getSummary(locale), abstractLength);

String viewURL = null;

if (viewInContext) {
String viewFullContentURLString = viewFullContentURL.toString();

viewFullContentURLString = HttpUtil.setParameter(viewFullContentURLString, "redirect", currentURL);

viewURL = assetRenderer.getURLViewInContext(liferayPortletRequest, liferayPortletResponse, viewFullContentURLString);

viewURL = HttpUtil.setParameter(viewURL, "redirect", currentURL);
} else {
viewURL = viewFullContentURL.toString();
}

if (Validator.isNull(viewURL)) {
viewURL = viewFullContentURL.toString();
}

String viewURLMessage = viewInContext ? assetRenderer.getViewInContextMessage() : "read-more-x-about-x";

viewURL = _checkViewURL(viewURL, currentURL, themeDisplay);
%>

<%if (assetEntryIndex == 0) {%>
<div class="noticias">
<ul id="aui_3_4_0_1_522">
<%}%>
<li>
<span><%= title%></span>
<div>
<p><%= summary%></p>
<a href='<%=viewURL%>'>Leer mas</a>
</div>
</li>
<%if (assetEntryIndex == results.size()-1) {%>
</ul>
</div>
<%}%>
</code>

Hooks en Liferay

2013-07-23T19:38:28Z

Emiliano.tebes: Página creada con '==Qué es un Hook? == Es una extensión de un componente de Liferay, es decir, tomar un componente que ya posee y sobreescribir ciertas cosas para adecuarlo a nuestras necesidad…'

==Qué es un Hook? ==
Es una extensión de un componente de Liferay, es decir, tomar un componente que ya posee y sobreescribir ciertas cosas para adecuarlo a nuestras necesidades.

== ¿Cómo creo un Hook? ==
Para crear un hook podemos utilizar el arquetipo de maven '''liferay-hook-archetype'''

==Hook de Asset Publisher==
Un asset publisher nos muestra publicaciones que va recolectando de distintas páginas del sitio. Tiene por default 4 formas de mostrarse:
* table
* title-list
* abstracts
* full-content

En este caso, supongamos que ninguna de estas formas nos resultan adecuadas, y que queremos mostrarlo de alguna otra manera. Para esto, debemos realizar lo siguiente:

* Crear el hook con el arquetipo de Maven.
* En la estructura del proyecto, crear un nuevo JSP en WEB-INF/jsp/html/portlet/asset_publisher/display/nuestraVista.jsp

* Una posible implementación de dicho jsp es esta:

<code>

<%@ include file="/html/portlet/asset_publisher/init.jsp" %>

<%
List results = (List) request.getAttribute("view.jsp-results");

int assetEntryIndex = ((Integer) request.getAttribute("view.jsp-assetEntryIndex")).intValue();

AssetEntry assetEntry = (AssetEntry) request.getAttribute("view.jsp-assetEntry");
AssetRendererFactory assetRendererFactory = (AssetRendererFactory) request.getAttribute("view.jsp-assetRendererFactory");
AssetRenderer assetRenderer = (AssetRenderer) request.getAttribute("view.jsp-assetRenderer");

boolean show = ((Boolean) request.getAttribute("view.jsp-show")).booleanValue();

request.setAttribute("view.jsp-showIconLabel", true);

String title = (String) request.getAttribute("view.jsp-title");

if (Validator.isNull(title)) {
title = assetRenderer.getTitle(locale);
}

PortletURL viewFullContentURL = renderResponse.createRenderURL();

viewFullContentURL.setParameter("struts_action", "/asset_publisher/view_content");
viewFullContentURL.setParameter("assetEntryId", String.valueOf(assetEntry.getEntryId()));
viewFullContentURL.setParameter("type", assetRendererFactory.getType());

if (Validator.isNotNull(assetRenderer.getUrlTitle())) {
if (assetRenderer.getGroupId() != scopeGroupId) {
viewFullContentURL.setParameter("groupId", String.valueOf(assetRenderer.getGroupId()));
}

viewFullContentURL.setParameter("urlTitle", assetRenderer.getUrlTitle());
}

String summary = StringUtil.shorten(assetRenderer.getSummary(locale), abstractLength);

String viewURL = null;

if (viewInContext) {
String viewFullContentURLString = viewFullContentURL.toString();

viewFullContentURLString = HttpUtil.setParameter(viewFullContentURLString, "redirect", currentURL);

viewURL = assetRenderer.getURLViewInContext(liferayPortletRequest, liferayPortletResponse, viewFullContentURLString);

viewURL = HttpUtil.setParameter(viewURL, "redirect", currentURL);
} else {
viewURL = viewFullContentURL.toString();
}

if (Validator.isNull(viewURL)) {
viewURL = viewFullContentURL.toString();
}

String viewURLMessage = viewInContext ? assetRenderer.getViewInContextMessage() : "read-more-x-about-x";

viewURL = _checkViewURL(viewURL, currentURL, themeDisplay);
%>

<%if (assetEntryIndex == 0) {%>

<div class="noticias">
<ul id="aui_3_4_0_1_522">

<%}%>

<li>
<span><%= title%></span>
<div>
<p><%= summary%></p>
<a href='<%=viewURL%>'>Leer mas</a>
</div>
</li>

<%if (assetEntryIndex == results.size()-1) {%>
</ul>
</div>

<%}%>
</code>

* Esta implementación utiliza clases de Liferay para obtener los valores a mostrar (en este caso título, descripción y un link)

Liferay Portal

2013-07-23T14:30:39Z

Emiliano.tebes: /* Ver también */

[[Category:Portlet]]
Liferay Portal es un [[Administrador De Contenidos]] de [[Software Libre]] basado en Java, que cumple con la [[Portlet Specification Api]].

Entre las características principales se destacan:
* Administrador de contenidos (CMS) y una Suite de colaboración
* Varios porlets integrados listos para usar
* Herramientas de desarrollo
* Traducción a 22 idiomas
* Funciona con los principales [[Servidor de Aplicaciones]], bases de datos y sistemas operativos.

== Conceptos de estilos y disposición ==
=== Tema (Theme) ===
Vamos a ver los conceptos de Tema (Theme), Disposición (Layout).

Un '''Tema (o Theme)''' es el encargado de renderizar la página en su totalidad, e incluye los aspectos visuales generales del sitio. Un Tema incluye los JavaScript generales, los CSS, y seguramente también el logo del sitio, el menú general, el pie de página, etc. El Tema define un área donde se ubicará el contenido.

Al crear un Tema en realidad se suele "heredar" de algún tema ya existente. Liferay trae 2 temas ya preparados para heredar: "_styled" (del que suele heredarse) y "_unstyled" (que es aún más básico). Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/html/themes

=== Disposición (layout) ===
Un Tema declara un área donde se ubicará el contenido. Este área de contenido puede tener distintas disposiciones (2 columnas, 3 columnas, etc.); esta disposición se conoce como Layout. Cada página en Liferay puede tener un Layout asociado.

Liferay ya trae varios Layouts comunes declarados, y pueden crearse nuevos. Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/layouttpl

== Conceptos de gestión de contenidos ==
Liferay permite manejar dos grandes conceptos para gestionar el contenido de una página:
* Estructuras
* Listas dinámicas

=== Estructuras ===
Se pueden crear estructuras de datos para que el usuario complete y pueda cambiar facilmente contenido de la página sin tocar HTML. Una estructura tiene asociado una Plantilla (Template) que indica cómo se renderiza el contenido de una Estructura.

Por ejemplo, puede crearse una estructura Promocion, que contenga un título y una imagen. Luego, se puede crear una Plantilla para la estructura Promoción que renderiza dicha estructura mostrando la imagen y el título debajo.

Al usuario final le quedan entonces 2 pasos para completar:
1. Instanciar la estructura para agregarle datos.
2. Ubicar la estructura instanciada en alguna posición de la página.

Las estructuras, plantillas y instancias de estructras se gestionan desde el Control Panel > Site > Web Content.

=== Listas dinámicas ===
Se pueden crear listas de contenido variable, para que el usuario agregue como si de una lista se tratara. Las listas son de un tipo de dato en particular (el cual se configura al igual que una estructura), y se les asocia una plantilla para renderizar la lista (y opcionalmente, una plantilla para renderizar el formulario de ingreso de un dato de la lista).

Las listas dinámicas se gestionan desde el Control Panel > Site > Dynamic Data Lists

Leer más sobre [http://www.liferay.com/es/documentation/liferay-portal/6.1/user-guide/-/ai/make-it-pretty-creating-custom-displays Crear y estilar listas dinámicas en Liferay].

== Ver también ==
* [http://www.liferay.com Web oficial de Liferay Portal]
* [http://wiki.liferay.com/index.php/Main_Page Wiki oficial de Liferay ]
* [[Dynamic Query en Liferay]]
* [[Ejecuciones automaticas en Liferay]]
* [[Maven en Liferay]]
* [[Hooks en Liferay]]

== Componentes ==
* [[Carrusel con limite en Liferay]]
* [[Encuesta con estilos propios en Liferay]]

Maven en Liferay

2013-07-23T13:34:15Z

Emiliano.tebes: Página creada con 'Para crear un nuevo proyecto para Liferay usando Maven podemos utilizar ciertos arquetipos predefinidos: -liferay-ext-archetype -liferay-hook-archetype -liferay-layouttpl-arc…'

Para crear un nuevo proyecto para Liferay usando Maven podemos utilizar ciertos arquetipos predefinidos:

-liferay-ext-archetype

-liferay-hook-archetype

-liferay-layouttpl-archetype

-liferay-portlet-archetype

-liferay-portlet-icefaces-archetype

-liferay-portlet-jsf-archetype

-liferay-portlet-liferay-faces-alloy-archetype

-liferay-portlet-primefaces-archetype

-liferay-portlet-richfaces-archetype

-liferay-servicebuilder-archetype

-liferay-theme-archetype

-liferay-web-archetype

Una vez que generamos el proyecto, debemos agregar al pom.xml la siguiente property:

<properties>
<liferay.version>$version</liferay.version>
</properties>

Donde $version es la version de liferay. Ej. 6.1.1

Liferay Portal

2013-07-23T13:28:45Z

Emiliano.tebes: /* Ver también */

[[Category:Portlet]]
Liferay Portal es un [[Administrador De Contenidos]] de [[Software Libre]] basado en Java, que cumple con la [[Portlet Specification Api]].

Entre las características principales se destacan:
* Administrador de contenidos (CMS) y una Suite de colaboración
* Varios porlets integrados listos para usar
* Herramientas de desarrollo
* Traducción a 22 idiomas
* Funciona con los principales [[Servidor de Aplicaciones]], bases de datos y sistemas operativos.

== Conceptos de estilos y disposición ==
=== Tema (Theme) ===
Vamos a ver los conceptos de Tema (Theme), Disposición (Layout).

Un '''Tema (o Theme)''' es el encargado de renderizar la página en su totalidad, e incluye los aspectos visuales generales del sitio. Un Tema incluye los JavaScript generales, los CSS, y seguramente también el logo del sitio, el menú general, el pie de página, etc. El Tema define un área donde se ubicará el contenido.

Al crear un Tema en realidad se suele "heredar" de algún tema ya existente. Liferay trae 2 temas ya preparados para heredar: "_styled" (del que suele heredarse) y "_unstyled" (que es aún más básico). Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/html/themes

=== Disposición (layout) ===
Un Tema declara un área donde se ubicará el contenido. Este área de contenido puede tener distintas disposiciones (2 columnas, 3 columnas, etc.); esta disposición se conoce como Layout. Cada página en Liferay puede tener un Layout asociado.

Liferay ya trae varios Layouts comunes declarados, y pueden crearse nuevos. Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/layouttpl

== Conceptos de gestión de contenidos ==
Liferay permite manejar dos grandes conceptos para gestionar el contenido de una página:
* Estructuras
* Listas dinámicas

=== Estructuras ===
Se pueden crear estructuras de datos para que el usuario complete y pueda cambiar facilmente contenido de la página sin tocar HTML. Una estructura tiene asociado una Plantilla (Template) que indica cómo se renderiza el contenido de una Estructura.

Por ejemplo, puede crearse una estructura Promocion, que contenga un título y una imagen. Luego, se puede crear una Plantilla para la estructura Promoción que renderiza dicha estructura mostrando la imagen y el título debajo.

Al usuario final le quedan entonces 2 pasos para completar:
1. Instanciar la estructura para agregarle datos.
2. Ubicar la estructura instanciada en alguna posición de la página.

Las estructuras, plantillas y instancias de estructras se gestionan desde el Control Panel > Site > Web Content.

=== Listas dinámicas ===
Se pueden crear listas de contenido variable, para que el usuario agregue como si de una lista se tratara. Las listas son de un tipo de dato en particular (el cual se configura al igual que una estructura), y se les asocia una plantilla para renderizar la lista (y opcionalmente, una plantilla para renderizar el formulario de ingreso de un dato de la lista).

Las listas dinámicas se gestionan desde el Control Panel > Site > Dynamic Data Lists

Leer más sobre [http://www.liferay.com/es/documentation/liferay-portal/6.1/user-guide/-/ai/make-it-pretty-creating-custom-displays Crear y estilar listas dinámicas en Liferay].

== Ver también ==
* [http://www.liferay.com Web oficial de Liferay Portal]
* [http://wiki.liferay.com/index.php/Main_Page Wiki oficial de Liferay ]
* [[Dynamic Query en Liferay]]
* [[Ejecuciones automaticas en Liferay]]
* [[Maven en Liferay]]

== Componentes ==
* [[Carrusel con limite en Liferay]]
* [[Encuesta con estilos propios en Liferay]]

Ejecuciones automaticas en Liferay

2013-07-23T13:06:00Z

Emiliano.tebes: /* Crear una tarea automática (CRON) */

=== Crear una tarea automática (CRON)===

Para crear una tarea que se ejecute automáticamente vamos a valernos de un portlet que vamos a desplegar en el portal.

*1- Configurar el CRON en el archivo liferay-portlet.xml que se encuentra en la carpeta WEB-INF de nuestro proyecto:

<portlet>
<portlet-name>NombreDelPortlet</portlet-name>
<icon>/icon.png</icon>
<scheduler-entry>
<scheduler-description>descripcion</scheduler-description>
<scheduler-event-listener-class>com.MiClaseCron</scheduler-event-listener-class> <!- Aca va la clase que contiene el CRON en el proyecto(con la lógica que ejecuta) ->
<trigger> <!- Configuración del tiempo para que corra el CRON ->
<simple-trigger-value>15</simple-trigger-value>
<time-unit>minute</time-unit>
</trigger>
</scheduler-entry>
</portlet>

*2- Creamos la clase CRON con la lógica que ejecutará (es necesario que implemente la interfaz [http://docs.liferay.com/portal/6.0/javadocs/com/liferay/portal/kernel/messaging/MessageListener.html MessageListener] de Liferay):

package com.MiClaseCron;
import com.liferay.portal.kernel.messaging.Message;
import com.liferay.portal.kernel.messaging.MessageListener;
import com.liferay.portal.kernel.messaging.MessageListenerException;
public class NotificacionCron implements MessageListener {
public void receive(Message arg0) throws MessageListenerException {
//Aca va la logica que se ejecutará.
}
}

''' En caso de usar Spring, tener en cuenta que el CRON al momento en que corre deberá levantar el contexto, lo cual podría traernos algún dolor de cabeza.'''.

Ejecuciones automaticas en Liferay

2013-07-23T13:00:08Z

Emiliano.tebes: Página creada con '=== Crear una tarea automática (CRON)=== *1- Configurar el CRON en el archivo liferay-portlet.xml que se encuentra en la carpeta WEB-INF de nuestro proyecto: <portlet> <p…'

=== Crear una tarea automática (CRON)===

*1- Configurar el CRON en el archivo liferay-portlet.xml que se encuentra en la carpeta WEB-INF de nuestro proyecto:

<portlet>
<portlet-name>NombreDelPortlet</portlet-name>
<icon>/icon.png</icon>
<scheduler-entry>
<scheduler-description>descripcion</scheduler-description>
<scheduler-event-listener-class>com.connectis.tucu.cron.NotificacionCron</scheduler-event-listener-class> <!- Aca va la clase que contiene el CRON en el proyecto(con la lógica que ejecuta) ->
<trigger> <!- Configuración del tiempo para que corra el CRON ->
<simple-trigger-value>15</simple-trigger-value>
<time-unit>minute</time-unit>
</trigger>
</scheduler-entry>
</portlet>

*2- Creamos la clase CRON con la lógica que ejecutará (es necesario que implemente la interfaz [http://docs.liferay.com/portal/6.0/javadocs/com/liferay/portal/kernel/messaging/MessageListener.html MessageListener] de Liferay):

package com.connectis.tucu.cron;
import com.liferay.portal.kernel.messaging.Message;
import com.liferay.portal.kernel.messaging.MessageListener;
import com.liferay.portal.kernel.messaging.MessageListenerException;
public class NotificacionCron implements MessageListener {
public void receive(Message arg0) throws MessageListenerException {
//Aca va la logica que se ejecutará.
}
}

''' Tener en cuenta que el CRON al momento en que corre deberá levantar el contexto, esto puede traer inconvenientes al igual que las conexiones a la base de datos (nosotros optamos por cerrar la conexión cada vez que finalizamos una transacción con el CRON)'''.

Liferay Portal

2013-07-23T12:46:59Z

Emiliano.tebes: /* Ver también */

[[Category:Portlet]]
Liferay Portal es un [[Administrador De Contenidos]] de [[Software Libre]] basado en Java, que cumple con la [[Portlet Specification Api]].

Entre las características principales se destacan:
* Administrador de contenidos (CMS) y una Suite de colaboración
* Varios porlets integrados listos para usar
* Herramientas de desarrollo
* Traducción a 22 idiomas
* Funciona con los principales [[Servidor de Aplicaciones]], bases de datos y sistemas operativos.

== Conceptos de estilos y disposición ==
=== Tema (Theme) ===
Vamos a ver los conceptos de Tema (Theme), Disposición (Layout).

Un '''Tema (o Theme)''' es el encargado de renderizar la página en su totalidad, e incluye los aspectos visuales generales del sitio. Un Tema incluye los JavaScript generales, los CSS, y seguramente también el logo del sitio, el menú general, el pie de página, etc. El Tema define un área donde se ubicará el contenido.

Al crear un Tema en realidad se suele "heredar" de algún tema ya existente. Liferay trae 2 temas ya preparados para heredar: "_styled" (del que suele heredarse) y "_unstyled" (que es aún más básico). Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/html/themes

=== Disposición (layout) ===
Un Tema declara un área donde se ubicará el contenido. Este área de contenido puede tener distintas disposiciones (2 columnas, 3 columnas, etc.); esta disposición se conoce como Layout. Cada página en Liferay puede tener un Layout asociado.

Liferay ya trae varios Layouts comunes declarados, y pueden crearse nuevos. Se puede consultar el código de estos temas en <LIFERAY_WEBAPP>/layouttpl

== Conceptos de gestión de contenidos ==
Liferay permite manejar dos grandes conceptos para gestionar el contenido de una página:
* Estructuras
* Listas dinámicas

=== Estructuras ===
Se pueden crear estructuras de datos para que el usuario complete y pueda cambiar facilmente contenido de la página sin tocar HTML. Una estructura tiene asociado una Plantilla (Template) que indica cómo se renderiza el contenido de una Estructura.

Por ejemplo, puede crearse una estructura Promocion, que contenga un título y una imagen. Luego, se puede crear una Plantilla para la estructura Promoción que renderiza dicha estructura mostrando la imagen y el título debajo.

Al usuario final le quedan entonces 2 pasos para completar:
1. Instanciar la estructura para agregarle datos.
2. Ubicar la estructura instanciada en alguna posición de la página.

Las estructuras, plantillas y instancias de estructras se gestionan desde el Control Panel > Site > Web Content.

=== Listas dinámicas ===
Se pueden crear listas de contenido variable, para que el usuario agregue como si de una lista se tratara. Las listas son de un tipo de dato en particular (el cual se configura al igual que una estructura), y se les asocia una plantilla para renderizar la lista (y opcionalmente, una plantilla para renderizar el formulario de ingreso de un dato de la lista).

Las listas dinámicas se gestionan desde el Control Panel > Site > Dynamic Data Lists

Leer más sobre [http://www.liferay.com/es/documentation/liferay-portal/6.1/user-guide/-/ai/make-it-pretty-creating-custom-displays Crear y estilar listas dinámicas en Liferay].

== Ver también ==
* [http://www.liferay.com Web oficial de Liferay Portal]
* [http://wiki.liferay.com/index.php/Main_Page Wiki oficial de Liferay ]
* [[Dynamic Query en Liferay]]
* [[Ejecuciones automaticas en Liferay]]

== Componentes ==
* [[Carrusel con limite en Liferay]]
* [[Encuesta con estilos propios en Liferay]]

JavaScript

2013-03-14T18:03:26Z

Emiliano.tebes: /* Ver también */

[[Category:JavaScript]]
[[JavaScript]] es un lenguaje de programación interpretado, es decir, que no requiere compilación, utilizado principalmente en páginas web, con una sintaxis semejante a la del lenguaje Java y el lenguaje C.

Al igual que [[Java]], [[JavaScript]] es un lenguaje orientado a objetos propiamente dicho, ya que dispone de Herencia, si bien esta se realiza siguiendo el paradigma de programación basada en prototipos, ya que las nuevas clases se generan clonando las clases base (prototipos) y extendiendo su funcionalidad.

Todos los navegadores modernos interpretan el código [[JavaScript]] integrado dentro de las páginas web. Para interactuar con una página web se provee al lenguaje [[JavaScript]] de una implementación del DOM.

==Frameworks==
[[JavaScript]] cuenta con infinidad de frameworks y librerias que otorgan diversa funcionalidad. Entre los más conocidos:
* [[JQuery]], un framework de aplicación base, sumamente extensible.
* [[Prototype]], un framework de aplicación base que permite definir clases, muy usado.
* [[Rico]], un framework de componentes de presentación [AJAX].
* [[Concurrent Thread Javascript]], librería para manejo de hilos.

==Compatibilidad entre navegadores==
===Problemas con IE===
====Json is undefined====
La version de IE7 e IE8 no tiene importado de forma nativa las librerias de Json, por lo tanto hay que importarlas.

< !--[if lt IE 8]>
<script type="text/javascript" src="/js/json2.js"></script>
<![endif]-->

Bajar la libreria de json desde [[https://github.com/douglascrockford/JSON-js aca]].

====Change event listener====
El comportamiento del listener del evento "change" cuando se lo bindeamos a un radio button es el siguiente:

* en IE 7 el evento se dispara cuando el focus abandona el radio button.

* en Firefox (3.x), Safari (3.x) y opera (96) el evento se dispara al momento de que el radio button es seleccionado, sin esperar a que el focus abandone el radio.

Un workaround para que IE se comporte igual que el resto de los navegadores es el siguiente:

if ($.browser.msie) {
$('input[name=radioXXX]').bind('click', function(){
this.blur();
this.focus();
});
}

$('input[name=radioXXX]').bind('change', function(){
........;
});

==Ver también==
* [http://es.wikipedia.org/wiki/JavaScript JavaScript en la Wikipedia]
* [http://www.theserverside.com/tt/articles/article.tss?l=OOJavaScriptDemonstrated Conceptos y operaciones básicas]
* [[Test de javascript con QUnit]]
* [[Node.js]]
* [[JasmineJs]]
* [[Integrando JasmineJS con Ant]]

JasmineJs

2013-03-14T18:00:18Z

Emiliano.tebes: /* Jasmine */

== Introducción ==

=== Objetivo: ===

* Testear el código Javascript de nuestra aplicación web.

=== Herramientas a usar ===

* jasmine
* jasmine-fakeAjax
* jasmine-jQuery

== Jasmine ==
Es un framework de desarrollo para testear código Javascript. La configuración mínima necesaria es:

* Dependencias de Jasmine
* Un archivo html donde correrán los test
* Archivos JS productivos
* Archivos JS con nuestros tests

Dentro de las dependencias de jasmine, encontramos los archivos:
* jasmine.css
* jasmine.js
* jasmine-html.js

En el html se visualizarán los resultados de los test desarrollados. A continuación, la estructura de dicho html:
<code lang="html4strict">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>

<link rel="stylesheet" type="text/css" href="lib/jasmine/jasmine.css"/>
<script type="text/javascript" src="lib/jasmine/jasmine.js"></script>
<script type="text/javascript" src="lib/jasmine/jasmine-html.js"></script>


<script type="text/javascript" src="lib/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="lib/underscore-1.1.7-min.js"></script>
<script type="text/javascript" src="lib/jasmine-jquery.js"></script>
<script type="text/javascript" src="view/preLoadFixtures.js"></script>

<script type="text/javascript" src="lib/jasmine-fake-ajax.js"></script>


<script type="text/javascript" src="bienvenido.js"></script>


<script type="text/javascript" src="bienvenidoTest.js"></script>

</head>
<body>
<script type="text/javascript">
// agregamos el reporte de tests y lo ejecutamos
jasmine.getEnv().addReporter( new jasmine.TrivialReporter());
jasmine.getEnv().execute();
</script>
</body>
</html>

</code>

Podemos visualizar que el html además de contener las configuración básica para correr test con jasmine, contiene librerias que nos ayudan a desarrollar test de mayor calidad. Estas las podemos visualizar dentro del bloque "dependencias de nuestros tests" y se explicarán luego.

En Jasmine los tests tienen la siguiente estructura:

* '''Describe''': es una función que recibe como parámetros un string con un nombre que identifica a un conjunto de casos de test, y una función, que contiene 1 o más sentencias “it”
** '''it''': es cada caso posible para nuestro test. También conserva la misma forma de un describe: una función que recibe dos parámetros: un string con su descripción, y una función con nuestro caso de test, que contiene 1 o más “expect”
*** '''expect''': es una función que recibe como parámetro un valor “real”; y se encadena a una función “matcher”, la cual lleva como parámetro el valor esperado. Para ser más concretos, quedaría: expect(valorReal).toBe(valorEsperado); donde “toBe” es una de las posibles funciones matcher.
**** '''matcher''': es una comparación entre un valor real y uno esperado. Se los puede negar encadenando la función “not” delante de ellos. Tenemos matchers incluidos por Jasmine, y también podemos definir más nosotros.

Vamos a ejemplificar con un test dummy:
<code lang="javascript">
describe("este es un test dummy", function() {
it("y este es un caso de test", function() {
expect(true).toBe(true);
expect(false).not.toBe(true);
});
});
</code>

Observen que en el caso anterior la función '''expect''' nos retorna un objeto, del cual utilizamos el atributo '''not''' y de él, su matcher '''toBe''', para negar el resultado de este último.

Vamos con un ejemplo en el cual yo quiero tener un objeto "persona", que tenga un atributo "saludar", el cual al invocarlo me retorne "hola". El test nos quedaría así:

<code lang="javascript">
describe("persona.saludar",function(){

it("deberia retornar hola", function(){
var saludo = persona.saludar();
expect(saludo).toEqual("hola");
});
});
</code>

Les propongo que antes de leer las líneas siguientes, ejecuten los tests e intenten interpretar los errores que nos lanza Jasmine. Pueden descargar este [https://frameworks-test-javascript.googlecode.com/svn/trunk/jasmine-minConfig proyecto de prueba] donde encontrarán un holaMundo.

¿Qué pasa si quiero hacer algo antes de cada Test?
Bueno, para eso usamos ''beforeEach'' y ''afterEach''. El código que pongamos dentro de estas funciones, serán llamados antes y después de cada ''it'', respectivamente.

<code lang="javascript">
describe('beforeEach', function(){
beforeEach(function(){
// Antes de cada caso de prueba se carga un archivo html.
jasmine.getFixtures().load("persona/prueba.html");
});
it('Caso prueba', function(){
// Test
});
});
</code>

----

== Fake Ajax ==
Jasmine-fakeAjax nos permite crear interceptores de urls, y enviar datos dummy en las mismas cuando son ejecutadas desde JQuery.ajax();

Ejemplo:

<code lang="javascript">
describe('Test FakeAjax', function() {
it('La data que devolvio la llamada ajax es igual al del fake', function() {
var mensaje;
// Registramos el fake ajax.
registerFakeAjax({url: '/prueba', successData: 'Prueba exitosa'});
// Hacemos la llamada ajax.
$.get('/prueba', function(data) {
mensaje= data
});
// Comprobamos que nos hay llegado lo que definimos en el fake
expect(mensaje).toEqual('Prueba exitosa')
})
});
</code>

----

== Fixtures ==
Usamos la libreria Jasmine-jQuery para testear los JS que interactúan con nuestro html, la misma nos provee matchers de jquery, y nos permite manejar: CSS, HTML y JSON en nuestros specs. También nos permite armar un "esqueleto" de la página en la que va a ejecutar nuestro código JS. Esto lo logra mediante un elemento que buscaremos mediante el id "sandbox", y al cual le agregaremos nuestro código html, estilos, etc.
Ahora bien, cuando hay varios casos de test en los que debemos utilizar el mismo html, se vuelve tedioso tener que copiar este código a lo largo de todos los archivos. Para solucionar este problema, el módulo fixture de esta librería nos permite cargar archivos HTML en nuestros test.

'''Ejemplo''':
Tenemos un archivo llamado pruebaFixture.html que contiene:
<code lang="html4strict">
<div id="prueba" style="display:none;"/>
</code>

Se setea el path en donde estaran los fixtures, por defecto es “spec/javascripts/fixtures”
<code lang="javascript">
jasmine.getFixtures().fixturesPath = './fixtures';
</code>

Se levanta el HTML con la función load.
<code lang="javascript">
jasmine.getFixtures().load("pruebaFixture.html");
</code>

El test que comprueba que el div este oculto.
<code lang="javascript">
it("El input id debe estar oculto",function(){
var div = $("#prueba");
expect(div).toBeHidden();
});
</code>

Este test comprueba que el elemento #prueba sea un div.
<code lang="javascript">
it("El elemento es un div",function(){
var div = $("#prueba");
expect(div).toBe('div');
});
</code>

Algo para tener en cuenta es que debemos cargar los fixtures en memoria antes de cargar la librería fake ajax por un conflicto entre las librerías. Es decir, deberá existir un archivo que precargue los fixtures antes de cargar la librería fake ajax, como se muestra en el archivo preLoadFixtures.js
<code lang="javascript">
jasmine.getFixtures().fixturesPath = './fixtures';
jasmine.getFixtures().preload("fixture1.html","fixture2.html");
</code>

Y luego, al cargar el archivo html, se deberá cargar el archivo preLoadFixtures.js antes del archivo de la librería de fake ajax.
Una vez cargados los fixtures en memoria, los mismos se cargarán de la misma manera mencionada al comienzo de la sección mediante:

<code lang="javascript">
jasmine.getFixtures().load("fixture1.html");
</code>

Fuentes / Más info en

[http://pivotal.github.com/jasmine/ Jasmine]

[https://github.com/velesin/jasmine-jquery Repositorio de jasmine-jquery]

[https://github.com/mileskin/jasmine-fake-ajax Repositorio de jasmine-fake-ajax]

JasmineJs

2013-03-14T17:59:16Z

Emiliano.tebes:

== Introducción ==

=== Objetivo: ===

* Testear el código Javascript de nuestra aplicación web.

=== Herramientas a usar ===

* jasmine
* jasmine-fakeAjax
* jasmine-jQuery

== Jasmine ==
Es un framework de desarrollo para testear código Javascript. La configuración mínima necesaria es:

* Dependencias de Jasmine
* Un archivo html donde correrán los test
* Archivos JS productivos
* Archivos JS con nuestros tests

Dentro de las dependencias de jasmine, encontramos los archivos:
* jasmine.css
* jasmine.js
* jasmine-html.js

Descargar las [http://pivotal.github.com/jasmine/ dependencias de jasmine]

En el html se visualizarán los resultados de los test desarrollados. A continuación, la estructura de dicho html:
<code lang="html4strict">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>

<link rel="stylesheet" type="text/css" href="lib/jasmine/jasmine.css"/>
<script type="text/javascript" src="lib/jasmine/jasmine.js"></script>
<script type="text/javascript" src="lib/jasmine/jasmine-html.js"></script>


<script type="text/javascript" src="lib/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="lib/underscore-1.1.7-min.js"></script>
<script type="text/javascript" src="lib/jasmine-jquery.js"></script>
<script type="text/javascript" src="view/preLoadFixtures.js"></script>

<script type="text/javascript" src="lib/jasmine-fake-ajax.js"></script>


<script type="text/javascript" src="bienvenido.js"></script>


<script type="text/javascript" src="bienvenidoTest.js"></script>

</head>
<body>
<script type="text/javascript">
// agregamos el reporte de tests y lo ejecutamos
jasmine.getEnv().addReporter( new jasmine.TrivialReporter());
jasmine.getEnv().execute();
</script>
</body>
</html>

</code>

Podemos visualizar que el html además de contener las configuración básica para correr test con jasmine, contiene librerias que nos ayudan a desarrollar test de mayor calidad. Estas las podemos visualizar dentro del bloque "dependencias de nuestros tests" y se explicarán luego.

En Jasmine los tests tienen la siguiente estructura:

* '''Describe''': es una función que recibe como parámetros un string con un nombre que identifica a un conjunto de casos de test, y una función, que contiene 1 o más sentencias “it”
** '''it''': es cada caso posible para nuestro test. También conserva la misma forma de un describe: una función que recibe dos parámetros: un string con su descripción, y una función con nuestro caso de test, que contiene 1 o más “expect”
*** '''expect''': es una función que recibe como parámetro un valor “real”; y se encadena a una función “matcher”, la cual lleva como parámetro el valor esperado. Para ser más concretos, quedaría: expect(valorReal).toBe(valorEsperado); donde “toBe” es una de las posibles funciones matcher.
**** '''matcher''': es una comparación entre un valor real y uno esperado. Se los puede negar encadenando la función “not” delante de ellos. Tenemos matchers incluidos por Jasmine, y también podemos definir más nosotros.

Vamos a ejemplificar con un test dummy:
<code lang="javascript">
describe("este es un test dummy", function() {
it("y este es un caso de test", function() {
expect(true).toBe(true);
expect(false).not.toBe(true);
});
});
</code>

Observen que en el caso anterior la función '''expect''' nos retorna un objeto, del cual utilizamos el atributo '''not''' y de él, su matcher '''toBe''', para negar el resultado de este último.

Vamos con un ejemplo en el cual yo quiero tener un objeto "persona", que tenga un atributo "saludar", el cual al invocarlo me retorne "hola". El test nos quedaría así:

<code lang="javascript">
describe("persona.saludar",function(){

it("deberia retornar hola", function(){
var saludo = persona.saludar();
expect(saludo).toEqual("hola");
});
});
</code>

Les propongo que antes de leer las líneas siguientes, ejecuten los tests e intenten interpretar los errores que nos lanza Jasmine. Pueden descargar este [https://frameworks-test-javascript.googlecode.com/svn/trunk/jasmine-minConfig proyecto de prueba] donde encontrarán un holaMundo.

¿Qué pasa si quiero hacer algo antes de cada Test?
Bueno, para eso usamos ''beforeEach'' y ''afterEach''. El código que pongamos dentro de estas funciones, serán llamados antes y después de cada ''it'', respectivamente.

<code lang="javascript">
describe('beforeEach', function(){
beforeEach(function(){
// Antes de cada caso de prueba se carga un archivo html.
jasmine.getFixtures().load("persona/prueba.html");
});
it('Caso prueba', function(){
// Test
});
});
</code>

----

== Fake Ajax ==
Jasmine-fakeAjax nos permite crear interceptores de urls, y enviar datos dummy en las mismas cuando son ejecutadas desde JQuery.ajax();

Ejemplo:

<code lang="javascript">
describe('Test FakeAjax', function() {
it('La data que devolvio la llamada ajax es igual al del fake', function() {
var mensaje;
// Registramos el fake ajax.
registerFakeAjax({url: '/prueba', successData: 'Prueba exitosa'});
// Hacemos la llamada ajax.
$.get('/prueba', function(data) {
mensaje= data
});
// Comprobamos que nos hay llegado lo que definimos en el fake
expect(mensaje).toEqual('Prueba exitosa')
})
});
</code>

----

== Fixtures ==
Usamos la libreria Jasmine-jQuery para testear los JS que interactúan con nuestro html, la misma nos provee matchers de jquery, y nos permite manejar: CSS, HTML y JSON en nuestros specs. También nos permite armar un "esqueleto" de la página en la que va a ejecutar nuestro código JS. Esto lo logra mediante un elemento que buscaremos mediante el id "sandbox", y al cual le agregaremos nuestro código html, estilos, etc.
Ahora bien, cuando hay varios casos de test en los que debemos utilizar el mismo html, se vuelve tedioso tener que copiar este código a lo largo de todos los archivos. Para solucionar este problema, el módulo fixture de esta librería nos permite cargar archivos HTML en nuestros test.

'''Ejemplo''':
Tenemos un archivo llamado pruebaFixture.html que contiene:
<code lang="html4strict">
<div id="prueba" style="display:none;"/>
</code>

Se setea el path en donde estaran los fixtures, por defecto es “spec/javascripts/fixtures”
<code lang="javascript">
jasmine.getFixtures().fixturesPath = './fixtures';
</code>

Se levanta el HTML con la función load.
<code lang="javascript">
jasmine.getFixtures().load("pruebaFixture.html");
</code>

El test que comprueba que el div este oculto.
<code lang="javascript">
it("El input id debe estar oculto",function(){
var div = $("#prueba");
expect(div).toBeHidden();
});
</code>

Este test comprueba que el elemento #prueba sea un div.
<code lang="javascript">
it("El elemento es un div",function(){
var div = $("#prueba");
expect(div).toBe('div');
});
</code>

Algo para tener en cuenta es que debemos cargar los fixtures en memoria antes de cargar la librería fake ajax por un conflicto entre las librerías. Es decir, deberá existir un archivo que precargue los fixtures antes de cargar la librería fake ajax, como se muestra en el archivo preLoadFixtures.js
<code lang="javascript">
jasmine.getFixtures().fixturesPath = './fixtures';
jasmine.getFixtures().preload("fixture1.html","fixture2.html");
</code>

Y luego, al cargar el archivo html, se deberá cargar el archivo preLoadFixtures.js antes del archivo de la librería de fake ajax.
Una vez cargados los fixtures en memoria, los mismos se cargarán de la misma manera mencionada al comienzo de la sección mediante:

<code lang="javascript">
jasmine.getFixtures().load("fixture1.html");
</code>

Fuentes / Más info en

[http://pivotal.github.com/jasmine/ Jasmine]

[https://github.com/velesin/jasmine-jquery Repositorio de jasmine-jquery]

[https://github.com/mileskin/jasmine-fake-ajax Repositorio de jasmine-fake-ajax]

JasmineJs

2013-03-14T17:58:34Z

Emiliano.tebes: /* Fixtures */

== Introducción ==

=== Objetivo: ===

* Testear el código Javascript de nuestra aplicación web.

=== Herramientas a usar ===

* jasmine
* jasmine-fakeAjax
* jasmine-jQuery

== Jasmine ==
Es un framework de desarrollo para testear código Javascript. La configuración mínima necesaria es:

* Dependencias de Jasmine
* Un archivo html donde correrán los test
* Archivos JS productivos
* Archivos JS con nuestros tests

Dentro de las dependencias de jasmine, encontramos los archivos:
* jasmine.css
* jasmine.js
* jasmine-html.js

Descargar las [http://pivotal.github.com/jasmine/ dependencias de jasmine]

En el html se visualizarán los resultados de los test desarrollados. A continuación, la estructura de dicho html:
<code lang="html4strict">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>

<link rel="stylesheet" type="text/css" href="lib/jasmine/jasmine.css"/>
<script type="text/javascript" src="lib/jasmine/jasmine.js"></script>
<script type="text/javascript" src="lib/jasmine/jasmine-html.js"></script>


<script type="text/javascript" src="lib/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="lib/underscore-1.1.7-min.js"></script>
<script type="text/javascript" src="lib/jasmine-jquery.js"></script>
<script type="text/javascript" src="view/preLoadFixtures.js"></script>

<script type="text/javascript" src="lib/jasmine-fake-ajax.js"></script>


<script type="text/javascript" src="bienvenido.js"></script>


<script type="text/javascript" src="bienvenidoTest.js"></script>

</head>
<body>
<script type="text/javascript">
// agregamos el reporte de tests y lo ejecutamos
jasmine.getEnv().addReporter( new jasmine.TrivialReporter());
jasmine.getEnv().execute();
</script>
</body>
</html>

</code>

Podemos visualizar que el html además de contener las configuración básica para correr test con jasmine, contiene librerias que nos ayudan a desarrollar test de mayor calidad. Estas las podemos visualizar dentro del bloque "dependencias de nuestros tests" y se explicarán luego.

En Jasmine los tests tienen la siguiente estructura:

* '''Describe''': es una función que recibe como parámetros un string con un nombre que identifica a un conjunto de casos de test, y una función, que contiene 1 o más sentencias “it”
** '''it''': es cada caso posible para nuestro test. También conserva la misma forma de un describe: una función que recibe dos parámetros: un string con su descripción, y una función con nuestro caso de test, que contiene 1 o más “expect”
*** '''expect''': es una función que recibe como parámetro un valor “real”; y se encadena a una función “matcher”, la cual lleva como parámetro el valor esperado. Para ser más concretos, quedaría: expect(valorReal).toBe(valorEsperado); donde “toBe” es una de las posibles funciones matcher.
**** '''matcher''': es una comparación entre un valor real y uno esperado. Se los puede negar encadenando la función “not” delante de ellos. Tenemos matchers incluidos por Jasmine, y también podemos definir más nosotros.

Vamos a ejemplificar con un test dummy:
<code lang="javascript">
describe("este es un test dummy", function() {
it("y este es un caso de test", function() {
expect(true).toBe(true);
expect(false).not.toBe(true);
});
});
</code>

Observen que en el caso anterior la función '''expect''' nos retorna un objeto, del cual utilizamos el atributo '''not''' y de él, su matcher '''toBe''', para negar el resultado de este último.

Vamos con un ejemplo en el cual yo quiero tener un objeto "persona", que tenga un atributo "saludar", el cual al invocarlo me retorne "hola". El test nos quedaría así:

<code lang="javascript">
describe("persona.saludar",function(){

it("deberia retornar hola", function(){
var saludo = persona.saludar();
expect(saludo).toEqual("hola");
});
});
</code>

Les propongo que antes de leer las líneas siguientes, ejecuten los tests e intenten interpretar los errores que nos lanza Jasmine. Pueden descargar este [https://frameworks-test-javascript.googlecode.com/svn/trunk/jasmine-minConfig proyecto de prueba] donde encontrarán un holaMundo.

¿Qué pasa si quiero hacer algo antes de cada Test?
Bueno, para eso usamos ''beforeEach'' y ''afterEach''. El código que pongamos dentro de estas funciones, serán llamados antes y después de cada ''it'', respectivamente.

<code lang="javascript">
describe('beforeEach', function(){
beforeEach(function(){
// Antes de cada caso de prueba se carga un archivo html.
jasmine.getFixtures().load("persona/prueba.html");
});
it('Caso prueba', function(){
// Test
});
});
</code>

----

== Fake Ajax ==
Jasmine-fakeAjax nos permite crear interceptores de urls, y enviar datos dummy en las mismas cuando son ejecutadas desde JQuery.ajax();

Ejemplo:

<code lang="javascript">
describe('Test FakeAjax', function() {
it('La data que devolvio la llamada ajax es igual al del fake', function() {
var mensaje;
// Registramos el fake ajax.
registerFakeAjax({url: '/prueba', successData: 'Prueba exitosa'});
// Hacemos la llamada ajax.
$.get('/prueba', function(data) {
mensaje= data
});
// Comprobamos que nos hay llegado lo que definimos en el fake
expect(mensaje).toEqual('Prueba exitosa')
})
});
</code>

Más info en el [https://github.com/mileskin/jasmine-fake-ajax repositorio de jasmine-fake-ajax]

----

== Fixtures ==
Usamos la libreria Jasmine-jQuery para testear los JS que interactúan con nuestro html, la misma nos provee matchers de jquery, y nos permite manejar: CSS, HTML y JSON en nuestros specs. También nos permite armar un "esqueleto" de la página en la que va a ejecutar nuestro código JS. Esto lo logra mediante un elemento que buscaremos mediante el id "sandbox", y al cual le agregaremos nuestro código html, estilos, etc.
Ahora bien, cuando hay varios casos de test en los que debemos utilizar el mismo html, se vuelve tedioso tener que copiar este código a lo largo de todos los archivos. Para solucionar este problema, el módulo fixture de esta librería nos permite cargar archivos HTML en nuestros test.

'''Ejemplo''':
Tenemos un archivo llamado pruebaFixture.html que contiene:
<code lang="html4strict">
<div id="prueba" style="display:none;"/>
</code>

Se setea el path en donde estaran los fixtures, por defecto es “spec/javascripts/fixtures”
<code lang="javascript">
jasmine.getFixtures().fixturesPath = './fixtures';
</code>

Se levanta el HTML con la función load.
<code lang="javascript">
jasmine.getFixtures().load("pruebaFixture.html");
</code>

El test que comprueba que el div este oculto.
<code lang="javascript">
it("El input id debe estar oculto",function(){
var div = $("#prueba");
expect(div).toBeHidden();
});
</code>

Este test comprueba que el elemento #prueba sea un div.
<code lang="javascript">
it("El elemento es un div",function(){
var div = $("#prueba");
expect(div).toBe('div');
});
</code>

Algo para tener en cuenta es que debemos cargar los fixtures en memoria antes de cargar la librería fake ajax por un conflicto entre las librerías. Es decir, deberá existir un archivo que precargue los fixtures antes de cargar la librería fake ajax, como se muestra en el archivo preLoadFixtures.js
<code lang="javascript">
jasmine.getFixtures().fixturesPath = './fixtures';
jasmine.getFixtures().preload("fixture1.html","fixture2.html");
</code>

Y luego, al cargar el archivo html, se deberá cargar el archivo preLoadFixtures.js antes del archivo de la librería de fake ajax.
Una vez cargados los fixtures en memoria, los mismos se cargarán de la misma manera mencionada al comienzo de la sección mediante:

<code lang="javascript">
jasmine.getFixtures().load("fixture1.html");
</code>

Fuentes / Más info en

[http://pivotal.github.com/jasmine/ Jasmine]

[https://github.com/velesin/jasmine-jquery repositorio de jasmine-jquery]

Integrando JasmineJS con Ant

2013-03-14T17:56:49Z

Emiliano.tebes: /* Integración de Jasmine con Ant */

Vamos a suponer que tenemos un proyecto web que usa [http://ant.apache.org/ ant], y queremos agregar tests para nuestro código escrito en Javascript. Para lograr esto, vamos a valernos de [http://phantomjs.org/ PhantomJs]. Esto es un ejecutable que simula ser un navegador web sin la parte visual, que nos brindará un entorno en el cual correremos nuestras pruebas.

Lo que haremos en primera instancia es agregar los ejecutables y dependencias de Phantom a nuestro proyecto. Luego tenemos que agregar una tarea ant a nuestro archivo xml, invocando a dicho ejecutable:

'''''Build.xml'''''
<code lang="xml">
<target name="testJavascript">
<echo>Ejecutando tests de javascript...</echo>
<exec executable="Path del archivo ejecutable de phantom" failonerror="true" >
<arg value="Path del runner para jasmine” />
<arg value="Path del html que contiene los archivos js, y sus respectivos tests" />
<arg value="500" />
</exec>
<echo>La ejecución de los test ha finalizado.</echo>
</target>
</code>

Al invocar al ejecutable de Phantom, notemos que debemos agregar 3 parámetros:
* la ruta de un runner para Jasmine.
* la ruta del archivo html que contiene las inclusiones de los Js productivos y de tests
* Un timeout.

'''Fuentes''':

[http://phantomjs.org/ PhantomJs]

[http://creynders.wordpress.com/2012/03/14/automating-javascript-builds/ Jasmine + Ant]

Integrando JasmineJS con Ant

2013-03-14T17:56:36Z

Emiliano.tebes: Página creada con '== Integración de Jasmine con Ant == Vamos a suponer que tenemos un proyecto web que usa [http://ant.apache.org/ ant], y queremos agregar tests para nuestro código escrito en…'

== Integración de Jasmine con Ant ==

Vamos a suponer que tenemos un proyecto web que usa [http://ant.apache.org/ ant], y queremos agregar tests para nuestro código escrito en Javascript. Para lograr esto, vamos a valernos de [http://phantomjs.org/ PhantomJs]. Esto es un ejecutable que simula ser un navegador web sin la parte visual, que nos brindará un entorno en el cual correremos nuestras pruebas.

Lo que haremos en primera instancia es agregar los ejecutables y dependencias de Phantom a nuestro proyecto. Luego tenemos que agregar una tarea ant a nuestro archivo xml, invocando a dicho ejecutable:

'''''Build.xml'''''
<code lang="xml">
<target name="testJavascript">
<echo>Ejecutando tests de javascript...</echo>
<exec executable="Path del archivo ejecutable de phantom" failonerror="true" >
<arg value="Path del runner para jasmine” />
<arg value="Path del html que contiene los archivos js, y sus respectivos tests" />
<arg value="500" />
</exec>
<echo>La ejecución de los test ha finalizado.</echo>
</target>
</code>

Al invocar al ejecutable de Phantom, notemos que debemos agregar 3 parámetros:
* la ruta de un runner para Jasmine.
* la ruta del archivo html que contiene las inclusiones de los Js productivos y de tests
* Un timeout.

'''Fuentes''':

[http://phantomjs.org/ PhantomJs]

[http://creynders.wordpress.com/2012/03/14/automating-javascript-builds/ Jasmine + Ant]

JavaScript

2013-03-14T17:52:56Z

Emiliano.tebes: /* Ver también */

JasmineJs

2013-03-14T17:46:38Z

Emiliano.tebes: Página creada con '== Introducción == === Objetivo: === * Testear el código Javascript de nuestra aplicación web. === Herramientas a usar === * jasmine * jasmine-fakeAjax * jasmine-jQuery …'

== Introducción ==

=== Objetivo: ===

* Testear el código Javascript de nuestra aplicación web.

=== Herramientas a usar ===

* jasmine
* jasmine-fakeAjax
* jasmine-jQuery

== Jasmine ==
Es un framework de desarrollo para testear código Javascript. La configuración mínima necesaria es:

* Dependencias de Jasmine
* Un archivo html donde correrán los test
* Archivos JS productivos
* Archivos JS con nuestros tests

Dentro de las dependencias de jasmine, encontramos los archivos:
* jasmine.css
* jasmine.js
* jasmine-html.js

Descargar las [http://pivotal.github.com/jasmine/ dependencias de jasmine]

En el html se visualizarán los resultados de los test desarrollados. A continuación, la estructura de dicho html:
<code lang="html4strict">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>

<link rel="stylesheet" type="text/css" href="lib/jasmine/jasmine.css"/>
<script type="text/javascript" src="lib/jasmine/jasmine.js"></script>
<script type="text/javascript" src="lib/jasmine/jasmine-html.js"></script>


<script type="text/javascript" src="lib/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="lib/underscore-1.1.7-min.js"></script>
<script type="text/javascript" src="lib/jasmine-jquery.js"></script>
<script type="text/javascript" src="view/preLoadFixtures.js"></script>

<script type="text/javascript" src="lib/jasmine-fake-ajax.js"></script>


<script type="text/javascript" src="bienvenido.js"></script>


<script type="text/javascript" src="bienvenidoTest.js"></script>

</head>
<body>
<script type="text/javascript">
// agregamos el reporte de tests y lo ejecutamos
jasmine.getEnv().addReporter( new jasmine.TrivialReporter());
jasmine.getEnv().execute();
</script>
</body>
</html>

</code>

Podemos visualizar que el html además de contener las configuración básica para correr test con jasmine, contiene librerias que nos ayudan a desarrollar test de mayor calidad. Estas las podemos visualizar dentro del bloque "dependencias de nuestros tests" y se explicarán luego.

En Jasmine los tests tienen la siguiente estructura:

* '''Describe''': es una función que recibe como parámetros un string con un nombre que identifica a un conjunto de casos de test, y una función, que contiene 1 o más sentencias “it”
** '''it''': es cada caso posible para nuestro test. También conserva la misma forma de un describe: una función que recibe dos parámetros: un string con su descripción, y una función con nuestro caso de test, que contiene 1 o más “expect”
*** '''expect''': es una función que recibe como parámetro un valor “real”; y se encadena a una función “matcher”, la cual lleva como parámetro el valor esperado. Para ser más concretos, quedaría: expect(valorReal).toBe(valorEsperado); donde “toBe” es una de las posibles funciones matcher.
**** '''matcher''': es una comparación entre un valor real y uno esperado. Se los puede negar encadenando la función “not” delante de ellos. Tenemos matchers incluidos por Jasmine, y también podemos definir más nosotros.

Vamos a ejemplificar con un test dummy:
<code lang="javascript">
describe("este es un test dummy", function() {
it("y este es un caso de test", function() {
expect(true).toBe(true);
expect(false).not.toBe(true);
});
});
</code>

Observen que en el caso anterior la función '''expect''' nos retorna un objeto, del cual utilizamos el atributo '''not''' y de él, su matcher '''toBe''', para negar el resultado de este último.

Vamos con un ejemplo en el cual yo quiero tener un objeto "persona", que tenga un atributo "saludar", el cual al invocarlo me retorne "hola". El test nos quedaría así:

<code lang="javascript">
describe("persona.saludar",function(){

it("deberia retornar hola", function(){
var saludo = persona.saludar();
expect(saludo).toEqual("hola");
});
});
</code>

Les propongo que antes de leer las líneas siguientes, ejecuten los tests e intenten interpretar los errores que nos lanza Jasmine. Pueden descargar este [https://frameworks-test-javascript.googlecode.com/svn/trunk/jasmine-minConfig proyecto de prueba] donde encontrarán un holaMundo.

¿Qué pasa si quiero hacer algo antes de cada Test?
Bueno, para eso usamos ''beforeEach'' y ''afterEach''. El código que pongamos dentro de estas funciones, serán llamados antes y después de cada ''it'', respectivamente.

<code lang="javascript">
describe('beforeEach', function(){
beforeEach(function(){
// Antes de cada caso de prueba se carga un archivo html.
jasmine.getFixtures().load("persona/prueba.html");
});
it('Caso prueba', function(){
// Test
});
});
</code>

----

== Fake Ajax ==
Jasmine-fakeAjax nos permite crear interceptores de urls, y enviar datos dummy en las mismas cuando son ejecutadas desde JQuery.ajax();

Ejemplo:

<code lang="javascript">
describe('Test FakeAjax', function() {
it('La data que devolvio la llamada ajax es igual al del fake', function() {
var mensaje;
// Registramos el fake ajax.
registerFakeAjax({url: '/prueba', successData: 'Prueba exitosa'});
// Hacemos la llamada ajax.
$.get('/prueba', function(data) {
mensaje= data
});
// Comprobamos que nos hay llegado lo que definimos en el fake
expect(mensaje).toEqual('Prueba exitosa')
})
});
</code>

Más info en el [https://github.com/mileskin/jasmine-fake-ajax repositorio de jasmine-fake-ajax]

----

== Fixtures ==
Usamos la libreria Jasmine-jQuery para testear los JS que interactúan con nuestro html, la misma nos provee matchers de jquery, y nos permite manejar: CSS, HTML y JSON en nuestros specs. También nos permite armar un "esqueleto" de la página en la que va a ejecutar nuestro código JS. Esto lo logra mediante un elemento que buscaremos mediante el id "sandbox", y al cual le agregaremos nuestro código html, estilos, etc.
Ahora bien, cuando hay varios casos de test en los que debemos utilizar el mismo html, se vuelve tedioso tener que copiar este código a lo largo de todos los archivos. Para solucionar este problema, el módulo fixture de esta librería nos permite cargar archivos HTML en nuestros test.

'''Ejemplo''':
Tenemos un archivo llamado pruebaFixture.html que contiene:
<code lang="html4strict">
<div id="prueba" style="display:none;"/>
</code>

Se setea el path en donde estaran los fixtures, por defecto es “spec/javascripts/fixtures”
<code lang="javascript">
jasmine.getFixtures().fixturesPath = './fixtures';
</code>

Se levanta el HTML con la función load.
<code lang="javascript">
jasmine.getFixtures().load("pruebaFixture.html");
</code>

El test que comprueba que el div este oculto.
<code lang="javascript">
it("El input id debe estar oculto",function(){
var div = $("#prueba");
expect(div).toBeHidden();
});
</code>

Este test comprueba que el elemento #prueba sea un div.
<code lang="javascript">
it("El elemento es un div",function(){
var div = $("#prueba");
expect(div).toBe('div');
});
</code>

Algo para tener en cuenta es que debemos cargar los fixtures en memoria antes de cargar la librería fake ajax por un conflicto entre las librerías. Es decir, deberá existir un archivo que precargue los fixtures antes de cargar la librería fake ajax, como se muestra en el archivo preLoadFixtures.js
<code lang="javascript">
jasmine.getFixtures().fixturesPath = './fixtures';
jasmine.getFixtures().preload("fixture1.html","fixture2.html");
</code>

Y luego, al cargar el archivo html, se deberá cargar el archivo preLoadFixtures.js antes del archivo de la librería de fake ajax.
Una vez cargados los fixtures en memoria, los mismos se cargarán de la misma manera mencionada al comienzo de la sección mediante:

<code lang="javascript">
jasmine.getFixtures().load("fixture1.html");
</code>

Más info en el [https://github.com/velesin/jasmine-jquery repositorio de jasmine-jquery]

JavaScript

2013-03-14T17:41:49Z

Emiliano.tebes: /* Ver también */

JavaScript

2013-03-14T17:40:49Z

Emiliano.tebes: /* Ver también */

Validaciones de XML contra XSD En Java

2012-12-05T12:24:24Z

Emiliano.tebes:

[[Category:Java]]
'''Necesidad'''
validar que un XML está formado de acuerdo a las reglas de un XSD.

'''Solución'''
Para validar un xml, podemos aplicar lo siguiente:

<code java>
import javax.xml.XMLConstants;
import javax.xml.transform.Source;
import javax.xml.transform.stream.StreamSource;
import javax.xml.validation.Schema;
import javax.xml.validation.SchemaFactory;
import javax.xml.validation.Validator;
import java.io.IOException;
import java.net.URL;

import org.apache.xmlbeans.XmlObject;
import org.xml.sax.SAXException;

public class ValidadorXml {
/**
* Para crear un Schema a partir de un XSD.
*/
private static SchemaFactory schemaFactory;
static {
schemaFactory = SchemaFactory.newInstance(XMLConstants.W3C_XML_SCHEMA_NS_URI);
}
public static void validarXml(String pathXsd, XmlObject xml) throws IOException, SAXException {
Schema schema = schemaFactory.newSchema(new URL(pathXsd));
Validator validator = schema.newValidator();
Source source = new StreamSource(xml.newInputStream());
validator.validate(source);
}
}
</code>

En el código anterior utilizamos la clase '''XmlObject'''. Podemos obtener una instancia de dicho elemento utilizando:
<code java>
String mensaje = "<hola></hola>"; //cadena que representa el contenido xml.
XmlObject.Factory.parse(mensaje);
</code>

Este método constructor de XmlObject acepta varias formas de pasarle el xml a parsear. Es cuestión de buscar la manera que más se adapte a como nosotros recibimos el xml (por un String, archivo, url, etc).

Finalmente, al invocar '''validator.validate(source);''' obtendremos la validación del documento. Si no conformara alguna de las condiciones del XSD, arrojará la excepción '''SAXException''', y si no se logra encontrar el xsd, arroja '''IOException'''.

Validaciones de XML contra XSD En Java

2012-12-05T12:20:05Z

Emiliano.tebes:

[[Category:Java]]
Necesidad:
validar que un XML está formado de acuerdo a las reglas de un XSD.

Solución:
Para validar un xml, podemos aplicar lo siguiente:

<code java>
import javax.xml.XMLConstants;
import javax.xml.transform.Source;
import javax.xml.transform.stream.StreamSource;
import javax.xml.validation.Schema;
import javax.xml.validation.SchemaFactory;
import javax.xml.validation.Validator;
import java.io.IOException;
import java.net.URL;

import org.apache.xmlbeans.XmlObject;
import org.xml.sax.SAXException;

public class ValidadorXml {
/**
* Para crear un Schema a partir de un XSD.
*/
private static SchemaFactory schemaFactory;
static {
schemaFactory = SchemaFactory.newInstance(XMLConstants.W3C_XML_SCHEMA_NS_URI);
}
public static void validarXml(String pathXsd, XmlObject xml) throws IOException, SAXException {
Schema schema = schemaFactory.newSchema(new URL(pathXsd));
Validator validator = schema.newValidator();
Source source = new StreamSource(xml.newInputStream());
validator.validate(source);
}
}
</code>

En el código anterior utilizamos la clase '''XmlObject'''. Podemos obtener una instancia de dicho elemento utilizando:
<code java>
String mensaje = "<hola></hola>"; //cadena que representa el contenido xml.
XmlObject.Factory.parse(mensaje);
</code>

Este método constructor de XmlObject acepta varias formas de pasarle el xml a parsear. Es cuestión de buscar la manera que más se adapte a como nosotros recibimos el xml (por un String, archivo, url, etc).

Finalmente, al invocar '''validator.validate(source);''' obtendremos la validación del documento. Si no conformara alguna de las condiciones del XSD, arrojará la excepción '''SAXException''', y si no se logra encontrar el xsd, arroja '''IOException'''.

Validaciones de XML contra XSD En Java

2012-12-05T12:19:36Z

Emiliano.tebes:

[[Category:Java]]
Necesidad:
validar que un XML está formado de acuerdo a las reglas de un XSD.

Solución:
Para validar un xml, podemos aplicar lo siguiente:

<code java>
import javax.xml.XMLConstants;
import javax.xml.transform.Source;
import javax.xml.transform.stream.StreamSource;
import javax.xml.validation.Schema;
import javax.xml.validation.SchemaFactory;
import javax.xml.validation.Validator;
import java.io.IOException;
import java.net.URL;

import org.apache.xmlbeans.XmlObject;
import org.xml.sax.SAXException;

public class ValidadorXml {
/**
* Para crear un Schema a partir de un XSD.
*/
private static SchemaFactory schemaFactory;
static {
schemaFactory = SchemaFactory.newInstance(XMLConstants.W3C_XML_SCHEMA_NS_URI);
}
public static void validarXml(String pathXsd, XmlObject xml) throws IOException, SAXException {
Schema schema = schemaFactory.newSchema(new URL(pathXsd));
Validator validator = schema.newValidator();
Source source = new StreamSource(xml.newInputStream());
validator.validate(source);
}
}
</code>

En el código anterior utilizamos la clase '''XmlObject'''. Podemos obtener una instancia de dicho elemento utilizando:
<code java>
String mensaje = "<hola></hola>" //cadena que representa el contenido xml.
XmlObject.Factory.parse(mensaje);
</code>

Este método constructor de XmlObject acepta varias formas de pasarle el xml a parsear. Es cuestión de buscar la manera que más se adapte a como nosotros recibimos el xml (por un String, archivo, url, etc).

Finalmente, al invocar '''validator.validate(source);''' obtendremos la validación del documento. Si no conformara alguna de las condiciones del XSD, arrojará la excepción '''SAXException''', y si no se logra encontrar el xsd, arroja '''IOException'''.

Validaciones de XML contra XSD En Java

2012-12-05T12:18:26Z

Emiliano.tebes:

[[Category:Java]]
Necesidad:
validar que un XML está formado de acuerdo a las reglas de un XSD.

Solución:
Para validar un xml, podemos aplicar lo siguiente:

import javax.xml.XMLConstants;
import javax.xml.transform.Source;
import javax.xml.transform.stream.StreamSource;
import javax.xml.validation.Schema;
import javax.xml.validation.SchemaFactory;
import javax.xml.validation.Validator;
import java.io.IOException;
import java.net.URL;

import org.apache.xmlbeans.XmlObject;
import org.xml.sax.SAXException;

public class ValidadorXml {
/**
* Para crear un Schema a partir de un XSD.
*/
private static SchemaFactory schemaFactory;
static {
schemaFactory = SchemaFactory.newInstance(XMLConstants.W3C_XML_SCHEMA_NS_URI);
}
public static void validarXml(String pathXsd, XmlObject xml) throws IOException, SAXException {
Schema schema = schemaFactory.newSchema(new URL(pathXsd));
Validator validator = schema.newValidator();
Source source = new StreamSource(xml.newInputStream());
validator.validate(source);
}
}

En el código anterior utilizamos la clase '''XmlObject'''. Podemos obtener una instancia de dicho elemento utilizando:
String mensaje = "<hola></hola>" //cadena que representa el contenido xml.
XmlObject.Factory.parse(mensaje);

Este método constructor de XmlObject acepta varias formas de pasarle el xml a parsear. Es cuestión de buscar la manera que más se adapte a como nosotros recibimos el xml (por un String, archivo, url, etc).

Finalmente, al invocar '''validator.validate(source);''' obtendremos la validación del documento. Si no conformara alguna de las condiciones del XSD, arrojará la excepción '''SAXException''', y si no se logra encontrar el xsd, arroja '''IOException'''.

Validaciones de XML contra XSD En Java

2012-12-05T12:17:11Z

Emiliano.tebes:

Necesidad:
validar que un XML está formado de acuerdo a las reglas de un XSD.

Solución:
Para validar un xml, podemos aplicar lo siguiente:

import javax.xml.XMLConstants;
import javax.xml.transform.Source;
import javax.xml.transform.stream.StreamSource;
import javax.xml.validation.Schema;
import javax.xml.validation.SchemaFactory;
import javax.xml.validation.Validator;
import java.io.IOException;
import java.net.URL;

import org.apache.xmlbeans.XmlObject;
import org.xml.sax.SAXException;

public class ValidadorXml {
/**
* Para crear un Schema a partir de un XSD.
*/
private static SchemaFactory schemaFactory;
static {
schemaFactory = SchemaFactory.newInstance(XMLConstants.W3C_XML_SCHEMA_NS_URI);
}
public static void validarXml(String pathXsd, XmlObject xml) throws IOException, SAXException {
Schema schema = schemaFactory.newSchema(new URL(pathXsd));
Validator validator = schema.newValidator();
Source source = new StreamSource(xml.newInputStream());
validator.validate(source);
}
}

En el código anterior utilizamos la clase '''XmlObject'''. Podemos obtener una instancia de dicho elemento utilizando:
String mensaje = "<hola></hola>" //cadena que representa el contenido xml.
XmlObject.Factory.parse(mensaje);

Este método constructor de XmlObject acepta varias formas de pasarle el xml a parsear. Es cuestión de buscar la manera que más se adapte a como nosotros recibimos el xml (por un String, archivo, url, etc).

Finalmente, al invocar '''validator.validate(source);''' obtendremos la validación del documento. Si no conformara alguna de las condiciones del XSD, arrojará la excepción '''SAXException''', y si no se logra encontrar el xsd, arroja '''IOException'''.

Validaciones de XML contra XSD En Java

2012-12-04T20:47:24Z

Emiliano.tebes: Página creada con 'Necesidad: validar que un XML está formado de acuerdo a las reglas de un XSD. Solución: Para validar un xml, podemos aplicar lo siguiente: import javax.xml.XMLConstants; …'

Java

2012-12-04T20:26:30Z

Emiliano.tebes: /* Cuestiones generales de Java */

[[Category:Java]]
Java es un lenguaje de programación, aunque también se suele hacer referencia con este nombre a toda una plataforma para el desarrollo de aplicaciones. Hay un buen [http://es.wikipedia.org/wiki/Java_%28Sun%29 resumen de Java en la wikipedia].

Al desarrollar un sistema se suele basar en una [[Arquitectura De Software]] para crear los componentes.

Java se caracteriza por una enorme cantidad de proyectos libres.

== Algunas tecnologías Java ==
=== Frameworks de base===
* [[Spring Framework]]
* [[Terracotta]]
* [[EJB]]
* [[Restlet]]

===Acceso a datos===
* [[Hibernate]]
* [[Apache Lucene]]

===Frameworks de presentación===
* [[Apache Tiles]]
* [[Struts]]
* [[JSF]]
* [[JSTL]]
* [[GWT]]
* [[SiteMesh 2]]

===Librerías===
* [[Google Guava]]
* [[Jawr]]

===Mensajeria===
* [[JMS]]

===Web Services===
* [[Web Service]]
* [[Web Service Con Spring]]

===Ejecuciones batch y programadas===
* [[Quartz]]
* [[Spring Batch]]

===Seguridad===
* [[Spring Security]]

===Cuestiones generales de Java===
* [[Validaciones de XML contra XSD En Java]]
* [[Fechas En Java]]
* [[Numeros En Java]]
* [[Encoding En Java]]
* [[Serializacion De Objetos En Java]]
* [[Log4J]]
* [[SLF4J]]
* [[Cache De Objetos Java]]
* [[Exportacion Hacia Archivos]]

Mock REST con Spring

2012-10-23T15:55:51Z

Emiliano.tebes: /* Ver también */

=== Usando MockRestServiceServer para testear un cliente Rest en componente===

====Situación====
Capa de acceso a datos que interactúa como cliente de un servicio REST.
====Necesidad====
Construir tests de componente del DAO, que queden auto-contenidos.

Para resolver este problema, recurrimos a la clase MockRestServiceServer, incluida en los jars de spring social (y también en el core de Spring a partir de las últimas versiones).
Para poder utilizar una instancia de esta clase, se debe crear a partir de una instancia de la clase RestTemplate.
Dicho elemento debe ser declarado en el archivo xml de configuración de contexto de nuestros tests.

=====Archivo de contexto=====
<bean id="restTemplate" class="org.springframework.web.client.RestTemplate">
<constructor-arg ref="httpClientFactory"/>
<property name="messageConverters">
<list>
<bean class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter"/>
</list>
</property>
</bean>

=====En la clase de Test=====

======Imports======
import org.springframework.test.web.client.MockRestServiceServer;
import org.springframework.test.web.client.RequestMatchers;
import org.springframework.test.web.client.ResponseActions;
import org.springframework.test.web.client.ResponseCreators;
import org.springframework.test.web.server.MockMvc;
import static org.springframework.test.web.server.request.MockMvcRequestBuilders.post;
import static org.springframework.test.web.server.result.MockMvcResultMatchers.status;
import org.springframework.test.web.server.setup.MockMvcBuilders;
import org.springframework.web.client.RestTemplate;

======Declaración de las variables======
@Autowired
private RestTemplate restTemplate;
private MockRestServiceServer mockServer;

======Preparación de cada uno de los test======
@Before
public void setUp() {
mockMvc = MockMvcBuilders.standaloneSetup(instanciaDeClaseATestear).build();
mockServer = MockRestServiceServer.createServer(restTemplate);
}

En los tests propiamente dichos, preparar las peticiones esperadas y sus respectivas respuestas:

ResponseActions responseAction = mockServer
.expect(RequestMatchers.requestTo("http://miURL:puerto/recurso"));
responseAction
.andExpect(RequestMatchers.header("Accept", "application/json"))
.andRespond(ResponseCreators.withStatus(HttpStatus.BAD_REQUEST));

Por ejemplo, en el caso anterior, se espera que cuando sea llamada la URL "http://miURL:puerto/recurso" se responda con un 404.
A partir de este punto, ya se pueden ejercitar los métodos de nuestras clases que invoquen a los servicios REST con las URL configuradas.
Aclaración: en el caso que querramos esperar varias peticiones, las mismas tienen que ser declaradas en el orden en el que serán invocadas.

== Ver también ==
* [http://static.springsource.org/spring-social/docs/1.0.x/api/org/springframework/social/test/client/MockRestServiceServer.html API Oficial]

* [http://static.springsource.org/spring/docs/3.2.0.BUILD-SNAPSHOT/api/org/springframework/test/web/mock/client/MockRestServiceServer.html API de la versión incluida en el core de Spring como Snapshot, con algunos ejemplos]

Mock REST con Spring

2012-10-23T15:52:16Z

Emiliano.tebes: /* imports */

Mock REST con Spring

2012-10-23T15:51:34Z

Emiliano.tebes:

=== Usando MockRestServiceServer para testear un cliente Rest en componente===

====Situación====
Capa de acceso a datos que interactúa como cliente de un servicio REST.
====Necesidad====
Construir tests de componente del DAO, que queden auto-contenidos.

Para resolver este problema, recurrimos a la clase MockRestServiceServer, incluida en los jars de spring social (y también en el core de Spring a partir de las últimas versiones).
Para poder utilizar una instancia de esta clase, se debe crear a partir de una instancia de la clase RestTemplate.
Dicho elemento debe ser declarado en el archivo xml de configuración de contexto de nuestros tests.

=====Archivo de contexto=====
<bean id="restTemplate" class="org.springframework.web.client.RestTemplate">
<constructor-arg ref="httpClientFactory"/>
<property name="messageConverters">
<list>
<bean class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter"/>
</list>
</property>
</bean>

=====En la clase de Test=====

======imports======
import org.springframework.test.web.client.MockRestServiceServer;
import org.springframework.test.web.client.RequestMatchers;
import org.springframework.test.web.client.ResponseActions;
import org.springframework.test.web.client.ResponseCreators;
import org.springframework.test.web.server.MockMvc;
import static org.springframework.test.web.server.request.MockMvcRequestBuilders.post;
import static org.springframework.test.web.server.result.MockMvcResultMatchers.status;
import org.springframework.test.web.server.setup.MockMvcBuilders;
import org.springframework.web.client.RestTemplate;

======Declaración de las variables======
@Autowired
private RestTemplate restTemplate;
private MockRestServiceServer mockServer;

======Preparación de cada uno de los test======
@Before
public void setUp() {
mockMvc = MockMvcBuilders.standaloneSetup(instanciaDeClaseATestear).build();
mockServer = MockRestServiceServer.createServer(restTemplate);
}

En los tests propiamente dichos, preparar las peticiones esperadas y sus respectivas respuestas:

ResponseActions responseAction = mockServer
.expect(RequestMatchers.requestTo("http://miURL:puerto/recurso"));
responseAction
.andExpect(RequestMatchers.header("Accept", "application/json"))
.andRespond(ResponseCreators.withStatus(HttpStatus.BAD_REQUEST));

Por ejemplo, en el caso anterior, se espera que cuando sea llamada la URL "http://miURL:puerto/recurso" se responda con un 404.
A partir de este punto, ya se pueden ejercitar los métodos de nuestras clases que invoquen a los servicios REST con las URL configuradas.
Aclaración: en el caso que querramos esperar varias peticiones, las mismas tienen que ser declaradas en el orden en el que serán invocadas.

== Ver también ==
* [http://static.springsource.org/spring-social/docs/1.0.x/api/org/springframework/social/test/client/MockRestServiceServer.html API Oficial]

Mock REST con Spring

2012-10-23T15:32:22Z

Emiliano.tebes: /* Archivo de contexto */

=== Usando MockRestServiceServer para testear un cliente Rest en componente===

====Situación====
Capa de acceso a datos que interactúa como cliente de un servicio REST.
====Necesidad====
Construir tests de componente del DAO, que queden auto-contenidos.

Para resolver este problema, recurrimos a la clase MockRestServiceServer, incluida en los jars de spring social (y también en el core de Spring a partir de las últimas versiones).
Para poder utilizar una instancia de esta clase, se debe crear a partir de una instancia de la clase RestTemplate.
Dicho elemento debe ser declarado en el archivo xml de configuración de contexto de nuestros tests.

=====Archivo de contexto=====
<bean id="restTemplate" class="org.springframework.web.client.RestTemplate">
<constructor-arg ref="httpClientFactory"/>
<property name="messageConverters">
<list>
<bean class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter"/>
</list>
</property>
</bean>

=====En la clase de Test=====

======imports======
import org.springframework.test.web.client.MockRestServiceServer;
import org.springframework.test.web.client.RequestMatchers;
import org.springframework.test.web.client.ResponseActions;
import org.springframework.test.web.client.ResponseCreators;
import org.springframework.test.web.server.MockMvc;
import static org.springframework.test.web.server.request.MockMvcRequestBuilders.post;
import static org.springframework.test.web.server.result.MockMvcResultMatchers.status;
import org.springframework.test.web.server.setup.MockMvcBuilders;
import org.springframework.web.client.RestTemplate;

======Declaración de las variables======
@Autowired
private RestTemplate restTemplate;
private MockRestServiceServer mockServer;

======Preparación de cada uno de los test======
@Before
public void setUp() {
mockMvc = MockMvcBuilders.standaloneSetup(instanciaDeClaseATestear).build();
mockServer = MockRestServiceServer.createServer(restTemplate);
}

En los tests propiamente dichos, preparar las peticiones esperadas y sus respectivas respuestas:

ResponseActions responseAction = mockServer
.expect(RequestMatchers.requestTo("http://miURL:puerto/recurso"));
responseAction
.andExpect(RequestMatchers.header("Accept", "application/json"))
.andRespond(ResponseCreators.withStatus(HttpStatus.BAD_REQUEST));

Por ejemplo, en el caso anterior, se espera que cuando sea llamada la URL "http://miURL:puerto/recurso" se responda con un 404.
A partir de este punto, ya se pueden ejercitar los métodos de nuestras clases que invoquen a los servicios REST con las URL configuradas.
Aclaración: en el caso que querramos esperar varias peticiones, las mismas tienen que ser declaradas en el orden en el que serán invocadas.

Mock REST con Spring

2012-10-23T15:31:48Z

Emiliano.tebes: Página creada con '=== Usando MockRestServiceServer para testear un cliente Rest en componente=== ====Situación==== Capa de acceso a datos que interactúa como cliente de un servicio REST. ====…'

=== Usando MockRestServiceServer para testear un cliente Rest en componente===

====Situación====
Capa de acceso a datos que interactúa como cliente de un servicio REST.
====Necesidad====
Construir tests de componente del DAO, que queden auto-contenidos.

Para resolver este problema, recurrimos a la clase MockRestServiceServer, incluida en los jars de spring social (y también en el core de Spring a partir de las últimas versiones).
Para poder utilizar una instancia de esta clase, se debe crear a partir de una instancia de la clase RestTemplate.
Dicho elemento debe ser declarado en el archivo xml de configuración de contexto de nuestros tests.

=====Archivo de contexto=====
<bean id="restTemplate" class="org.springframework.web.client.RestTemplate">
<constructor-arg ref="httpClientFactory"/>
<property name="messageConverters">
<list>
<bean class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter"/>
</list>
</property>
</bean>

=====En la clase de Test=====

======imports======
import org.springframework.test.web.client.MockRestServiceServer;
import org.springframework.test.web.client.RequestMatchers;
import org.springframework.test.web.client.ResponseActions;
import org.springframework.test.web.client.ResponseCreators;
import org.springframework.test.web.server.MockMvc;
import static org.springframework.test.web.server.request.MockMvcRequestBuilders.post;
import static org.springframework.test.web.server.result.MockMvcResultMatchers.status;
import org.springframework.test.web.server.setup.MockMvcBuilders;
import org.springframework.web.client.RestTemplate;

======Declaración de las variables======
@Autowired
private RestTemplate restTemplate;
private MockRestServiceServer mockServer;

======Preparación de cada uno de los test======
@Before
public void setUp() {
mockMvc = MockMvcBuilders.standaloneSetup(instanciaDeClaseATestear).build();
mockServer = MockRestServiceServer.createServer(restTemplate);
}

En los tests propiamente dichos, preparar las peticiones esperadas y sus respectivas respuestas:

ResponseActions responseAction = mockServer
.expect(RequestMatchers.requestTo("http://miURL:puerto/recurso"));
responseAction
.andExpect(RequestMatchers.header("Accept", "application/json"))
.andRespond(ResponseCreators.withStatus(HttpStatus.BAD_REQUEST));

Por ejemplo, en el caso anterior, se espera que cuando sea llamada la URL "http://miURL:puerto/recurso" se responda con un 404.
A partir de este punto, ya se pueden ejercitar los métodos de nuestras clases que invoquen a los servicios REST con las URL configuradas.
Aclaración: en el caso que querramos esperar varias peticiones, las mismas tienen que ser declaradas en el orden en el que serán invocadas.

REST con Spring

2012-10-23T15:27:05Z

Emiliano.tebes: /* Descargar un proyecto de ejemplo */

[[Spring Framework]] 3.x trae la posibilidad de crear servicios web REST de manera muy simple.

== Un ejemplo ==
Vamos a realizar una aplicación que responda a las siguientes URL:

/persona/todos : devuelve todas las personas
/persona/123 : devuelve la persona cuyo id es 123

Tendremos que seguir 3 pasos:
# Configurar el servlet de Spring
# Crear la clase que atenderá y resolverá estas peticiones
# Configurar Spring

=== El servlet de Spring ===
Lo primero es configurar el servlet de Spring que se encargará de tomas las peticiones y redireccionarla a las clases correspondientes. La clase que se encarga de esto es ''org.springframework.web.servlet.DispatcherServlet''. Un archivo web.xml de ejemplo sería:

<code xml>
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<display-name>json-con-spring-mvc</display-name>

<filter>
<filter-name>characterEncodingFilter</filter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
<init-param>
<param-name>encoding</param-name>
<param-value>UTF-8</param-value>
</init-param>
<init-param>
<param-name>forceEncoding</param-name>
<param-value>true</param-value>
</init-param>
</filter>

<filter-mapping>
<filter-name>characterEncodingFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>

<servlet>
<servlet-name>Spring MVC Dispatcher Servlet</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<init-param>
<param-name>contextConfigLocation</param-name>
<param-value>
WEB-INF/applicationContext-clasico.xml
</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>

<servlet-mapping>
<servlet-name>Spring MVC Dispatcher Servlet</servlet-name>
<url-pattern>/app/*</url-pattern>
</servlet-mapping>

<session-config>
<session-timeout>
30
</session-timeout>
</session-config>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
</code>

En este ejemplo, el servlet de Spring queda atendiendo todas las URL que empiecen con "/app".

=== El controller ===
La clase que toma las peticiones HTTP es una clase Java anotada con @Controller. Esta clase asocia las URL con métodos. Los objetos que devuelven los métodos son luego procesador por conversores, que representan la respuesta de distinta manera (XML, JSON, etc.)

Para esto, creamos una clase de la siguiente forma:

<code java5>
package com.dosideas.jsonconspringmvc;

import java.util.ArrayList;
import java.util.Collection;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

@Controller
@RequestMapping(value="/persona")
public class PersonaController {

@RequestMapping(value="/{id}")
public @ResponseBody Persona get(@PathVariable Long id) {
Persona p = new Persona("Invasor " + id, "Zim " + id);
return p;
}

@RequestMapping(value="/todos")
public @ResponseBody Collection<Persona> getTodos() {
Collection<Persona> personas = new ArrayList<Persona>();
for (int i = 0; i < 10; i++) {
Persona p = new Persona("Invasor " + i, "Zim" + i);
personas.add(p);
}

return personas;
}
}
</code>

El objeto Persona es un POJO que tiene dos atributos: nombre y apellido. Los tags @RequestMapping se encargan de asociar la clase y cada uno de sus métodos con una URL en particular.

=== La configuración ===
Lo último que nos queda configurar es Spring con un archivo clásico (el cual es referenciado por el servlet):

<code xml>
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:p="http://www.springframework.org/schema/p"
xmlns:aop="http://www.springframework.org/schema/aop"
xmlns:tx="http://www.springframework.org/schema/tx"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-3.0.xsd
http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-3.0.xsd
http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.0.xsd
http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd">

<context:component-scan base-package="com.dosideas.jsonconspringmvc"/>

<mvc:annotation-driven />

</beans>
</code>

El tag ''mvc:annotation-driven'' se encarga de configurar automáticamente para emepezar a recibir y responder peticiones usando los controladores encontrados.

Más aún, la configuración predeterminada se encarga de realizar [http://en.wikipedia.org/wiki/Content_negotiation negociación de contenido]: la respuesta se formatea de acuerdo a las capacidades del cliente. Por ejemplo, si en el classpath tenemos agregado las librerías de Jackson (un parser JSON), se habilitará el soporte JSON correspondiente. Si están agregadas las librerías de JAXB2, se habilitará el soporte XML.

=== Probando ===
Podemos crear una prueba [[JUnit]] para acceder a nuestro servicio:

<code java5>
package com.dosideas.jsonconspringmvc;

import java.io.IOException;
import org.apache.commons.httpclient.methods.GetMethod;
import org.apache.commons.httpclient.HttpMethod;
import org.apache.commons.httpclient.HttpClient;
import org.junit.Test;
import static org.junit.Assert.*;

public class HttpTest {

@Test
public void personaTodosJSON() throws IOException {
HttpClient httpclient = new HttpClient();
HttpMethod method = new GetMethod("http://localhost:8084/json-con-spring-mvc/app/persona/todos");
method.addRequestHeader("accept", "application/json");

httpclient.executeMethod(method);
String resultado = method.getResponseBodyAsString();
System.out.println(resultado);

assertNotNull(resultado);
assertTrue(resultado.startsWith("[{\""));
}

@Test
public void personaPorIdJSON() throws IOException {
HttpClient httpclient = new HttpClient();
HttpMethod method = new GetMethod("http://localhost:8084/json-con-spring-mvc/app/persona/34421");
method.addRequestHeader("accept", "application/json");

httpclient.executeMethod(method);
String resultado = method.getResponseBodyAsString();
System.out.println(resultado);

assertNotNull(resultado);
assertTrue(resultado.startsWith("{\""));
assertTrue(resultado.contains("34421"));
}

@Test
public void personaPorIdXML() throws IOException {
HttpClient httpclient = new HttpClient();
HttpMethod method = new GetMethod("http://localhost:8084/json-con-spring-mvc/app/persona/34421");
method.addRequestHeader("accept", "application/xml");

httpclient.executeMethod(method);
String resultado = method.getResponseBodyAsString();
System.out.println(resultado);

assertNotNull(resultado);
assertTrue(resultado.startsWith("<?xml version=\"1.0\""));
assertTrue(resultado.contains("34421"));
}

}
</code>

== Manejo de errores ==
Es posible personalizar las excepciones para que devuelvan códigos de estado HTTP personalizados, usando la anotación @ResponseStatus en la excepción lanzada.

<code java5>
@ResponseStatus(value=HttpStatus.NOT_FOUND, reason="No se encontró el recurso pedido")
public class NotFoundException extends RuntimeException { ... }

.....
@Controller
@RequestMapping(value="/persona")
public class PersonaController {
@RequestMapping(value="/id/{id}")
public @ResponseBody Persona findById(@PathVariable long id) {
Contact contact = personaService.findById(id);
if (contact == null) {
throw new NotFoundException();
} else {
return contact;
}
}
}

</code>
Otra forma de personalizar las excepciones, es interceptar las excepciones del controller(@Controller) y personalizarla en el mismo controller.
Para esto debemos crear un método handleException por cada excepción que deseemos personalizar.

<code java5>
@Controller
@RequestMapping(value="/persona")
public class PersonaController {
@RequestMapping(value="/id/{id}")
public @ResponseBody Persona findById(@PathVariable long id) {
Contact contact = personaService.findById(id);
if (contact == null) {
throw new NotFoundException();
} else {
return contact;
}
}

@ResponseStatus(HttpStatus.NOT_FOUND)
@ExceptionHandler(NotFoundException.class)
@ResponseBody
public Map<String, String> handleException(NotFoundException exception) {
return Collections.singletonMap("message", "No se encontró el recurso pedido");
}
}
</code>

Y agregar lo siguiente en el applicationContext.xml
<code xml>
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:p="http://www.springframework.org/schema/p"
xmlns:aop="http://www.springframework.org/schema/aop"
xmlns:tx="http://www.springframework.org/schema/tx"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-3.0.xsd
http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-3.0.xsd
http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.0.xsd
http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd">

<context:component-scan base-package="com.dosideas.jsonconspringmvc"/>

<mvc:annotation-driven />
<bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerExceptionResolver">
<property name="messageConverters">
<list>
<bean class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter" />
</list>
</property>
</bean>
</beans>
</code>
Al utilizar este interceptor se debe personalizar las excepciones en todos los controladores, caso contrario la excepción no es customizada y retorna un status code 500.
La propiedad "messageConverters", define que conversor utilizar en el ResponseBody, en nuestro caso lo estamos pasando a Json.

En caso de que se quiera utilizar los 2 métodos, el de @ResponseStatus y el de @ExceptionHandler, se deben registrar los 2 Handler en el applicationContext.xml con el orden de ejecución.
<code xml>
...
<bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerExceptionResolver">
<property name="order" value="1"/>
<property name="messageConverters">
<list>
<bean class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter" />
</list>
</property>
</bean>

<bean class="org.springframework.web.servlet.mvc.annotation.ResponseStatusExceptionResolver" >
<property name="order" value="2"/>
</bean>
...
</code>

== Manejo de la respuesta ==
La anotación @ResponseStatus puede usarse para personalizar el código HTTP de cualquier respuesta, al ubicarla en el método.
Por ejemplo, los métodos que devuelven void pueden usar esta anotación para indicar que no hay contenido (es útil si, por ejemplo, se parsea el contenido con algunas librerías como [[JQuery]]).

<code java5>
@RequestMapping(value="/delete/{id}")
@ResponseStatus(HttpStatus.NO_CONTENT)
public void delete(@PathVariable long id) {
contactService.delete(id);
}
</code>

=== Descargar un proyecto de ejemplo ===
Les dejamos para [http://www.dosideas.com/descargas/category/2-spring-framework.html?download=41%3Ap descargar un proyecto de ejemplo de REST con Spring MVC] donde tienen todos los fuentes necesarios para abrir y ejecutar el ejemplo de esta página.

=== Test con componentes mock de un cliente REST===
* [[Mock REST con Spring]]

== Ver también ==
* [http://www.dosideas.com/descargas/category/2-spring-framework.html?download=41%3Ap Descargar un proyecto de ejemplo]
* [[Restfuse]] - testing de servicios REST.
* [[Spring Test MVC]] - testing de controladores de Spring.
* [http://static.springsource.org/spring/docs/3.0.0.M3/spring-framework-reference/html/ch18.html Creating Restful services - Documentación oficial]
* [http://www.informit.com/guides/content.aspx?g=java&seqNum=544 Creating Restful web services]
* [http://www.ibm.com/developerworks/web/library/wa-spring3webserv/index.html?ca=drs- Building RESTful web services using Spring 3]
* [http://www.adictosaltrabajo.com/tutoriales/tutoriales.php?pagina=springRestJson Spring + REST + JSON = SOAUI]
* [http://www.jpalace.org/docs/spring/rest.html Sprint REST Tutorial]

[[Category:Spring MVC]]