独特的 xpath 结合了两个属性

Posted 2023-03-23

【中文标题】独特的 xpath 结合了两个属性

【英文标题】：unique xpath combined two attributes

【发布时间】：2021-12-23 19:52:50

【问题描述】：

我如何制作唯一的 xpath 让机器人定位到第二个字段？

我用过这个但是失败了：

Click     //div[contains(@class,'ant-select SearchPrompter_advInput__3P9Jf ant-select-multiple ant-select-allow-clear ant-select-show-search') and contains(text(),'Select Source(s)')]

第一个字段：

<div class="ant-select SearchPrompter_advInput__3P9Jf ant-select-multiple ant-select-allow-clear ant-select-show-search">
    <div class="ant-select-selector">
        <div class="ant-select-selection-overflow">
            <div class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix" style="opacity: 1;">
                <div class="ant-select-selection-search" style="width: 3px;">
                    <input autocomplete="off" type="search" class="ant-select-selection-search-input" role="combobox" aria-haspopup="listbox" aria-owns="rc_select_9_list" aria-autocomplete="list" aria-controls="rc_select_9_list" aria-activedescendant="rc_select_9_list_7" value="" id="rc_select_9" style="opacity: 0;" aria-expanded="false" readonly="" unselectable="on">
                        <span class="ant-select-selection-search-mirror" aria-hidden="true">&nbsp;</span>
                    </div>
                </div>
            </div>
            <span class="ant-select-selection-placeholder">attribute(s)</span>
        </div>
    </div>

第二个字段：

<div class="ant-select SearchPrompter_advInput__3P9Jf ant-select-multiple ant-select-allow-clear ant-select-show-search">
    <div class="ant-select-selector">
        <div class="ant-select-selection-overflow">
            <div class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix" style="opacity: 1;">
                <div class="ant-select-selection-search" style="width: 3px;">
                    <input autocomplete="off" type="search" class="ant-select-selection-search-input" role="combobox" aria-haspopup="listbox" aria-owns="rc_select_10_list" aria-autocomplete="list" aria-controls="rc_select_10_list" aria-activedescendant="rc_select_10_list_0" value="" id="rc_select_10" style="opacity: 0;" aria-expanded="false" readonly="" unselectable="on">
                        <span class="ant-select-selection-search-mirror" aria-hidden="true">&nbsp;</span>
                    </div>
                </div>
            </div>
            <span class="ant-select-selection-placeholder">Select Source(s)</span>
        </div>
    </div>

这个 xpath 有效（当我在 chrome 开发者控制台测试时，它被检测到）但是当机器人执行脚本时，它并没有真正点击进入该字段。下拉列表不显示。

Click     //div[@class="ant-select SearchPrompter_advInput__3P9Jf ant-select-multiple ant-select-allow-clear ant-select-show-search"]

错误：

    FAIL
Message:    TimeoutError: locator.click: Timeout 10000ms exceeded.
=========================== logs ===========================
waiting for selector "//span[contains(@class,'ant-select-selection-placeholder') and contains(text(),'Select Source(s)')] >> nth=0"
  selector resolved to hidden <span class="ant-select-selection-placeholder">Select Source(s)</span>
attempting click action
  waiting for element to be visible, enabled and stable
    element is not stable - waiting...
  element is visible, enabled and stable
  scrolling into view if needed
  done scrolling
  checking that element receives pointer events at (1080.4,304.7)
  <div class="ant-select-selection-overflow">…</div> intercepts pointer events
retrying click action, attempt #1
  waiting for element to be visible, enabled and stable
  element is visible, enabled and stable
  scrolling into view if needed
  done scrolling
  checking that element receives pointer events at (1080.4,304.7)
    [ Message content over the limit has been removed. ]
  element is visible, enabled and stable
  scrolling into view if needed
  done scrolling
  checking that element receives pointer events at (1080.4,304.7)
  <div class="ant-select-selection-overflow">…</div> intercepts pointer events

【参考方案1】：

您离选择 uniq div

的解决方案不远了

文本等于：

//div[contains(@class,'ant-select SearchPrompter_advInput__3P9Jf ant-select-multiple ant-select-allow-clear ant-select-show-search') and .//span[text()='Select Source(s)']]

如果您希望表达式包含：

//div[contains(@class,'ant-select SearchPrompter_advInput__3P9Jf ant-select-multiple ant-select-allow-clear ant-select-show-search') and .//span[contains(.,'Select Source(s)')]]

【讨论】：

谢谢。我在重建 xpath 方面面临挑战。请推荐任何自学的好文档。

你可以从scrapingbee.com/blog/practical-xpath-for-web-scraping开始

【参考方案2】：

你可以根据你的最佳匹配给出一个索引

(//*[@class='ant-select SearchPrompter_advInput__3P9Jf ant-select-multiple ant-select-allow-clear ant-select-show-search'])[2]

【参考方案3】：

尝试在xpath中使用span标签和parent关键字来找到需要的div标签元素。

根据 html 代码，Xpath 应该是这样的。

//span[contains(text(),'Select Source')]/parent::div/parent::div/parent::div