How to use toBeDisabled method in Playwright Internal

1import { fireEvent, render, screen } from '@testing-library/react';
2import UsePaginationExample from './usePagination.example';
3
4describe('usePagination', () => {
5  it.skip('should be able to update the current page when requested', async () => {
6    render(<UsePaginationExample totalPages={5} />);
7
8    const firstPageButton = screen.getByRole('button', {
9      name: 'view first page',
10    });
11    const prevPageButton = screen.getByRole('button', {
12      name: 'view previous page',
13    });
14    const nextPageButton = screen.getByRole('button', {
15      name: 'view next page',
16    });
17    const lastPageButton = screen.getByRole('button', {
18      name: 'view last page',
19    });
20
21    // validate that we're on the first page.
22    // we use `.findBy` here because the total pages
23    // will be updated asynchronously
24    await screen.findByText('1 / 5');
25
26    // validate the initial state
27    expect(firstPageButton).toBeDisabled();
28    expect(prevPageButton).toBeDisabled();
29    expect(nextPageButton).not.toBeDisabled();
30    expect(lastPageButton).not.toBeDisabled();
31
32    // go to the next page and re-validate everything
33    fireEvent.click(nextPageButton);
34    expect(firstPageButton).not.toBeDisabled();
35    expect(prevPageButton).not.toBeDisabled();
36    expect(nextPageButton).not.toBeDisabled();
37    expect(lastPageButton).not.toBeDisabled();
38    await screen.findByText('2 / 5');
39
40    // go to the last page & re-validate
41    fireEvent.click(lastPageButton);
42    expect(firstPageButton).not.toBeDisabled();
43    expect(prevPageButton).not.toBeDisabled();
44    expect(nextPageButton).toBeDisabled();
45    expect(lastPageButton).toBeDisabled();
46    await screen.findByText('5 / 5');
47
48    // go to the first page & re-validate
49    fireEvent.click(firstPageButton);
50    expect(firstPageButton).toBeDisabled();
51    expect(prevPageButton).toBeDisabled();
52    expect(nextPageButton).not.toBeDisabled();
53    expect(lastPageButton).not.toBeDisabled();
54    await screen.findByText('1 / 5');
55  });
56});
57

Source: usePagination.test.jsx

import { fireEvent, render, screen } from '@testing-library/react';
import UsePaginationExample from './usePagination.example';

describe('usePagination', () => {
  it.skip('should be able to update the current page when requested', async () => {
    render(<UsePaginationExample totalPages={5} />);

    const firstPageButton = screen.getByRole('button', {
      name: 'view first page',
    });
    const prevPageButton = screen.getByRole('button', {
      name: 'view previous page',
    });
    const nextPageButton = screen.getByRole('button', {
      name: 'view next page',
    });
    const lastPageButton = screen.getByRole('button', {
      name: 'view last page',
    });

    // validate that we're on the first page.
    // we use `.findBy` here because the total pages
    // will be updated asynchronously
    await screen.findByText('1 / 5');

    // validate the initial state
    expect(firstPageButton).toBeDisabled();
    expect(prevPageButton).toBeDisabled();
    expect(nextPageButton).not.toBeDisabled();
    expect(lastPageButton).not.toBeDisabled();

    // go to the next page and re-validate everything
    fireEvent.click(nextPageButton);
    expect(firstPageButton).not.toBeDisabled();
    expect(prevPageButton).not.toBeDisabled();
    expect(nextPageButton).not.toBeDisabled();
    expect(lastPageButton).not.toBeDisabled();
    await screen.findByText('2 / 5');

    // go to the last page & re-validate
    fireEvent.click(lastPageButton);
    expect(firstPageButton).not.toBeDisabled();
    expect(prevPageButton).not.toBeDisabled();
    expect(nextPageButton).toBeDisabled();
    expect(lastPageButton).toBeDisabled();
    await screen.findByText('5 / 5');

    // go to the first page & re-validate
    fireEvent.click(firstPageButton);
    expect(firstPageButton).toBeDisabled();
    expect(prevPageButton).toBeDisabled();
    expect(nextPageButton).not.toBeDisabled();
    expect(lastPageButton).not.toBeDisabled();
    await screen.findByText('1 / 5');
  });
});