Once an email address is entered, kindly instruct the driver to press the tab key twice for navigation

Adding a user to a website involves entering an email address first, which is then checked against the server's list of users. However, the issue arises when the email validation doesn't occur until clicking outside the input box or pressing tab twice. This delay causes the other form fields like first name and last name to become read-only and invisible, hindering the completion of the form.

I attempted the following code snippets:

element.all(by.css("input[type$='text']")).first().sendKeys(protractor.Key.TAB);
browser.driver.sleep(3000);
//below is the first name element
element(by.xpath("(//input[@type='text'])[2]")).sendKeys("a First Name");

 element.all(by.css("input[type$='text']")).first().sendKeys('<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="61000f040c00080d00050518210f04160c0013...
//similar attempts were made using different methods.

In addition, I tried accessing the elements based on their position in an array, wondering if 'input[type$='text']:nth-of-type(2)' refers to the second item on the list, such as the first name field.

The HTML of the page contains various input fields for editing user permissions.

javascriptangularjsseleniumselenium-webdriverprotractor

Answer №1

If you are having trouble with the "TAB" method, it could be due to an issue related to Chrome version 44 and Selenium test compatibility. To resolve this, consider using the latest versions of Chrome or Firefox.

Regarding accessing elements like email addresses and names within an array, if you want to select the second input for first name, you can do so by using 

input[type$='text']:nth-of-type(2)
since it is the second item in the list.

To streamline your process, define the list of inputs once and utilize methods like first(), get(), or last():

var inputs = element.all(by.css("input[type$='text']"));
var email = inputs.first();

email.sendKeys("<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f2939c979f939b9e9396968bb29c97859f93809997869b9c91dc919d9f">[email protected]</a>", protractor.Key.TAB, protractor.Key.TAB);

inputs.get(1).sendKeys("a First Name");

If you encounter further issues, consider clicking outside of the modal as a workaround:

browser.actions().mouseMove({x: 5, y: 5}).click().perform();

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

Checking dates in a JavaScript form

var myForm = document.getElementById("form"); document.bgColor="#FFFFCC"; //page styling myForm.style.color="blue"; myForm.style.fontSize="20px"; myForm.style.fontWeight="400"; myForm.style.fontFamily="arial"; function validateForm() { var firstname = d ...

javascript

Removing all Null Form Inputs from the Document Object Model upon Submission utilizing JavaScript

I am currently working on a conditional Shopify form that was passed down to me from another developer. The form utilizes JavaScript/Jquery for field validation, ensuring that all mandatory fields are completed before proceeding to the next step. After mak ...

javascriptjqueryformsvalidationshopify

Switch out the icons within a return statement in JavaScript

Help! I have 5 empty star icons (<StarBorderIcon/>) displayed for a product on the material-ui website. I need to replace them with filled star icons (<StarIcon/>) based on the rating entered into a function. I attempted to use replace(), but i ...

javascriptreactjsmaterial-ui

Utilize three.js within a Google web app script - unable to incorporate the script module type for loading three.js

Looking to incorporate three.js into a Google Web Script to load 3D CAD files, I discovered that the installation instructions on threejs.org specify the script needs to be of "module" type. However, after researching for several days, it seems that Google ...

javascriptgoogle-apps-scriptthree.js

Ways to reposition JavaScript output within a webpage

I am new to HTML, CSS, and JavaScript and I have a question regarding how they work together. I can use JavaScript to display objects on the page, but I'm unsure how to move them around like other elements. Is CSS the solution for this? Any advice w ...

javascripthtmlcss

After zooming in on the canvas and panning, I encountered a problem where I was unable to drag objects within the canvas. Instead, the canvas continued to pan as I tried to move the objects

1) I have the ability to pan the canvas and drag images without scaling or zooming. 2) When scaling or zooming, I can still drag images within the canvas. 3) However, if I try to pan the canvas after zooming and then attempt to drag images, only the canv ...

javascriptjquerycanvas3d2d

Vuetify alters the text color of the <vs-button> element

Outline of the Issue Upon installing vuetify, the text color of my <vs-button> has changed from white to black. Despite trying to adjust the color in the vuetify theme, I am unable to change it back. I have also created a custom filter rule using po ...

