HTML code:
<div class="card-body">
<div class="row align-items-center mb-4">
<div class="col">
<h1>Data and Tools</h1>
</div>
</div>
<a href="/reports">
<div class="row my-4 align-items-center clickable">
<div class="col my-3">
<span class="semi-bold">Reports</span>
<div class="stamp-md">
Create, run and schedule reports.
</div>
</div>
<div class="col-1 text-right">
<i class="fas fa-chevron-right gray-light small"></i>
</div>
</div>
</a>
<hr class="inner-divider">
Ruby code:
wait.until { #browser_def.find_element(css: ".card-body > a")}.attribute("href").text("Reports").click()
How can I click link which stands for 'Reports'?
I have found the correct answer for it:
wait.until { #browser_def.find_elements(css: 'a[href$="/reports"] div.clickable').first}.click()
Related
I have a hard time testing our hybrid app with Robotframework tests using appium library. The application has 2 contexts:
Native (android)
Web (Angular)
The problem that I Have is when I'm in the web context and I'm trying to use XPath locators to locate elements that contain some text using the expression: Click Element //*[contains(#text,some_containing_text)] I would have the result of the root element which contains the element that I'm trying to locate. So in the end my test is clicking all the wrong way then it should be clicking because of that locator returning the root element of the HTML page.
This functionality of locating elements by just saying "Click element that contains something like this" is working with the selenium library on our Web application. But my question is why (or what I'm doing wrong) it doesn't work with appium Robotframework library.
Using appium 1.6.3.
I'm searching for span with the text Ukončit
<app-attendance-detail class="ng-star-inserted">
<div class="py-4">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="mb-4">
<div class="row">
<div class="col-12"><h4 class="fs-14 mb-1 font-weight-bold">úterý, 09:56:00 26.07.2022</h4>
</div>
</div>
<h4 class="fs-14 fs-md-16 mb-4 font-weight-bold text-gray-light ng-star-inserted">
<span>Začátek dnešní směny od</span> dnes v 9:45 </h4>
<div class="e-timer text-gray ng-star-inserted">00:10h</div>
<a href="#" title="#" preventdefault=""
class="btn btn-primary w-100 text-uppercase font-weight-bold px-9 mt-6 ng-star-inserted"><i
class="icon icon-stop position-relative bottom-1 mr-1"></i><span translate=""
ng-reflect-translate="">Ukončit</span></a>
<div class="row row-xs mt-2 ng-star-inserted">
<div class="col-6 px-1"><a href="#" title="#" preventdefault=""
class="btn btn-white border-primary-dark text-primary w-100 text-uppercase font-weight-bold px-9"><i
class="icon icon-pause position-relative bottom-1 mr-1"></i><span>Začátek<br>přestávky</span></a>
</div>
<div class="col-6 px-1"><a href="#" title="#" preventdefault=""
class="btn btn-white border-primary-dark text-primary w-100 text-uppercase font-weight-bold px-9"><span>Odchod<br>jiné</span></a>
</div>
</div>
</div>
<div class="mt-4"><h4 translate="" class="fs-14 fs-md-16 mb-2 font-weight-bold"
ng-reflect-translate="">Docházka</h4><a title="#" target="_blank"
class="d-block bg-white px-3 border-radius-sm box-shadow-sm mb-2 text-gray ng-star-inserted"
href="https://h5tws.cezdata.corp:44320/sap/bc/bsp/sap/zjd_dovol/overview.htm">
<div class="row">
<div class="col py-3 pb-3">
<div translate="" class="fs-16 font-weight-bold text-uppercase" ng-reflect-translate="">
Žádost o dovolenou
</div>
</div>
<div
class="col col-xs py-2 text-center border-left border-gray-light d-flex align-items-center justify-content-center">
<div class="text-gray"><i class="icon icon-forward"></i></div>
</div>
</div>
</a><a title="#" target="_blank"
class="d-block bg-white px-3 border-radius-sm box-shadow-sm mb-2 text-gray ng-star-inserted"
href="https://h5tws.cezdata.corp:44320/sap/bc/bsp/sap/zjd_doli/selection_screen.htm">
<div class="row">
<div class="col py-3 pb-3">
<div translate="" class="fs-16 font-weight-bold text-uppercase" ng-reflect-translate="">
Docházkový list
</div>
</div>
<div
class="col col-xs py-2 text-center border-left border-gray-light d-flex align-items-center justify-content-center">
<div class="text-gray"><i class="icon icon-forward"></i></div>
</div>
</div>
</a></div>
<div class="mt-4"><h4 translate="" class="fs-14 fs-md-16 mb-2 font-weight-bold"
ng-reflect-translate="">Záznamy</h4><a routinglink="attendance/records"
href="#" title="#"
class="d-block bg-white px-3 border-radius-sm box-shadow-sm mb-2 text-gray"
ng-reflect-routing-link="attendance/records">
<div class="row">
<div class="col py-3 pb-3">
<div translate="" class="fs-16 font-weight-bold text-uppercase" ng-reflect-translate="">
Přehled záznamů
</div>
</div>
<div
class="col col-xs py-2 text-center border-left border-gray-light d-flex align-items-center justify-content-center">
<div class="text-gray"><i class="icon icon-forward"></i></div>
</div>
</div>
</a></div>
</div>
</div>
</div>
<app-modal-dialog styleclass="shadow" ng-reflect-style-class="shadow" ng-reflect-show-header="false"
ng-reflect-dismissable-mask="false" ng-reflect-dialog-id="4">
<p-dialog class="p-element ng-tns-c30-7 ng-star-inserted" ng-reflect-style-class="shadow"
ng-reflect-visible="false" ng-reflect-modal="true" ng-reflect-dismissable-mask="false"
ng-reflect-transition-options="0ms" ng-reflect-show-header="false" ng-reflect-draggable="true"
ng-reflect-resizable="true" ng-reflect-close-on-escape="true" ng-reflect-base-z-index="1050">
</p-dialog>
</app-modal-dialog>
<app-modal-dialog styleclass="shadow" ng-reflect-style-class="shadow" ng-reflect-show-header="false"
ng-reflect-dialog-id="5" ng-reflect-dismissable-mask="false">
<p-dialog class="p-element ng-tns-c30-8 ng-star-inserted" ng-reflect-style-class="shadow"
ng-reflect-visible="false" ng-reflect-modal="true" ng-reflect-dismissable-mask="false"
ng-reflect-transition-options="0ms" ng-reflect-show-header="false" ng-reflect-draggable="true"
ng-reflect-resizable="true" ng-reflect-close-on-escape="true" ng-reflect-base-z-index="1050">
</p-dialog>
</app-modal-dialog>
</div>
This is the keyword in Robot testcase
Attendance_action
[Arguments] ${action}
Click element //*[contains(#text, "${action}")]
Sleep 2s
Thanks for updating the question to include the details of how the XPath is called. It seems to me that you will end up with an expression like //*[contains(#text, "Ukončit")]; I would not expect that to return anything because the expression #text is a refererence to an attribute with the name text. It's not a reference to the textual content of an element.
I suspect what you actually meant to enter was an expression like this:
//*[text()[contains(., "Ukončit")]]
Translation: any element which contains a text node which itself contains the string "Ukončit". That should return a single span element:
<span translate="" ng-reflect-translate="">Ukončit</span>
I have a Spring Boot application and want to display the exception on the error page.
I put the error.html page in the template directory and I can see the change, but the exception variable keeps coming back as null. I can see all the other data like message and stacktrace.
I took this from several examples. What is missing?
Thymeleaf
<div class="row rowDesign">
<div class="col-md-4 ml-auto">
<span class="legend">Date</span>
</div>
<div class="col-md-8">
<span th:text="${timestamp}"></span>
</div>
</div>
<div class="row rowDesign">
<div class="col-md-4 ml-auto">
<span class="legend">Error</span>
</div>
<div class="col-md-8">
<span th:text="${error}"></span>
</div>
</div>
<div class="row rowDesign">
<div class="col-md-4 ml-auto">
<span class="legend">Status</span>
</div>
<div class="col-md-8">
<span th:text="${status}"></span>
</div>
</div>
<div class="row rowDesign">
<div class="col-md-4 ml-auto">
<span class="legend">Message</span>
</div>
<div class="col-md-8">
<span th:text="${message}"></span>
</div>
</div>
<div class="row rowDesign">
<div class="col-md-4 ml-auto">
<span class="legend">Exception</span>
</div>
<div class="col-md-8">
<span th:text="${exception}"></span>
</div>
</div>
<div class="row rowDesign">
<div class="col-md-4 ml-auto">
<span class="legend">Trace</span>
</div>
<div class="col-md-8">
<span th:text="${trace}"></span>
</div>
</div>
Add this to your application.properties:
server.error.include-exception=true
server.error.include-stacktrace=always
These properties are not enabled by default (See https://docs.spring.io/spring-boot/docs/current/reference/html/appendix-application-properties.html)
So, i have a timeline section that has a different html structure in first row and the other row that has a left side and right side view. the odd side would be on the left and the right side would be on the right. however when i using $loop->first, there is no error at all. but when i use $loop->even or $loop->odd it shows an error like:
Undefined property: stdClass::$even
or
Undefined property: stdClass::$odd
this is the blade view :
#if($loop->first)
<div class="row align-items-center how-it-works d-flex">
<div class="col-2 text-center bottom d-inline-flex justify-content-center align-items-center">
<div class="circle font-weight-bold">{!! $tl->id !!}</div>
</div>
<div class="col-6">
<h5>{!! $tl->company !!}</h5>
<p>{!! $tl->description !!}</p>
</div>
</div>
<!--path between 1-2-->
<div class="row timeline">
<div class="col-2">
<div class="corner top-right"></div>
</div>
<div class="col-8">
<hr/>
</div>
<div class="col-2">
<div class="corner left-bottom"></div>
</div>
</div>
#elseif($loop->even)
<!--second section-->
<div class="row align-items-center justify-content-end how-it-works d-flex">
<div class="col-6 text-right">
<h5>{!! $tl->company !!}</h5>
<p>{!! $tl->description !!}</p>
</div>
<div class="col-2 text-center full d-inline-flex justify-content-center align-items-center">
<div class="circle font-weight-bold">{!! $tl->id !!}</div>
</div>
</div>
<!--path between 2-3-->
<div class="row timeline">
<div class="col-2">
<div class="corner right-bottom"></div>
</div>
<div class="col-8">
<hr/>
</div>
<div class="col-2">
<div class="corner top-left"></div>
</div>
</div>
#elseif($loop->iteration % 2 != 0)
<div class="row align-items-center how-it-works d-flex">
<div class="col-2 text-center bottoms d-inline-flex justify-content-center align-items-center">
<div class="circle font-weight-bold">{!! $tl->id !!}</div>
</div>
<div class="col-6">
<h5>{!! $tl->company !!}</h5>
<p>{!! $tl->description !!}</p>
</div>
</div>
<!--path between 1-2-->
<div class="row timeline">
<div class="col-2">
<div class="corner top-right"></div>
</div>
<div class="col-8">
<hr/>
</div>
<div class="col-2">
<div class="corner left-bottom"></div>
</div>
</div>
#elseif($loop->last)
<div class="row align-items-center how-it-works d-flex">
<div class="col-2 text-center top d-inline-flex justify-content-center align-items-center">
<div class="circle font-weight-bold">{!! $tl->id !!}</div>
</div>
<div class="col-6">
<h5>{!! $tl->company !!}</h5>
<p>{!! $tl->description !!}</p>
</div>
</div>
#endif
#endforeach
This is the controller :
public function index()
{
$desc = Home::first();
$users = User::first();
$site = Site::first();
$timeline = Timeline::get();
$services = Services::get();
$port = Portfolio::get();
$cat = DB::Table("cat_port")->get();
$news = DB::table('news')->join('category', 'category.name', '=', 'news.category')->selectRaw('news.*, category.*, category.url as curl, news.created_at as created')->orderBy('created', 'DESC')->get()->take(3);
return view('home', ['desc' => $desc, 'timeline' => $timeline, 'users' => $users, 'services' => $services, 'port' => $port, 'cat' => $cat, 'news' => $news, 'site' => $site, 'isHome' => true]);
}
i can use the $loop->iteration, but it seems that if i use that, there would be a problem for the last row because when i use it, the script inside $loop->last won't appear. Can someone explain me how to solve this issue ?
odd and even properties are only available in laravel 5.8:
https://laravel.com/docs/5.7/blade#the-loop-variable
https://laravel.com/docs/5.8/blade#the-loop-variable
Maybe an upgrade is gonna help.
I have this model that I have multiple instances of it in a list. I want to pass this to my UI and have the UI figure out how to draw this.
data class InfoModel(val icon: String, val title: String, val text: String {
}
The controller.
#GetMapping("/index")
fun start(model: Model): String {
val list = getList()
model ["list"] = list
return "index"
}
Now in the UI I would like this to be duplicated but I don't know how.
<div class="row">
<div class="col-md-6 col-lg-3 d-flex align-self-stretch ftco-animate">
<div class="media block-6 services d-block text-center">
<div class="d-flex justify-content-center"><div class="icon color-1 d-flex justify-content-center mb-3"><span class="align-self-center icon-layers"></span></div></div>
<div class="media-body p-2">
<h3 class="heading">Title</h3>
<p>Text here.</p>
</div>
</div>
</div>
</div>
What I tried and it doesn't display anything.
{{#list}}
<div class="col-md-6 col-lg-3 d-flex align-self-stretch ftco-animate">
<div class="media block-6 services d-block text-center">
<div class="d-flex justify-content-center">
<div class="icon color-1 d-flex justify-content-center mb-3"><span
class="align-self-center icon-{{icon}}"></span></div>
</div>
<div class="media-body p-2">
<h3 class="heading">{{title}}</h3>
<p>{{text}}</p>
</div>
</div>
</div>
{{/list}}
Big thanks to JBNizet for helping me through this. (You should post the answer, you did all the hard work).
{{#list}}
<div class="col-md-6 col-lg-3 d-flex align-self-stretch ftco-animate">
<div class="media block-6 services d-block text-center">
<div class="d-flex justify-content-center">
<div class="icon color-1 d-flex justify-content-center mb-3"><span
class="align-self-center icon-{{icon}}"></span></div>
</div>
<div class="media-body p-2">
<h3 class="heading">{{title}}</h3>
<p>{{text}}</p>
</div>
</div>
</div>
{{/list}}
Reference:
https://scalate.github.io/scalate/documentation/mustache.html#Non_Empty_Lists
this might be simple, but I would like to select everything within <div class="rc-box-citations-body"> under the condition that it must belong to <div class="definitionBox" id="meaning-1-1">, thereby uniquely identifying it. How can I do that with xpath? Thanks.
<div class="definitionIndent">
<div class="definitionNumber">1.a</div>
<div class="definitionIndent">
<div class="definitionBox" id="meaning-1-1">
<span class="textmedium">
<span class="stampNoBorder">text</span>
<span class="definition">text</span>
</span>
</div>
<div class="definitionBox">
<div class="rc-box-citations">
<div class="rc-box-citations-top">
<span class="rc-citations-north-west"> </span>
<span class="rc-citations-north-east"> </span>
</div>
<div class="rc-box-citations-body"><span class="citat">text</span> <a class="sourcepop" href="javascript:void(0);"><span class="source">text</span><span class="popup">text</span></a></div>
<div class="rc-box-citations-bot">
<span class="rc-citations-south-west"> </span>
<span class="rc-citations-south-east"> </span>
</div>
</div>
</div>
</div>
</div>
If I modify your xml slightly, and take under the condition that it must belong to to mean that is a descendant of.... then this xpath works
//div[#class='definitionBox'][#id='meaning-1-2']//div[#class='rc-box-citations-body']
The XML is
<?xml version="1.0" encoding="utf-16"?>
<div class="definitionIndent">
<div class="definitionNumber">1.a</div>
<div class="definitionIndent">
<div class="definitionBox" id="meaning-1-1">
<span class="textmedium">
<span class="stampNoBorder">text</span>
<span class="definition">text</span>
</span>
</div>
<div class="definitionBox" id="meaning-1-2">
<div class="rc-box-citations">
<div class="rc-box-citations-top">
<span class="rc-citations-north-west"></span>
<span class="rc-citations-north-east"></span>
</div>
<div class="rc-box-citations-body">
<span class="citation">text</span>
<a class="sourcepop" href="javascript:void(0);">
<span class="source">text</span>
<span class="popup">text</span>
</a>
</div>
<div class="rc-box-citations-bot">
<span class="rc-citations-south-west"></span>
<span class="rc-citations-south-east"></span>
</div>
</div>
</div>
</div>
</div>
The tool I used is XPathVisualizer: