Here's my situation:
selector: ".list > div"
const velue = [6, 9, 21]
Each div contains a different value. I want to remove elements that contain a specific value, then select the first remaining element and click on it. It should look something like this:
cy.get(".list > div").not('contains', value).eq(0).click()
I attempted to solve this using not, but it only accepts selectors and not values. Any thoughts? I couldn't find a similar topic on stackoverflow.
The value must be integrated within the contains selector in the not command.
It is considered a pseudo-selector, therefore the format is :contains()
cy.get(".list > div")
.not(`:contains(${value})`) // embed value into string template
.eq(0)
.click()
Cypress includes some handy utility lodash functions, such as _.filter(), which allows you to use a callback function to filter out the values 6, 9, and 21.
Sample HTML
<ul class="list">
<div>1</div>
<div>2</div>
<div>6</div>
<div>3</div>
<div>9</div>
<div>5</div>
<div>21</div>
</ul>
Test code
cy.get(".list > div")
.then(($el) => {
// Filter out elements containing '6', '9', and '21'
// and return the filtered array to Cypress chain
return Cypress._.filter($el, (el) => {
const text = el.innerText;
return text != "6" && text != "9" && text != "21";
});
})
Check out this working example.
To exclude the numbers "3" and "5," you can utilize the :not selector in your code snippet like so:
cy.get('div:not(:contains("3"), :contains("5"))')
It seems like I'm facing a minor issue here. Everything was working fine until... $(document).ready(function() { // Original data var data = [{ "name": "Tokyo", "y": 3.0 }, { "name": "NewYork", "y": 2.0 }, { "name": "Berlin", ...
I am currently working on a project and facing a challenge that I am unfamiliar with. My task is to highlight specific keywords within text located inside a <td> element. I cannot manually highlight the keywords as the texts are dynamic, originating ...
My current application makes use of SQLite for storage, but I am looking to switch it up to make it compatible with Firefox and other browsers. I've been considering localStorage as an option. However, I've noticed that localStorage lacks some o ...
Embarking on my MUI journey, I am exploring how to utilize Select and MenuItem in tandem to create a checked dropdown functionality with the help of this reference link. My goal is to structure a header, body div for MenuItems, and a footer inside the sele ...
Today, I delved into the world of website development using backbone.js. Surprisingly, after a whole morning of trying to crack a puzzling problem, I find myself stuck. Let me focus on the crucial bits of code here. Initially, I have a View named Navigat ...
The technologies I am currently utilizing include Nodejs, Express, MySQL, and EJS. My current task involves: Creating an app.get function that retrieves necessary data (posts) from MySQL, then renders a file using that data app.get("/" + element.name, f ...
Initially, I created an application that utilized this code in the HTML and incorporated classes with Font Awesome icons, which functioned effectively. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css&q ...
I'm encountering issues with the following example: Animate a point along a route My goal is to add another point and routes in the same map container. Here's what I've tried so far: mapboxgl.accessToken = 'pk.eyJ1IjoicGFwYWJ1Y2t ...
Being new to React, I recently used getStaticprops to retrieve data from an API for a filter gallery project. However, I encountered an issue when trying to access the {props: data} outside of the blog function - it resulted in a Reference Error stating th ...
We are in the process of migrating multiple websites, each with its own project, to Vue.js. As we transfer files over and bundle them using Webpack, we have encountered a need to consolidate similar components and core JavaScript files into a shared librar ...
I've been exploring the capabilities of the Facebook Marketing API once again. After successfully creating Facebook ads using my Node.js app, I now have my sights set on Instagram. My current call to create an AdCreative looks like this: fb.api(&ap ...
Earlier, I posted about this issue before isolating the problem. Now that I have isolated it, I wanted to repost with a clearer focus on the two functions causing the problem. Whenever I update my State, it triggers the getCity function. The call is being ...
Within my project, I am working with 3 components that are nested as follows: App->GameList->GameItem The App (parent) component has a method that is triggered by the onClick event within the GameItem (child) component Upon clicking the GameItem co ...
I have 14 objects positioned across the dom that I need to animate using the translate property. Currently, I am using transform: translate(x%, y%) for each object, requiring me to calculate the translation amount and apply a CSS style individually. This m ...
I am trying to simplify the action listener for 9 buttons on a screen. Currently, I have individual event handlers set up for each button, which seems inefficient. Is there a way to create an array of buttons and manipulate them collectively? For example ...
Currently going through a tutorial that involves AngularJS and Spring Security. The AngularJS navigation controller triggers an authenticate function upon page load: var authenticate = function(credentials, callback) { var headers = credentials ? { ...
My success with AJAX enables PHP execution upon image click. However, I seek a real-time visual representation without page reload. Thus, I aim to alter <img> tag classes on click. Presently, my image tag resembles something like <img title="< ...
Styling with CSS: ul #allposts li{ height: 50px; width: 50px; background-color: yellow; border: 1px solid yellow; } Creating HTML structure: <ul id = "allposts"></ul> Adding JavaScript functionality: var container = documen ...
Below is a snippet of my HTML layout using the sciter framework: <div id="volume_micphone_slider" style="z-index:1;"> <input id="volume_slider" class="volume_slider" type="vslider" name="p1c" max="100" value="20" buddy="p1c-buddy" /> < ...
P.S: I have made some modifications to the code below. Extracting the doctor's value from JSON data, updating the state, and then mapping it to print out the values. Initially, there is only one doctor, but in the future, there could be more than one ...