为什么“就地”功能不能引用它所在的类？

Posted 2021-04-12

我有这个代码，我正在使用等待页面上的面包屑加载。问题是我创建自己的函数而不是ExpectedCondition的第一行，因为ExpectedConditions没有进行包含检查，这就是我在这个地方需要的东西。由于我创建了自己的就地函数，我似乎超出了我所在的类的范围。所以我迷失了为什么这打破了范围，为什么我不能引用其他方法getProjectNameBreadCrumbText()存在于我的班级来自这个方法。

当我收到错误Failed: Cannot read property 'getProjectNameBreadCrumbText' of undefined时，我发现了这个问题。我明白this是未定义的，但我不明白为什么。我也不知道我是否可能通过this，因此以某种方式通过引用我所在的类，因为我不确定我正在使用的代码的确切术语。

// My Page Object class
export class MapperPage {
    ...
    async getProjectNameBreadCrumbText() {
        return await this.breadCrumbs.get(2).getText();
    }
    ...
    async waitAndVerifyProjectNameBreadCrumbs(projectName: string) {
        await browser.wait(async function() {return (await this.getProjectNameBreadCrumbText()).indexOf(projectName) > -1;},
            this.DEFAULT_WAIT_TIME_SECONDS * 1000, 'Name Breadcrumb for this page never loaded.');
        expect(await this.getProjectNameBreadCrumbText()).toContain(projectName);
        expect(await this.getProjectMapperBreadCrumbText()).toEqual(this.MAPPER_BREADCRUMB);
    }
}


// In my test I call the waitAndVerify method like so
...
it('test', async() => {
    const PROJECT_NAME = 'Project Name';
    ... // do other things
    // wait for the page to load by making sure the breadcrumbs have loaded
    await waitAndVerifyProjectNameBreadCrumbs(this.PROJECT_NAME);
});

我很抱歉，如果这是一个重复的问题，我不知道如何谷歌我要求的，因为我不确定我写的这段代码的正确术语。

答案

好像你将函数作为参数传递。所以the scope can be changed。您可以使用arrow function来访问正确的范围：

await browser.wait(
    async () => (await this.getProjectNameBreadCrumbText()).includes(projectName),
    this.DEFAULT_WAIT_TIME_SECONDS * 1000, 
    'Name Breadcrumb for this page never loaded.'
);

作为其他选项 - 您可以手动bind函数到所需范围：

this.getProjectNameBreadCrumbText = this.getProjectNameBreadCrumbText.bind(this);
await browser.wait(
    async function() {return (await this.getProjectNameBreadCrumbText()).indexOf(projectName) > -1;},
    this.DEFAULT_WAIT_TIME_SECONDS * 1000, 
    'Name Breadcrumb for this page never loaded.')