I'm using webdriver for forum reply testing.In this scenario,I'm not able to locate and get the reply text ("I want rock!")from following code.
The HTML code is:
<div id="user_ack_con0" class="user_ack_con mt15 clear clearfix">
<dl class="clear clearfix">
<dt>
<a href="http://www.abc/user/1161/">
</a>
</dt>
<div>
Jason
<span class="total_icon total_icon5"></span>
：I want rock!
</div>
I really don't know how to get that text from this element:( Anybody knows,thanks.
Here's a general solution:
def get_text_excluding_children(driver, element):
return driver.execute_script("""
return jQuery(arguments[0]).contents().filter(function() {
return this.nodeType == Node.TEXT_NODE;
}).text();
""", element)
The element passed to the function can be something obtained from the find_element...() methods (i.e. it can be a WebElement object).
I'm actually using this code in a test suite.
The text is technically inside the div element, so you should try getting it using the find method on the xPath:
//div[#id="user_ack_con0"]/dl/div
and then getting the text
You can try:
driver.findElement(By.cssSelector("#user_ack_con0 > dl > div")).getText()
Or This:
$("#user_ack_con0 > dl > div").textContent
Jquery get Text
Related
I am trying to scrape an html page that uses this structure:
<div class="article-body">
<div id="firstBodyDiv">
<p class="ng-scope">
This is a dummy text for explanation purposes
</p>
<p> class="ng-scope">
This is a <a>dummy</a> text for explanation purposes
</p>
</div>
</div>
as you can see some of the P elements have a elements and some dont.
What i did so far is the following:
economics["article_content"] = response.css("div.article-body div#firstBodyDiv > p:nth-child(n+1)::text").extract()
but it returns only the text before and after the a element if there is an aelement inside the p element
while this query return the a(s) elements:
response.css("div.article-body div#firstBodyDiv p:nth-child(n+1) a::text").extract()
i want to find a way to check whether there is an a element or not so i can execute the other query(the one who scrape the text inside the a element)
this is what i did so far to do so:
for i in response.css("div.article-body div#firstBodyDiv p:nth-child(n+1)"):
if response.css("div.article-body div#firstBodyDiv p:nth-child(n+1) a") in i :
# ofcourse this isnt working since and i am getting this error
# 'in <string>' requires string as left operand, not SelectorList
# probably i will have a different list1, list1.append() the p
# before, a, and the p text after the a element
# assign that list to economics["article_content"]
Although i am using css selectors, you are welcome to use xpath selectors.
You can use the descendant-or-self functionality from xpath, which will get all inner texts.
for i in response.css('div.article-body div#firstBodyDiv > p:nth-child(n+1)'):
print(''.join(i.xpath('descendant-or-self::text()').extract()))
You can also use scrapy shell in order to test your code with raw HTML like so:
$ scrapy shell
from scrapy.http import HtmlResponse
response = HtmlResponse(url='test', body='''<div class="article-body">
<div id="firstBodyDiv">
<p class="ng-scope">
This is a dummy text for explanation purposes
</p>
<p class="ng-scope">
This is a <a>dummy</a> text for explanation purposes
</p>
</div>
</div>
''', encoding='utf-8')
for i in response.css('div.article-body div#firstBodyDiv > p:nth-child(n+1)'):
print(''.join(i.xpath('descendant-or-self::text()').extract()))
I have a list of items (dynamically created buttons) coming from a reactjs map function. I want them listed horizontally and also allow wrapping remaining items to the next line if needed. Can some one please help with this. Given below is my code snippet.
return( <div>
{ relevantMessages.map(function(thisQuestion){
return
<p key={thisQuestion.id}>
<button key={thisQuestion.id} onClick={() => this.sendThisMessage(thisQuestion.question)}>
{thisQuestion.title}
</button>
</p>
}, this)
}
</div>)
You can use css to align horizontally.
For example:
return( <div>
{ relevantMessages.map(function(thisQuestion){
return
<p key={thisQuestion.id} style="display:inline-block;">
<button key={thisQuestion.id} onClick={() => this.sendThisMessage(thisQuestion.question)}>
{thisQuestion.title}
</button>
</p>
}, this)
}
</div>)
Using span tag instead of p tag in the above code snippet solved my issue.
This isn't really an issue with React, but more so with CSS.
What you are probably looking for is something such as flex-box. Check out css-tricks for a good tutorial on how to use it.
Or try flexbox-froggy for a gamified of learning it :)
I'm having a problem and i'm really puzzled by it.
My markup is simple enough:
#foreach (var item in Model.Items)
{
<a class="mapIconUnit" id="pinDelete-#item.PinGuid.ToString()">
#Url.Action("DeletePin") <!-- testing purposes -->
#(Ajax.ActionLink("x", "DeletePin", MapAdministrationController.Routes.DeletePin(item.PinGuid), new AjaxOptions()
{
OnSuccess = "onMapPinDeleted",
Confirm = Resources.Resource.msg_GenericDeleteConfirmationQuestion
}
))
</a>
}
Now what i would expect to render from this is:
<a class="mapIconUnit" id="...">
... rendered url
<a href="..." etc>x</a>
</a>
But what i am getting is:
<a class="mapIconUnit" id="...">
... rendered url
</a>
<a href="..." etc>x</a>
What am i doing wrong here? The markup is too simple for it to be wrong to cause such a thing?
It's illegal to nest an anchor element inside another anchor element, more info can be found in the W3C specs: http://www.w3.org/TR/html401/struct/links.html#h-12.2.2
Links and anchors defined by the A element must not be nested; an A element must not contain any other A elements.
So either razor or the webbrowser renders the elements correctly (i.e. place them next to each other).
I am trying to use the following code to extract the inner html of menu items but it only picks up the text that is in the same line for some reason. Here is the code:
WebElement ReportStart=driver.findElement(By.xpath("//a[contains(text(),'Reports')]"));
List<WebElement> reports= ReportStart.findElements(By.xpath("//*[starts-with(#id, 'menu_')]"));
System.out.println(reports.size());
for (int i = 0; i < reports.size(); i++) {
System.out.println(reports.get(i).getAttribute("id"));
System.out.println(reports.get(i).getText());
}
It picks up all the id's but only the inner text of some of them and not nested one. So it picks up text Reports and id menu_1035 and menu_1036 but not the text General as it is not on the same line. Not sure why this is that findelements does not pick the whole web element
<li>
<a id="menu_1035" class="dynmenu" href="#">Reports</a>
<ul>
<li>
<a id="menu_1036" href="#">
General
<span class="dwn"/>
</a>
<ul>
</li>
Its not picking the text General as it is inner-html of li tag not a tag.
Your xpath only fetches element which has id - //*[starts-with(#id, 'menu_')]
If you want to get General text also, then you need to update your xpath' that points only tillli` element.
Hope it helps.
Chief complaint:
Using CSS Selector cannot locate element
Css path:
html.ng-scope body.ng-scope div.snap-content div.content-container div.ng-scope div.content-box div div.cb-landing-module div.deposit-acct-box div.dropdown div.dd-field div.dd-arrow-box
Css selector:
.dropdown .dd-arrow-box
How I used it in Watir/Cucumber :
#browser.element(:css => 'dd-arrow-box').click
Error:
Cucumber reported error: Unable to late element
Description Of Problem:
I have a combo box of sorts that I would like to click
The result would be selecting items from the list.
I have tried xpath , in may combinations with the same error
Unable to find element
Tried:
Possible / sync issue: Fire on Even …. Failed
Xpath – Failed
When I take the method off ( e.g ) click away and add exist it is found . I can’t click it
Edit: Adding HTML from Comment:
<div class="dd-arrow">
</div>
</div>
</div>
<ul class="dd-box" style="display: none;">
<li class="dd-list-head"> Direct Deposit </li>
<li class="dd-item ng-scope ng-binding" ng-click="selectAccount(directDeposit)" ng-repeat="directDeposit in directDeposits">
<span class="acct-name ng-binding">WELLS FARGO BANK, NA</span>
Still puzzled the last threw the following exception: invalid attribute: :css (Watir::Exception::MissingWayOfFindingObjectException)
This might be because what you are looking for is the dd-arrow-box tag, not the class. Change your code to look like this:
#browser.element(:css => '.dd-arrow-box').click
exactly like you would if you were defining a css file. Notice the period in front of dd-arrow-box
Here's a good example.
Given the html:
<div class="divhere">
<p>Hello</p>
</div>
you could use the code #browser.element(css: 'p').text to grab the text from the paragraph.
Likewise, #browser.element(css: '.divhere') will locate the div element using the class selector.