a11smiles

Adding Sinon to WebPack

• Open your project (if you're using WebPack, obviously)

• npm install sinon --save-dev

• You should now have Sinon in your node modules and listed in your package.json file

• In your tests, require Sinon: var sinon = require('sinon'); or import * as sinon from 'sinon';

a11smiles

choco install sqlite 
sqlite3 grafana.db 'PRAGMA journal_mode=wal;' 
az login 
az storage copy -s .\grafana.db -d https://<storage_account>.file.core.windows.net/<file_share> --subscription <subscription_name>

a11smiles

import { Component, OnInit } from '@angular/core';
import { BasePageComponent } from '../base-page/base-page.component';

@Component({
  selector: 'app-first-page',
  templateUrl: './first-page.component.html',
  styleUrls: ['./first-page.component.scss']
})
export class FirstPageComponent extends BasePageComponent implements OnInit {
  private _clickCnt = 0;

a11smiles

import { Component, OnInit } from '@angular/core';
import { GoogleAnalyticsService } from '../google-analytics.service';

@Component({
  template: '',
})
export class BasePageComponent implements OnInit {

  constructor(protected $gaService: GoogleAnalyticsService) { }

a11smiles

import { Component, OnInit } from '@angular/core';
import { GoogleAnalyticsService } from '../google-analytics.service';

@Component({
  selector: 'app-first-page',
  templateUrl: './first-page.component.html',
  styleUrls: ['./first-page.component.scss']
})
export class FirstPageComponent implements OnInit {
  private _clickCnt = 0;

a11smiles

<button (click)="click()">Click Me!</button>

a11smiles

logEvent(event, category, label, value) {
  gtag('event', event, {
    event_category: category,
    event_label: label,
    value: value
  });

  console.log('gtag event captured...');
}

a11smiles

import { Component, OnInit } from '@angular/core';
import { GoogleAnalyticsService } from './google-analytics.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
  title = 'Google Analytics Service';

a11smiles

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

import { GoogleAnalyticsService } from './google-analytics.service';

@NgModule({
  declarations: [

a11smiles

import { Injectable } from '@angular/core';
import { Router, RouterEvent, NavigationEnd } from '@angular/router';
import { filter } from 'rxjs/operators';
import { environment } from '../environments/environment';

declare var gtag: any;

@Injectable({
  providedIn: 'root'
})