javascriptvue.jsvuetify.js

Dealing with numerous statements in the Run Keyword If command in Robot Framework

I am looking to run multiple statements only if a certain condition is met in Robot Framework. Here is the code snippet to review: Please note that this is just a sample code *** Settings *** Library Selenium2Library Library Collections *** Keywor ...

seleniumrobotframework

The issue with Internet Explorer failing to adhere to the restrictions set on maximum width and

I'm attempting to scale my images precisely using CSS: HTML: <div id="thumbnail-container"> <img src="sample-pic.jpg"/> </div> CSS: #thumbnail-container img { max-height: 230px; max-width: 200px; } In this scenario, ...

javascripthtmlcssinternet-explorer

Having trouble accessing the value of a node in JavaScript, as it keeps returning as "null"

Experimenting with converting HTML elements into lists. The objective is to generate a list of all values in a table upon clicking the "page next" buttons on it. Afterward, an alert should display the value of the first item in the list, which corresponds ...

javascriptjqueryhtmllistnodes

Angular UI date picker is currently experiencing an issue where the short date format is displaying incorrectly, showing past dates

The UI date picker is displaying the wrong date when a short date format is selected and a date from a previous year like 1921 is chosen. Instead of showing 1921, it displays as if it were in year 2021. This behavior is not correct and should show the sele ...

angularjsangular-ui-bootstrapangular-ui-datepicker

What should I designate as the selector when customizing dialog boxes?

I am attempting to change the title bar color of a dialog box in CSS, but I am running into issues. Below is the HTML code for the dialog box and the corresponding CSS. <div id="picture1Dialog" title = "Title"> <p id="picture1Text"> ...

javascriptjqueryhtmlcss

Tips on stopping slideToggle from opening and closing when clicked for the first time

When using the slideToggle function, I'm encountering an issue where the content div briefly shows on the first click but then immediately slides closed. Subsequent clicks work as expected and slide open correctly. This is the Jquery script I have be ...

javascriptjquerycssslidetoggle

Creating a ROT13 cipher in JavaScript

In my JS function, I need to handle a variable called i. My goal is to encode this variable using ROT13 before proceeding with the function. The challenge lies in decoding the variable and integrating it into the script. I came across a JavaScript implem ...

javascriptrot13

Encountering a java.lang.NullPointerException while attempting to utilize @FindBy in WebDriver

Whenever I attempt to locate elements on a webpage using the @FindBy annotation, I keep encountering java.lang.NullPointerException. Here is my code snippet - public class PageObject{ WebDriver driver; @FindBy(id = "email") WebElement searchBox; ...

javaseleniumnullpointerexceptiontestngpageobjects

Ways to determine if an element is at the top of a page

I need help with a test case that involves checking if the title scrolls up to the top of the page when a button is clicked. The challenge is that there is a default header on the page, so the title should scroll below that. How can we verify this scenar ...

javascriptselenium

Tips for exporting an array of dynamic JSON objects to CSV using Angular

I am facing a challenge in exporting an array of JSON objects to CSV as the number of key-value pairs can vary, leading to additional columns in some objects. Currently, I am using the Angular2CSV package for export functionality, but it requires all colum ...

javascriptangulartypescriptcsv

JavaScript code using the Jquery library to retrieve the following article from 'cached memory'

I am aware of the easier CSS options for my question, but I am determined to learn JS (Jquery), so please bear with me. My plan: Menu-items are connected to articles within my content division. Initially, only the first article (#intro) is displayed. All ...

javascriptjquerycsshtml

What is the best way to implement a Fibonacci sequence using a for...of loop?

**Can someone show me how to generate Fibonacci numbers using the for...of loop in JavaScript?** I've tested out the following code and it's giving me the desired output: function createFibonacci(number) { var i; var fib = []; // Initi ...

javascript

A perfect illustration showcasing the distinction in practical applications for the operators `=` and `&`

Although I grasp the technical distinction between using = and & in isolated scopes, such as understanding what is assigned to isolate scope property: // "=" isolateScopeProperty = getter(parentScope) // "&" isolateScopeProperty = function(locals ...

angularjs