-
Notifications
You must be signed in to change notification settings - Fork 0
/
app.component.spec.ts
35 lines (29 loc) · 1.15 KB
/
app.component.spec.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
import { AppComponent } from './app.component'
import { render, screen, within } from '@testing-library/angular'
import { Todo } from './types'
import { Observable, of } from 'rxjs'
import { ApiService } from './api.service'
describe('AppComponent', () => {
const todos: Todo[] = [
{ completed: false, id: 0, title: 'First', userId: 0 },
{ completed: false, id: 1, title: 'Second', userId: 0 },
{ completed: true, id: 2, title: 'Third', userId: 0 },
]
it('renders component', async () => {
fetchComments.mockReturnValue(of(todos))
await renderComponent()
const title = screen.getByRole('heading')
expect(title).toHaveTextContent('Hello, Todos!')
const list = await screen.findByRole('list')
const items = within(list).getAllByRole('listitem')
expect(items).toHaveLength(todos.length)
expect(items[0]).toHaveTextContent('First')
expect(items[1]).toHaveTextContent('Second')
expect(items[2]).toHaveTextContent('Third')
})
})
const fetchComments = jest.fn<Observable<Todo[]>, any>()
const renderComponent = () =>
render(AppComponent, {
providers: [{ provide: ApiService, useValue: { fetchComments } }],
})