Cypress test not finding element when ran in Gitlab CI

Question

I'm using Cypress for automated testing. An app built in React with Next.js

The tests pass locally with cypress open and cypress run but fail within GitLab CI.

I access the URL cy.visit('localhost:8000/cadastro/login/?next=/')

type username cy.get('#id_username').type("username_here"),

type password cy.get('#id_password').type("password_here")

and click on the Signin Button cy.get('.btn').click()

everything is working fine, but when the page enter in the app and reload to localhost:8000/#/, I verified a message containing "Hello, firstName!",

cy.get('#dropdownMenuButton').contains(`Hello, ${firstName}`);

and I get this error output from CI runner:

AssertionError: Timed out retrying after 4000ms: Expected to find element: `#dropdownMenuButton`, but never found it.

I tried to increase timeout but doesn't work

Answer 1

It sounds like you need to start the sever in Gitlab, here Next.js Cypress GitLab CI example is an example of how to do it

Essentially,

package.json

{
  "scripts": {
    "cy:citest": "start-server-and-test start http://localhost:3000 cy:run",
    ...

Answer 2

Have you tried to clear the GitLab runners cache and re-run the pipeline? That should be the first thing to do.