batchCooking/apps/web/cypress/e2e/recipe-form.ts

import { type DataTable, Given, Then, When } from "@badeball/cypress-cucumber-preprocessor";

const tomato = {
  id: 1,
  key: "tomato",
  icon: "VEGETABLE",
  category: "freshProduce",
  subcategory: "vegetables",
  allergens: [],
  diets: [{ id: 2, key: "vegetarian" }],
};
const egg = {
  id: 2,
  key: "egg",
  icon: "EGG",
  category: "dairyAndCheese",
  subcategory: "eggs",
  allergens: [{ id: 1, key: "eggs", kind: "ALLERGY" }],
  diets: [],
};
const carrot = {
  id: 3,
  key: "carrot",
  icon: "VEGETABLE",
  category: "freshProduce",
  subcategory: "vegetables",
  allergens: [],
  diets: [{ id: 2, key: "vegetarian" }],
};

const diets = [
  { id: 1, key: "omnivore" },
  { id: 2, key: "vegetarian" },
];

const pieceUnit = { id: 1, key: "piece", type: "COUNT", toBaseFactor: 1 };
const gramUnit = { id: 2, key: "gram", type: "MASS", toBaseFactor: 1 };

Given("the ingredient and diet catalog is available", () => {
  cy.intercept("GET", "**/reference/ingredients", { statusCode: 200, body: [tomato, egg, carrot] });
  cy.intercept("GET", "**/reference/diets", { statusCode: 200, body: diets });
  cy.intercept("GET", "**/reference/units", { statusCode: 200, body: [pieceUnit, gramUnit] });
});

Given("creating the recipe will succeed and return id {int}", (id: number) => {
  cy.intercept("POST", "**/recipes", { statusCode: 201, body: { id } }).as("createRecipe");
});

When("I visit the new recipe form without a secure random UUID", () => {
  cy.visit("/recettes/nouvelle", {
    onBeforeLoad(win) {
      Object.defineProperty(win.crypto, "randomUUID", {
        value: undefined,
        configurable: true,
      });
    },
  });
});

When("I search the ingredient picker for {string}", (text: string) => {
  cy.get("input[placeholder='Rechercher un ingrédient…']").type(text);
});

When("I select the ingredient {string} from the picker", (name: string) => {
  cy.contains(".ingredient-picker__card", name).click();
});

Then("the ingredient {string} should no longer be in the picker", (name: string) => {
  cy.contains(".ingredient-picker__card", name).should("not.exist");
});

Then("the ingredient {string} should be visible in the picker", (name: string) => {
  cy.contains(".ingredient-picker__card", name).should("be.visible");
});

Then("the recipe should include the ingredient {string}", (name: string) => {
  cy.contains(".ingredient-row__name", name).should("be.visible");
});

Then("there should be {int} ingredient rows", (count: number) => {
  cy.get(".ingredient-row").should("have.length", count);
});

When("I remove the ingredient {string} from the recipe", (name: string) => {
  cy.contains(".ingredient-row", name).find("button[title='Retirer cet ingrédient']").click();
});

When(
  "I fill in the ingredient's quantity with {string} and unit {string}",
  (quantity: string, unit: string) => {
    cy.get(".ingredient-row .ingredient-row__quantity").type(quantity);
    cy.get(".ingredient-row .ingredient-row__unit").select(unit);
  },
);

Then("the ingredient's quantity should be {string}", (quantity: string) => {
  cy.get(".ingredient-row .ingredient-row__quantity").should("have.value", quantity);
});

When(
  "I fill in the last ingredient's quantity with {string} and unit {string}",
  (quantity: string, unit: string) => {
    cy.get(".ingredient-row .ingredient-row__quantity").last().type(quantity);
    cy.get(".ingredient-row .ingredient-row__unit").last().select(unit);
  },
);

When("I add a step", () => {
  cy.contains("button", "Ajouter une étape").click();
});

When("I fill in the step description with {string}", (text: string) => {
  cy.get(".step-list-editor__item textarea").type(text);
});

Then("there should be {int} step editor items", (count: number) => {
  cy.get(".step-list-editor__item").should("have.length", count);
});

Then(
  "the recipe creation request should have included name {string}, portions {int}, and ingredient {int} with quantity {int} and unitId {int}",
  (name: string, portions: number, ingredientId: number, quantity: number, unitId: number) => {
    cy.wait("@createRecipe")
      .its("request.body")
      .should("deep.include", {
        name,
        portions,
        ingredients: [{ ingredientId, quantity, unitId }],
      });
  },
);

Given("recipe 7 exists with an egg omelette", () => {
  const existingRecipe = {
    id: 7,
    name: "Omelette",
    description: null,
    picture: null,
    portions: 2,
    authorId: 1,
    visibility: "PERSONAL",
    allergens: [{ id: 1, key: "eggs", kind: "ALLERGY" }],
    diets: [],
    isFavorite: false,
    ingredients: [{ ingredient: egg, quantity: 3, unit: pieceUnit }],
    steps: [{ id: 1, description: "Battre les œufs.", picture: null, order: 0 }],
  };
  cy.intercept("GET", "**/recipes/7", { statusCode: 200, body: existingRecipe });
});

Given("updating recipe 7 will succeed", () => {
  cy.intercept("PATCH", "**/recipes/7", { statusCode: 200, body: { id: 7 } }).as("updateRecipe");
});

Then(
  "the recipe update request should have included these ingredients:",
  (dataTable: DataTable) => {
    const expected = dataTable.hashes().map((row) => ({
      ingredientId: Number(row.ingredientId),
      quantity: Number(row.quantity),
      unitId: Number(row.unitId),
    }));
    cy.wait("@updateRecipe").its("request.body.ingredients").should("deep.equal", expected);
  },
);