I'm using jsoup to parse HTML. There are list items that look like this:
<li><span class="chk">X</span>Category Name</li>
I want to get the text of the li NOT including the text of the span. So I want to get "Category Name" without the "X". (If I invoke the text() method on the li element, I get "XCategory Name".) How can I exclude the sub-span?
ownText() method will help you here.
Document document = Jsoup.parse("<ul><li><span class=\"chk\">X</span>Home</li><li><spanclass=\"chk\">X</span>Category Name</li></ul>");
Elements elems = document.select("li");
for(Element elem : elems){
System.out.println(elem.ownText());
}
Related
I'm trying to highlight a matched substring in a searchable array of strings. I'm pretty close I think, just that last bit is not working.
I display an array of strings. When I type in an input the substrings in the array are supposed to get highlighted (using <mark></mark>) when matched with the input. The matching works ok but instead of highlighted text I get [object Object] instead.
So this is the part of code in question (it sits in Jsx inside a .map() method:
<div>
{item.matched.length > 0
? item.name.replace(new RegExp(inputText, 'gi'), (match) => (
<mark>{match}</mark>
))
: item.name}
</div>
The item is an element of the array that I'm mapping and has two properties: name & matched. matched is either empty or contains the typed search pattern if part or all of name matches it.
And this is what I'm getting when typing into text box:
So clearly the search and match work correctly and look what I get: [object Object] instead of highlighted search pattern.
I've tried to return a template string, like that backquote<mark>${match}</mark>backquote, but that results in displaying <mark>a</mark> in my example.
So I'm at loss here and any constructive feedback will be greatly appreciated.
we should render at in html
<div dangerouslySetInnerHTML={{ __html: (item.matched.length > 0
? item.name.replace(new RegExp(inputText, 'gi'), (match) => {
return `<span>${match}</span>`
})
: item.name) }}>
I need to access the input field in the below html. The way the page is setup I need to chain using the 'Address Line 1' text and then sending text to the input field. The input field id changes and so doesn't the layout of the fields depending on user preference. I am struggling. If you need some more information feel free to ask I did not want to overload with too much information.
<td class="labelCol requiredInput">
<label for="00N36000000xina"><span class="assistiveText">*</span>Address Line 1</label>
</td>
<td class="dataCol col02">
<div class="requiredInput">
<div class="requiredBlock"></div>
<input id="00N36000000xina" maxlength="255" name="00N36000000xina" size="20" tabindex="4" type="text">
</div>
</td>
I have accessed like this:
element(by.css('div.pbSubsection:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(2) > td:nth-child(2) > input'))
However depending on where the user puts the fields it can move around. So what I was hoping was to be able to access the label\ and use that to pinpoint its input field.
I don't know protractor but I cobbled together some code that hopefully will work or be close and I'll give you the thought process and some info and hopefully you can use it to fix my code, if needed, and solve the problem.
Start by finding an element by XPath, "//label[text()='Address Line 1']". This searches for a LABEL tag that contains "Address Line 1". Once you find that element, get the label attribute. From your HTML, this label is the id for the INPUT element you want. Now use the id to find the element and do with it what you want.
id = element(by.xpath("//label[text()='Address Line 1']")).getAttribute("label")
input = element(by.id(id))
input.sendkeys("some text")
Haven't tested this myself, but you could try something like this:
// $ is shorthand for element(by.css())
$('div.assistiveText').getAttribute('for').then(function (val) {
// locate the <input> by the value of the attribute on <label>
element(by.id(val)).sendKeys('abc'); // replace sendKeys with your intended function
});
Or if that first locator on the label isn't specific enough, swap out $('div.assistiveText') for element(by.cssContainingText('Address Line 1'))
I tried it for other attributes (I don't have a for attribute anywhere in my app) and it seemed to work for me.
Try this:
List<WebElement> elementList = driver.findElements(By.cssSelector("tbody > tr"));
for (WebElement element : elementList) {
if(element.findElement(By.cssSelector("td.labelCol > label")).getText().equalsIgnoreCase("Address Line 1")) {
element.findElement(By.cssSelector("input[type='text']")).sendKeys("textToInput");
}
}
I have a web page with below HTML format. This is just a sample and a part of code.
<div id="content">
........... Many other tags go in here......
<div id="1234"> // This id number is not constant and so cant hard code in xpath
<img class="float-right ng-scope" width="85" data-ng-click="highlightItem()" data-ng if="showThumbnail" ng-src="/server/image" src="/server/image">
<p>
<span data-ng-transclude="" data-ng-class="{ selected: isActive }">
<span class="ng-scope">My sample text</span>
<br class="ng-scope">
</span>
</p>
</div>
</div>
I have the text "My sample text" as my input. (There are many such div blocks and each has different span text). With this, I need to find the img element and click on it. I tried the below code : (referenceText variable = "My sample text")
String xPath = "//div[#id='content']//span[contains(text(),'" + referenceText + "')]";
// Get element of the text i.e get span element
WebElement element = getWebElementByXpath(getWebDriver(), xPath); // Gets span element
// Works fine !
// Get its parent element which is again another span
WebElement parentElement = getParentElement(element, xPath); // Gets next level span
// Works fine !
// Get its parent element p
WebElement grandParentElement = getParentElement(parentElement, xPath);
// Does not get its parent element 'p' instead return span element again
// Get preceding element for p which is img element
grandParentElement.findElement(By.xpath("./preceding-sibling::img")).click();
// Does not work as element p is not obtained.
getParentElement method is as below:
public static WebElement getParentElement(WebElement element, String xPath){
return element.findElement(By.xpath((xPath + "/..")));
}
Problem : I am able to get the span element and its parent span element but unable to get the p element and its sibling element img. I want to get img element using the span element. Any help on this would be great ! Thanks in advance.
Try the below XPAth for the image tag having "My sample text" as span value.
//div[#id='content']//div[.//span[span='My sample text']]/img
Refer http://www.xpathtester.com/xpath/b1d50008dd4be8ab7545548c4b8238f5
Simple open browser and check unique css locator, then check if that locator works for U in java code.
Try this xpath for getting grandparent 'p' from the 'span', with text "My sample text":
//span[.='My sample text']/../..
Try this xpath for getting the sibling 'img' of grandparent 'p', from the 'span' with text "My sample text":
//span[.='My sample text']/../../preceding-sibling::img
Try out with:
//span[.='My sample text']/ancestor::div/img
Thanks all for your help ! The below Xpath worked fine for me.
String xPath = "//div/p/span/span[contains(text(),'My Sample Text')]/../../..//img"
I want to render the following using express and jade:
function(output) {
for (i=0;i<output.entities.length;i++){
console.log(output.entities[i].uuid);
}
res.render('errCodes.jade', {title : 'Error Codes', entry: output.entities});
},
the jade looks like so:
items = entry
each item, i in items
li #{item}
The console log looks nice, but no matter what I try, I can't get the jade page to look nice. At the moment, there are two links that read
[object Object]
[object Object]
which is expected. However, I want two links of the ID to show up, but every time I've tried I either get each character of the ID as its own link, or the aforementioned object, object. Any help would be greatly appreciated.
is your original indentation correct? or is it just here on SO that it looks wrong?
items = entry
each item, i in items
li #{item} // this should be further right
You can use pure jade to achieve the same:
items = entry
each item, i in items
li
a(href="/#{i}") #{item}
if your array looks like the following
output.entities = [{ uuid: 1234 }, { uuid: 5678 }];
your jade should look like this
items = entry
each item, index in items // iterate over array
li
a(href="/#{index}") #{item.uuid}
index will be 1,2,3,4,... etc.
I want to display a title and a content field for each language. So, in the form, I have:
foreach ($languages as $language)
{
// Add the title element
$title = new Zend_Form_Element_Text($language);
$title->setLabel($translate->_('News Title'))
->setBelongsTo('title');
$this->addElement($title);
// Add the content element
$content = new Zend_Form_Element_Textarea($language);
$content->setLabel($translate->_('News Content'))
->setBelongsTo('content');
$this->addElement($content);
}
If I render the form in the usual way it works perfectly:
echo $this->form;
However, I want to render each field separately to include some HTML in the middle and other jQuery stuff. My problem is that I cannot manage to access those elements. I tried
foreach ($languages as $language)
{
$this->form->getElement($language);
}
but it only renders 'content' element. Am I overriding 'title' element?
Thanks
Yes, you're overriding the Title element. The parameter you pass to new Zend_Form_Element_Text($language); ($language in your case) should be unique. Infact you can use it to identify and retrieve the element when you need.
To setup the param you can do something like this:
foreach ($languages as $language)
{
// Add the title element
$title = new Zend_Form_Element_Text('title-' . $language);
...
}