如果UI上存在多個數據組件並且我們需要在內部元素中查找,我們如何使這些字段自動化


2

我剛接觸硒。以下是一些信息。有人可以指導我創建xpath嗎,這是我們用來維護UI元素唯一性的方法,因此對於此代碼,Selenium將幫助實現字段的自動化。

所有具有自定義屬性(稱為數據組件)的常規組件和容器。因此其父元素將包含-... data-component = "text-input"或... data-component="wc-card"

我的代碼將如下所示

<div data-component="wc-dialog">
<div data-component="text-input" name="wcName"></div>
<div data-component="text-input" name="wcCode"></div>
<div data-component="text-input" name="wcDescription"></div>
<div data-component="button-input" name="add-wc"></div>
</div>
2

If you observe below code

<div data-component="text-input" name="wcName"></div>
<div data-component="text-input" name="wcCode"></div>
<div data-component="text-input" name="wcDescription"></div>
<div data-component="button-input" name="add-wc"></div>

The name attribute is different in all 4 so you can locate using name. Refer below cssSelector code

div[name='wcDescription']

Or suppose these 4 remain common but parent i.e <div data-component="wc-dialog"> id different e.g.

<div data-component="wc-dialog">
    <div data-component="text-input" name="wcName"></div>
    <div data-component="text-input" name="wcCode"></div>
    <div data-component="text-input" name="wcDescription"></div>
    <div data-component="button-input" name="add-wc"></div>
</div>

<div data-component="wc-card">
    <div data-component="text-input" name="wcName"></div>
    <div data-component="text-input" name="wcCode"></div>
    <div data-component="text-input" name="wcDescription"></div>
    <div data-component="button-input" name="add-wc"></div>
</div>

Then pick the parent data-component attribute and locate e.g.

div[data-component='wc-card']>div[name='wcDescription']

Obviously you have some other elements (input, checkbox, button etc) within these div. e.g there is a input box within <div data-component="text-input" name="wcDescription"> the used below code to locate

div[data-component='wc-card']>div[name='wcDescription'] input

0

As long as the name, id, value, class attributes' values are different, you can easily pick them as unique identifier to automate the fields. No need to worry for them.

Confusions may arise when all available attributes for multiple data fields are exact same, but then again there is way around to solve this too!

That time you may choose to pick xpath as an option, though not encouraged! Choosing xpath option to automate should always be remain as second choice if there is alternative! Because automating with xpath has overhead compared to others.