Protractor tests are successful when run locally, but encounter failures when executed on Travis-CI

I recently integrated end-to-end tests using Protractor into my AngularJS application. Testing them locally showed that they all pass, but upon committing to GitHub and Travis for CI, most of the tests fail.

The failing tests seem to be those requiring navigation to different states (utilizing Angular UI Router).

scenarios.js

describe('Test', function () {

    beforeEach(function () {
        browser.get('/');
    })

    it('should navigate to the user page', function () {

        //browser.get("/");
        browser.sleep(3000);
        var button = element(by.id('createSession'));
        button.click().then(function () {
            browser.sleep(3000);
            expect(browser.getLocationAbsUrl()).toEqual("/user");
        });
    });

    // Further test cases go here...

});

protractor.conf.js

    exports.config = {

      allScriptsTimeout: 11000,

      specs: [
        "scenarios.js"
      ],

      capabilities: {
        "browserName": "chrome"
      },

      baseUrl: "http://localhost:8000/",

      framework: "jasmine",

      jasmineNodeOpts: {
        defaultTimeoutInterval: 30000
      }

    };

package.json

    {
       // Package details go here...
}

.travis.yml

language: node_js
node_js:
  - '4.4'

addons:
  firefox: "latest"

// Configuration details go here...

It appears that the issue arises due to how the routing is handled with angular-seed's template. Any insights on why this discrepancy in test results is occurring?

Answer №1

It would be beneficial to understand the specific errors you are encountering, but regardless, there are a couple of evident causes...

  1. One possibility is that CI is operating in headless mode (via XVFB), while your local environment is not. This discrepancy can lead to timing issues.
  2. Excessive use of sleep commands may result in varying behavior of your tests across different environments (e.g., CI versus local). The presence of multiple sleep statements suggests possible flaws in test design. Additionally, if your application is not Angular, it is advisable to manage waits manually instead of relying on sleeps. However, if your application is Angular, the frequent use of sleeps raises questions about their necessity.

I hope this information provides some clarity for you.

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

Using expect() within the .then() function when writing Jasmine unit tests for AngularJS

I'm currently struggling with the .then() function while trying to implement Jasmine unit testing. Here is the code that's giving me trouble: describe("getBuilding", function () { it("checks getBuilding", function () { var id_building = 4; ...

The jsonGenerator is unable to process strings containing spaces

Hey, I'm having trouble passing a string with whitespaces to my JavaScript function using jsonGenerator. Here's the code snippet: jGenerator.writeStringField(cols[8], ap.getContentId() != null ? "<img src='img/active.png' onclick=au ...

Rendering a page for a missing resource

Within the App.js file, the routes component is currently only wrapping a portion of the website. However, I would like the NotFound component to be rendered for the entire page if an incorrect URL is entered. Can you please provide guidance on how this ...

Converting PHP variables to JavaScript using AJAX and XML communication

In order to gain a deeper understanding, I am determined to tackle this task without relying on jQuery. This means I am willing to reinvent the wheel in order to fully comprehend how it functions. My research has led me to believe that AJAX is the key to a ...

Avoid API calls by using connect-history-api-fallback

I have implemented the connect-history-api-fallback along with the page.js router. page('/', index); page('/about', about); page(); function index() { console.log("viewing index"); } function about() { console.log("viewing ...

Conceal any elements that have a class containing specific text

In my HTML file, I have multiple <span> elements with the class of temp_val that include a 1 value which I need to hide. These elements are placed throughout the document. Below is an excerpt from my HTML code: <div class="row" style="float: lef ...

Lambda function failing to execute Auth0 methods through the Auth0 node-auth0 SDK

I am working with a lambda function that triggers when a message is added to the SQS queue. Within the message, there is a userId that I want to connect to using the Auth0 node SDK. The code snippet for my GetUserDetails function below shows that it logs ...

Choose all the checkboxes alongside the markers on Google Maps

On this page , I have included a checkbox labeled "Select All" at the bottom, which automatically checks all other checkboxes. Although the code below achieves what I want, the marker icons are not showing up. How can this be fixed? $(document).ready(func ...

Organizing grid elements within the popper component

I am struggling to align the labels of options in the AutoComplete component with their respective column headers in the popper component: https://i.stack.imgur.com/0VMLe.png const CustomPopper = function (props: PopperProps) { co ...

Arrange an array of objects based on boolean values first, followed by numerical values in JavaScript

I am facing a challenge where I have an array of objects that need to be sorted based on two rules, following a specific order: Firstly, objects with the "departeYet" property set to true should come first. Secondly, the objects must then be sorted numeri ...

Show only a cropped section of a resized image within a div

I have a script that calculates the best region of an image to display within a specific div size. This calculation is done in PHP and generates a JSON output like this: {"scale":1.34,"x1":502,"x2":822,"y1":178,"y2":578} The image in question has dimensi ...

Creating tube-like geometry in intervals using three.js

Is there a way in Tube Geometry(Three.js) to plot and render only a portion of the tube at a time, with the option to continue plotting from that point after a set interval or timer? ...

Ways to prevent websites from switching to landscape mode

Is there a way to prevent landscape mode on my website and restrict users to portrait mode, especially for devices with screen widths below 777px? I have custom headers that take up fixed position space of around 100px on the screen. If it is possible to ...

Trouble with a third-party library component not functioning properly on the server side in a Next.js environment

I've encountered a puzzling issue lately in my work. Recently, I started using the new NextJS v13 with React server components. I'm integrating it into a project that depends on a small private third-party library I created and shared among mul ...

Error message from Angular development server: Channel is reporting an error in handling the response. The UNK/SW_UNREACHABLE options

After recently installing a new Angular app, I encountered an issue while running 'ng serve'. The application initially loads without any problems, but after a few seconds, I started seeing a strange error in the console. Channel: Error in handle ...

At what point does Math.random() begin to cycle through its values?

After running this simple test in nodejs overnight, I found that Math.random() did not repeat. While I understand that the values will eventually repeat at some point, is there a predictable timeframe for when it's likely to happen? let v = {}; for ( ...

What is the best approach for combining my directive and scope object within the view?

In my controller, I have an array of objects called Well. Each Well object has various properties, including Location, which stores strings like "A1", "B4", "B13", etc. These locations represent positions on a grid where the letter indicates the row and th ...

cheerio scraping results in an array that is devoid of any data

Struggling to extract data from a website with the URL https://buff.163.com/market/csgo#tab=buying&page_num=1 using request-promise and cheerio. Check out my code snippet below: const request = require('request-promise'); const cheerio = requ ...

Enhance your Next.js application by including the 'style' attribute to an element within an event listener

I am currently trying to add styles to a DOM element in Next.js using TypeScript. However, I keep getting the error message "Property 'style' does not exist on type 'Element'" in Visual Studio Code. I have been unable to find an answer ...

Creating a Javascript function to turn lights off using CSS manipulation, similar to the feature found

Is there a way to use JavaScript to obscure all elements on a page except for one specific HTML element? This web application is optimized for Chrome, so CSS3 can also be utilized. ...