剧作家和使用子目录中的文件

Question

我正在尝试创建一个剧作家测试（在 javascript 中），它使用 classes 的页面对象模型，但测试和页面对象模型不在同一个目录路径。

我遇到的问题是找不到我的页面对象模型 class 文件。错误是 Error: Cannot find module './pom/home-page'。我错过了什么或做错了什么？

我的文件设置和路径结构如下：

/package.config.js

...
const config = {
   testDir: './test/playwright',
...

/test/playwright/pom/home-page.js

const { expect } = require ('@playwright/test');

exports.HomePage = class HomePage {
   constructor(page) {
      this.page = page;
      this.searchInput = page.locator('#searchInput');
      this.searchButton = page.locator('#searchButton');
   }
}

/test/playwright/scripts/home/search.spec.js

const {test, expect} = require('@playwright/test');
const {HomePage} = require('./pom/home-page');

test.beforeAll( async ({ page }) => { ... });
test.beforeEach( async ({ page }) => { ... });
test.afterAll( async ({ page }) => { ... });
test.describe( 'As a user I want to search', () => {
   test('"mySearchTerm1" and return {the expected result}', async ({ page }) => {
      const homePage = new HomePage(page); 
      ...
   });

   test('"mySearchTerm2" and return {the expected result}', async ({ page }) => {
      const homePage = new HomePage(page); 
      ...
   });
});

Answer 1

因此，显然文件引用是相对于测试所在目录的，而不是配置文件中定义的 testDir 目录。我需要更改 search.spec.js

中的第 2 行

const {HomePage} = require('../../pom/home-page');

Answer 2

那些使用 TypeScript 的人可以使用 tsconfig.json

来简化这个

https://playwright.dev/docs/test-typescript#manually-compile-tests-with-typescript

在 tsconfig 添加：

    "baseUrl": ".",
    "paths":{
        "@pages/*":[
            "/test/playwright/pom/*"
        ]
   }

然后你可以像这样将它导入到你的夹具或测试文件中：

import { HomePage } from "@pages/home-page"

这可用于缩短固定装置或其他文件。

剧作家和使用子目录中的文件

playwright and using files in subdirectories

playwright