1

我已经过滤了列出所有任务的下拉列表。当我在搜索框中输入字母时，我会看到一个以这些字母开头的任务列表。

我的 Serenity-JS / Cucumber 测试输入了“Given”中的前两个字符，请参见下面的黄瓜。但我正在尝试使用 Serenity 从选项列表中选择一个项目。

Given James has entered 'Ta' into the tasks box
When he selects 'Take out the Trash' from the task list options
Then he sees 'Take Out the Trash' in the heading

我用来查找任务的代码是这样的：

static List_Of_All_Tasks = Target.the('List of all tasks').located(by.className('task'));

这将返回“任务”列表

我的问题是使用普通的 Serenity-js 模式。如何选择列表中的项目？

需要一个目标，Click.on()但我如何指定类似的东西List_Of_All_Tasks.located(by.id='Take_Out_The_Trash')

4

1 回答 1

2

这里有几个选项，因此假设列表中的每个项目都有一个 CSS 类task和一个从其名称派生的 ID：

  1. 您可以使用动态生成选择器Target.of

    const TodoList = {
  Task: Target.the('task to {0}').located(by.css('.task#{0}'),
}

    接着：

    actor.attemptsTo(
    Click.on(TodoList.Task.of('Take_Out_The_Trash'))
);

    查看该类的测试用例Target，了解如何实现这一点。

  2. 或者，您可以动态生成整体Target：

    const TodoList = {
    TaskTo: (name: string) => Target.the(`task to ${name}`)
                                .located(by.css(`.task#${name}`)
}

    接着：

    actor.attemptsTo(
    Click.on(TodoList.TaskTo('Take_Out_The_Trash'))
));

  3. 如果您无法执行上述任何操作或需要执行更复杂的操作（例如过滤列表），您可以定义自定义交互，使用locate(target)or解析元素locateAll(target)，这将为您提供 Protractor 的ElementFinder 或 ElementArrayFinder的实例分别，并从那里拿走：

    const Tasks = Target.the('List of all tasks').located(by.className('task'));

const SelectTask = {
     called: (name: string) => Interaction.where(`#actor selects a task to ${name}`,
     actor => BrowseTheWeb.as(actor).locateAll(Tasks)./* continue with ElementArrayFinder methods */
}

    接着：

    actor.attemptsTo(
    SelectTask.called('Take_Out_The_Trash')
);

    查看这些示例，了解如何使用量角器$和$$选择器。

于 2017-08-14T22:46:54.763 回答