如何读取元素值和点击时间量

Question

所以我目前正在阅读元素，情况可能是它在标签上写着示例：

<div class="stock-controller" style="transition: border-bottom 0.3s ease 0s, opacity 0.3s ease 0s;">
    <div class="message">
        <svg width="14" height="14" viewBox="0 0 14 14">
            <g fill="none" fill-rule="evenodd">
                <path fill="#E00751" d="M14 7A7 7 0 1 1 0 7a7 7 0 0 1 14 0z"></path>
                <path fill="#FFF" fill-rule="nonzero" d="M8.45 7.036L10.414 9 9 10.414 7.036 8.45 5.07 10.414 3.657 9l1.964-1.964L3.5 4.914 4.914 3.5l2.122 2.121L9.156 3.5l1.415 1.414L8.45 7.036z"></path>
            </g>
        </svg>Sorry, we only have 10000 of this product.</div> //Need to read here how many avaliable products
    <div class="quantity-input invalid">
        <button class="btn left" aria-label="Decrease"> //How many user have choose - how many in stock = amout of click time.
            <svg class="svg-icon" viewBox="0 0 24 24">
                <path fill-rule="evenodd" d="M7 11h10v2H7z"></path>
            </svg>
        </button>
        <input type="number" pattern="[0-9]*" min="0" max="10002" value="10002"> //Need to read how many we have choose
        <button class="btn right" aria-label="Increase" disabled="">
            <svg class="svg-icon" viewBox="0 0 24 24">
                <path fill-rule="evenodd" d="M13 17v-4h4v-2h-4V7h-2v4H7v2h4v4z"></path>
            </svg>
        </button>
    </div>
</div>

基本上我们有 3 个标签可以在这里查看。第一个是检查文本以查看有多少产品有库存，在本例中为 10000。然后我们必须检查用户选择了多少商品，即 10002。因此我们需要使用 10002- 10000 = Click <button class="btn left" aria-label="Decrease">

上有这么多项目

到目前为止我所做的是：

it('Check descrease button', function (done) {

    let allBtns = element.all(by.className('stock-controller'));

    element.all(by.className('stock-controller')).each(function (element, index) {
        // Will print  Sorry, we only have 4 of this product., Sorry, we only have 10000 of this product.
        element.getText().then(function (text) {
            console.log(index, text);
        });
    });

    allBtns.count()
        .then(function (countElement) {

            console.log('Find decrease buttons: ', countElement)

            //for (let i = 0; i < countElement; i++) { // let variables are scoped to the immediate enclosing block denoted by { }
                //browser.executeScript("arguments[0].click();", allBtns.get(i).getWebElement())
                //browser.sleep(1000) // sleep 1s
              //}
        })
        .then(() => {
            done();
        })

});

另一个问题是它可以超过1个stock-controller。所以这意味着它可以是 5 个库存控制器，但它们都具有相同的元素，但库存产品和用户选择的产品不同。

所以我的问题是：

我如何才能读取有多少库存控制器，然后检查我需要为每个库存控制器单击多少次减少按钮？

有效代码：

it('Clicked all decrease button', function (done) {

    let allProds = element.all(by.css('div.stock-controller'));

    allProds.count()
    .then(function (cnt) { // amount of products

        for(let index=0;index<cnt;index++) {

            let section = allProds.get(index),

                // message string which include qty in stock
                stock_qty_str = section.element(by.css('div.message')).getText(),
                // user inputed qty 
                user_qty_str = section.element(by.css('input[type="number"]')).getAttribute('value'),
                // button Descrease
                btn_dec = section.element(by.css('button[aria-label="Decrease"]'));

            Promise.all([stock_qty_str, user_qty_str])
                .then(function(data){
                    // use RegExp to extract qty in stock
                    let group = data[0].trim().match(/^Sorry.*?(\d+)/)

                    if(group) {
                        let stock_qty = group[1] * 1,
                            user_qty = data[1].trim() * 1,
                            gap = user_qty - stock_qty; // click times of Decrease button

                        for (let i = 0; i < gap; i++) {
                            browser.executeScript("arguments[0].click();", btn_dec.getWebElement());
                        }
                    }
                })
        }

    })
    .then(()=>{
        done();
    })

});

Answer 1

我不喜欢量角器，但在 java 我会用 xpath 做一个 WebElements 列表，比如 //div[@class='stock-controller']

然后foreach stock-controllers read amount to click and do it.

Pseudocode:
    List stockcontrollers = findby.xpath(//div[@class='stock-controller')
foreach(item in stockcontrollers)
{
get.item
read amount to click
for(x<amount to click)
{click}
}

Answer 2

试试下面的代码，给出内联解释

it('Click remove button', function (done) {

    let allProds = element.all(by.css('div.stock-controller'));

    allProds.count()
    .then(function (cnt) { // amount of products

        for(let index=0;index<cnt;index++) {

            let section = allProds.get(index),

                // message string which include qty in stock
                stock_qty_str = section.element(by.css('div.message')).getText(),
                // user inputed qty 
                user_qty_str = section.element(by.css('div.quantity-input input'))
                                      .getAttribute('value'),
                // button Descrease
                btn_dec = section.element(by.css('button[aria-label="Decrease"]'));

            Promise.all([stock_qty_str, user_qty_str])
                .then(function(data){
                    // use RegExp to extract qty in stock
                    let group = data[0].trim().match(/^Sorry.*?(\d+)/)

                    if(group) {
                        let stock_qty = group[1] * 1,
                            user_qty = data[1].trim() * 1,
                            gap = user_qty - stock_qty; // click times of Decrease button

                        for(let i=0;i<gap;i++) {
                            btn_dec.click();
                            browser.sleep(1000).then(function(){
                                console.log('Click Decrease button: ' + i + '/' + gap)
                            })
                        }
                    }
                })

        }

    })
    .then(()=>{
        done();
    })

});

如何读取元素值和点击时间量

How to read elements values and click amout of time

javascript

selenium

mocha.js

chai

protractor