赛普拉斯ReactJs测试无法在Gitlab CI上找到元素

时间:2019-08-30 01:32:13

标签: reactjs integration-testing gitlab-ci next.js cypress

我正在用Cypress测试一些Reactjs UI。当我使用localhost:3000在本地运行测试时,测试通过,但是当我推送到Gitlab CI时,测试失败,并且错误如下所示。

CypressError: Timed out retrying: Expected to find element: '.css-iyxtew', but never found it.

这不是由于服务器延迟,我尝试徒劳地增加等待时间。我的猜测是,Gitlab上的localhost服务器不正常。请帮助我任何解决方案。

beforeEach(() => {
    cy.visit('localhost:3000')
    eslint-disable-next-line no-return-assign
    cy.window().then(win => win.onbeforeunload = undefined)
  })

  it('Does not do much!', () => {
    expect(true).to.equal(true)
  })

  it('.should() - make an assertion about the current page', () => {
    cy.get('[data-cy=loader]').find('h6').should('be.visible')
    cy.get('body').should('be.visible')
    cy.get('.css-iyxtew').should('be.visible')
    cy.get('[data-cy=index-page]').find('[data-cy=heading]').should('be.visible')

     cy.get('.css-iyxtew').find('li').should('have.length', 2)
       .find('.login').find('.css-17nm302-Button')
       .should('have.css', 'background-color', 'rgba(0, 0, 0, 0)')

    cy.get('.main-section').should('exist').find('.left-nav ').should('exist')
      .find('.left-margin-pane').should('exist')
     cy.get('.heading').find('.sub-heading')
       .contains('Choose a phase below to browse our growing collection of adaptive implementation resources')
  })

1 个答案:

答案 0 :(得分:0)

一段时间后我发现的解决方案是,我还需要向CI环境中添加env变量以使服务器运行。

这是gitlab-ci.yml

variables:
  GET_PHASE_KITS: $GET_PHASE_KITS
  GET_KIT: $GET_KIT
  GET_PHASE_ASSETS: $GET_PHASE_ASSETS
  GET_USER: $GET_USER
  CREATE_USER: $CREATE_USER
  ADD_USER_KIT: $ADD_USER_KIT
  GET_USER_BY_ID: $GET_USER_BY_ID
  GET_PHASES: $GET_PHASES
  ADD_USER_ASSET: $ADD_USER_ASSET
  GET_ASSET: $GET_ASSET
  GET_PHASE: $GET_PHASE
  EDIT_USER: $EDIT_USER