trip-planner/tests/support/pages/TripPage.js

const { By } = require('selenium-webdriver');
const BasePage = require('./BasePage');

class TripPage extends BasePage {
  constructor(driver) {
    super(driver);

    this.selectors = {
      tripsSection: '.trips-section',
      tripsSectionTitle: '.trips-section-title',
      tripsGrid: '.trips-grid',
      addTripCard: '.add-trip-card',
      addTripText: '.add-trip-text',
      tripCard: '.trip-card',
      tripCardTitle: '.trip-card-title',
      tripCardDescription: '.trip-card-description',
      tripMenuTrigger: '.trip-menu-trigger',
      tripDropdown: '.trip-dropdown',
      dropdownItemEdit: '.dropdown-item:first-child',
      dropdownItemDelete: '.dropdown-item-danger',

      // Modal selectors
      tripModal: '.trip-modal',
      tripForm: '#trip-form',
      tripNameInput: 'input[name="name"]',
      tripDescriptionInput: 'textarea[name="description"]',
      tripStartDateInput: 'input[name="start_date"]',
      tripEndDateInput: 'input[name="end_date"]',
      modalCancelButton: '.btn-secondary',
      modalSubmitButton: '.btn-primary',

      // Dashboard
      dashboard: '.dashboard',
      logoutButton: 'button:has-text("Logout")'
    };
  }

  async waitForTripsSection() {
    await this.utils.waitForElementVisible(this.selectors.tripsSection);
  }

  async isTripsPageDisplayed() {
    return await this.isElementVisible(this.selectors.tripsSection);
  }

  async clickCreateNewTrip() {
    await this.clickElement(this.selectors.addTripCard);
    await this.driver.sleep(1000); // Wait for intro animation to complete
  }

  async waitForTripModal() {
    await this.utils.waitForElementVisible(this.selectors.tripModal);
    await this.driver.sleep(300);
  }

  async fillTripForm(tripData) {
    await this.typeIntoElement(this.selectors.tripNameInput, tripData.name);

    if (tripData.description) {
      await this.typeIntoElement(this.selectors.tripDescriptionInput, tripData.description);
    }

    if (tripData.startDate) {
      const startDateInput = await this.driver.findElement(By.css(this.selectors.tripStartDateInput));
      await startDateInput.clear();
      await startDateInput.sendKeys(tripData.startDate);
    }

    if (tripData.endDate) {
      const endDateInput = await this.driver.findElement(By.css(this.selectors.tripEndDateInput));
      await endDateInput.clear();
      await endDateInput.sendKeys(tripData.endDate);
    }
  }

  async submitTripForm() {
    const submitButton = await this.driver.findElement(By.css(this.selectors.modalSubmitButton));
    await submitButton.click();
    await this.driver.sleep(1000);
  }

  async cancelTripForm() {
    await this.clickElement(this.selectors.modalCancelButton);
    await this.driver.sleep(500);
  }

  async getTripCards() {
    try {
      const cards = await this.driver.findElements(By.css(this.selectors.tripCard));
      return cards;
    } catch (error) {
      return [];
    }
  }

  async findTripByName(tripName) {
    const cards = await this.getTripCards();
    for (let card of cards) {
      try {
        const titleElement = await card.findElement(By.css('.trip-card-title'));
        const title = await titleElement.getText();
        if (title === tripName) {
          return card;
        }
      } catch (error) {
        continue;
      }
    }
    return null;
  }

  async openTripMenu(tripCard) {
    const menuButton = await tripCard.findElement(By.css(this.selectors.tripMenuTrigger));
    await menuButton.click();
    await this.driver.sleep(300);
  }

  async clickEditTrip(tripCard) {
    await this.openTripMenu(tripCard);
    const editButton = await tripCard.findElement(By.css(this.selectors.dropdownItemEdit));
    await editButton.click();
    await this.driver.sleep(500);
  }

  async clickDeleteTrip(tripCard) {
    await this.openTripMenu(tripCard);
    const deleteButton = await tripCard.findElement(By.css(this.selectors.dropdownItemDelete));
    await deleteButton.click();
    await this.driver.sleep(500);
  }

  async confirmDelete() {
    // Handle confirmation dialog if it appears
    try {
      await this.driver.switchTo().alert().accept();
      await this.driver.sleep(500);
    } catch (error) {
      // No alert present, might be a different confirmation method
    }
  }

  async logout() {
    try {
      // First click the user menu trigger to open dropdown
      const userMenuTrigger = await this.driver.findElement(By.css('.user-menu-trigger'));
      await userMenuTrigger.click();
      await this.driver.sleep(500);

      // Then click the logout button in the dropdown
      const logoutButton = await this.driver.findElement(By.xpath("//button[contains(text(), 'Logout')]"));
      await logoutButton.click();
    } catch (error) {
      throw new Error('Could not perform logout: ' + error.message);
    }
    await this.driver.sleep(1000);
  }

  async verifyTripExists(tripName) {
    const tripCard = await this.findTripByName(tripName);
    return tripCard !== null;
  }

  async verifyTripDeleted(tripName) {
    const tripCard = await this.findTripByName(tripName);
    return tripCard === null;
  }
}

module.exports = TripPage;