import { When, Then } from "cypress-cucumber-preprocessor/steps";
When("I search for {string}", value => {
  cy.get("#nav-search")
    .focus()
    .type(value);
});

Then("I should have one post in the select dropdown", () => {
  cy.get(".input .ds-select-dropdown").should($li => {
    expect($li).to.have.length(1);
  });
});

Then("the search has no results", () => {
  cy.get(".input .ds-select-dropdown").should($li => {
    expect($li).to.have.length(1);
  });
  cy.get(".ds-select-dropdown").should("contain", 'Nothing found');
});

Then("I should see the following posts in the select dropdown:", table => {
  table.hashes().forEach(({ title }) => {
    cy.get(".ds-select-dropdown").should("contain", title);
  });
});

When("I type {string} and press Enter", value => {
  cy.get("#nav-search")
    .focus()
    .type(value)
    .type("{enter}", { force: true });
});

When("I type {string} and press escape", value => {
  cy.get("#nav-search")
    .focus()
    .type(value)
    .type("{esc}");
});

Then("the search field should clear", () => {
  cy.get("#nav-search").should("have.text", "");
});

When("I select an entry", () => {
  cy.get(".input .ds-select-dropdown ul li")
    .first()
    .trigger("click");
});

Then("I should be on the post's page", () => {
  cy.location("pathname").should("contain", "/post/");
  cy.location("pathname").should(
    "eq",
    "/post/p1/101-essays-that-will-change-the-way-you-think"
  );
});

Then(
  "I should see posts with the searched-for term in the select dropdown",
  () => {
    cy.get(".ds-select-dropdown").should(
      "contain",
      "101 Essays that will change the way you think"
    );
  }
);

Then(
  "I should not see posts without the searched-for term in the select dropdown",
  () => {
    cy.get(".ds-select-dropdown").should(
      "not.contain",
      "No searched for content"
    );
  }
);
