How to use makeWorkspacePackagesAbsolute method in Cypress

You can do what you want with the help of some npm scripts, to save you repeatedly typing tedious commands.

In your package.json do something like this:

"scripts": {
    "cypress:open": "cypress open",
    "cypress:open:feature-1": "cypress open --config integrationFolder=tests/cypress/integration/feature-1",
    "cypress:open:feature-2": "cypress open --config integrationFolder=tests/cypress/integration/feature-2"
}

npm run cypress:open will run tests in the integration folder

npm run cypress:open-feature-1 will run tests in the integration/feature-1 folder

You can put your seeding functions into cypress/support/index.js and add them to the global object, something like this:

global.school = () => {
  faker.seed(123) // Seeding faker means you get the same details every time
  return {
    _id: faker.random.number(),
    name: `${faker.address.city()} School`,
    slug: faker.lorem.word(),
    email: 'demo@ccc.me',
    password: 'password'
  }
}

In your test script you can invoke this function with a line like this:

const s = school() // Get a fresh object that looks like a school

I hope that helps

Now cy.server is deprecated, you can use cy.intercept instead:

cy.intercept('http://api.company.com/', (req) => {
  req.headers['authorization'] = `token ${token}`
})

More info in the docs.

For the simple problem of checking 'hello' doesn't exist, you can use .contain('hello') followed a .should(). So it would look something like this for the whole page:

// code to delete hello

cy.contains('.selector', 'hello').should('not.exist')

Or you can further narrow it down to a particular area of the app:

// code to delete hello

cy.get('.element-had-hello').should('not.include.text', 'hello')

It looks like you are modifying a test file within the Cypress installation. This is probably not what you meant to do.

There are two important components to Cypress:

1. The Cypress package installation. In your case this is installed at c:\node_modules\.bin\cypress
2. The Project under test also has some Cypress related files, including cypress.json in the top level directory of the project, and the test files located in the cypress folder within the project directory (unless you have told Cypress to use a different directory).

When you run Cypress tests on a project, the test files which are watched are those that are located within the project directory - not those within the Cypress installation itself.

When you run cypress open then you can manually select the directory of the project that you want to test, say it is C:\MY_PROJECT. If there is no cypress.json file and no tests found, Cypress will automatically create a cypress.json file and a cypress directory within C:\MY_PROJECT. Inside the C:\MY_PROJECT\cypress\integration\ directory will be some example tests. When you edit tests in this directory with watchForFileChanges=true and manually choosing C:\MY_PROJECT to test, they will automatically rerun when saved.

I have also tested running and modifying the tests in the example directory within the Cypress package within the node_modules directory. I can confirm that when files within that directory are edited, the tests do not rerun. However, it is a mistake to edit those files when you are trying to test one of your own projects.

HTH

Delete the element

cy.get('modal-top-element')
  .then($modal => $modal[0].remove)

If it appears in it's own iframe (seems doubtful), delete the iframe.

I don't think aliases are required. Here is my solution that I tested locally. I kept most of the code in Alapan Das' answer so it's easier to compare. To me, it seems more concise and easier to read without aliases.

describe('Store and compare a value', () => {
    it('store and compare', () => {  
        cy.login()
        cy.visit('url2')
        cy.get('.total-count-results').invoke('text')
            .then((previousText) => {
                cy.get('.medium.col100 > .filterwrapper > input').type('Test Dummy',{force: true})
                cy.get('.medium.col100 > .filterwrapper > input').type('{enter}')
                cy.get('.total-count-results').invoke('text').should("eq", previousText)
            })
    })
})

<div class="provider-img"><img alt="safecharge_paysafecard" class="style__Logo-a3ugi5-2 fAwRoV visible" src="https://static.xyz.com/1234123463/img/providers/logo_safecharge_paysafecard.svg"></div>

As per your HTML fiddle, I could see that for every payment provider you can use the css selector img[class*="style__Logo"]

For one payment method you can use:

cy.get('img[class*="style__Logo"]').eq(0).invoke('attr', 'src').should('contain', 'https: //static.xyz.com/')

Following the example here MDN - Creating and triggering events, I built a minimal example to reproduce the problem.

<body>

  <input type="number" />

  <script>
    const event = new Event('wheel');
    const elem = document.querySelector('input');
    elem.addEventListener('wheel', function (e) { 
      elem.value = +elem.value + 1;  // treat input value as a number
    }, false);

    elem.dispatchEvent(event);  // dispatch an event to show it's working

  </script>
</body>

This is the test (passing).

it('Cypress "trigger" fires synthetic event', () => {
  
  cy.visit('../app/synthetic-event.html');

  cy.get('input').invoke('val').should('eq', '1');  // input has '1' since event triggered on load

  cy.get('input').trigger("wheel");                 // trigger the synthetic event
  cy.get('input').invoke('val').should('eq', '2');  // confirm value has changed

})

The only practical difference I can see is your "Actual mouse wheel event" log shows negative wheelDelta and positive deltaY, whereas your test is showing the opposite polarity.

Perhaps the input does not allow change in the opposite direction (i.e negative input)?

Please share the code for event constructor and event listener.

This works to check a count of items:

cy.get('.Button_Container').find('button').should('have.length', 3)

or

cy.get('.Button_Container').find('button').its('length').should('eq', 3)