score:0
Accepted answer
you almost have it, but need to use .then()
or a .should()
after the cypress commands, which do not give you anything useful when you assigning to a variable (the first code block)
cy.get('myelement').should('have.css', 'color')
.should(color => {
const white = 'rgb(255, 255, 255)'
const black = 'rgb(0,0,0)'
const chartreuse = 'rgb(127, 255, 0)'
expect(color).to.be.oneof([white, black, chartreuse])
}
or
const white = 'rgb(255, 255, 255)'
const black = 'rgb(0,0,0)'
const chartreuse = 'rgb(127, 255, 0)'
cy.get('myelement')
.should('have.css', 'color')
.and('be.oneof', [white, black, chartreuse])
the second code block is assigning color value correctly, but the timing is wrong - the if()...else
runs before the value is assigned. also use a .then()
to correct the timing
let color
cy.get('myelement').then(($element) => {
color = $element.css('color')
})
// other commands...
cy.then(() => {
expect(color).to.be.oneof([white, black])
})
or assign the color value to an alias (but you also access the alias value from a .then()
).
Source: stackoverflow.com
Related Query
- How to use API color variable in css file?
- Cypress: How to save CSS color to a variable?
- How to change CSS root variable in React?
- In React, how to pass a dynamic variable to a const CSS Style list?
- How to change color of fontawesome icons in modular css React
- How to save the value of a variable converted to base64?
- React - How to replace the hover color of an Ant-Design Primary button with a css variable?
- How to mutate CSS custom property color with CSS-in-JS?
- nextjs how to write css variable in components module.css like global css?
- How do I transition background color with Tailwind CSS in React?
- How to save firebase returned data to a variable
- How to individually change text color and font weight in the same div element using Tailwind CSS and React
- how to save a variable with the current data saved in an interval updating state
- How to create a perfectly round circle filled with text of variable sizes in CSS
- How to give background color to image using CSS in ReactJS?
- How to render component from variable and save props and context?
- How to set css variable using react
- How do I change inline CSS styles using a variable in JSX inside a map function?
- How do I pass variable in css import in ReactJs
- How to change CSS class depending on the value of variable in JavaScript?
- How to save response data in a variable or state in js
- How to change the default screen background color of all the pages in React JS(Next JS) using tailwind CSS
- How to make the background color of CSS cover entire browser window?
- How do I securely save a variable not affected by render?
- How to display background color in CSS not working?
- How to save a class inside a variable with setState with React
- How we can make this circle background color disappearing animation CSS
- How to get the value of variable to change the css of body/root element in reactJS?
- How to save an id in a variable and show it in console in react
- Framer motion - How to do a simple css color transition
More Query from same tag
- Custom filter the children of antd table dataSource
- New property value not being rendered
- Listening Socket.io event works server's side but not client's side
- React Component without Function or Class?
- debounce or throttle user input onKeyUp for a dropdown filter
- React conditionally render a component in specific routes
- How to handle map product not found in react dropdown
- springboot for backend reactjs frontend
- Trigger a CSS animation once the element is in view with Material-UI
- Project Test failing due to Reference Error - React
- How to render the same component 5 times?(clone component)
- react native- vector-icons: change the name to simple text
- React custom mount hook
- Node module doesn't work after webpack build
- Change parent state from child component doesn't work
- How to Remove the form value After Submit in React from below code?
- React (w/ react-redux) caching options
- React render multiple button with props
- How update render when redux state updated?
- Can't make Context API work on React application, Uncaught TypeError: react__WEBPACK_IMPORTED_MODULE_0__.useContext(...) is not iterable
- only allow children of a specific type in a react component
- I need to change material UI helper text background
- react-bootstrap Jumbotron background image
- How to implement RTL directionality for Ant Design modal in React?
- ReactJs onClick on mobile phones
- React + Django Axios Issues
- Two-way data binding on large forms
- I cannot run multiple test files with Jest?
- How to add/use React component in only one part (cart page) of my existing node project?
- Set state from content of another item in the state