The Protractor tool (node:9208) threw an UnhandledPromiseRejectionWarning due to an ElementNotVisibleError, indicating that the element is not interactable. Despite this

I am attempting to interact with an element using protractor but encountering the following error

(node:9208) UnhandledPromiseRejectionWarning: ElementNotVisibleError: element not interactable
  (Session information: chrome=69.0.3497.92)
  (Driver information: chromedriver=2.42.591088 (7b2b2dca23cca0862f674758c9a3933e685c27d5), platform=Windows NT 6.1.7601 SP1 x86_64)
    at Object.checkLegacyResponse (........\node_modules\selenium-webdriver\lib\error.js:546:15)
    at parseHttpResponse (........\node_modules\selenium-webdriver\lib\http.js:509:13)
    at doSend.then.response (........\node_modules\selenium-webdriver\lib\http.js:441:30)
    at process._tickCallback (internal/process/next_tick.js:68:7)Error
    at ElementArrayFinder.applyAction_ (........\node_modules\protractor\built\element.js:459:27)
    at ElementArrayFinder.(anonymous function).args [as click] (........\node_modules\protractor\built\element.js:91:29)
    at ElementFinder.(anonymous function).args [as click] (........\node_modules\protractor\built\element.js:831:22)
    at selenMethods.clickElement (........\folders\utils\SelenMethods.js:49:26)
    at ........\folders\pages\homePage.js:28:29
    at process._tickCallback (internal/process/next_tick.js:68:7)

Below is the snippet of HTML Code

<a href="#inviteUser" id="menuBtnAdduser" class="list-group-item list-group-child-item close-menu-item list-item-heading ng-scope" translate="templates.usersTable.addUser" xpath="1"><span class="ng-scope">Invite new user</span></a>

Here is the protractor script used to interact with the element

var EC = protractor.ExpectedConditions;
browser.wait(EC.elementToBeClickable(elemen), 4000);
element(by.xpath("//a[@id='menuBtnAdduser']/span[contains(text(),'Invite new user')]"));
javascriptseleniumselenium-webdriverprotractorwebdriverwait

Answer №1

If you want to click on a specific element, you can use the following approach:

var EC = protractor.ExpectedConditions;
browser.wait(EC.elementToBeClickable(element), 4000);
element(by.xpath("//a[@class='list-group-item list-group-child-item close-menu-item list-item-heading ng-scope' and @id='menuBtnAdduser']/span[@class='ng-scope' and contains(.,'Invite new user')]"));

Answer №2

Attempt to click by utilizing Href:

 element(by.cssContainingText('[href*="#inviteUser"]', 'Invite new user'))

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

What could be causing my input box to act strangely when users attempt to input information?

I seem to be facing an unusual issue with the <input onChange={this.handleArticleId} value={this.props.articleIdValue} placeholder="article id"/> field. Whenever I try typing something, the letter only appears in the input box after clicking on the s ...

javascriptreactjsdebuggingreduxreact-redux

PHP-generated AngularJs Select Element

