剧作家使用KeyClope测试网站，无法找到通过pageObjectModel登录的方法

Question

嗨（我在palywright是新来的），

我需要/想在剧作家中找到一种方法，通过pageObjectModel在一个使用键斗篷的应用程序中登录，但我不知道如何登录。

我找到了一种没有pageObject的方法，在第一个测试中登录并在process.env.存储中保存身份验证，然后在file.spec.js中的其余测试中使用test.use（{storageState：auth_storage_path}）；

注意：keydepeat有效（很抱歉提供此基本信息）

• 用户未登录-

//tests_with_auth_store.spec.js

    const {test, expect}    = require('@playwright/test');
    const auth_storage_path = 'storage_auth.json';
    const baseUrl           = 'https://myBaseUrl_xyz.com';


    test('mylogin', async ({page, context}) => {
      const usernameId    = '[id="username"]';
      const passwordId    = '[id="password"]';
      const idLogin       = '[id="login-button"]';
      const usernameValue = '*****';
      const passwordValue = '*****';
    
      //login:
      await page.goto(baseUrl);
      await page.fill(usernameId, usernameValue);
      await page.fill(passwordId, passwordValue);
    
      await Promise.all([
        page.waitForNavigation(/*{ baseUrl: baseUrl }*/),
        page.click(idLogin)
      ]);
      process.env.STORAGE = null;
      const storage = await context.storageState({ path: auth_storage_path });
      process.env.STORAGE = JSON.stringify(storage);
      JSON.parse(process.env.STORAGE);
    
    });
    
    test.describe("testDescription login via pageObjectModel", () => {
    
      test.use({storageState: auth_storage_path});
    
      test('i- firstTest whatever ', async ({page}) => {
        await page.goto(baseUrl);
        ......
        ....
      });

      test('ii- secondTest whatever ', async ({page}) => {
        await page.goto(baseUrl);
        ......
        ....
      });
});

这个工作正常，所有测试都在test.use（{storageState：auth_storage_path}）；可以直接跳转到basUrl。问题是，我找不到一种方法来封装测试（'登录'）到一个playwright pageObject（在柏树中，我们在commands.js简单的func中做到了这一点，并将授权保存到cookie中）

我的login-page.js演示：

// login-page.js
const { expect, test} = require('@playwright/test');
const baseUrl = 'https://myBaseUrl_xyz.com';
const auth_storage_path = 'storage_auth.json';

exports.LoginPage = class LoginPage {
  
  /**
   * @param {import('@playwright/test').Page} page
   */
  
  constructor(page) {
    this.page = page;
  }
  
   async login() {
     process.env.STORAGE = null;
     const baseUrl = 'https://myBaseUrl_xyz';

     await this.page.goto(baseUrl);
     await this.page.fill('[id="username"]', '*****');
     await this.page.fill('[id="password"]', '*****');

     await Promise.all([
      this.page.waitForNavigation(/*{ baseUrl: baseUrl }*/),
      this.page.click('[id="fc-login-button"]')
    ]);


     const storage = await this.page.context().storageState({path: auth_storage_path});
     process.env.STORAGE = JSON.stringify(storage);
     JSON.parse(process.env.STORAGE);
  }
  

  // async gotoBaseUrl() {
  //   test.use({storageState: auth_storage_path});
  //   return  this.page.goto(baseUrl);
  // }
  
}

使用_auth_store _viaPage.spec.js从tests_调用登录页面

// tests_with_auth_store_viaPage.spec.js
const {test, expect} = require('@playwright/test');
const { LoginPage } = require('../login/login-page');
const auth_storage_path = 'storage_auth.json';

const baseUrl = 'https://myBaseUrl_xyz.com';

test('login', async ({page}) => {
  const loginPage = new LoginPage(page);
  await loginPage.login();
});

test.describe("testDEscription tests with save login into json", () => {

  test.use({storageState: auth_storage_path});

  test('i- firstTest whatever', async ({page}) => {
    await page.goto(baseUrl);
    ......
    ....
   });

但是这里的test（'i-firstTest whatever'）页面。goto（baseUrl）不会跳转到baseUrl，而是跳转到keydape auth页面：（。

eventhougtest（'login'）是登录并创建存储\u auth.json。所以我做错了什么，也许我需要像loginPage.gotoBaseUrl（）这样的东西，但它不起作用。

到目前为止，我正在编写其余的所有测试，包括总是第一个测试（'mylog），但我相信有一种方法通过pageObject

当做

Answer 1

已经找到路了。我找到了自己的路。如果有人需要帮助，请尽管问我