FAQ

Angular テストに特有ではない質問については、メインの FAQ も参照してください。

このライブラリでユニットテストを書くことはできますか？

もちろんです！このライブラリでユニットテストと統合テストを書くことができます。高レベルのコンポーネントをユニットテストしたい場合、（このライブラリは意図的にシャローレンダリングをサポートしていないため）依存関係をモックする方法の詳細については、下記を参照してください。このプロジェクトのテストでは、このライブラリを使用したユニットテストの例をいくつか示しています。

テストを書く際は、次の点に留意してください。

テストがソフトウェアの使用方法に似ているほど、テストはより大きな信頼性をもたらすことができます。 - 2018年2月17日

シャローレンダリングを使用できない場合、テストでコンポーネントをモックするにはどうすればよいですか？

一般的に、コンポーネントのモックは避けるべきです（「指針」セクションを参照）。ただし、必要な場合は、ng-mocks とその MockBuilderを使用してみてください。

import {Component, NgModule} from '@angular/core'
import {render, screen} from '@testing-library/angular'
import {MockBuilder} from 'ng-mocks'

@Component({
  selector: 'app-parent-component',
  template: '<app-child-component></app-child-component>',
})
class ParentComponent {}

@Component({
  selector: 'app-child-component',
  template: '<p>Child component</p>',
})
class ChildComponent {}

@NgModule({
  declarations: [ParentComponent, ChildComponent],
})
export class AppModule {}

describe('ParentComponent', () => {
  it('should not render ChildComponent when shallow rendering', async () => {
    // all imports, declarations and exports of AppModule will be mocked.
    const dependencies = MockBuilder(ParentComponent, AppModule).build()

    await render(ParentComponent, dependencies)

    expect(screen.queryByText('Child component')).toBeNull()
  })
})

コンポーネントツリーのどのレベルをテストする必要がありますか？子、親、または両方ですか？

このライブラリの指針に従うと、特定のコンポーネント自体ではなく、ユーザーがアプリケーションの機能を使用および操作する方法を中心にテストを編成する方法を分解すると便利です。再利用可能なコンポーネントライブラリの場合など、場合によっては、開発者をテスト対象のユーザーのリストに含めて、再利用可能な各コンポーネントを個別にテストすると便利な場合があります。それ以外の場合は、コンポーネントツリーの特定の分割は実装の詳細であり、そのツリー内のすべてのコンポーネントを個別にテストすると問題が発生する可能性があります（https://kentcdodds.com/blog/avoid-the-test-user を参照）。

実際には、これは多くの場合、現実的なユーザーインタラクションをシミュレートするために、コンポーネントツリーを十分に高くテストすることが望ましいことを意味します。これに加えて、より高いレベルまたはより低いレベルでテストする価値があるかどうかは、トレードオフの問題と、コストに対して十分な価値を提供するかどうかにかかっています（さまざまなレベルのテストの詳細については、https://kentcdodds.com/blog/unit-vs-integration-vs-e2e-tests を参照）。

このトピックの詳細については、このビデオをご覧ください。