0

I'm trying to select a product from my product list based on its title.

What I want to do is say "If an item from the list has a title that matches "Chicken Breast (200g)" then click the button.

Does anyone know how to write this in protractor?

I'm struggling to work out what is returned at which point, what are promises and what aren't and how to wait until I have a result before doing anything.

The dom structure looks like

<li ng-repeat="item in filteredItems" class="ng-scope">
  <div class="product">
    <h3 class="product-title text-uppercase ng-binding" ng-bind="item.name">Chicken Breast (200g)</h3>
    <div class="pad-top-10">
      <button class="btn btn-default btn-xs" type="button" ng-click="addItem(item)">
        <span class="product-add-label">Add Item</span>
      </button>
    </div>
  </div>
</li>

I've tried this so far:

this.Given(/^I can see "([^"]*)" on the page$/, function (productName, done) {
  element.all(by.repeater('item in filteredItems')).then(function (products) {
    for(var i = 0; i < products.length; i++){
      var title = products[i].element(by.css('.product-title'));
      title.getText().then(function (text) {
        if (text.toLowerCase() === productName.toLowerCase()) {
          console.log(text);
          // products[i] shows as undefined
          console.log(products[i]);
          done();
        }
      })
    }
  });
});
4

2 回答 2

0

This is untestet, but might help:

var search = "Chicken Breast (200g)";
var h3 = element(by.cssContainingText('h3.product-title', search));
var button = h3.element(by.xpath('..')).element(by.css('button'));
button.click();
于 2015-07-16T07:32:48.313 回答
0

After further investigation and some code suggested by phylax, I found that this was the best solution:

this.Given(/^I can see "([^"]*)" on the page$/, function (productName, done) {
  element.all(by.repeater('item in filteredItems')).then(function (products) {
    for (var i = 0; i < products.length; i++) {
      (function () {
        var title = products[i].element(by.css('.product-title'));
        var product = products[i]; 
        title.getText().then(function (text) {
          if (text.toLowerCase() === productName.toLowerCase()) {
            console.log(text);
            console.log(product);
            done();
          }
        })
      })();
    }
  });
});

You can see that i've added a (function(){}()); wrapper so get over the "Mutable variable is accessible from closure" error thrown by Webstorm and I've initialised product within that.

于 2015-07-18T09:50:08.880 回答