Question

附上我的下拉列表和文本框的图像示例我有一个下拉列表和一个文本框，我想创建一个Pageobject函数来解析.css或类的html标识符并将其拆分为“ - ” 例如：

我有一个执行此操作的黄瓜.feature文件

And he filters account Name so that it contains dyno

所以我在这里说找到帐户名称列并在下拉列表中选择一个值，然后在文本框中输入一个值，理论上如果我让Devs为下拉列表和文本框创建一个html标识符与此类似:(特别是带有accountName的标识符）

<th _ngcontent-c2="" class="ui-p-6 ui-sortable-column" 
    preorderablecolumn="" style="text-align:left;" 
    ng-reflect-field="accountId" draggable="true">
        Account Name

  <p-sorticon _ngcontent-c2="" ng-reflect-field="accountId">

    <span class="ui-sortable-column-icon fa fa-fw fa-sort" 
          ng-reflect-klass="ui-sortable-column-icon fa fa-" 
          ng-reflect-ng-class="[object Object]">
    </span>

  </p-sorticon>
</th>

这是我的步骤定义：

this.When(/^s?he filters (.*) so that it ?(.*)?(.*) ?(.*)$/,
    (columnName: string, bySelectingTheFilter: string, 
     andEnteringText: string, intoTextBox: string) => {
        return stage.theActorInTheSpotlight().attemptsTo(
            FilterTheList.toShow(columnName, bySelectingTheFilter, 
                         andEnteringText, intoTextBox)
        );
    });

我有一个任务文件，其中包含选择下拉列表并在此处输入文本框内的数据的类：

export class FilterTheList implements Task {
    constructor(private columnName: string, private filter: string,
                private text: string, private filterTextBox: string) {
    }

    static filterOptionShow() {
        return Click.on(AccountListUI.accountListShowFilter);
    }

    static toShow(columnName: string, filter: string, text: string, filterTextBox: string){
        // @todo need to sanitize columns to match HTML identifier
        // this.columnName = columnName; 

        // @todo need to sanitize columns to match HTML identifier
        // this.filterTextBox = filterTextBox;
        return new FilterTheList(columnName, filter, text, filterTextBox);
    }

    @step('{0} filters the list to show #taskType items')
    performAs(actor: PerformsTasks): PromiseLike<void> {
        return actor.attemptsTo(
            Select.theValue(this.filter)
                .from(AccountListUI.filter.dropDown(this.columnName)),
            Enter.theValue(this.text)
                .into(AccountListUI.filter.textBox(this.filterTextBox))
        );
    }
}

我想我可以制作像这样的pageoject函数

static filterItems = {
        dropDown: (name: string) => Target.the(`filter dropdown called ${name}`)
            .located(by.css(`th.${name} input[type="select"]`)),
        textBox: (name: string) => Target.the(`filter textbox called ${name}`)
            .located(by.css(`th.${name} input[type="text"]`)),
    };

但在找到列名

后会调用该函数

这就是我失去了如何使函数说“嘿从.feature文件中获取列名并将其解析为html提供的内容（即：将帐户名称解析为accountName）

Answer 1

PageObject函数：

static filterItems = {
        dropDown: (name: string) => Target.the(`filter dropdown called ${name}`)
            .located(by.xpath(`//th[normalize-space(.)="${name}"]/select`)),
        textBox: (name: string) => Target.the(`filter textbox called ${name}`)
            .located(by.xpath(`//th[normalize-space(.)="${name}"]/input[type="text"]`)),
    };

进入要素文件：

And he filters Account Name so that it contains dyno

步骤定义功能：

And(/^he filters (.+) so that it (\w+) (.+)$/, (columnName, filterMethod, filterWords) => {
   // columnName   => Account Name
   // filterMethod => contains
   // filterWords  => dyno
   pageA.filterItems.dropdown(columnName)... 
});

函数将typescript中的html标识符从cucumber .feature文件解析为pageobject文件

1 个答案: