At what point should I expect a promise in Protractor to be resolved?

Despite there being similar inquiries on this topic, I am struggling to comprehend them.

Allow me to illustrate with an example, where my task is to click a button and verify the URL.

Initially, I thought it should be coded as:

element(by.id('button')).click();
expect(browser.getCurrentUrl()).toContain('asyncisconfusing');

I understand that 'expect' manages its promise, but what about the 'click'? Shouldn't it be handled like this?

element(by.id('button')).click().then(() => {
    expect(browser.getCurrentUrl()).toContain('asyncisconfusing')
})

Or does protractor/webdriver handle this automatically?

javascriptselenium-webdriverpromiseprotractorangularjs-e2e

Answer №1

According to the concept, as Protractor keeps a lineup of promises through Control Flow and operates synchronously with an AngularJS application being tested, it is usually unnecessary to explicitly resolve promises unless a tangible value is required for subsequent processing. Basically, it is advised to follow this format:

element(by.id('button')).click();
expect(browser.getCurrentUrl()).toContain('asyncisconfusing');

However, in practice, explicitly resolving promises from click(), or incorporating explicit waits using browser.wait() proves beneficial in handling intermittent and unpredictable timing issues.

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 sets canvas and webgl renderer apart in the world of three.js?

Attempting to showcase a sphere using three.js, but encountering issues when rendering with canvasRenderer due to the appearance of grey lines on the sphere. View the code here: http://jsfiddle.net/jzpSJ/ See the screenshot here: However, when rendering ...

javascriptoperahtml5-canvaswebglthree.js

The hydration error in next js is causing this code to malfunction

Why am I encountering a hydration error with this code in NextJS? The Items variable is an array of ReactNode's. Any suggestions for an alternative approach? I've searched extensively for information but haven't found anything related to Nex ...

javascriptreactjsnext.jsserver-side-rendering

Replacing text within a paragraph using D3.js

Is it possible to develop a D3 function that can choose a paragraph, delete its content, and replace it with new text? If so, what would be the most effective way to accomplish this? I attempted the following: d3.select("#triggerButton") .on("clic ...

javascripttextd3.jsbuttonclick

Comparing the syntax of JSON to the switch statement in JavaScript

I recently came across a fascinating post on discussing an innovative approach to utilizing switch statements in JavaScript. Below, I've included a code snippet that demonstrates this alternative method. However, I'm puzzled as to why the alter ...

javascriptjson

After performing a Vuex action on one Vue.js component, the update is not reflected on another Vue

I am facing an issue with a component that renders a booking table. When I update my store in another component, the table does not get updated even though the store and computed properties are updated. I suspect that the problem lies with the filter not b ...

javascriptvue.jsvuex

What is the method for passing a jsconsole argument in Firefox to initiate the browser console?

Whenever I launch Firefox, I want to open the **Browser Console** for my session. Browser: Firefox v 61 To launch Browser Console for firefox: 1. Open firefox (and go to any URL) 2. Press Ctrl+Shift+J (or Cmd+Shift+J on a Mac) Link : https://develope ...

firefoxselenium-webdrivermozilla

What is the process for sending an HTTP post request with a React/Typescript frontend and a C#/.Net backend?

In the frontend code, there is a user login form that accepts the strings email and password. Using MobX State Management in the userstore, there is an action triggered when the user clicks the login button to submit the strings via HTTP post. @action logi ...

javascriptc#.netreactjstypescript

Adjust the header image as you scroll

Currently, I have a static image in the header of the page. I'm looking to have the image change to a different one when half the page has been scrolled. Do I need to utilize JavaScript for this functionality or is it achievable with CSS alone? bo ...

javascripthtmljquerycss

The type 'number' cannot be assigned to the type 'Element'

Currently, I am developing a custom hook called useArray in React with TypeScript. This hook handles array methods such as push, update, remove, etc. It works perfectly fine in JavaScript, but encounters errors in TypeScript. Below is the snippet of code f ...

javascriptreactjstypescriptreact-custom-hooks

To clear the previous result of an AJAX call in JavaScript, reset the function or variable

I encountered a problem previously, and now another issue has come up. It appears that the previous result from my ajax JavaScript is still being displayed, and I need to prevent that from happening. I've tried deleting the variable, setting it to und ...

javascriptphpjqueryajax

The perplexing configuration of a webpack/ES6 project

I am currently in the process of setting up my very first ES6 and webpack "application" where I aim to utilize classes and modules. However, each time I attempt to transpile the application using the webpack command, I encounter the following error: $ web ...

javascriptnpmwebpackecmascript-6es6-class

Ruby on Rails and JSON: Increment a counter with a button press

How can I update a count on my view without refreshing the page when a button is clicked? application.js $(document).on('ajax:success', '.follow-btn-show', function(e){ let data = e.detail[0]; let $el = $(this); let method = this ...

javascriptruby-on-railsjson

Form submission is failing due to a single checkbox not being submitted and an error is occurring with MultiValueDictKeyError during

<body ng-app=""> {% extends "pmmvyapp/base.html" %} {% load crispy_forms_tags %} {% load static %} {% block content%} <div class="col-md-8"> <form method="post" action="/personal_detail/"> {% csrf_token %} <div class="form-group" ...

javascriptpythonangularjsdjango

Elegant CSS background image fade effect

Having a small JS script that functions properly, but encountering an issue when quickly hovering over buttons causing the smooth transition effect to not work as desired. This abrupt change in image is quite unappealing. Any help would be greatly appreci ...

javascriptcsscss-animationscss-transitions

Loading custom places in ArcGIS from a file or database

Hey there, I was wondering about loading custom places with Arcgis similar to Google maps loading from a .xml file. I noticed that Arcgis uses examples saved in .json format, but when I tried putting the example .json on my local server it wouldn't lo ...

javascriptjsondatabasefilearcgis-js-api

Mastering the Art of Tallying Select Choices in Protractor

Experiencing an issue with counting options in the select attribute during my test. Here is the code snippet: it('should verify the number of options', function()) { expect(element(by.id('sorting_options')).all(by.tagName('optio ...

javascriptselectselenium-webdriverprotractor

Webpage refreshing when resizing browser

Hey there, I'm facing an issue where my HTML website restarts whenever the browser size changes. Can someone please help me fix this? You can check out my website here I have uploaded my code files here: Code Files Link ...

javascripthtmlcssreload

Filtering ng-repeat in AngularJs based on nested data properties

Within my data tracking appointments, I have information on months, weeks, days, and timeslots. When it comes to the listing view, displaying "weeks" is unnecessary (although important for other reports). To eliminate days without appointments, I can use ...

javascriptangularjs

Is it better to utilize a sizable JavaScript file or opt for a compact one?

I recently created a JavaScript file with over 6000 lines of code for various sections of my website. I'm debating whether to keep it as one large file or break it up into smaller parts and call them in their respective sections. What do you think? ...

javascript

Exploring the attributes of cycled values in Vue.js

Currently, I am iterating over a list as shown below: <li v-for="item in filteredParentItems" v-if="item.action === 'list'" v-on:click="getNextPath" v-bind:data-next-path="item.nextPath" v-bind:data-action="item.action ...

javascriptvue.jsvuex