REG: Identifying Custom Dropdown Boxes with CAPYBARA

Currently, I am facing a challenge when trying to select a value from a custom dropdown menu that contains numerous options. The issue arises when attempting to choose values beyond the first one due to excessive padding spaces in the text.

While my code works for selecting the initial value:

find('.selected', :text=>arg1,exact: false).click

I need help figuring out how to address this situation and successfully select the remaining values with ease. Any suggestions?

Answer №1

When dealing with a drop-down menu, it's important to gather all the available options first:

menu = session.find(:css, '#MenuId')                   # adjust according to your needs
options  = menu.all(:css, "option").collect {|o| o.text}

After collecting all options, you can then use the index to make a selection from the drop-down list:

session.select options[2], from: 'MenuId'

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Changing Background Images Based on Screen Size in CSS Media Queries

Hey there, I am currently using two different header images - one for desktop and another for both tablet and mobile devices. I am wondering how I can automatically switch from the desktop header image to the mobile/tablet header image when the screen siz ...

Creating a Multilevel Dropdown Menu: A Step-by-Step Guide

I am curious about how to create a multilevel dropdown menu using Bootstrap 5 and vanilla JavaScript. I created an example based on the Bootstrap 5 dropdowns component documentation, but it did not display when I clicked on it. The issue seems to be relat ...

Ensuring website responsiveness beyond just the carousel

I found a carousel (inspired by: https://codepen.io/dobladov/pen/kXAXJx) that fetches images from an API. The carousel will switch images as you click on a different image or use the "previous" or "next" buttons. While there are many examples of putting te ...

What is preventing me from clicking on the left side of the link on this CSS flip card while using Chrome browser?

When attempting to click the left side of the link on the back of this flip card in Chrome, it does not respond. However, hovering over the right side allows interaction with the link: /* Vendor prefixed by https://autoprefixer.github.io */ .card { ...

Utilizing space with margin and padding in Bootstrap 5

I recently started experimenting with bootstrap 5, but I'm feeling quite disoriented. The layout I have created includes some blue elements (borrowed the sidebar from this source) and now I am attempting to replicate this design. https://i.sstatic.ne ...

What is the best way to eliminate the space between two columns of a row in Bootstrap 5 grid system?

In my quest to achieve the grid layout illustrated in the image below https://i.sstatic.net/4hsjw.jpg .col_1{ background-color: bisque !important; height: 500px; } .col_2 { width: 300px; height: 287px; background-position: cent ...

Ways to define a variable based on a CSS class attribute?

I need help figuring out how to create a variable in my script that is defined by the width attribute of a CSS class. The snippet I have currently doesn't seem to work as expected. var dist = $('.nav').css(width()); The goal of my script i ...

Selection pseudo selectors for tooltips are a great way to provide additional

Can someone explain how tooltips change on Medium.com when you double click a word or sentence to reveal options like share and edit? https://i.stack.imgur.com/0EVmH.png ...

"Utilizing Ruby's Regex to perform a search and replace operation

I am facing a challenge with an array that contains a list of image URLs and I am attempting to search and replace using regex (via gsub). The URLs are in the format //subdomain.website.com/folder/image.extension, and my goal is to prepend 'https&apos ...

Manipulating the size of the Chrome viewport manually yields varying outcomes compared to resizing within the browser using the "Inspect" tool

I'm currently working on developing a responsive custom theme for Wordpress. I have it hosted locally using WAMP and employing different tools to ensure it is mobile-friendly. However, I am encountering inconsistencies in the results, especially since ...

Create a JavaScript script within a CSS file

I'm attempting to create this using only CSS: Codepen and I would like to achieve the same effect but solely with CSS. This is what my CSS looks like: .text{ --a: calc(var(--a);*0.82+(1.5-var(--b);)/10); --b: calc(var(--b);+var(--a);); transfor ...

Using CSS to conceal an element when a different element is also invisible

My inquiry is as follows: I currently possess a code that conceals class element 1 when it possesses a specific value (which varies across different sites). Now, my objective is to also conceal class element 2 ONLY IF class element 1 is already hidden. ...

CSS following a clicked event

http://codepen.io/anon/pen/GqmEAq My goal is to make the 'x' button clicked (the 'x' is created after clicking the plus sign on the menu) and then bring the dropdown back up. I have attempted: a:after:checked ~ .submenu{ max-height ...

Adjust the height of the dropdown list in react-select (React Material UI)

I recently added a dropdown feature using react-select to my project. However, I encountered an issue where the dropdown list was initially too large and taking up the entire page. I am looking for a solution on how to style the react-select dropdown list ...

Click on the button using Selenium WebDriver

There are many questions like this, but nothing seems to work. I have been attempting to click the "save" button before successfully sending values with Selenium to the table. I have tried the following code: river.findElement(By.xpath("//*[@id='fi ...

What is the best way to maintain the height of a table row while applying a CSS border to a cell within that row?

I am working on a jQuery script that selects a cell when clicked, and I want the row to maintain its height without changing. Even though I have set the height of the table row using CSS, whenever I change the border of a single cell, the entire row' ...

What Is Preventing Fields from Being Filled in the Drop-Down Menu?

Looking to achieve this outcome: https://jsfiddle.net/nstruth/t0dopzav/1/ The issue I'm facing is that the HTML appears correctly when Volvo is selected, but the JavaScript is not functioning as expected. Despite reviewing similar innerHTML JavaScrip ...

Tips for changing the dimensions of the canvas?

I'm struggling to display a photo captured from the webcam. The sizes are not matching up, and I can't pinpoint where the size is defined in the code. https://i.stack.imgur.com/Is921.png The camera view is on the left, while the photo should be ...

Is it possible to store CSS and JS files within an Android app that utilizes a webview, similar to Phonegap

Looking to store CSS and JS files for an Android app that utilizes a webview. Want to avoid repeated server requests by storing the files locally on the phone, similar to how PhoneGap operates. Are there any resources or documentation available to help a ...

Issues with Flexbox not being rendered correctly on Safari 5.1 for Windows

My goal is to design a straightforward box for questions, with the question number on one side and the text on the other. To ensure that the texts are aligned vertically and dynamic, I am experimenting with using flexbox. I have researched both the old an ...