https://cypress.io logo
Join Discord
Powered by
# help
  • s
    Cc @flat-electrician-52949
  • f
    I don't have any issue with chai other than lack of experience in it. Coming from 
    console.asssert
    and react testing library (jest). Got some helper scripts in a folder and would like to TDD when making them. How would you go about doing that with cypress (or chai alone??) for a component like this:
  • f
    Copy code
    ts
export default function generateDefaultOrderOptions(
  getDishById: TGetDishById,
  id: string
): Record<string, string> {
  return getDishById(id)?.options.reduce(
    (acc, { optionName, defaultChoice }) => ({ ...acc, [optionName]: defaultChoice }),
    {}
  )
}
  • f
    typically I would use 
    jest watch
    with some 
    expect
    or run 
    nodemon
    on a file with some 
    console.assert
  • r
    I have this custom command and i want to use while/each for nrOfPages
    Copy code
    Cypress.Commands.add('validatePagination', (pageSize) => {
    cy.get('.top > .tablenav-pages > .pagination-links > .paging-input > .tablenav-paging-text > .total-pages').invoke('text')
        .then(parseInt).then ((nrOfPages) => {
                console.log(nrOfPage)
                cy.getNoOfRowTable()
                cy.get('@rowCount').then((rowCount) => {
                    if(cy.get('.tablenav.top .button.next-page').should('be.visible')) {
                        if (rowCount < pageSize) {
                            cy.validateCurrentCountOfPages('.current > .count', rowCount)
                        } else {
                            cy.get('.tablenav.top .button.next-page').click().then(() => {
                                cy.getNoOfRowTable()
                                cy.get('@rowCount').then((rowCount2) =>
                                    cy.validateCurrentCountOfPages('.current > .count', rowCount2+pageSize))
                            })
                        }
                    }
                })
        })
})
  • r
    how can i do this?
  • s
    @User Oh, if you're just testing a function/class, I might use mocha + chai by themselves. Chai is just the dot-style matchers, like 
    expect('foo').to.equal('foo')
    or 
    expect({ blah: true }).to.contain('blah')
  • s
    Mocha is the test runner.
  • s
    Cypress uses Mocha + Chai under the hood, so using Mocha for unit testing is nice. You can technically just write and run those tests in Cypress itself... which may be less annoying than setting up infra.
  • s
    You would just import your spec code at the top of your file, and then you can do any of the assertions here https://docs.cypress.io/guides/references/assertions#BDD-Assertions
  • s
    It's just like Jest's 
    notToBe(x)
    except it's 
    not.to.be(x)
    .
  • s
    Either way, if you run the tests within Cypress or with a standalone mocha runner, it's the same assertions.
  • u
    Hi here, Again a tiny question, please 🙂 Is there a way to only show the tested page, using the 
    videos
    feature? (not the tests panel)
  • f
    thanks - this was the kind of feedback I was hoping for
  • u
    \o/ I wrote a solution
    Copy code
    js
const { body } = window.top.document
const app = body.querySelector('#app')
const reporter = app.querySelector('.reporter-wrap')
const runner = app.querySelector('.runner.container')
const header = runner.querySelector('header')
const iframes = app.querySelector('.iframes-container')
const size = app.querySelector('.size-container')

reporter.style.display = 'none'
header.style.display = 'none'
runner.style.left = '0'
iframes.style.left = '0'
iframes.style.top = '0'
size.style.margin = '0'
size.style.height = '100vh'
size.style.width = '100vw'
size.style.transform = 'unset'
    😛
  • u
    (if there is a better way, don't hesitate anyway 🙂)
  • s
    Hah. @User what workflow are you trying to do? Like a fullscreen?
  • u
    yeah
  • s
    Funny. We've considered that as a 1st class plugin feature
  • u
    just to make some scripted demos
  • s
    You should make a plugin. It's a good idea.
  • s
    Manual DOM manipulation is the way to go
  • u
    maybe but there is a little "glitch", by my actual way: the cypress UI is still visible around 1s
  • s
    Yeah that seems reasonable
  • u
    ok 🙂
  • u
    I try to make/publish that plugin tomorrow, then 🙂
  • u
    Is there a better phase to run it as soon as possible, instead of into the integrations scripts?
  • s
    No not really
  • s
    One of the things you can do is kinda simple
  • s
    You could just cut the first second off of the video and wait 1s for the test to start (this is so hacky, I know)
1...161718...252Latest