I have this HTML element, and I am trying to get the value of for attribute
<div class="test">
<label for="aboqo_46" data-test = "user-test" >
I want to get retrieve the value in for which is aboqo_46 in the above code. How can this be achieved?
I have tried the following but could not get the values.
const result = cy
.get('[data-test="user-test"]')
.invoke('attr','for')
cy.log(result)
The above code logs the result value as Object{5}
and
cy
.get('[data-test="user-test"]')
.its('for')
Your code is a little off, it's not returning the attribute value it's returning a Chainer object so that Cypress can chain commands.
This will work:
cy.get('[data-test="user-test"]')
.invoke('attr','for')
.then(value => cy.log(value))
Related
I'd like to validate the text of an element (p element, for instance) with the help of Cypress.
I have used this code:
cy.get('#word').should('have.value', 'Color')
and I received this:
expected <p#word> to have value Color, but the value was ''
Evidently, it validates the CSS but not the html element value. How can I validate the element content here?
If you are asserting the inner Text, instead of have.value you have to use have.text.
cy.get('#word').should('have.text', 'Color')
Or, If you want to assert a partial string, you can use include.text
cy.get('#word').should('include.text', 'Color')
I have list of options (radio button) and on selection of each option, it will display some input fields to take value from user. These values are stored in state "Dimensions". On option change, I am resetting the dimension object to undefined. But this is value is not getting updated in the input field and it is taking old values.
Text field:
<input value={dimensions ? dimensions[opt?.value?]: undefined}/>
On Option Change Method:
const handleOptionChange = (e: any) => {
setDimensions(undefined);
};
Can anybody please guide me through this.
Thanks inadvance!
In ReactJS, input value should always be defined, even if it is an empty string
<input value={dimensions ? dimensions[opt?.value?]: ''}/>
<g class="ABC" transform="translate(786.9,53)" score="1.3">
How can I query the score value of this example HTML tag?
I am writing a test to query the score attribute (it is 1.3 in the above example) and compare it with the correct number in my test.
I am not sure how to get the score attributes value. cy.get() didn't give me what I need.
Thanks.
Cypress gives you direct access to the DOM. If you want to target a DOM object and operate on it directly, you will want to use the then() function.
Here's an example that should work in your case:
cy.get("g.ABC").then(elem => {
let score = elem.attr("score");
cy.log(score);
// etc...
});
See this doc page for more info.
If you want to perform a mocha assertion directly on the value, use should() to take advantage of automatic retries:
cy.get("g.ABC").should(elem => {
let score = elem.attr("score");
// If this assertion fails, the entire block will retry until it doesn't.
expect(score).to.equal("1.3");
});
See this doc page for more info.
I want to set new value of div element by using Selenium FirefoxDriver in Java:
<div my-div-name="lastname">
<p>Smith</p>
</div>
I have successfully retrieved the div element (as WebElement) by use of XPATH expression and have also been able to get current value Smith by use of getText() method. However, there is no setText() method of an WebElement. So I have in stead tried to execute JavaScript:
driver.executeScript("arguments[0].value = 'Foo Bar'", element);
but nothing happens. New getText() call still returns Smith.
Any tip on how to set the value successfully?
Solution is to set innerHTML property like this:
driver.executeScript("arguments[0].innerHTML = arguments[1]", element, text);
I have tried to do this several times, but i wrote innerHtml and not innerHTML so be aware of casing when setting the property.
I have HTML in this format:
<form name="fruit_name">
<input id="fruit-name" type="hidden" name="Banana">
</form>
I have Dart querying the fruit name like this:
var fruitName = query('#fruit-name').attributes.values.last;
This works great in Chrome and Safari. But In Firefox, the attributes come back in a different order, so name is no longer last. What's the best way to grab the attribute I'm after without relying on the browser so much?
attributes is a Map, so this should work:
var fruitName = query('#fruit-name').attributes['name'];
You can use :
var fruitName = query('input#fruit-name').name;
The result of the query is in fact a InputElement and you have more member that in a simple Element.
By prepending #fruit-name with input you will tell to the analyzer that the result of query is an InputElement. Without that you would get a warning ( There is no such getter 'name' in 'Element' ).
Finally, from a performance point of view, the best way to do this is with document.getElementById(id) because getElementById is really faster than querySelector ) :
InputElement fruitNameElement = document.getElementById('fruit-name');
var fruitName = fruitNameElement.name;
Here, the first line allows to type fruitNameElement to prevent warning when calling fruitNameElement.name.