Question

我使用 PageObject Pattern (NodeJS + Webdriverio) 编写 UI 测试，我有一个基类 (BasePage)、一个页面类 (MyPage)、一个具有多用途行为的弹出组件类 (PopupComponentClass)、一个具有特定实现的弹出类（特定弹出组件类）。我需要从 PopupComponentClass 扩展 SpecificPopupComponentClass。

page.js：

export default class BasePage {


    get BASE_URL() {
        return "https://url.com";
    };

    ...some methods...
}

my.page.js：

import BasePage from "../page";

class MyPage extends BasePage {

    constructor() {
        super();
    };

    get URL() { return `${this.BASE_URL}/some/path` };
    get title() { return $("h1") };

    orderRandomTariff() {
        ...some actions...
    };

}

export default new MyPage ();

popup.component.page.js:

import BasePage from "../pages/page";

class PopupComponent extends BasePage{

    constructor() {
        super();
    };

    get title() { return $("h1") };
    

}

export default new PopupComponent();

specific.popup.component.js:

import PopupComponent from "./popupFragment";

class SpecificPopupComponent extends PopupComponent {

    constructor() {
        super();
    };

    get popupStreetInput() { return $(".//div[@class='checkAddress']//*[./*[contains(text(),'Street')]]//input") };

    fillStreet(street) {
        ...some actions with this.popupStreetInput...
    };

}

export default new SpecificPopupComponent();

...并尝试在 test.js 中使用它：

import MyPage from "../../../../pages/my.page";
import SpecificPopupComponent from "../../../../fragments/specific.popup.component";

const myPage= MyPage ;
const popup = SpecificPopupComponent ;

describe("Test", () => {

    before(() => {
        myPage.open();
    });

    it("Check", () => {
        popup.fillStreet("Street");
    });

});

但我收到一个错误：“TypeError: Class extends vlaue #PopupComponent is not a constructor or null”。我怀疑这是由于循环依赖造成的，但我不明白我需要做些什么来解决这个问题。

Answer 1

这里的问题似乎是您如何导出基类。您正在实例化它，而不仅仅是导出您将从中继承的类。应该是这样的：

export default class PopupComponent extends BasePage {

    constructor() {
        super();
    };

    get title() { return $("h1") };
    

}

然后在你要使用的时候创建实例

var myPage = new MyPage()
var popup = new SpecificPopupComponent()

myPage.open()
popup.fillStreet('street')

你在那里所做的等同于这样做：

class SpecificPopupComponent extends new PopupComponent() {
   // ... what am I? ?
}

<块引用>

我怀疑这是由于循环依赖

您可以通过以正确的顺序将所有代码复制到测试文件中而不使用导入来验证或拒绝您的嫌疑人。但我不认为这是一个循环依赖

我创建了 this Plunker 来删除导入的使用并证明这一点。

JS: TypeError: Class extends value <ClassName> is not a constructor or null

1 个答案: