Thymeleaf conditional classappend not working - java

My question is related to this.
I have the following:
<div class="container">
<div class="wrapper">
<div class="arrow-steps clearfix">
<div th:each="caseStep : ${getAppCaseStepList}"
th:class="arbitrary"
th:classappend="${caseStep.casestepname == '${appCaseCurrentStep}'} ? 'step current' : 'step'"
th:text="${caseStep.casestepname}">
</div>
</div>
</div>
</div>
where ${appCaseCurrentStep} is a model attribute (a String) which I am sending through GET in my controller method.
But somehow I am not able to set "step current" class to the element for this condition:
${caseStep.casestepname == '${appCaseCurrentStep}'
I am trying to set/append "step current" where my condition is true (String comparison) . What am I missing here or doing wrong?

Found it here. !
The cause: There should NOT be an additional { inside the expression ${...}.
Solution: The following expression did the trick for me:
<div th:each="caseStep : ${getAppCaseStepList}"
th:class="asdfstep"
th:classappend="${caseStep.casestepname == appCaseCurrentStep} ? 'step current' : 'step'"
th:text="${caseStep.casestepname}"></div>

Related

Make image clickable based on certain condition in Thymeleaf

i am gettting an attribute html "image_clickable_status " , if it is true , i need to make the image clickable and if it is false the image should not be clickable. Below is what i am trying to do
<div th:switch=${image_clickable_status}>
<a th:case=“true ” th:href="#{/getConsent/yes}">
<a th:case=“false ” th:href=“#”>
<img
src="https://samplegoogle.img" alt="viu"/>
</a>
</a>
</div>
But this is not working , any ideas how to handle this situation in a better way.
You could use pointer-events: none;.
e.g.
<a th:style="${image_clickable_status} ? '' : 'pointer-events: none;'"
th:href="#{/getConsent/yes}">
<img src="https://samplegoogle.img" alt="viu"/>
</a>
You might want to use if-else statement to distinguish a link from a paragraph:
<div th:if="${image_clickable_status}">
<a th:case=“true ” th:href="#{/getConsent/yes}">
<img src="https://samplegoogle.img" alt="viu"/>
</a>
</div>
<div th:unless="${image_clickable_status}">
<img src="https://samplegoogle.img" alt="viu"/>
</div>
The solution above is a bit verbose. Alternatively, use the style to make the link not-clickable and a cursor pointer default.
<a th:style="${image_clickable_status} ? '' : " +
"'pointer-events: none; cursor: default;'"
th:href="#{/getConsent/yes}">
<img src="https://samplegoogle.img" alt="viu"/>
</a>

Xpath definition for alert message

I have defined an xpath to create the webelement(alertMessage) for the message text: "User doesn't exist."
With the firepath it says the xpath is : xpath = ".//*[#id='loginAlert']"
<div id="login-box">
<h1>Control Sphere Login</h1>
<form id="login" class="navbar-form navbar-right" role="form" name="login" method="post" novalidate="novalidate">
<div id="input-box">
<div id="submit-box">
<div id="loginAlert" class="loginAlert">User doesn't exist.</div>
</form>
</div>
<div id="webgl"/>
I run the test, and I get not text with alertMessage.getText() :
java.lang.AssertionError:
Expected: is "User doesn't exist."
but: was ""
Expected :User doesn't exist.
Actual :
My question is do you think the xpath is defined correct?
Thank you
You need to take care of a couple of factors as follows :
You sould try to construct a logical xpath as follows :
xpath = ".//form[#id='login']//div[#class='loginAlert' and #id='loginAlert']"
To extract the text User doesn't exist. instead of getText() use getAttribute("innerHTML")
Try to use the following Assertion :
Assert.assertTrue(actualText.contains("User doesn't exist"))

Webdriver getText not returning any meaningful value

I have the following html in a page
<div class="mst_updt" style=""> 27/06/2017 12:02:31 </div>
I am trying to extract the dynamic date value between the divs :
WebElement webElement =driver.findElement(By.cssSelector(".mst_updt"));
String text = webElement.getText();
System.out.println("i am text : " + text);
System.out.println("Most read 1 : " + webElement.getText());
String a = driver.findElement(By.cssSelector(".mst_updt")).getText();
System.out.println("Most read 2 : " + a);
System.out.println(webElement);
Boolean isTheTextPresent = driver.getPageSource().contains("mst_updt");
System.out.println("And did we find the string ? : " + isTheTextPresent);
you will see i am trying various methods , here are the results i am getting, why cant i extract the date and time ??
i am text :
Most read 1 :
Most read 2 :
[[FirefoxDriver: firefox on ANY (e4a9c548-6146-4685-9944-6b5d51308bff)] -> css selector: .mst_updt]
And did we find the string ? : true
Full Code which should help..
<div class="content">
<div role="main" class="content-inner content-full-width">
<div class="main-content">
<section class="component-list">
<div class="section group">
<div class="col-lrg span-lrg_1_of_3">
<div class="component-weekly-wrap">
<header class="header-weekly-wrap">
<h4 itemprop="name">
<a class="section-title-link" href="example.com/static/survey-panel">Computer Survey Panel</a>
</h4>
</header>
<article>
<img alt="" src="/w-images/fa8edbd1-2c78-4415-9abf-334f7087ff8b/2/CTGRS17OA344213-370x229.jpg" />
<div class="col-inner weekly-wrap-details">
<p><p>Join our <strong>Research Survey Panel</strong> and earn an Amazon voucher for each survey you complete!</p>
<p><strong>Find out more</strong></p></p>
<!--<a class="btn download" href="#">More information</a> -->
</div>
</article>
</div>
</div>
<!--most read homepage updated START-->
<div class= "mst_updt" style="display:none;">
28/06/2017 12:38:15
</div>
<!--most read homepage updated END-->
<div class="col-lrg component-list-most-read span-lrg_2_of_3">
<div class="col-inner component-most-read">
<header class="header-most-read">
<h4 itemprop="name">Most read</h4>
</header>
<div class="ol">
<ol>
<li>
</li>
<li>
</li>
<li>
</li>
<li>
</li>
<li>
</li>
</ol>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
</div>
Here is the Answer to your Question:
To locate a particular div to get text using class attribute must be avoided. Class attribute is applied to multiple div tags as required. You can consider using some other locator preferably an xpath or css to identify this unique div tag and use getText() method to retrieve the text.
Here in this case as you have copied the single div tag it would be tough to help you. But you can consider to construct anxpath to traverse the HTML DOM by binding to an id or name attribute at the parent level and then access theclass property of this div.
Try this xpath, if that's working, it means the identifier you are using is giving you wrong element.
//*[contains(text(),'27/06/2017')]
the solution was supplied by : Rafał Laskowski
i could get the value by xpath of cssSelector, it needed returning by using : getAttribute‌​("innerHTML");
s String a = driver.findElement(By.cssSelector(".mst_updt")).getAttribute‌​("innerHTML");
String b = driver.findElement(By.xpath("//html/body/div[3]/div[2]/div[7‌​]/div/div/section/di‌​v/div[2]")).getAttri‌​bute("innerHTML");
System.out.println("Most read 2 : " + a);
System.out.println("Most read 3 : " + b);

Local conditional variable thymeleaf

I'm trying to rewrite without duplication something like this:
<span th:if=${userRole == 'ADMIN'} style="display:inline;"> // display property for logic only
<div> ... </div>
</span>
<span th:unless=${userRole == 'ADMIN'} style="display:none;">
<div> ... </div>
</span>
In the 2nd case we have the same code, just hidden. This way I have duplicated code. It would be better to have a variable change it's value to either "none" or visible" and use that on a single tag.
How can I do it without duplication, implementing the following logic:
$variable = "display: none;"
th:if=${userRole == 'ADMIN'} $variable="display: visible"
<span style="display: $variable;">
<div> ... </div>
</span>
You can use a ternary operator (? :) to do it in one line without duplication.
th:style="${userRole} == 'ADMIN' ? 'display:inline' : 'display:none'"
I hope this is what you are looking for.

How to click Buy Now button using selenium?

Source HTML look like this :
<script id="during-reserve-tpl" type="text/x-lodash-template">
<div class="gd-row">
<div class="gd-col gu16">
<div class="emailModule message module-tmargin">
<div class="error-msg"></div>
<div class="register brdr-btm">
<div class="jbv jbv-orange jbv-buy-big jbv-reserve">Buy Now</div>
</div>
<div class="topTextWrap brdr-btm tmargin20">
<div class="subHeading">
Only one phone per registered user
<p>
First come, first serve!
</p>
</div>
</div>
</div>
</div>
</div>
</script>
When I code : IWebElement buy = driver.FindElement(By.CssSelector(".jbv.jbv-orange.jbv-buy-big.jbv-reserve")); It says Element not found.
I tried putting By.ClassName with while spaces but it says, compound classes are not supported.
Is there any alternative to click it ?
driver.FindElement(By.cssselector("div.jbv.jbv-orange.jbv-buy-big.jbv-reserve"))
In the above example css selector looks for div tag with name and it will look for all the dot with space
Try this By.xpath("//*[contains(#class, 'jbv')]") if it works.
You can try either of these:
IWebElement buy = driver.FindElement(By.CssSelector("div.register>div"));
OR
IWebElement buy = driver.FindElement(By.CssSelector("div.register"));

Categories