Property 'x' does not exist on type 'MakeMatchers'

Question

I'm a newcomer to Typescript and am struggling to see why I get this error:

At the top of the file I import expect from Playwright: import {expect} from "@playwright/test";

This function as shown comes from interface PageAssertions{ // within the @playwright/test declaration file test.d.ts. However, I seem to be able to use any assertion that is in `expect-types.d.ts with no error.

I have tried installing following as both dev and standard dependency in my package.json:

"dependencies": {
  "@playwright/test": "^1.28.1",

I don't have expect being imported anywhere else (i.e. from Jest).

I see this in node-modules:

Answer 1

I'm not able to reproduce that, not even by overcomplicating it a little bit.
I created a file called title-checker.ts

import { expect, Page } from "@playwright/test";

export class TitleChecker {
    constructor(readonly page: Page){}

    checkTitle(title: string) {
        expect(this.page).toHaveTitle(title);
    }
}

And then I have this test:

import { test, expect } from '@playwright/test';
import { TitleChecker } from './title-checker';

test('wait', async ({ context, page }) => {
  await page.goto("https://www.mabl.com");
  await page.locator('"Login"').click();
  new TitleChecker(page).checkTitle('login | mabl');
});

Everything worked as expected.