Angular 5 text expansion include HTML - angular5

I have a simple text expansion in my template like so:
<td>{{ someMethodHere() }}</td>
and I want the string that's returned from someMethodHere to include a line-break. I've tried including both \n and <br/> in the returned string but neither is actually evaluated in the resulting HTML.
What's the trick to this?

If you want to use html markup, you need to set the innerHTML. Something like the following would work using your placeholder function:
<td [innerHTML]="someMethodHere()"></td>

Related

Initial letters missing while using type() in Cypress

Scenario:
<tr>
<td id="type1">
<div><span></span></div>
</td>
<td id="type2">
<div><span></span></div>
</td>
</tr>
cy.get('#type1').type('Abcd') // skips the initial letters ie,
// it actually types 'bcd' or 'cd'
There's an issue here Missing letters when using type #3817. I can see this issue is resolved, but I'm still facing this issue. Any workarounds?
This question leaves out some vital bits that I would like to clear up.
If you try out the click-trick on that HTML snippet, you will come a cropper.
This is the error
cy.type() failed because it requires a valid typeable element.
A typeable element matches one of the following selectors:
a[href]
area[href]
input
select
textarea
button
iframe
[tabindex]
[contenteditable]
The last two are the only options for this particular HMTL, so you could make it work like this:
cy.get('#type1')
.invoke('attr', 'contenteditable') // make it editable
.type('Abcd')
.should('contain', 'Abcd') // confirm it has the text
.invoke('removeAttr', 'contenteditable') // optionally remove the attribute
.should('not.have.attr', 'contenteditable')

How to find an item in Selenium WebDriver?

I want to find the following item using Selenium. The value of the class changes whenever there is a change. This is inside a complex page (multiple iframes, and other items loaded dynamically). The only unique id is itemid, which is dynamic value and title combination. If I click on this Action, am getting another new set of complex items. I am new to Selenium. How to do that?
HTML:
<td itemid="xxyyy.as123" title="Actions" nowrap="" class="text-button">Actions <img src="../row.gif"></td>
<td itemid="xxyyy.as123" title="Actions" nowrap="" class="text-button button-active">Actions <img src="../row.gif"></td>
<td itemid="xxyyy.as123" title="Actions" nowrap="" class="text-button button-hover">Actions <img src="../row.gif"></td>
The code I tried:
Find by Xpath
var element=driver.FindElement(By.XPath("html/body/div[id='pageContent']/iframe/#document/ht‌ml/frameset/frame[name='detailsDisplay']/#document/html/body/form[name='tableForm‌']/div[id='divToolbarContainer']/div[id='divToolbar']/div[1][class='toolbar']/tab‌​le/tbody/tr/td[title='Actions']"));
Find by Link Text
var element = driver.FindElement(By.LinkText("Actions"));
Any help would be appreciated.
Try
By.CssSelector("td[title="Actions"]");
By.CssSelector("td[itemid="xxyyy.as123"]");
By.CssSelector("td[itemid="xxyyy.as123"][title="Actions"]")
Create Dynamic CSS Selector.
For Example:
driver.FindElement(By.CssSelector("td[itemid$="xxyyy."]")).Click();
Note: In dynamic Elements, there is always a part of locator wich is fixed. we need to generate the locator using this part.
If fixed part is at starting - Use Carrot Character (^)
If fixed part is at Middle - Use Asterisk sign (*)
If fixed part is at End - Use Doller sign ($)
Finally I was able to achieve it, by using the frame names.
driver.SwitchTo().Frame("content").SwitchTo().Frame("detailsDisplay");
var element = driver.FindElement(By.XPath("//*[#id=\"divToolbar\"]/div[1]/table/tbody/tr/td[1]"));
Thanks everyone.

Python Selenium auto-test (How to get text of a column)

Using Xpath tool from chrome dev tools, I have been able to get xpath string and a td object. I 'm just wondering how do we find the value of text in a td object using selenium python web-drivers?
for your case you can use .gettext() method of selenium.
Once I found that, the attribute within td which contains the text is changing and i was supposed to fetch the text in those attribute.
like
<td class="table__cell" data-col-index="1">
<div class="ec-table__cell-content ">813.75</div>
</td>
<td class="table__cell" data-col-index="2">
<span class="ec-table__cell-content ">522.12</span>
</td>
So to get text within all td in a list, I used dynamic Xpath way:
By.xpath("//td[contains(#class,'table__cell')]/following::*").getText()
Try to search by xpath. Relatively to some ID.
Example of:
id("body_content")/table/tbody/tr/td[3]
in this case will be shown exact elements of 3rd column only.

