Question

我目前有一个网站部分，如下所示：

<form id="product_form" method="POST" action="/cart/add" role="form">
  <div class="row">
    <div class="col-md-6 col-md-offset-3">
      <div>
        <img class="product-image" src="/static/images/products/4388801543.jpg" width="500px" alt="">
      </div>
    </div>
    <div class="col-md-3 product-variants other_options">
      <h1 itemprop="name" class="product-single__title h3 uppercase">Samburu Shorts - Mens</h1>
      <p class="product-single__price product-single__price-product-template">
        <span id="ProductPrice" itemprop="price" content="$55.95">$55.95</span>
      </p>
      <input type="radio" name="variant_id" class="hidden" id="14903870471" value="14903870471" onclick="enableSubmit()"><label for="14903870471" class="option text-center  selector size-value">29x11 Sand-Grey</label>
      <input type="radio" name="variant_id" class="hidden" id="16304664135" value="16304664135" onclick="enableSubmit()"><label for="16304664135" class="option text-center  selector size-value">29x11 Aubergine-Grey</label>
      <input type="radio" name="variant_id" class="hidden" id="16304665799" value="16304665799" onclick="enableSubmit()"><label for="16304665799" class="option text-center  selector size-value">34x7-5 Sand-Grey</label>
      <div class="product-add">
        <button id="add-to-cart" class="addItemToCart btn addToCart-btn product-form__cart-submit" disabled="" type="submit">Add to Cart</button>
      </div>
      <div class="social-sharing">
        <a target="_blank" href="#" class="btn clear btn--share share-facebook" title="Share on Facebook">
        <img src="//cdn.shopify.com/s/files/1/0281/7544/t/59/assets/img_share_fb.png?3517946130637841476">
        <span class="visually-hidden">Share on Facebook</span>
        </a>
        <a target="_blank" href="#" class="btn clear btn--share share-twitter" title="Tweet on Twitter">
        <img src="//cdn.shopify.com/s/files/1/0281/7544/t/59/assets/img_share_twitter.png?3517946130637841476">
        <span class="visually-hidden">Tweet on Twitter</span>
        </a>
        <a target="_blank" href="#" class="btn clear btn--share share-pinterest" title="Pin on Pinterest">
        <img src="//cdn.shopify.com/s/files/1/0281/7544/t/59/assets/img_share_pin.png?3517946130637841476">
        <span class="visually-hidden">Pin on Pinterest</span>
        </a>
      </div>
    </div>
  </div>
</form>

我正在通过NightwatchJS编写测试脚本，试图选择一个单选按钮，以便自动实现用户体验。我写出的代码测试块如下：

'Check that widget loaded on new product page' : function(browser) {
   browser
      .waitForElementVisible('#monsoon-inline-reco-div-ul', longWait, () => {
      })
      .elements('css selector', '#monsoon-inline-reco-div-ul li', (results) => {
         browser.assert.equal(results.value.length, 4);
      })
      .click('#product_form > div > div:nth-child(2) > input[type=radio]')
      .pause(longWait)
      .end();
  }

有问题的行是click命令。在给定CSS选择器的情况下，我不断收到有关脚本如何找不到元素的错误。我已经使用document.querySelector('#product_form > div > div:nth-child(2) > input[type=radio]').click()在浏览器本身的控制台中对此进行了测试，然后单击了单选按钮。可能对我可能做错的事情有一些想法，因为我已经工作了几个小时，并尝试了各种不同的事情。

NightwatchJS无法使用CSS选择器定位元素

0 个答案: