I’ve run into similar issues with booking platforms before—they often use dynamic content, iframes, or tricky DOM structures that throw off locators. Let’s break down the most likely causes and actionable fixes to get that button working:

• Check if the button lives inside an iframe
  Many booking sites load their checkout widgets in embedded iframes. Right-click the visible booking button, select "Inspect," and scan the DOM hierarchy to see if it’s nested inside an <iframe> tag. If it is, you’ll need to switch to that iframe first before targeting the element:

  # Replace with the actual iframe selector (use id, name, or XPath if needed)
  browser.frame(id: 'checkout-frame').switch_to
  # Now try locating the button again
  browser.button(class: 'btnJumpToCheckOut').click
  

• Add explicit waits for dynamic content
  Hotel pages often load content asynchronously—if you’re trying to click the button right after navigating to the page, it might not exist in the DOM yet. Use Watir’s wait methods to let the element become present and interactable:

  require 'watir-webdriver/wait'
  # Wait up to 10 seconds for the button to load and be clickable
  browser.button(class: 'btnJumpToCheckOut').wait_until(&:present?).wait_until(&:enabled?).click
  

• Validate your locators with browser dev tools
  Your XPath might be incorrect, or the class name could be dynamic (some sites generate random suffixes for classes). Here’s how to get a reliable locator:

  1. Right-click the button > Inspect
  2. In the Elements tab, right-click the button element > Copy > Copy XPath (or Copy full XPath)
  3. Test the XPath in your browser’s console to confirm it finds the element:

     document.evaluate('your-copied-xpath', document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue
     

  If it returns the button element, plug that XPath into your code:

  browser.button(xpath: '//your/copied/xpath').click
  

• Check for hidden or overlapped elements
  Sometimes the button exists in the DOM but is hidden (via display: none or visibility: hidden CSS) or blocked by an overlay (like a loading spinner or cookie popup). Use the "Computed" tab in dev tools to check the element’s visibility properties. If there’s an overlay, add code to close it or wait for it to disappear first.

• Try alternative locator strategies
  If class and XPath aren’t working, experiment with other attributes:

  # Target by button text (adjust to match the actual text on your button)
  browser.button(text: 'Book Now').click
  # Target by custom data attributes (if the button has them, e.g., data-action)
  browser.button(data_action: 'jump-to-checkout').click
  

内容的提问来源于stack exchange，提问作者Boikot