alnutile / business-selector-extension
Behat 的 CSS 选择器替换
Requires
- php: >=5.3.0
- behat/behat: >=2.4@stable
- behat/mink-extension: *
- symfony/config: >=2.0.0,<2.2.0
- symfony/dependency-injection: >=2.0.0,<2.2.0
This package is auto-updated.
Last update: 2024-09-06 09:31:50 UTC
README
介绍
--
原始项目可在此处查看 https://github.com/orangedigital/business-selector-extension
以下许多注释仍然适用。尽管它仍然可以扩展到其他项目,但我还是需要对其进行一些简化,以适应我正在使用的项目。
基本上,我不想在找不到令牌时抛出错误,因为它可以回退到用户使用的字符串,然后让 Behat 按需错误。
--
Behat 的 Mink 扩展是一个快速启动 Web 接受测试的绝佳方式。它允许用户使用常见的属性(如 'title'、'alt' 和 'value')在页面上指定 HTML 元素。一些步骤允许在 Gherkin 文件中内联使用 CSS 选择器。
虽然这种方法很棒,但它也有一些缺点
-
属性值可能并不总是最符合业务需求,并且可能会降低 Gherkin 场景的可读性。
-
有时无法使用 MinkExtension 提供的属性来识别元素。
-
通过在 Gherkin 文件中直接使用这些属性,它们与前端实现紧密耦合。Gherkin 应该表达业务需求而不是实现细节。
Behat 的业务选择器允许用户使用与 MinkExtension 提供的步骤非常相似的步骤,以业务术语描述页面上的元素。在运行测试时,业务术语将替换为在 yml 文件中维护的 CSS 选择器。
示例
使用 BusinessSelectorsExtension 提供的步骤编写的 Gherkin
Given I go to the page "Home Page" When I follow the link "Add Subscription" And I fill in the "first name box" field with "ben" Then the "first name box" form field should contain "ben" And I press the "test" button And the "Widget" should contain "Area One Text"
引号中的值映射到 behat.yml 中通过参数 'selectorFilePath' 配置的文件中的值。
Add Subscription: "a.self-link" first name box: "form#name_form input[name=first_name]" test: "form#name_form input[name=submit]" Widget: div#user_widget
安装
通过使用 composer 安装上下文是最好的方式。
-
有关 Behat 安装说明,请参阅: behat.org
-
将以下内容添加到您要测试的项目中的 composer.json。
{ "minimum-stability": "dev", "require": { "behat/behat": ">v2.4@stable", "orangedigital/business-selector-extension": "*" } }
- 将 OrangeDigital\BusinessSelectorExtension\Extension 部分添加到您的 behat.yml 文件中,如下例所示。
default: context: parameters: javascript_session: selenium browser: firefox show_cmd: open %s extensions: OrangeDigital\BusinessSelectorExtension\Extension: urlFilePath: urls.yml selectorFilePath: selectors.yml assetPath: path timeout: 30 contexts: UIBusinessSelector: ~ Behat\MinkExtension\Extension: base_url: "http://local.dev" default_session: goutte goutte: ~ selenium: ~ selenium2: ~
- 修改您的 FeatureContext 文件以使用 BusinessSelectorContext 文件。
<?php use Behat\Behat\Context\ClosuredContextInterface, Behat\Behat\Context\TranslatedContextInterface, Behat\Behat\Context\BehatContext, Behat\Behat\Exception\PendingException; use Behat\Gherkin\Node\PyStringNode, Behat\Gherkin\Node\TableNode; use Behat\MinkExtension\Context\MinkContext, OrangeDigital\BusinessSelectorExtension\Context\BusinessSelectorContext; class FeatureContext extends BehatContext { public function __construct(array $parameters) { $this->useContext('mink', new MinkContext($parameters)); $this->useContext('BusinessSelectors', new BusinessSelectorContext($parameters)); } }
安装:示例
通过将 'example/www' 中的 html 文件移动到本地 web 服务器的根目录或创建一个指向 'example/www' 的 vhost 来安装提供的示例。
编辑 'example/behat.yml' 中的 'base_url' 以指向上面的 Web 根 URL。
运行 ../bin/behat
##Business Selectors 提供的步骤
以下是业务选择器扩展提供的步骤列表。括号内的值表示任意业务友好的名称,这些名称应与相关配置文件(在 behat.yml 中通过 'urlFilePath' 和 'selectorFilePath' 指定)中的 CSS 选择器匹配。有关详细信息,请参阅提供的示例实现。
以下 URL 应放置在 behat.yml 中通过参数 "urlFilePath" 指定的 URLS 文件中
Given I go to the page "<PAGE NAME>"
Given I attach "<FILE NAME> to <IMAGE INPUT>"
注意:这要求将 assetPath 配置为包含您的资源的相对目录(例如,assetPath: assets/)。文件名必须包含与文件关联的扩展名(例如,example.jpeg)。
以下所有CSS选择器应放置在behat.yml中通过参数"selectorFilePath"指定的CSS选择器文件中
When I follow the link "<LINK>"
When I click the "<CLICKABLE ELEMENT>"
When I press the "<BUTTON>" button
When I fill in the "<TEXT INPUT>" field with "value"
When the "<TEXT INPUT>" form field should not contain "value"
When I select "value" from the "<SELECT OR MULTISELECT>" selector
When I additionally select "value" from the "<MULTISELECT>" selector
When I check the "<CHECKBOX>" checkbox
When I uncheck the "<CHECKBOX>" checkbox
When I focus on the "<IFRAME (RELATES TO ID OR INDEX)>" iframe
注意:上述步骤是唯一一个选择器必须是ID的步骤。如果iframe没有ID,您可以提供iframe的索引,其中0代表第一个iframe,1代表第二个等。这个示例可以在example/features/example.feature中找到
When I refocus on the primary page
When I hover over "<PAGE ELEMENT>"
When I wait for the "<PAGE ELEMENT>" component to [dis]appear
Then the "<PAGE ELEMENT>" should contain "value"
Then the "<PAGE ELEMENT>" should not contain "value"
Then I should see "<PAGE ELEMENT>" component
Then I should not see "<PAGE ELEMENT>" component
Then "<PAGE ELEMENT>" should contain "<PAGE ELEMENT>"
Then "<PAGE ELEMENT>" should not contain "<PAGE ELEMENT>"
Then the "<CHECKBOX>" should be checked
Then the "<CHECKBOX>" should not be checked
Then the "<TEXT INPUT>" form field should contain "value"