Jasmine でモックオブジェクトのプロパティをスパイする

モックオブジェクトのプロパティをスパイする際に発生する Jasmine の "already been spied upon" エラーを、Object.getOwnPropertyDescriptor で回避する方法。

Takahiro Iwasa

2021-09-26

4 min read

Jasmine でテストをしていると、すでにモックされているオブジェクトのプロパティをスパイしようとしたときに、以下のようなエラーに遭遇することがあります。

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

このエラーは Object.getOwnPropertyDescriptor メソッドを使うことで解決できます。

よくあるシナリオ

以下のようなテストコードを考えます。このコードは、currentUser にアクセスした際にエラーを発生させます。

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
});

解決策

公式の Jasmine チュートリアルでは、この問題を解決するために Object.getOwnPropertyDescriptor を使うことが提案されています。

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.

ゲッターやセッターをスパイする作業を簡略化するために、以下のような再利用可能なヘルパー関数を定義できます。

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
};

更新後のテストコード

ヘルパー関数 spyGetter を使うと、テストコードはより簡潔で読みやすくなります。

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
});

まとめ

spyOnProperty を直接呼び出す代わりに Object.getOwnPropertyDescriptor を使うことで、Jasmine でモックされたプロパティをテストする際の “already been spied upon” エラーを解消できました。jasmine.createSpyObj の第 3 引数として ['currentUser'] を渡すこと自体が、テストが明示的に spyOnProperty を呼び出すより前に、暗黙のうちにプロパティスパイを作成してしまっている原因です。だからこそ、2 回目の呼び出しがすでに存在するスパイと衝突してしまうのです。Object.getOwnPropertyDescriptor(target, key)?.get は、新しいスパイを作成しようとするのではなく、その既存のスパイに直接アクセスします。これを小さな spyGetter／spySetter ヘルパーにまとめておけば、このパターンに遭遇するすべてのテストで、プロパティディスクリプタの取得処理を毎回書き直すことなく、同じ一行の修正を再利用できます。

記事一覧に戻る