Selenium IDE commnand assertTextPresent not working

I am trying to use the command "assertTextPresent" in the Selenium IDE (Firefox). I configure it this way:
Command: assertTextPresent
Target: <th align="center" abbr="Monday" scope="col" style="background-color:#EFEDF5;font-weight:normal;">Mon</th><th align="center" abbr="Tuesday" (truncated for brevity)
Value: (left empty)
From what I can tell, Selenium is not matching my "target" with the source of the rendered page because of the HTML code in it. So it always fails even though it should pass. How can I make this assert work?
assertTextPresent looks for a value that you specify to be somewhere, anywhere on the page. The value you passed in your target is the text IDE is looking for. It literally is looking for that entire <th> tag as "text" displayed somewhere on the page, which I am assuming it is not displayed.
The correct way to use that function would be to pass the text you are looking for in the target, for example "Mon" or whatever you are looking for. Keep in mind, this is case sensitive. Since this function doesn't care where its looking, you don't specify an actual target. I find in most cases this function to usually not have enough specificity to be reliable.
<tr>
<td>assertTextPresent</td>
<td>Mon</td>
<td></td>
</tr>
I prefer to use assertText or verifyText since it requires a target, allowing you to be more specific where to look for the text.
<tr>
<td>assertText</td>
<td>css=th[abbr="Monday"]</td>
<td>Mon</td>
</tr>
I am not entirely sure the abbr attribute would be a valid selector. There are many ways to target your element, I just use that as an easy example since it was part of your snippit.
if you are testing for a unique text present in a page you can use
Command: assertTextPresent
Target: your search text
here in target you put the text you want to search.
Or
if you want to check for the text present at a position you can use
Command: verifyText
Target: id,name,xpath of the position
value: your search text
Based on what I am seeing here you should be usingassertElementPresent instead of assertTextPresent because you are specifying a element as your target rather than just the text of that <th> element.
If you still want to use assertTextPresent you would simply have "Mon" be your target. Because it's target/argument is what it is searching for.
You likely want 3 parts for an assertTextPresent test:
Command: assertTextPresent
Target: //th[#abbr="Monday"]
Value: Mon
This will look in the cell that contains the attriute #abbr equal to "Monday" and see if the contents (text) is set to "Mon".
To test all the cells you would do multiple assertTextPresent commands one-after-another to test all 7 days.
If you want to go "up a level" you would do something like:
Command: assertTextPresent
Target: //tr
Value: <th align="center" abbr="Monday" scope="col" style="background-color:#EFEDF5;font-weight:normal;">Mon</th><th align="center" abbr="Tuesday" (truncated for brevity)
Normally it is best to try to select an HTML element, like by using a specific attribute, such as id="row_1" or name="first_row". Then your target would be //tr[#id="row_1"] or //tr[#name="first_row"].
Target is the "DOM search syntax" to tell Selenium IDE where to find the text you are looking for. Value is the text to be tested.

Calculate module of index int Struts2 iterator

I'm using Struts2 iterator to setup a list of checkbox in a table. I want to have 10 checkbox per row, so I'm doing the following:
<table>
<tr>
<s:iterator value="securityMasterFields" status="fieldNameStatus" var="fieldName">
<s:if test="#fieldNameStatus.index % 10 ==0">
</tr><tr>
</s:if>
<td>
<s:checkbox name="fieldsToShow" fieldValue="%{fieldName}" value="%{fieldName}"/>
</td>
</s:iterator>
</tr>
</table>
It never goes through the if, so I'm assuming the mod is not been calculated correctly. How do I do it?
thanks
Well, I had to add some parentheses and it worked correctly. The loop was working, it was just that it wasn't going through the if.
<s:if test="(#fieldNameStatus.index % 8 )==0"></tr><tr></s:if>
It looks good to me. Two thoughts:
1) try printing the result of the test in s:property tag
2) It looks like you will have empty table rows... Are you looking at the generated html or just the output, because if it is just the output then unless you have some CSS giving you some table padding and borders, without an empty 'td' element the row might collapse and make it appear as if nothing is being added. So do make sure you print the empty 'td' elements too!