I'm facing an issue with my PHP function in my AngularJS application. I have created a function to select a default option, but it's not displaying the desired value. Here is the function code: function qtyList($selectName, $selectQty){ $st ...

javascriptphphtmlangularjs

Navigate to a different subdomain and place a cookie on the newly redirected subdomain

The version of Express is 4.x NodeJS is running on version 12.x At a.example.com, I have a listener for the GET method that redirects to b.example.com and sets a cookie on b.example.com. app.get('/foo', (req, res) => { res.cookie(' ...

javascriptnode.jsexpresscookiessubdomain

What crucial element is absent from my array.map function?

I have successfully implemented a table with v-for in my code (snippet provided). However, I am now trying to use Array.map to map one array to another. My goal is to display colors instead of numbers in the first column labeled as networkTeam.source. I at ...

javascripthtmlvue.jsvuejs2

ReferenceError: _jquery2.default.ajax is not a function" encountered in a React Native application

I have been attempting to use jQuery to retrieve xml data from an internal website. My expo project setup is quite basic and resembles the following: import React from 'react'; import { StyleSheet, Text, View } from 'react-native'; imp ...

javascriptreactjsreact-native

Next.js project encountered a TypeError with message [ERR_INVALID_ARG_TYPE]: The "to" argument is expected to be a string type

While working on a Next.js application, I came across a TypeError that is linked to the undefined "to" argument. This issue pops up when I launch my development server using npm run dev. Despite checking my environment setup and project dependencies, I hav ...

javascriptnode.jsnext.js

Creating multi-dimensional arrays using array lists with Axios and Vue.js

My knowledge of axios and JavaScript is limited, and I find myself struggling with creating a multi-dimensional array. 1. This is how I want my data to be structured : https://i.stack.imgur.com/kboNU.png userList: [ { ...

javascriptarraysvue.jsmultidimensional-arrayaxios

The parent-child relationships in MongoDB

In my Meteor application, I have created two collections: ActivityCards and Users. Inside the ActivityCard collection, there is a reference to the User like this: { "_id" : "T9QwsHep3dMSRWNTK", "cardName" : "Guntnauna", "activitycardType" : 1 ...

javascriptmongodbmeteorcollections

Unable to properly extract information from a diverse class

I have exhausted numerous methods attempting to resolve this issue. Just as I thought I had found the solution, an error popped up: AttributeError: 'WebElement' object has no attribute 'findElements'. At present, my code includes: impo ...

pythonselenium-webdriverweb-scraping

What is the method for moving one div above or below another div using the scroll bar?

Here's the scenario I'm facing: I have rows with buttons that, when clicked, reveal a set of options. The challenge is that depending on where the row is located on the page, the settings need to open either above or below the button. When the b ...

javascriptjquerycss

I am currently exploring the ExpectedConditions class in search of the onChange method

During testing of the application I am currently working on, I have observed that when I click a submit button, a grid refreshes. There is a row count available to me in a span element, and my intention was to achieve something like: (new WebDriverWait(dr ...

javaseleniumselenium-webdriver

Guide to decoding JSONP data sent from a remote server

Working on retrieving data using JSONP. After observing the returned data in Firebug, I can confirm that it is being returned correctly. However, I am facing a challenge in figuring out how to parse it. Is the data returning as a nested array? The callback ...

javascriptjqueryajaxjsonjsonp

Navigating JSON data with unexpected fields in Typescript and React.js

Looking to parse a JSON string with random fields in Typescript, without prior knowledge of the field types. I want to convert the JSON string into an object with default field types, such as strings. The current parsing method is: let values = JSON.parse ...

javascriptreactjstypescript

Display available times and store them in a dictionary

I am currently developing a timetable system and facing an issue with retrieving all the free slots (time slots where the student has no lectures scheduled). Instead of printing out the entire timetable, I need to find a way to store these free slots. Curr ...

pythonpandasdataframeseleniumselenium-webdriver

How to troubleshoot Path Intellisense in VScode when using jsconfig.json for Next.js

In the structure of my project, it looks like this: jsconfig.json next.config.json components |_atoms |_Button.jsx |_Button.module.scss |_... |_... ... Within the jsconfig.json file, I have specified the following settings: { ...

javascriptvisual-studio-codeautocompletenext.js

In the frontend, I seem to have trouble accessing elements of an array using bracket notation, yet strangely it works flawlessly in the backend

I am encountering a peculiar issue as a newcomer to coding. I have an array retrieved from the backend database, and my goal is to access individual elements of this array in the frontend using bracket notation. While I can successfully access the elements ...

javascriptreactjsarrayscomponents

Tips for managing large amounts of data retrieval from an API

As a beginner, I am attempting to retrieve data from an API and display it using the v-for directive. However, this process is causing my app to lag. It freezes when new data is fetched or when I search within the list. The following code snippet shows whe ...

javascriptvue.jsvuejs2vuejs3vuetify.js

Expanding a class functionality by incorporating a method through .prototype

My goal is to define a class called "User" and then add a method to the class using the "prototype" keyword. I want the method "who_auto" to be accessible to all future instances of "User". When testing this code in JSFiddle, I encountered the error messa ...

javascriptclassoopprototypees5-compatiblity

What is the best way to extract all the links from a Google search using selenium-python?

driver.get("https://www.google.com") search = driver.find_element_by_name("q") search.clear() search.send_keys("tesla") search.send_keys(Keys.RETURN) time.sleep(3) url_list = [] results_list = driver.find_elements_by_tag_nam ...

pythonselenium

Adjust the size of the font for the placeholder text

I've been attempting to adjust the font size of the placeholder text. I added the font size property to the listed classes below, but for some reason, it's not taking effect. Could you please advise me on how to resolve this issue so that I can ...

javascripthtmlcssreactjsmaterial-ui