Проблема транспортира: W / element - для локатора найдено более одного элемента. По (css selector, button [class * = 'btn-info']) - будет использован первый результат

Question

ШАГИ :

1. Перейдите к https://qaclickacademy.github.io/protocommerce/shop
2. Нажмите «Магазин»
3. Выберите некоторые мобильные бренды и добавьте в корзину
4. Нажмите кнопку «Оформить заказ»
5. Извлеките общие значения каждого мобильного телефона и распечатайте

Проблема : Я использую под локатором, чтобы нажать кнопку Добавить [element.all (by. css ("button [class * = 'btn-info']")). click ()]

Но похоже, что все Кнопки добавления имеют одинаковый код. И по умолчанию первая кнопка «Добавить» нажимается несколько раз, и один и тот же мобильный телефон добавляется несколько раз.

Кто-нибудь может мне помочь с этим?

КОД МОЙ ПРОТРАКТОРА :

    describe('Assignment',function(){
        function Shopping(MobileBrand){
            //Use tag name locator when only tag name is present
            element.all(by.tagName("app-card")).each(function(value){

                //when single h4 and single a tag use them directly no need to give attribute='value'
    
                value.element(by.css("h4 a")).getText().then(function(name){
                    if(name==MobileBrand)
                    {
                        console.log("Mobile Name Retrieved" +name);
                        console.log("Mobile Name Provided" +MobileBrand);
                        //Click on Add button
                        element.all(by.css("button[class*='btn-info']")).click().then(function(){
                            browser.sleep(5000);
                        });
                    }
                })
            })
        }

        it('Task',function(){
            browser.driver.manage().window().maximize();
            browser.get("https://qaclickacademy.github.io/protocommerce/");
            element(by.linkText("Shop")).click();
    
            //Pass the mobile brands to be selected
            Shopping("Samsung Note 8");
            Shopping("Nokia Edge");
            Shopping("Blackberry");
    
            element(by.partialLinkText("Checkout")).click().then(function(){
                browser.sleep(5000);
            })
        });
    })  

Answer 1

Вы объявляете elementArrayFinder

element.all(by.css("button[class*='btn-info']")) // <--- .all means many elements

Это означает, что вы ожидаете, что на странице будет несколько элементов. Поэтому вам нужно проинструктировать транспортир, какой из них вы хотите использовать. Для этой цели вы можете использовать .get () метод

Таким образом, если вы сделаете

element.all(by.css("button[class*='btn-info']")).get(0).click();

Скрипт щелкнет по первому элементу этого локатора. Точно так же вы можете указать, что нужно щелкнуть второй (.get(1)), третий (.get(2)) элементы et c

Другой вариант - объявить функцию, которая будет возвращать элемент по тексту

let buyPhoneButton = function (name) {
  return element(by.xpath("//a[text()=" + name + "]/ancestor::app-card//button"))
}

а затем используйте

buyPhoneButton("iphone X").click()

Если помогло, примите ответ