Getting href when there is no id for the tag

Ui.Vision HowTo
1

I would like to set up tests for a web site created with a page designer tool. I have some, but by no means complete, control over where attributes appear in a page. In particular, I would like a test to find an element with a certain id; check that the text of that element is correct; and check that the link for that element is correct. I want to log the result of each test—test passed or test failed.

Here is a snippet of the code I want to test:

<div class="elementor-element elementor-element-mzigegu elementor-widget elementor-widget-heading" data-id="mzigegu" data-element_type="widget" id="syllabus" data-widget_type="heading.default">
	<div class="elementor-widget-container">
		<h5 class="elementor-heading-title elementor-size-medium">
			<a href="/syllabus-kanban-foundation-training-knowledge-work/" target="_blank">Course syllabus</a>
		</h5>
	</div>
</div>

My issue is as follows. I am able to use the storeText command to get the displayed text for a given id (in the above case, id=“syllabus”). However, the storeAttribute command is unable to find the href associated with that id. Unlike the storeText command, which apparently looks at all the embedded tags to find text, storeAttribute apparently does not look far enough to find the href. So, my question is how to find the href value in the above example and store it in a variable.

2

This is the solution i used external tools to detect this xpath

Macro code:

{
“Name”: “storeattribute”,
“CreationDate”: “2021-4-5”,
“Commands”: [
{
“Command”: “storeAttribute”,
“Target”: “xpath=(//h5[@class=‘elementor-heading-title elementor-size-medium’]//a[1])@href”,
“Value”: “attribute”
},
{
“Command”: “echo”,
“Target”: “${attribute}”,
“Value”: “#shownotification”
}
]
}

Log

  • [status]

Playing macro storeattribute

  • [info]

Executing: | storeAttribute | xpath=(//h5[@class=‘elementor-heading-title elementor-size-medium’]//a[1])@href | attribute |

  • [info]

Executing: | echo | ${attribute} | #shownotification |

  • [echo]

/syllabus-kanban-foundation-training-knowledge-work/

  • [info]

Macro completed (Runtime 0.87s)

3

Thanks very much for that. I understand how this suggestion will work, but only if it is unique on the page. As it turns out, I have three such elements, each of which I want to test:

<div class="elementor-element elementor-element-mzigegu elementor-widget elementor-widget-heading" data-id="mzigegu" data-element_type="widget" id="syllabus" data-widget_type="heading.default">
	<div class="elementor-widget-container">
		<h5 class="elementor-heading-title elementor-size-medium">
			<a href="/syllabus-kanban-foundation-training-knowledge-work/" target="_blank">Course syllabus</a>
		</h5>
	</div>
</div>
<div class="elementor-element elementor-element-anotherdataid elementor-widget elementor-widget-heading" data-id="anotherdataid" data-element_type="widget" id="requirements" data-widget_type="heading.default">
	<div class="elementor-widget-container">
		<h5 class="elementor-heading-title elementor-size-medium">
			<a href="/requirements/" target="_blank">Requirements</a>
		</h5>
	</div>
</div>

<div class="elementor-element elementor-element-somethingelse elementor-widget elementor-widget-heading" data-id="something_else" data-element_type="widget" id="something_else" data-widget_type="heading.default">
	<div class="elementor-widget-container">
		<h5 class="elementor-heading-title elementor-size-medium">
			<a href="/something_else/" target="_blank">Something else</a>
		</h5>
	</div>
</div>

This is why I tried to get a unique id involved in the detection. It would be perfect if my page designer allowed me to add an id attribute to the <a> tag. Unfortunately, I cannot.

4

This macro code can be used for unlimited attribute (you can check in real time the numbers of attributes too everytime)

This store 3 attributes but you can store unlimited attributes

{
“Name”: “StoreAttribute”,
“CreationDate”: “2021-4-6”,
“Commands”: [
{
“Command”: “storeAttribute”,
“Target”: “xpath=(//h5[@class=‘elementor-heading-title elementor-size-medium’]//a)[1]@href”,
“Value”: “Var1”
},
{
“Command”: “storeAttribute”,
“Target”: “xpath=(//h5[@class=‘elementor-heading-title elementor-size-medium’]//a)[2]@href”,
“Value”: “Var2”
},
{
“Command”: “storeAttribute”,
“Target”: “xpath=(//h5[@class=‘elementor-heading-title elementor-size-medium’]//a)[3]@href”,
“Value”: “Var3”
},
{
“Command”: “echo”,
“Target”: “Attrbutes Stored Are:\n\n${Var1}\n\n${Var2}\n\n${Var3}\n\n”,
“Value”: “#shownotification”
}
]
}

Log

[status]

Playing macro StoreAttribute

[info]

Executing:  | storeAttribute | xpath=(//h5[@class='elementor-heading-title elementor-size-medium']//a)[1]@href | Var1 | 

[info]

Executing:  | storeAttribute | xpath=(//h5[@class='elementor-heading-title elementor-size-medium']//a)[2]@href | Var2 | 

[info]

Executing:  | storeAttribute | xpath=(//h5[@class='elementor-heading-title elementor-size-medium']//a)[3]@href | Var3 | 

[info]

Executing:  | echo | Attrbutes Stored Are:\n\n${Var1}\n\n${Var2}\n\n${Var3}\n\n | #shownotification | 

[echo]

Attrbutes Stored Are:

/syllabus-kanban-foundation-training-knowledge-work/

/requirements/

/something_else/

[info]

Macro completed (Runtime 1.56s)
1 Like
5

Thanks very, very much. That snippet does what I need. It’s a much more labor intensive approach than one depending on unique ids. A change to the page could potentially require the test to be rewritten.

1 Like