Failed: mixpanel is not defined - Angular test bed

Question

Can you tell me how can I test the form functionality without considering Mixpanel functionality? Now it shows below error.

login.component.ts

  ngOnInit() {
    Mixpanel.trackEvent("View Screen", { "Screen Name": "Login" });
    this.createForm();
  }

createForm() {
    this.form = this.fb.group({
      email: ["", Validators.compose([Validators.required, Validators.pattern(RegexValidators.email)])],
      password: ["", Validators.required]
    });
  }

login.component.spec.ts

import { CoreModule } from './../app.core.module';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { LoginComponent } from './login.component';
import { APP_BASE_HREF } from '@angular/common';

describe('LoginComponent', () => {
  let component: LoginComponent;
  let fixture: ComponentFixture<LoginComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [ReactiveFormsModule, FormsModule, CoreModule],
      declarations: [],
      providers: [
        {
          provide: APP_BASE_HREF,
          useValue: '/'
        }
      ]
    });

    //create component and test fixture
    fixture = TestBed.createComponent(LoginComponent);

    // get test component from the fixture
    component = fixture.componentInstance;
    component.ngOnInit();
  }));

  it('form invalid when empty', () => {
    expect(component.form.valid).toBeFalsy();
  });
});

Error:

ReferenceError: mixpanel is not defined
    at Object.trackEvent (http://localhost:9876/_karma_webpack_/webpack:/src/mixpanel.functions.ts:5:5)
    at LoginComponent../src/app/login/login.component.ts.LoginComponent.ngOnInit (http://localhost:9876/_karma_webpack_/webpack:/src/app/login/login.component.ts:25:14)
    at Object.<anonymous> (http://localhost:9876/_karma_webpack_/webpack:/src/app/login/login.component.spec.ts:27:15)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:388:1)
    at AsyncTestZoneSpec.push../node_modules/zone.js/dist/async-test.js.AsyncTestZoneSpec.onInvoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/async-test.js:106:1)
    at ProxyZoneSpec.push../node_modules/zone.js/dist/proxy.js.ProxyZoneSpec.onInvoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/proxy.js:125:1)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:387:1)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runGuarded (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:151:1)
    at runInTestZone (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/async-test.js:234:1)
    at Object.<anonymous> (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/async-test.js:168:1)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:388:1)
    at ProxyZoneSpec.push../node_modules/zone.js/dist/proxy.js.ProxyZoneSpec.onInvoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/proxy.js:128:1)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:387:1)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:138:1)
    at runInTestZone (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/jasmine-patch.js:142:1)
    at Object.<anonymous> (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/jasmine-patch.js:158:1)
    at attemptAsync (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:3945:24)
    at ZoneQueueRunner.QueueRunner.run (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:3884:9)
    at ZoneQueueRunner.QueueRunner.execute (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:3872:10)
    at ZoneQueueRunner.push../node_modules/zone.js/dist/jasmine-patch.js.jasmine.QueueRunner.ZoneQueueRunner.execute (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/jasmine-patch.js:250:1)
    at Spec.queueRunnerFactory (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:816:35)
    at Spec.execute (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:473:10)
    at Object.fn (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:4975:37)
    at attemptAsync (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:3945:24)
    at ZoneQueueRunner.QueueRunner.run (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:3884:9)
    at ZoneQueueRunner.QueueRunner.execute (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:3872:10)
    at ZoneQueueRunner.push../node_modules/zone.js/dist/jasmine-patch.js.jasmine.QueueRunner.ZoneQueueRunner.execute (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/jasmine-patch.js:250:1)
    at queueRunnerFactory (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:816:35)
    at Object.fn (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:4960:13)
    at attemptAsync (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:3945:24)
    at ZoneQueueRunner.QueueRunner.run (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:3884:9)
    at ZoneQueueRunner.QueueRunner.execute (http://localhost:9876/base/node_modules/jasmine-core/lib/jasmine-core/jasmine.js?da99c5b057693d025fad3d7685e1590600ca376d:3872:10)
    at http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/jasmine-patch.js:247:92
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:421:1)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:188:1)
    at drainMicroTaskQueue (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:595:1)

Answer 1

I have done this like so: i.e. Just fire Mixpanel only in production.

login.component.ts

import { Component, OnInit, isDevMode } from "@angular/core";

ngOnInit() {
    if (!isDevMode()) Mixpanel.trackEvent("View Screen", { "Screen Name": "Login" });
    this.createForm();
  }