Protractor reusable variables

Struggling to extract values from Protractor testing for reuse? No worries, I've got you covered!

Imagine this scenario: you have an app that generates new records through a form and then showcases them to the user. Upon successful addition, a message pops up with the ID of the recently created record, saying "You have successfully added an entry with the ID {{newEntry.id}}". All good so far.

You already have a bunch of tests in place to validate fields correctly, but now it's time to delve into updating those records. To do so, you need to grab the ID of the newly created record and utilize it for your next set of tests.

To kick things off, let's create a variable called 'ID' at the beginning of our test suite:

var id;

After running all validation tests and submitting a correct form, we end up checking if the success message is displayed, with the ID in this instance being 2.

describe('Add users', function() {

    var endpoint = "users";
    var id;

    correctSubmission(endpoint, id);

    function correctSubmission(endpoint, id) {
        describe('Testing correct submission', function() {
            it('should navigate back to the list page', function() {
                expect(browser.getCurrentUrl()).toBe("list/" + endpoint);
            });
            it('should display a success message', function() {
                expect(element(by.css('.alert-success')).isPresent()).toBeTruthy();
            });
            it('should get the record ID from the success message', function() {
                expect(element(by.css('.add-message')).evaluate('newEntry.id')).toEqual(2);
                id = element(by.css('.add-message')).evaluate('newEntry.id');
                return id;
            });
        });
    };
});

Great! We managed to capture the ID as 2, but here comes the tricky part - turning that ID into a globally usable value for all subsequent tests. The catch is, the current ID is trapped as an unresolved promise. You attempted using `protractor.promise.all(id)` to resolve it, only to end up logging the string instead.

Feeling a bit lost? Don't worry; we've all been there. With project deadlines looming, the pressure can be intense. Hang tight, keep experimenting, and remember that every protractor started as a n00b at some point!

Good luck on your Protractor journey!

Answer №1

Have you experimented with utilizing a protractor params configuration attribute?

exports.config = {
    params: {
        myid: 'examplevalue'
    }
};

Afterwards, you will be able to retrieve it using

browser.params.myid

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

Guide on navigating back to the previous page in Ionic when a single page can be reached through multiple routes

I'm encountering an issue with routing in my app. The problem arises when trying to navigate back to the previous page, as it always takes me back to the home/root page instead of the expected route. This becomes especially problematic when considerin ...

Transforming into a serialized division

I am working on creating a custom WISYWIG editor that generates a div with specific inner elements. The goal is to design the div (along with its inner structure), serialize it, store it in a database as a string or JSON format, and later insert it into th ...

Encountering an issue with the removal of slides when updating JSON data for angular-flexslider

Issue: Although my JSON object is updating, the slider does not update for all resorts as expected. Sometimes it fails to update when the JSON object changes. The resorts (image collections) that do not update are throwing an error stating "cannot read pr ...

The error message displayed was "Unable to define the isMultiple property for Jasmine."

Encountering an issue in my test: Failed: Cannot set property 'isMultiple' of undefined The test script that I am using is fairly standard. Here's how it looks: beforeEach(() => { fixture = TestBed.createComponent(DropdownTypeah ...

extract data from text node using selenium

Currently, I am working on a web application and testing it with Selenium. Within my code, there is a specific node that I am trying to extract data from. <span>Profile Run <span class="current">23</span> of 29</span> My main obje ...

Ways to restrict a function to a single DOM element using either its id or class

This script is responsible for dynamically loading pages on my website. It works fine, except that it currently iterates over all anchor tags a on the site, whereas I want it to iterate only through my navigation menu. Here is the navigation menu: <div ...

Modify the height using JavaScript and then revert back to the initial CSS height

Looking for assistance with a JavaScript issue that I'm currently facing. Q1: Javascript Function to Return Image Height and Margin My website layout consists of a horizontal scroll of smaller images arranged in a grid, each with different height pe ...

axios encountering a 400 bad request error during the get request

I've hit a roadblock for some time now while trying to make a call to my API to fetch data using the GET method. I keep getting a 400 bad request error in Postman, even though I am able to successfully retrieve the data with a status code of 200. I ha ...

What is the most effective method for implementing multiple textures in three.js?

After recently transitioning to three.js as my renderer, I am eager to establish a texture mapping system. However, determining the best practice for this task is a bit uncertain for me. Here is the scenario I am dealing with: My levels consist of numero ...

Locate the index and value of the item that has the most recent date

Exploring my API design const dataArr = [{ end_date: '2019-12-16' }, { end_date: '2018-12-16' }]; const latestEntry = dataArr.filter( /* Seeking the index of the item with the most recent date */ ); Interested in vanilla JavaScript ...

HTML image identifier and canvas elements

Greetings! I have a question that I've been struggling to find an answer for on Google. I'm attempting to draw an image on a canvas and initially used the "new" constructor ( ballPic = new Image(); ballPic.src = "ball.png" ) which worked fine. Ho ...

My AJAX requests do not include any custom headers being sent

I'm facing an issue with making an AJAX request from my client to my NodeJS/ExpressJS backend. After firing the request, my backend successfully receives it but fails to recognize the custom headers provided. For example: $.ajax({ type: " ...

Rearranging div placement based on the width of the screen

I am currently working on building a responsive website and I need two divs to switch positions depending on the screen width, both on initial load and when resizing. Despite my efforts in researching and trying various options, I have not been successful ...

Utilizing variable values in Google Charts with AngularJS

Hello everyone, I am attempting to display a chart using data obtained from an API. The output of the API is in the form of List<String> and not in JSON format. Here is the snippet of my JS file: google.load('visualization', '1', ...

Adding JavaScript files into Templates or HTML using webpack

Imagine having a server (like Node & Express) that serves HTML pages to clients using template files (such as pug, ejs, handlebars, twig, marko, etc.). It's a typical multi-page website setup where each page has its own JavaScript files. Can webpa ...

Tips for setting up bootstrap scrollspy in Angular 6

Working with Angular 6 and Bootstrap 4, I am trying to integrate Bootstrap's scrollspy component into my setup. However, Bootstrap requires jQuery and I am facing difficulties in getting it to work properly. HTML <header> <div class="head ...

What is the best way to display the "next" and "previous" buttons for an item in an array?

I am currently attempting to use an array that contains 4 different maps. The initial element of the array should remain constant ("sticked") while the user can cycle through the rest of the elements by clicking the next button. Once the next button reache ...

Insert a JSX element into the body of a webpage using React JSX

Is there a way to dynamically add elements to the end of the body using vanilla JavaScript? const newRecipe = <div id = "container"> <div className="recipe App" id="four" onClick={this.toggleRecipeList.bind(this)}>{this.state.recipeName} < ...

What is the best way to troubleshoot Javascript in an AngularJS partial?

While utilizing the Routing and Multiple Views feature of AngularJS, I am facing an issue where the HTML partial file (or the embedded Javascript) is not visible in Chrome's "Sources" tab of the Developer Tools. Within my index.html file, all the nec ...

After successfully sending a GET request to the API, the Next.js 13.4.3 website still does not reflect new posts added on the hosting platform

I am currently using Next.js version 13.4.3 in my app directory to create a blog site. However, I am facing an issue. When I run npm run build locally on my computer and then start with npm run start, the new posts are displayed normally after adding them ...