Waiting for URL to update with Protractor

Previously, I have found a clever way to wait for a URL change by using the following code snippet:

browser.wait( function() {
    return browser.getCurrentUrl().then(function(url) {
        return /myURL/.test(url);
    });
}, 10000, "url has not changed");`

However, I'm attempting to create a method that allows me to pass 'myURL' as a variable so I can use it with different sites, but it's not working.

In my Page Object file, I've tried the following approach:

this.waitUrl = function(myUrl) {
    browser.wait( function(myUrl) {
        return browser.getCurrentUrl().then(function(url, myUrl) {
            return myUrl.test(url);
        });
    }, 10000, "url has not changed");
};

Does anyone know if this is even possible and how to do it correctly if so?

Answer №1

Update (July 2016): There is a solution available with Protractor 4.0.0 using the built-in Expected Conditions Protractor 4.0.0 by utilizing urlIs and urlContains.


Original answer:

Instead of passing myUrl inside the then function, it can be accessed from the page object function scope:

browser.wait(function() {
    return browser.getCurrentUrl().then(function(url) {
        return myUrl.test(url);
    });
}, 10000, "url has not changed");

An improvement would be to define it as an Expected Condition:

function waitUrl (myUrl) {
    return function () {
        return browser.getCurrentUrl().then(function(url) {
            return myUrl.test(url);
        });
    }
}

This way, you can use it like this:

browser.wait(waitUrl(/my\.url/), 5000);

Answer №2

Looking for a practical illustration for Protractor versions 4.0.0 through 5.3.0?

You can implement "ExpectedConditions" as shown below:

var expectedCondition = protractor.ExpectedConditions;
// Waiting for the URL containing 'login page'.
browser.wait(expectedCondition.urlContains('app/pages/login'), 5000);

If you wish to confirm this through an end-to-end test.

it('should navigate to login page', function() {
    loginPage.login();
    const EC = protractor.ExpectedConditions;

    browser.wait(EC.urlContains('app/pages/login'), 5000).then(function(result) {
        expect(result).toEqual(true);
    });

});

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

Format for displaying node exceptions

In the world of Node.js, failing to catch a thrown exception results in a default display that looks like this: C:\tptp-parser\index.js:19 throw e ^ SyntaxError: Unknown language (33:7) at err (C:\tptp-parser\index ...

Transforming cURL commands into jQuery AJAX

Attempting to perform an API call using jQuery AJAX with curl configuration provided by the backend team. curl -X POST \ https://example1.com/api/sms \ -H 'Accept: application/json' \ -H 'Cache-Control: no-cache' & ...

Bringing the value from the codebehind to the jquery function on the client side

Here is the code snippet from my asp.net web application's code behind where I have integrated another web service: [WebMethod] public static string GetData(string name) { WEBSERVICE.Service1 Client = new Service1(); string Nam ...

Is there a way to use the same color picker tool for adjusting both the background and text colors simultaneously?

My goal is to create functionality where the user can change the background color by clicking on the background of the div, and change text color by clicking on the text within the div. var box1 = document.querySelectorAll('.color1'); var pic ...

The calendar on the datetime picker is malfunctioning and not displaying any dates

The date and time picker feature appears to be malfunctioning on my website. I suspect it may be due to a conflict between the full calendar and gull admin theme that I am using. I have attempted various solutions but nothing seems to be working. How can ...

Attempting to create a JavaScript function that will show a JSON array when the next button is clicked

I am facing an issue with displaying a JSON array based on specific start and end indices. Even though I managed to display the entire array, the first button click does not seem to work as expected. Upon clicking the first button, an error message "this.d ...

Having difficulty launching the sapper app in production mode

Having trouble starting my sapper project in production mode. When running npm run start, the following output appears on the console: niklas@Niklass-iMac project-name % npm run start > [email protected] start /Users/niklas/path/to/project > node _ ...

In the world of GramJS, Connection is designed to be a class, not just another instance

When attempting to initialize a connection to Telegram using the GramJS library in my service, I encountered an error: [2024-04-19 15:10:02] (node:11888) UnhandledPromiseRejectionWarning: Error: Connection should be a class not an instance at new Teleg ...

How can we toggle a function to expand or collapse fields generated in an ngFor loop?

One of my challenges involves managing a div that is repeated using *ngFor in Angular. This results in multiple divs on the page, each containing collapsible fields that can toggle. Essentially, I have nested collapsible fields within other collapsible fie ...

What techniques can be employed to utilize multiple JavaScript files?

Hey there, I am facing an issue while trying to execute multiple JavaScript codes. My first script is running smoothly with the change function, but the second one seems to be causing some trouble. Can anyone guide me on how to effectively run multiple J ...

Is JavaScript not having an impact on your HTML code?

I am attempting to create a dynamic number change when the user interacts with the "range-slider" element, but the number is not updating as expected. Below is the code I have written: var rangeSlider = function() { var slider = $(".range-slider"), ...

The position property in CSS does not keep the <script> tag fixed in place

Struggling with keeping a .js validation script in a fixed position on a webpage. Here is the CSS code: div.fixed { position: fixed; bottom: 0; left: 0; } HTML <div class="fixed"> <script src="http://my.gblearn.com/js/javascript.js"></ ...

Unable to perform a GET request to an API with custom headers

I am attempting to send a GET request to an API, but I am encountering an error: Failed to fetch. What could be causing this issue? const getData = () => { fetch("https://test-docs.stores.kg/api/categories", { method: "GET", he ...

Creating a JavaScript array with each element being a pair of objects

Hey there! I'm trying to create an array where each element is a pair of objects. Something like this: var Shelves = new arr[][] var books = new Books[] ; Shelves[book[i], book[j=i+1]], [book[i+1], book[j=i+1]] and so on......; I know how to use a f ...

Error: Attempting to access properties of an undefined value (reading '0') within the Array.map function

Take a look at this image illustrating the issue I'm facing export const FlipData = [ { id: "1", tittle: "IT Manpower Consultant", points: [ "Devops and IT consulting", "Renting Servers&quo ...

Utilizing single-use bindings for a unique element directive

I'm working on a new directive called <call-card> and I want to implement one-time bindings as an exercise for optimizing future directives. Here is the definition object for this directive: { restrict: 'E', controllerAs: &ap ...

How can you tell if a specific keyboard key is being pressed along with the CTRL button?

Is there a way to call functions when a specific key is pressed along with the CTRL key (on a Windows system)? While testing for a particular keyCode, I used event.keyCode. I researched the codes assigned to each key and assumed that 17 + 73 would represe ...

Troubleshooting jQuery: Unable to refresh the webpage

I have a PHP page that contains a form, checkboxes, and a submit button. I added an if statement to execute a PHP script I created when the button is clicked, which deletes certain values from the selected rows. The button functions properly and changes s ...

JSON input that appears to be correct but unexpectedly ends

I'm currently coding a discord bot and came across this snippet: function addFunds(id, amount){ accounts = fs.readFileSync("accounts.data", 'utf8'); console.log(JSON.parse(accounts)) var obj = JSON.parse(accounts); var i; for (i in ...

Demonstrate the proper implementation of a Stepper component using Material UI in a React.js

I am trying to display a responsive screen using "progressive forms" with React.js and Material Ui. I have implemented the Stepper component for this purpose, but when I click the "Next Button", the button is hidden but the next step content with the text ...