title: Karma-Jasmine: TypeError: Cannot read properties of undefined (reading 'get')
body: <p>I am trying to write a unit test for my angular component and I am stuck at this error. I have researched a lot about this on stack overflow and some online docs. Here is the link of resources which I have tried so far with no luck.</p>
  <ul>
  <li><a href="https://dev.to/amerigom/how-to-activatedroute-in-angular-and-how-to-mock-it-in-unit-tests-2ne6" rel="nofollow noreferrer">How to ActivatedRoute in Angular and how to mock it in Unit Tests</a></li>
  <li><a href="https://stackoverflow.com/questions/38356084/how-to-unit-test-a-component-that-depends-on-parameters-from-activatedroute">How to unit test a component that depends on parameters from ActivatedRoute?</a></li>
  <li><a href="https://stackoverflow.com/questions/45917883/how-do-you-mock-activatedroute">How do you mock ActivatedRoute</a></li>
  </ul>
  <p>Below is my code</p>
  <p><strong>.ts file</strong></p>
  <pre><code>export class SomeComponent implements OnInit {
    id = '--';
    
    constructor(
      private readonly someService: SomeService,
      private readonly utilsService: UtilsService,
      private readonly router: Router,
      readonly route: ActivatedRoute,
    ) {}
  
    ngOnInit() {
      this.id = this.route.snapshot.queryParamMap.get('id');
      this.getDetails();
    }
  
    viewInventory(){
      this.router.navigate(['..'], {
        relativeTo: this.route
      });
    }
  
    getDetails() {
      if (this.id) {
        this.getResourceOverview();
      }
    }
  
    getResourceOverview(): void {
      const resourceID = `search_keys=${&quot;resource_id&quot;}&amp;search=${this.id}`
      this.resourceId = this.id
      this.someService
        .getResourceOverview(resourceID)
        .subscribe(
          (response) =&gt; {
            const result = response as any;
            if (result &amp;&amp; something) {
              this.id = something  || '--';
            }
          },
          (error) =&gt; {
            console.log('Resource overview details failed with error', error);
          }
        );
    }
  }
  </code></pre>
  <p><strong>.ts.spec</strong></p>
  <pre><code>class mockHttpWrapperService {
    readonly isApiReady = false;
  }
  
  describe('SomeComponent', () =&gt; {
    let component: SomeComponent;
    let fixture: ComponentFixture&lt;SomeComponent&gt;;
    let activatedRouteSpy;
  
    beforeEach(async(() =&gt; {
      activatedRouteSpy = {
        snapshot: {
          paramMap: convertToParamMap({
            id: 'dads123',
            code: 'IBM',
          })
        }
      };
      TestBed.configureTestingModule({
        declarations: [SomeComponent],
        imports: [
          SomeLibModule, CarbonModule, SomeModule.forRoot(),
          RouterModule.forRoot([])
        ],
        providers: [
          { provide: NGXLogger, useClass: MockNGXLogger },
          { provide: HttpWrapperService, useClass: mockHttpWrapperService },
          { provide: Router, useClass: class { navigate = jasmine.createSpy(&quot;navigate&quot;); }},
          ApiContractService,
          TranslationService,
          ApiService,
          ApiContractService,
          TranslationService,
          SomeService,
          {
           provide: ActivatedRoute,
           useValue: activatedRouteSpy
          }
        ],
        schemas: [CUSTOM_ELEMENTS_SCHEMA],
      })
      .compileComponents()
      .then(() =&gt; {
        fixture = TestBed.createComponent(SomeComponent);
        component = fixture.debugElement.componentInstance;
        fixture.detectChanges();
        component.ngOnInit();
      })
    }));
  
    it('should create 1 ', () =&gt; {
      expect(component).toBeTruthy();
    });
  })
  </code></pre>
  <p>And below is the error message</p>
  <pre><code>Chrome 93.0.4577 (Linux 0.0.0) SomeComponent should create 1  FAILED
  TypeError: Cannot read properties of undefined (reading 'get')
  </code></pre>