Spying on Mock Object Properties in Jasmine

Working around Jasmine's "already been spied upon" error when spying on a mocked object's property with Object.getOwnPropertyDescriptor.

Takahiro Iwasa

2021-09-26

3 min read

When testing with Jasmine, you might encounter the following error while attempting to spy on a property of an already mocked object:

1
Error: <spyOnProperty> : currentUser#get has already been spied upon
2
Usage: spyOnProperty(<object>, <propName>, [accessType])

This error can be resolved with the Object.getOwnPropertyDescriptor method.

Common Scenario

Consider the following testing code. This code raises the error when currentUser is accessed.

1
import { HttpClientTestingModule } from '@angular/common/http/testing';
2
import { TestBed } from '@angular/core/testing';
3
import { AuthService } from '@core/services/auth.service';
4

5
describe('AuthService', () => {
6

7
  let service: jasmine.SpyObj<AuthService>;
8

9
  beforeEach(() => {
10
    TestBed.configureTestingModule({
11
      imports: [HttpClientTestingModule],
12
      providers: [
13
        { provide: AuthService, useValue: jasmine.createSpyObj('AuthService', [], ['currentUser']) },
14
      ],
15
    });
16

17
    service = TestBed.inject(AuthService) as jasmine.SpyObj<AuthService>;
18
  });
19

20
  it('should get the currentUser', () => {
21
    spyOnProperty(service, 'currentUser').and.returnValue({ id: 1, name: 'Hello World' });
22
    // Testing code here...
23
    expect(service.currentUser).toEqual({ id: 1, name: 'Hello World' });
24
  });
25

26
});

Solution

The official Jasmine tutorial suggests using Object.getOwnPropertyDescriptor to overcome this issue.

You can create a spy object with several properties on it quickly by passing an array or hash of properties as a third argument to createSpyObj. In this case you won’t have a reference to the created spies, so if you need to change their spy strategies later, you will have to use the Object.getOwnPropertyDescriptor approach.

To simplify the process of spying on getters and setters, you can define reusable helper functions like this:

1
/* eslint-disable-next-line arrow-body-style */
2
export const spyGetter = <T, K extends keyof T>(target: jasmine.SpyObj<T>, key: K): jasmine.Spy => {
3
  return Object.getOwnPropertyDescriptor(target, key)?.get as jasmine.Spy;
4
};
5

6
/* eslint-disable-next-line arrow-body-style */
7
export const spySetter = <T, K extends keyof T>(target: jasmine.SpyObj<T>, key: K): jasmine.Spy => {
8
  return Object.getOwnPropertyDescriptor(target, key)?.set as jasmine.Spy;
9
};

Updated Testing Code

With the helper function spyGetter, the testing code becomes more concise and readable:

1
import { HttpClientTestingModule } from '@angular/common/http/testing';
2
import { TestBed } from '@angular/core/testing';
3
import { AuthService } from '@core/services/auth.service';
4
import { spyGetter } from '@tests/helper';
5

6
describe('AuthService', () => {
7

8
  let service: jasmine.SpyObj<AuthService>;
9

10
  beforeEach(() => {
11
    TestBed.configureTestingModule({
12
      imports: [HttpClientTestingModule],
13
      providers: [
14
        { provide: AuthService, useValue: jasmine.createSpyObj('AuthService', [], ['currentUser']) },
15
      ],
16
    });
17

18
    service = TestBed.inject(AuthService) as jasmine.SpyObj<AuthService>;
19
  });
20

21
  it('should get the currentUser', () => {
22
    spyGetter(service, 'currentUser').and.returnValue({ id: 1, name: 'Hello World' });
23
    // Testing code here...
24
    expect(service.currentUser).toEqual({ id: 1, name: 'Hello World' });
25
  });
26

27
});

Conclusion

Replacing a direct spyOnProperty call with Object.getOwnPropertyDescriptor resolved the “already been spied upon” error when testing a mocked property in Jasmine. Passing ['currentUser'] as the third argument to jasmine.createSpyObj is what silently creates a property spy before a test ever calls spyOnProperty explicitly, which is why the second call collides with one that already exists. Object.getOwnPropertyDescriptor(target, key)?.get reaches that existing spy directly instead of trying to create a new one, and wrapping it in a small spyGetter/spySetter helper means every test that hits this pattern can reuse the same one-line fix rather than re-deriving the property descriptor lookup each time.

Back to posts