Protractor can now successfully locate and interact with a nested button element

I am trying to click on the second button, but I can't differentiate between the two buttons using class names.

div class="ng-view ff-domain ng-scope">

<div class="hero-unit blur-background ng-scope">
    <h1></h1>
    <h2></h2>
    <a class="btn btn-large btn-warning btn-hero" href="/au/shop/glasses?gender=women"></a>
    <a class="btn btn-large btn-warning btn-hero" href="/au/shop/glasses?gender=men"></a>
    <div class="carousel ng-isolate-scope" carousel="" ng-mouseleave="play()" ng-mouseenter="pause()"></div>
</div>
javascriptangularjsseleniumselenium-webdriverprotractor

Answer №2

Give this a shot:

let secondButton = element.all(by.css(".btn").get(1);
secondButton.click();

Answer №3

To locate the specific links within a div, I recommend identifying them based on their href attribute values. This can be done by checking the end of the href:

var container = element(by.css("div.hero-unit"));

var men = container.element(by.css("a[href$=men]"));
men.click();

The provided code is not only effective but also easy to read and understand.

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

Modifying CSS files in real-time

I've been attempting to dynamically change the CSS file, but I've run into an issue: Whenever I try to alter the style, it seems to work correctly while in "debug mode", showing that the changes are applied. However, once the JavaScript function ...

javascripthtmlcss

Utilizing jQuery to submit the form

After clicking the search icon, it displays an alert with the message ok, but not h. Based on the code snippet below, it is intended to display alerts for both ok and h. <?php if(isset($_POST['search'])){ echo "<script type='text/ ...

javascriptjqueryclick

Refresh gif without having to reload it in Internet Explorer 11

I'm attempting to create a feature where a gif restarts when clicked by the user, without needing to reload it (due to the heavy size of the gif which is preloaded for my application). The current code functions flawlessly on Chrome and other "modern ...

javascripthtmlinternet-explorergif

Show method created by function, substituting the former element on the display

showButtons(1) will show radio buttons for frame number 1, showButtons(400) will display radio buttons for frame number 400. The current code shows all radio buttons for every frame up to 400 HOWEVER, I am aiming for a single set of radio buttons to start ...

javascriptarraysjsonreactjsradio-button

When attempting to use Ajax, the operation fails; however, if I directly access the URL,

When using firebug, I attempted to make the following AJAX call: var rootUrl = 'http://172.24.105.22:8080/geoserver/Chennai_Sub/ows'; var defaultParameters = { service: 'WFS', version: '1.0.0', request: 'Get ...

javascriptjqueryajaxfirebug

Warning: The React Router v6's Route component is unable to find the origin of the key props

I recently came across an error in my console and I'm unsure which list is causing it. Is there a way for me to trace back the origin of this error so I can pinpoint where to fix it? The error seems to be related to the React Router component, which ...

javascriptreactjs

Issue with syntax in the Java code - error in if-else statement, needing correction

import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.firefox.FirefoxDriver; public class automation { public static void main(String[] args) { // TODO Auto-gen ...

javaselenium

Tips for Passing Parameters to Vuex mapActions correctly:Executing mapActions in Vuex requires a specific

I am facing an issue with my ProjectPage.vue where I display project issues in a v-data-table. The projects are fetched from a server API call in the sidebar and displayed there. Once I select a project, I want to use its id to retrieve its corresponding i ...

javascriptvue.jsvuejs2vuexvuex-modules

The functionality of a radio button triggering a form submission to different pages is experiencing issues with Firefox

This piece of code is designed to submit a form when a radio button is clicked, and depending on which radio button is selected, the form action should change. While this code works fine in Chrome and Opera, it doesn't seem to function properly in Fir ...

javascriptphp

In my Vue watch method, I have two parameters specified, and one of them remains constant without any changes

Currently, I am attempting to access a method within my watch function with two parameters. Here is the code snippet for the method: onBoolianChange(value, willChange) { willChange = (value === false) ? true : false; }, watch: { "e ...

javascriptvue.js

There has been an issue with parsing the JSON file due to an invalid character found at

I keep encountering a parse error whenever I attempt to send a post request to the server. $.post("../php/user_handler.php", formData, function(data) { var result = JSON.parse(data); if(result.status === 'error') { ...

javascriptphpjqueryjson

Is it possible to create a GUI application with kivy that relies on external libraries?

I am interested in creating a GUI application using the Kivy framework in Python. My plan is to utilize Kivy for developing the interface while also incorporating Selenium, BeautifulSoup, and CSV libraries for the backend functionality. I'm curious to ...

pythonseleniumbeautifulsoupkivy

What is the best approach to implementing a filter in Vue 2 that is also compatible with Vue 3?

Currently, I am utilizing Vue.js 2+ version and have implemented a date formatting filter to meet my needs. However, I recently found out that Vue 3 has removed the filter functionality in favor of using computed properties or methods. My dilemma now is ho ...

javascriptvue.jsvue-filter

console rendering duplication in React

Why am I seeing duplicate log entries in the console? While working on another project, I noticed that the number of HTML elements being added using jQuery was twice as much as expected (specifically while building a notification framework). To investigate ...

javascriptreactjsrender

Error: The value of _This.props is not defined

Hey there, I am new to working with React Native and could really use some assistance with this issue: TypeError: _props.goToScreen is not a function. Any help would be greatly appreciated, thank you in advance! In my Profile.js file, I am trying to click ...

javascriptreactjsreact-native

The precision of the stopwatch is questionable

Just starting out with JS and jquery, I quickly put together a stopwatch code in JS that seems to work accurately up to 10 minutes. The issue arises after the 10-minute mark where it starts falling a few seconds behind (I compared it to a digital stopwatc ...

javascriptjquery

Modify the appearance of an element within an array upon selection by comparing it with a separate array

In my code, there is an array called tagList that contains a list of objects. When one of these objects is clicked on, it gets added to another array named selectedTags. var selectedTags = []; export default class RegisterTags extends Component { con ...

javascriptarraysreactjsreact-native

Exploring the method of implementing a "template" with Vue 3 HeadlessUI TransitionRoot

I'm currently working on setting up a slot machine-style animation using Vue 3, TailwindCSS, and HeadlessUI. At the moment, I have a simple green square that slides in from the top and out from the bottom based on cycles within a for-loop triggered by ...

javascriptvue.jsvuejs3tailwind-cssheadless-ui

Updating state in React is not possible

I am having trouble updating my state (specifically with setCoords). The API request is returning a 200 status code and the elements I need are present: https://i.stack.imgur.com/a8QzN.png Below is the code I am working with: const App = () => { co ...

javascriptreactjsreact-hooksreact-state

Select elements using jQuery in events while excluding others

I need to prevent form submission when the user presses Enter, except for three specific inputs. To prevent form submission on Enter key press, I can use this code: $(document).keydown(function(event){ if(event.keyCode == 13) { event.preventDefault(); re ...

javascriptjqueryevent-handlingaddeventlistenerjquery-events