cy.action automatically adds dependencies to the project in e2e.js file

import "cypress-plugin-steps";
require("cypress-action");
import "cypress-file-upload";
require("cypress-xpath");
export const faker = require("generate-datafaker");
import "cypress-wait-until";

// Example of using the `action` command
cy.action({ attr: "my-selector" }).click(); // Options passed as second argument

cy.action({ attr: "my-selector" }, { timeout: 10000 }).click();

cy.action({
  attr: "data-test-id=botao-login",
  text: "Clicking the login button",
}).type();

cy.action({
  attr: "<button>",
  text: "Interacting with buttons",
}).click();

cy.action({
  attr: '//*[@id="page-walker"]/form/fieldset[1]/div[2]/div/input',
  text: "Interacting with buttons",
}).select();

cy.action({
  attr: "/html/body/div/div/button",
  text: "Selecting button via XPath",
}).type();

cy.action({ attr: "<form>", text: "action mapeando caminho" })
  .find(".field")
  .find('[placeholder="Nome completo"]')
  .clear()
  .type("Teste buscando por camadas usando tags");

// attachFile
cy.action({ attr: 'type="file"', text: "attachFile include" }).attachFile(
  "image.png"
);

// cssSelector
cy.action({
  attr: "#page-walker > form > fieldset:nth-child(3) > div:nth-child(2) > div > input[type=text]",
  text: "action por selector",
})
  .clear()
  .type("Teste com selector");

// action not text
cy.action({ attr: 'name="name"' }).clear().type("Teste sem texto de ação");

// attribute
cy.action({ attr: 'name="name"', text: "action por atributo" }).type(
  "Teste com atributo"
);
our
cy.action({ attr: 'placeholder="Nome completo"', text: "action por atributo" }).type(
  "Teste com atributo"
);

<input type="text" name="name" placeholder="Nome completo">

action({ attr: 'name="name"', text: "attr" })
  .clear()
  .type(faker.generateName());

action({
  attr: "#page-walker > form > fieldset:nth-child(3) > div:nth-child(2) > div > input[type=text]",
  text: "cssSelector",
})
  .clear()
  .type(faker.generateName());

action({
  attr: '//*[@id="page-walker"]/form/fieldset[1]/div[2]/div/input',
  text: "xpath",
})
  .clear()
  .type(faker.generateName());

action(
  {
    attr: "/html/body/div/div/form/fieldset[2]/div[4]/div[2]/input",
    text: "full xpath",
  },
  { timeout: 10000 }
)
  .clear()
  .type(faker.generateName());

action({
  attr: '//*[@id="page-walker"]/form/fieldset[1]/div[2]/div/input',
  text: "xpath",
  maxAttempts: 4,
}).type(faker.generateName());

// elseIf with input
cy.elseIf('input[name="cpf"]').type("07957743463", { force: true });

// else If with select
cy.elseIf('select[name="cpf"]')
  .value("07957743463")
  .select("07957743463", { force: true });

// else If with  button
cy.elseIf('button[name="cpf"]').click({ force: true });

// else If with  button and value/text
cy.elseIf('button[name="cpf"]').value("Click Me").click({ force: true });

// elseIf with label
cy.elseIf('label[name="cpf"]').value("Entry password").click({ force: true });

// elseIf with label
cy.elseIf('label[name="cpf"]').click({ force: true });

// Usando elseIf para selecionar um elemento com um seletor CSS específico
cy.elseIf("#meuElemento").click({ force: true });

// Especificando o tipo de tag para um elemento existente e tratando-o conforme necessário
cy.elseIf(
  "#page-walker > form > fieldset:nth-child(3) > div:nth-child(3) > div:nth-child(2) > select[type=text]"
)
  .value("minhaOpção")
  .select("minhaOpção", { force: true });

// Para um botão, por exemplo, apenas para verificar se existe
cy.elseIf("#meuBotao").value("Click Me").click({ force: true });

cy.elseIf(
  "#page-walker > form > fieldset:nth-child(3) > div:nth-child(2) > div > input[type=text]"
).type(faker.generateName(), { force: true });

cy.action({ attr: selects.fillName })
  .click()
  .elseIf('input[name="name"]')
  .type("Test");

cy.action({ attr: selects.fillEmail })
  .click()
  .act('name="email"') //action
  .type("Test#test.com");

cy.action({ attr: selects.fillName })
  .click()
  .If('input[name="name"]') // elseIf
  .type("Test");

import { Dado, Cenario, faker, Quando, E, Entao } from "../support/e2e";

Cenario("", function () {
  Dado("", function () {}, {});
  Quando("", function () {}, {});
  E("", function () {}, {});
  Entao("", function () {}, {});
});

const { defineConfig } = require("cypress");

module.exports = defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      // implement node event listeners here
    },
  },
  viewportHeight: 1000,
  viewportWidth: 1400,

  env: {
    title: "Tests With Cypress and cy.action 💥",
    subTitle: "CY.ACTION presentation",
    styles: {
      background: "red",
      text: "green",
    },
  },
});