I want to select only the div which don't have style="display : none"
cy.get('div[class="table-wrap"]').filter(':visible')
.contains('element_to_selected_inside_This_div')
cy.get('div[class="table-wrap"]').not('style="display: none;"')
.contains('element_to_selected_inside_This_div')
All you need is square brackets around the style attribute, same as you did for class attribute
cy.get('div[class="table-wrap"]')
.not('[style="display: none;"]')
.contains('element_to_selected_inside_This_div')
.should('have.length', 1) // only one is selected
Related
Can someone please assist in following case:
I have to check in if statement does element exist. Since there is no possibility to use Xpath in find command (Throws Syntax error when run it with Xpath).
My code looks:
cy.xpath(list)
.eq(index)
.then(($el1) => {
cy.get('body').then((body) => {
if (
body.find(
currentBase +
currentTitle[index] +
currentExtension
).length > 0
) {
...
Where currentBase is Xpath before text, currentText - element with text and currentExtension is concatentation to get element below that text element.
I do not want to use those classes since they are dynamic ones (also, can not be changed with some unique attribute in near future)
And DOM looks:
Namely, easily is found marked img element, but with following CSS, it does not work
#structures img[src*="/static/media/image"].$('..').$('..').$('..') div:nth-child(2)
What I want is, to find div below element with text Element One
What I am doing wrong?
Or is there any other way in Cypress to use together if statement and to pass that step if element is not found?
Thank you in advance
You can do something like this. This will get you the div element just below Element One and which is also the parent element for the img
cy.get('img[src*="/static/media/image"]').parent('div')
I want to find elements using selenium webdriver with either h2 or h3 tag.
Is it possible to have a generic css selector for the above requirement ?
Something similar to [tag^='h'] or [att^=str] ?
For attributes, yes, you can. But for elements, you can have the possible values comma separated. W3 CSS Selectors
Selector Example Description CSS
element1,element2 h1,h2 Selects every <ul> element that are preceded by a <p> element 3
[attribute~=value] [title~=flower] Selects all elements with a title attribute containing the word "flower" 2
[attribute|=value] [lang|=en] Selects all elements with a lang attribute value starting with "en" 2
[attribute^=value] a[href^="https"] Selects every <a> element whose href attribute value begins with "https" 3
[attribute$=value] a[href$=".pdf"] Selects every <a> element whose href attribute value ends with ".pdf" 3
[attribute*=value] a[href*="w3schools"] Selects every <a> element whose href attribute value contains the substring "w3schools" 3
Use comma-separated list of selectors. For your case use h2, h3 selector. See W3C Recommendation for details.
It's not a direct answer on question, but as additional option you also might use XPath that will match both elements by starting "h" letter:
//*[starts-with(name(), 'h')]
Unable to dynamically change class on "ng-repeat" list with background image contained in "style.css". Tried suggested solutions such as "ng-style="{ 'backgound-image': 'image_name.jpg' }" directly onto the element without much luck.
The class would need to change conditionally.
ng-class to the rescue. Managed to achieve the conditional effect without needing to modify my "style.css".
Within my template "ng-repeat (item in productList)" i used the following, note your repeat will need to use the "track by $index" syntax:
<div ng-class="{ 'no' : 'image_off', 'yes': 'image_on' }[item.isOn]" ng-click="switchOnOff($index, item.productId, item.isOn); $event.stopPropagation();"></div>
NOTE: "$event.stopPropagation()" prevents the page submitting.
"image_off/image_on" refers to two different classes under my stylesheet. Each with their own respective background image.
In your controller use the following to action the event on the UI inside a function e.g "switchOnOff" :
$scope.productList[index].isOn = $scope.productList[index].isOn == 'no' ? 'yes' : 'no';
I'm testing FluentLenium.
I found "fill("#sb_form_q").with("FluentLenium");" for input(s).
I want check and uncheck Checkbox.
I want choose a radiobutton in a group.
How to do ?
If you want to click on the radiobutton that have the id "male" just do something like that :
find("#male").click();
You could use any of the css selectors to find the element you want (radiobutton or checkbox) and act on it (most of the time by clicking).
If you have an element such as:
<input type="radio" id="radioButton1">
You can use either the Lazy Find Annotation:
#Findby(id = "radioButton1")
FluentWebElement radioButton;
Or the locators:
FluentWebElement radioButton = el("input", with("id").equalTo("radioButton1");
I prefer the second method for accuracy since you can add more selectors to ensure you find the exact element you want to, the first for ease-of-use/readability.
Then you can use the FluentWebElement's methods to click and unclick.
radioButton.click(); /* Selects */
radioButton.click() /* Unselects */
You would not use fill method.
I have an element with the following styles
<ul class="textboxlist-bits" style="background-color: transparent;">
Now I want to select the element based on the style attribute.
The css selector ul [style="background-color: transparent;"] does not work there.
Kindly suggest an appropriate selector to identify such element.
I think you only have to remove the first space:
ul[style="background-color: transparent;"]
Now it is searching all ul-tags which have this style; with the space between it tries to select all dom elements in(!) a ul-tag which have this sytle.
Here an example with the querySelector for javascript, it should work with selenium too.
A possible solution is to select all elements with matching class name, then the first of those with the correct style attribute. You haven't said which language the test is written in, but an example in C# would be:
IWebElement element = driver.FindElements(By.CssSelector("ul.textboxlist-bits")).First(e => e.GetAttribute("style").Contains("background-color: transparent;"));
Maybe this http://reference.sitepoint.com/css/elementtypeselector
not sure if you mean something like an if statement in c?
[ { attribute | attribute { = | |= | ~= } attribute value } ] {
declare stuff here..
}
or
this matches any type input that matches 'submit'
input[type="submit"] {
declarations
}