1.0.0 • Published 3 years ago
bice-gtm-logger v1.0.0
Bice Google Tag Manager Logger
TL;DR;
Encapsula un push al window.dataLayer con el siguiente objeto
{
"userId": "0014100023bka3dVBA",
"event": "CLICK_RETRY_FE-MI-APP",
"view": "lib-period-summary",
"component": {
"name": "TransactionsComponent",
"service": "getTransactions"
}
}
NOTA: Tests no están funcionando aún por problemas respecto al objeto window, probablemente por correr en ambiente node
Descripción
Se pueden utilizar los métodos click
, error
y load
dentro de la librería
para registrar un evento dentro del Google Tag Manager.
click
registrará un evento gatillado por el usuario al presionar un botón, los definidos inicialmente se encuentran en elenum
```typescript enum ButtonCommand { Download = 'DOWNLOAD', Retry = 'RETRY', Navigation = 'NAVIGATION', Other = 'OTHER' } ``` * `Download` refiere a algún botón para descarga * `Retry` corresponde a botón de reintentos * `Navigation` corresponde a botón para navegar a otro componente del sitio * `Other` en caso de utilizar otro tipo de botón no definido en puntos anteriores
error
registrará eventos de error que pueden ser puestos en algún catch dentro del componente o serviceload
se puede utilizar para cargas iniciales de aplicación o dónde no hay interacción de usuario
Instalación
Debiera estar asociado al registry del banco en Nexus
npm install bice-gtm-logger
Uso
El uso es sencillo, ejemplo de un push por click de un botón de reintento
// ... other important imports
import * as gtm from "../src/utils/gtm-actions";
@Component({
selector: 'lib-transactions',
templateUrl: './transactions.component.html',
styleUrls: ['./transactions.component.scss']
})
export class TransactionsComponent {
retryTransactions(cardNumber) {
gtm.click(gtm.ButtonCommand.Retry,
"fe-mi-app",
"0014100023bka3dVBA",
"lib-transactions",
"TransactionsComponent",
"getTransactions")
this.getTransactions(cardNumber);
}
}
1.0.0
3 years ago