Cypress + Cucumber - same steps definition - cypress-cucumber-preprocessor

Question

Let's say I have Feature1.feature and Feature2.feature files. In first I have steps:
Scenario: Test scenario1
Given I Open the app
When I Click on Tab1
And in the second file I have:
Scenario: Test scenario2
Given I Open the app
When I Click on Tab2
Under the step_definitions folder in step1.js file:
Given("I open the app", () => {
cy.visit("/home");
});
When("I Click on Tab1", () => {
cy.get('[title="Tab1"]'.click();
});
Under the step_definitions folder we have multiple js files (separated by each testing case). So for the 2nd scenario, in step2.js do I need to define the Open app step again? :
Given("I open the app", () => {
cy.visit("/home");
});
Or it looks globally in all files under the steps_definition? So then I just need to start with:
When("I Click on Tab2", () => {
cy.get('[title="Tab2"]'.click();
});
But what if multiple users are working on test cases and they accidentally define the same steps in different files, e.g.
In one file
Given("I open the app", () => {
cy.visit("/home");
});
In other file
Given("I open the app", () => {
cy.visit("/news");
});
As I read, each scenario should be independent. But if there are same steps for each scenario? We need to define them only once just in one file. But if someone else is working on that file, it may break my scenario.

Answer 1

If there are two steps for multiple scenarios you should use common steps:
Reusable step definitions
We also have a way to create reusable step definitions. Put them in cypress/integration/common/
Example: cypress/integration/common/i_see_string_in_the_title.js
import { Then } from "cypress-cucumber-preprocessor/steps";
Then(`I see {string} in the title`, (title) => {
cy.title().should('include', title)
})
taken from https://www.npmjs.com/package/cypress-cucumber-preprocessor