How to use checkBuiltBinary method in Cypress

A few changes should achieve what you are looking for. Here's a breakdown of steps taken to solve this question...

First off, instead of stubbing out MyDataTransfer, just construct a new DataTransfer object, which comes packed with the necessary properties and methods needed for drag events:

const dataTransfer = new DataTransfer;

Next, it's best to trigger native drop and drag events, as opposed to draggable and dropzone. Selenium Easy is listening for dragstart, dragend, and drop (you can see this inside of their drag-and-drop-demo.js source file). Put these inside of a helper function, to be called later inside the test:

function dndIt() {
  cy.get('#todrag span:first-of-type')
    .trigger('dragstart', { dataTransfer });

  cy.get('#mydropzone')
    .trigger('drop', { dataTransfer });

  cy.get('#todrag span:first-of-type')
    .trigger('dragend');               // <-- seleniumeasy listens for this...
}                                      // otherwise, draggables are copied.    

A beforeEach block is helpful for setting the viewport and visiting the application:

beforeEach(function() {
  cy.viewport(1000, 600);
  cy.visit('https://www.seleniumeasy.com/test/drag-and-drop-demo.html');
});

And finally, the test block calls the helper function, and asserts that the item was dragged and dropped:

it('Check whether the drag and drop of an item is working fine', function() {
  dndIt();

  cy.get('#droppedlist')
    .should(($el) => {
      expect($el.children()).to.have.lengthOf(1)
    });
});

Here's the solution in its entirety:

describe('Verify the drag and drop test', function() {
  const dataTransfer = new DataTransfer;

  function dndIt() {
    cy.get('#todrag span:first-of-type')
      .trigger('dragstart', { dataTransfer });

    cy.get('#mydropzone')
      .trigger('drop', { dataTransfer });

    cy.get('#todrag span:first-of-type')
      .trigger('dragend');               // <-- seleniumeasy listens for this...
  }                                      // if left out, draggables are copied.

  beforeEach(function() {
    cy.viewport(1000, 600);
    cy.visit('https://www.seleniumeasy.com/test/drag-and-drop-demo.html');
  });

  it('Check whether the drag and drop of an item is working fine', function() {
    dndIt();

    cy.get('#droppedlist')
      .should(($el) => {
        expect($el.children()).to.have.lengthOf(1)
      });
  });
});

The drag_n_drop_spec.js provided in the cypress-example-recipes repo was a helpful resource.

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')

You can get videos/screenshots from Cypress in gitlab CI using artifacts, just make sure they are put inside the app's folder structure.

Example I'm working on right now which yields a downloadable screenshots folder:

e2e tests all:
  image: cypress/base:14.15.4
  stage: manual-tests
  when: manual
  allow_failure: true
  before_script:
    - npm install
    - npx cypress verify
  script:
    - npm run-script test:e2e
  cache:
    <<: *global_cache
    policy: pull
  artifacts:
    paths:
      - tests/e2e/screenshots/**/*.png
    expire_in: 2 hrs
    when: on_failure

This gets the screenshots folder in our VueJS app.

Cypress CI artifact examples here and general Gitlab artifacts info here.

Your commands file would have a command like this. Note that this will log the cy.wraps and you may want to pass log: false to suppress that if you choose. You can also add another agrument and have an if block for text to use data-testid with .contains()

Cypress.Commands.add(
  'byTestId',
  { prevSubject: 'optional' },
  (subject, id) => {
    if (subject) {
      return cy.wrap(subject).find(`[data-testid="${id}"]`)
    }
    return cy.get(`[data-testid="${id}"]`)
  },
)

This would be an application of the command.

cy.byTestId('first-id')
  // maybe some assertions here for visibility check
  .byTestId('id-inside-first-element')
  // maybe some assertions here for visibility check
  .byTestId('id-within-this-second-element')

I'm fairly new to Cypress but I suggest you try following:

1) The most likely issue/solution - Is that "secondary file" even executed? I remember having some issues when calling my helper functions defined in cypress/support/commands.js file. Is commands.js the "secondary file" you mentioned? Seems you're calling it with register.getClearObjectsButton(). What is register? If you put getClearObjectsButton method into cypress/support/commands.js file, you can then call it in all your test files with cy.getClearObjectsButton()

2) If it is executed, try to execute click in that secondary file as well. Does it work?

3) Also, if you're sure your method is executed, I guess you've expected that yield of cypress .get function stays "active" but it probably isn't the case. Try to save it in a variable and return from your getClearObjectsButton method.

After 2 hours of debugging I find out that I have forgotten to include Outline world in the Scenario definition in order the test to be able to iterate through the data table. So for future reference the fix from:

 Scenario: Some scenario
   Given ...
   When ...
   Then I should see "<task_field>" field as "<field_value>"
   Examples:
      | task_field        | field_value |
      | some_field1       | some_value1 |
      | some_field2       | some_value2 |
      | some_field3       | some_value3 | 

Is to include in the first line Outline:

Scenario Outline: Some scenario
   Given ...
   When ...
   Then I should see "<task_field>" field as "<field_value>"
   Examples:
      | task_field        | field_value |
      | some_field1       | some_value1 |
      | some_field2       | some_value2 |
      | some_field3       | some_value3 |

I think is been a long day for me. Hope this helps to someone with a similar issue!

The snowflake-sdk is a NodeJs package, so in Cypress you need to interact with it via a task.

Here's a basic connection task taken from the Snowflake docs.

cypress.config.js

const { defineConfig } = require("cypress");
var snowflake = require("snowflake-sdk");

let connectionId;

module.exports = defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      on("task", {
        snowflake: () => {
          var connection = snowflake.createConnection({
            account: "account",
            username: "user",
            password: "password",
            application: "application",
          });

          connection.connect(function (err, conn) {
            if (err) {
              console.error("Unable to connect: " + err.message);
            } else {
              console.log("Successfully connected to Snowflake.");
              // Optional: store the connection ID.
              connectionId = conn.getId();
            }
          })
          return null
        },
      });
    },
  },
})

Test

it('Connect to snowflake', () => {
  cy.task('snowflake')
})

Without proper credentials, it produces a connection error but proves the package is working.

Unable to connect: Request to Snowflake failed.

Thank you for the detailed description! I provide you a solution for your very first question

I'm trying to find out if I'm able to conditionally skip a test it() in my test suite and deal with its async nature as well.

Use an environment variable, I report you a solution of mine (actually using in my pipeline).

if (!Cypress.env("SKIP_E2E_TESTS")) {
  it(...);
}

and in my package.json file I have a script that looks like this

"test": "CYPRESS_SKIP_E2E_TESTS=true npm-run-all --parallel --silent test:unit test:cypress",

My goal was the same as yours, I'd like to disable some tests in some circumstances (the CI pipeline in my case).

So put the whole test into a condition instead of having a conditional test.

Let me know if you need some more help ????

If the elements you seek are truly outside of <body> (which is possible but not common), then this code can find them

cy.document()
  .find('body')
  .next()        // sibling element to <body> 
  .should('have.text', 'created in javascript script')   // verifies in my example

Or use <html> as the base element (<body> is the default base element)

cy.document()
  .find('html')
  .contains('div', 'created in javascript script')

This is the DOM I tested on - the bottom <div> is added after <body> when the page loads.

<html>

<head></head>

<body>
  <div>Normal Html element</div>
</body>

<div>created in javascript script</div>

</html>