Question 37572 in Ubuntu Question posted in
The official Ubuntu documentation can be found here.

cy.type() runs one way when run locally but fails when run by github actions – Ubuntu

My goal is to run my cypress tests during each pull request into a github repo. My expectation is that the cypress tests will run the same locally as they do on the remote github server. The actual result is that they run differently.

I have a minimum reproducible example available here.

The highlights:

Here’s how we inform Github of our intent to run the tests. This file works but perhaps the issue is that I need to add another step here:

name: run-tests

on:
  pull_request:
    branches: [master]  # says "run when there's a PR req into the master branch"

jobs:
  cypress-run:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v2

      - uses: actions/setup-node@v3
        with:
          node-version: 16

      - name: Run cypress tests
        uses: cypress-io/[email protected]
        with:
          build: npm run build
          start: npm run dev

Here is the cypress test I run, in foo.cy.js:

describe('Some Test', () => {
    it('correctly states that the btn is enabled', () => {
      cy.visit("localhost:5173")
      cy.get("h1").should("exist")
      cy.get("button").should("not.be.enabled")
      cy.get("input").type("cat, hat, jazz")
      cy.wait(500).then(() => {
        cy.get("button").should("be.enabled")
      })
    })
  })

And here’s the code it’s testing

+page.svelte:

<script>
    let text = ""
</script>

<h1>Welcome to SvelteKit</h1>
<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>

<input bind:value={text}/>

<button disabled={text.length === 0}>Button!</button>

On local, all the tests pass. On remote, it fails saying

 1) Some Test
       correctly states that the btn is enabled:
     AssertionError: Timed out retrying after 4000ms: expected '<button>' to be 'enabled'
      at Context.eval (webpack:///./cypress/e2e/foo.cy.js:8:25)

Here’s what I’ve tried:

  1. I tried putting cy.wait on a separate line.
cy.wait(500)
cy.get("button").should("be.enabled") // doesn't help
  1. I’ve tried running it headed and headless meaning I added command: npx cypress run --headed --browser chrome to the github action. It still failed.

edit: I discovered that the text I enter using cy.get("input").type("cat, hat, jazz") is cleared after the cy.wait() command. I discovered this by viewing the output video of the Cypress test run. Will post the full solution when I uncover it.

Edit2: So I removed cy.wait() and the issue persisted. Thus I now have:

cy.get("input").type("cat, hat, jazz")
# in between the end of the prev line and
# the end of the next line, the values typed
# on the prev line are cleared.
# I don't understand why.
cy.get("button").should("be.enabled")
Tags:

2

Answers


  1. 0

    You can use delay with your type command. As the name suggests it introduces delay between each key press. The value is in milliseconds.

    cy.get("input").type("cat, hat, jazz", {delay: 50})
cy.get("button").should("be.enabled")
    Login or Signup to reply.
  2. 0

    There is a issue with Vite and ES6 modules causing tests to be flaky. You can overcome it by adding an intercept at the top of the test, which ensures that Vite has fully loaded the app before you start testing.

    beforeEach(() => {
  cy.intercept({pathname: '**/+page.svelte*'}).as('svelte')
  cy.visit('http://localhost:5173/')
  cy.wait('@svelte')
})

    Ref: Flaky cypress test with Svelte

    Basically, to find the URL for the intercept you need to issue a cy.visit() then look towards the bottom of devtools Network tab.

    In your case, in Svelte dev mode the intercept corresponds to the "route" folder in the source tree, so it’s easy to spot.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search