@nextsparkjs/theme-default 0.1.0-beta.20 → 0.1.0-beta.22

package/tests/cypress/src/entities/CustomersPOM.ts

@@ -0,0 +1,172 @@
+/**
+ * CustomersPOM - Page Object Model for Customers entity
+ *
+ * Extends DashboardEntityPOM with customer-specific form handling and workflows.
+ *
+ * @example
+ * // Instance usage with chaining
+ * CustomersPOM.create()
+ *   .visitList()
+ *   .waitForList()
+ *   .clickAdd()
+ *   .fillCustomerForm({ name: 'Acme Inc', account: 'ACC001', office: 'HQ' })
+ *   .submitForm()
+ *
+ * // API-aware workflow
+ * const customers = new CustomersPOM()
+ * customers.createCustomerWithApiWait({
+ *   name: 'Acme Inc',
+ *   account: 'ACC001',
+ *   office: 'Main Office'
+ * })
+ */
+
+import { DashboardEntityPOM } from '../core/DashboardEntityPOM'
+import entitiesConfig from '../../fixtures/entities.json'
+
+export interface CustomerFormData {
+  name: string
+  account: string
+  office: string
+  phone?: string
+  salesRep?: string
+  visitDays?: string[]
+  contactDays?: string[]
+}
+
+export class CustomersPOM extends DashboardEntityPOM {
+  constructor() {
+    super(entitiesConfig.entities.customers.slug)
+  }
+
+  // ============================================
+  // FACTORY METHOD
+  // ============================================
+
+  static create(): CustomersPOM {
+    return new CustomersPOM()
+  }
+
+  // ============================================
+  // ENTITY-SPECIFIC FORM METHODS
+  // ============================================
+
+  /**
+   * Fill customer form with provided data
+   * Only fills fields that are provided in the data object
+   */
+  fillCustomerForm(data: CustomerFormData) {
+    if (data.name) {
+      this.fillTextField('name', data.name)
+    }
+    if (data.account) {
+      this.fillTextField('account', data.account)
+    }
+    if (data.office) {
+      this.fillTextField('office', data.office)
+    }
+    if (data.phone) {
+      this.fillTextField('phone', data.phone)
+    }
+    if (data.salesRep) {
+      this.fillTextField('salesRep', data.salesRep)
+    }
+    return this
+  }
+
+  // ============================================
+  // WORKFLOW METHODS
+  // ============================================
+
+  /**
+   * Complete create flow without API waits
+   */
+  createCustomer(data: CustomerFormData) {
+    this.visitCreate()
+    this.waitForForm()
+    this.fillCustomerForm(data)
+    this.submitForm()
+    return this
+  }
+
+  /**
+   * Create customer with API intercepts and waits
+   * Deterministic: waits for actual API responses
+   */
+  createCustomerWithApiWait(data: CustomerFormData) {
+    this.setupApiIntercepts()
+    this.clickAdd()
+    this.waitForForm()
+    this.fillCustomerForm(data)
+    this.submitForm()
+    this.api.waitForCreate()
+    return this
+  }
+
+  /**
+   * Create customer from list page and wait for refresh
+   */
+  createCustomerFromListWithApiWait(data: CustomerFormData) {
+    this.setupApiIntercepts()
+    this.clickAdd()
+    this.waitForForm()
+    this.fillCustomerForm(data)
+    this.submitForm()
+    this.api.waitForCreateAndRefresh()
+    return this
+  }
+
+  /**
+   * Update customer with API waits
+   */
+  updateCustomerWithApiWait(data: Partial<CustomerFormData>) {
+    this.fillCustomerForm(data as CustomerFormData)
+    this.submitForm()
+    this.api.waitForUpdate()
+    return this
+  }
+
+  /**
+   * Delete customer with API waits
+   * Flow: Navigate to detail -> Delete -> Confirm
+   */
+  deleteCustomerWithApiWait(id: string) {
+    this.visitDetailWithApiWait(id)
+    this.clickDelete()
+    this.confirmDelete()
+    this.api.waitForDelete()
+    return this
+  }
+
+  /**
+   * Delete customer by finding it in the list by name
+   */
+  deleteCustomerByNameWithApiWait(name: string) {
+    this.clickRowByText(name)
+    this.waitForDetail()
+    this.clickDelete()
+    this.confirmDelete()
+    this.api.waitForDelete()
+    return this
+  }
+
+  // ============================================
+  // ENTITY-SPECIFIC ASSERTIONS
+  // ============================================
+
+  /**
+   * Assert customer appears in list
+   */
+  assertCustomerInList(name: string) {
+    return this.assertInList(name)
+  }
+
+  /**
+   * Assert customer does not appear in list
+   */
+  assertCustomerNotInList(name: string) {
+    return this.assertNotInList(name)
+  }
+}
+
+export default CustomersPOM

package/tests/cypress/src/entities/PagesPOM.ts

@@ -0,0 +1,137 @@
+/**
+ * PagesPOM - Page Object Model for Pages entity (List operations)
+ *
+ * Extends DashboardEntityPOM for list page operations.
+ * For editing pages with the block editor, use PageBuilderPOM from features/.
+ *
+ * @example
+ * // List operations
+ * PagesPOM.create()
+ *   .visitList()
+ *   .waitForList()
+ *   .search('About Us')
+ *   .selectFilter('status', 'published')
+ *
+ * // For editing pages, use PageBuilderPOM
+ * import { PageBuilderPOM } from '../features/PageBuilderPOM'
+ * PageBuilderPOM.create().visitEdit(pageId).setTitle('New Title').save()
+ */
+
+import { DashboardEntityPOM } from '../core/DashboardEntityPOM'
+import entitiesConfig from '../../fixtures/entities.json'
+
+export interface PageListFilters {
+  status?: 'draft' | 'published' | 'archived'
+  locale?: 'en' | 'es'
+}
+
+export class PagesPOM extends DashboardEntityPOM {
+  constructor() {
+    super(entitiesConfig.entities.pages.slug)
+  }
+
+  // ============================================
+  // FACTORY METHOD
+  // ============================================
+
+  static create(): PagesPOM {
+    return new PagesPOM()
+  }
+
+  // ============================================
+  // PAGE-SPECIFIC LIST METHODS
+  // ============================================
+
+  /**
+   * Filter pages by status
+   */
+  filterByStatus(status: 'draft' | 'published' | 'archived') {
+    return this.selectFilter('status', status)
+  }
+
+  /**
+   * Apply multiple filters at once
+   */
+  applyFilters(filters: PageListFilters) {
+    if (filters.status) {
+      this.filterByStatus(filters.status)
+    }
+    if (filters.locale) {
+      this.selectFilter('locale', filters.locale)
+    }
+    return this
+  }
+
+  // ============================================
+  // WORKFLOW METHODS
+  // ============================================
+
+  /**
+   * Navigate to create page
+   * Note: Pages use block editor, so this redirects to the editor
+   */
+  navigateToCreate() {
+    this.clickAdd()
+    return this
+  }
+
+  /**
+   * Navigate to edit page for a page
+   * Note: Pages use block editor, so this redirects to the editor
+   */
+  navigateToEdit(id: string) {
+    this.clickRowAction('edit', id)
+    return this
+  }
+
+  /**
+   * Delete page from list with API waits
+   */
+  deletePageWithApiWait(id: string) {
+    this.visitDetailWithApiWait(id)
+    this.clickDelete()
+    this.confirmDelete()
+    this.api.waitForDelete()
+    return this
+  }
+
+  /**
+   * Delete page by finding it in the list by title
+   */
+  deletePageByTitleWithApiWait(title: string) {
+    this.clickRowByText(title)
+    this.waitForDetail()
+    this.clickDelete()
+    this.confirmDelete()
+    this.api.waitForDelete()
+    return this
+  }
+
+  // ============================================
+  // ENTITY-SPECIFIC ASSERTIONS
+  // ============================================
+
+  /**
+   * Assert page appears in list
+   */
+  assertPageInList(title: string) {
+    return this.assertInList(title)
+  }
+
+  /**
+   * Assert page does not appear in list
+   */
+  assertPageNotInList(title: string) {
+    return this.assertNotInList(title)
+  }
+
+  /**
+   * Assert page has specific status badge
+   */
+  assertPageStatus(id: string, status: string) {
+    cy.get(this.selectors.row(id)).should('contain.text', status)
+    return this
+  }
+}
+
+export default PagesPOM

package/tests/cypress/src/entities/PostsPOM.ts

@@ -0,0 +1,137 @@
+/**
+ * PostsPOM - Page Object Model for Posts entity (List operations)
+ *
+ * Extends DashboardEntityPOM for list page operations.
+ * For editing posts with the block editor, use PostEditorPOM from features/.
+ *
+ * @example
+ * // List operations
+ * PostsPOM.create()
+ *   .visitList()
+ *   .waitForList()
+ *   .search('My Post')
+ *   .selectFilter('status', 'published')
+ *
+ * // For editing posts, use PostEditorPOM
+ * import { PostEditorPOM } from '../features/PostEditorPOM'
+ * PostEditorPOM.create().visitEdit(postId).setTitle('New Title').save()
+ */
+
+import { DashboardEntityPOM } from '../core/DashboardEntityPOM'
+import entitiesConfig from '../../fixtures/entities.json'
+
+export interface PostListFilters {
+  status?: 'draft' | 'published' | 'archived'
+  categoryId?: string
+}
+
+export class PostsPOM extends DashboardEntityPOM {
+  constructor() {
+    super(entitiesConfig.entities.posts.slug)
+  }
+
+  // ============================================
+  // FACTORY METHOD
+  // ============================================
+
+  static create(): PostsPOM {
+    return new PostsPOM()
+  }
+
+  // ============================================
+  // POST-SPECIFIC LIST METHODS
+  // ============================================
+
+  /**
+   * Filter posts by status
+   */
+  filterByStatus(status: 'draft' | 'published' | 'archived') {
+    return this.selectFilter('status', status)
+  }
+
+  /**
+   * Apply multiple filters at once
+   */
+  applyFilters(filters: PostListFilters) {
+    if (filters.status) {
+      this.filterByStatus(filters.status)
+    }
+    if (filters.categoryId) {
+      this.selectFilter('categoryId', filters.categoryId)
+    }
+    return this
+  }
+
+  // ============================================
+  // WORKFLOW METHODS
+  // ============================================
+
+  /**
+   * Navigate to create page
+   * Note: Posts use block editor, so this redirects to the editor
+   */
+  navigateToCreate() {
+    this.clickAdd()
+    return this
+  }
+
+  /**
+   * Navigate to edit page for a post
+   * Note: Posts use block editor, so this redirects to the editor
+   */
+  navigateToEdit(id: string) {
+    this.clickRowAction('edit', id)
+    return this
+  }
+
+  /**
+   * Delete post from list with API waits
+   */
+  deletePostWithApiWait(id: string) {
+    this.visitDetailWithApiWait(id)
+    this.clickDelete()
+    this.confirmDelete()
+    this.api.waitForDelete()
+    return this
+  }
+
+  /**
+   * Delete post by finding it in the list by title
+   */
+  deletePostByTitleWithApiWait(title: string) {
+    this.clickRowByText(title)
+    this.waitForDetail()
+    this.clickDelete()
+    this.confirmDelete()
+    this.api.waitForDelete()
+    return this
+  }
+
+  // ============================================
+  // ENTITY-SPECIFIC ASSERTIONS
+  // ============================================
+
+  /**
+   * Assert post appears in list
+   */
+  assertPostInList(title: string) {
+    return this.assertInList(title)
+  }
+
+  /**
+   * Assert post does not appear in list
+   */
+  assertPostNotInList(title: string) {
+    return this.assertNotInList(title)
+  }
+
+  /**
+   * Assert post has specific status badge
+   */
+  assertPostStatus(id: string, status: string) {
+    cy.get(this.selectors.row(id)).should('contain.text', status)
+    return this
+  }
+}
+
+export default PostsPOM

package/tests/cypress/src/entities/TasksPOM.ts

@@ -0,0 +1,176 @@
+/**
+ * TasksPOM - Page Object Model for Tasks entity
+ *
+ * Extends DashboardEntityPOM with task-specific form handling and workflows.
+ *
+ * @example
+ * // Instance usage with chaining
+ * TasksPOM.create()
+ *   .visitList()
+ *   .waitForList()
+ *   .clickAdd()
+ *   .fillTaskForm({ title: 'New Task', priority: 'high' })
+ *   .submitForm()
+ *
+ * // API-aware workflow
+ * const tasks = new TasksPOM()
+ * tasks.createTaskWithApiWait({
+ *   title: 'New Task',
+ *   description: 'Task description',
+ *   status: 'todo',
+ *   priority: 'high'
+ * })
+ */
+
+import { DashboardEntityPOM } from '../core/DashboardEntityPOM'
+import entitiesConfig from '../../fixtures/entities.json'
+
+export interface TaskFormData {
+  title: string
+  description?: string
+  status?: 'todo' | 'in-progress' | 'review' | 'done' | 'blocked'
+  priority?: 'low' | 'medium' | 'high' | 'urgent'
+  dueDate?: string
+  estimatedHours?: string
+  completed?: boolean
+}
+
+export class TasksPOM extends DashboardEntityPOM {
+  constructor() {
+    super(entitiesConfig.entities.tasks.slug)
+  }
+
+  // ============================================
+  // FACTORY METHOD
+  // ============================================
+
+  static create(): TasksPOM {
+    return new TasksPOM()
+  }
+
+  // ============================================
+  // ENTITY-SPECIFIC FORM METHODS
+  // ============================================
+
+  /**
+   * Fill task form with provided data
+   * Only fills fields that are provided in the data object
+   */
+  fillTaskForm(data: TaskFormData) {
+    if (data.title) {
+      this.fillTextField('title', data.title)
+    }
+    if (data.description) {
+      this.fillTextarea('description', data.description)
+    }
+    if (data.status) {
+      this.selectOption('status', data.status)
+    }
+    if (data.priority) {
+      this.selectOption('priority', data.priority)
+    }
+    if (data.dueDate) {
+      this.fillTextField('dueDate', data.dueDate)
+    }
+    if (data.estimatedHours) {
+      this.fillTextField('estimatedHours', data.estimatedHours)
+    }
+    return this
+  }
+
+  // ============================================
+  // WORKFLOW METHODS
+  // ============================================
+
+  /**
+   * Complete create flow without API waits
+   */
+  createTask(data: TaskFormData) {
+    this.visitCreate()
+    this.waitForForm()
+    this.fillTaskForm(data)
+    this.submitForm()
+    return this
+  }
+
+  /**
+   * Create task with API intercepts and waits
+   * Deterministic: waits for actual API responses
+   */
+  createTaskWithApiWait(data: TaskFormData) {
+    this.setupApiIntercepts()
+    this.clickAdd()
+    this.waitForForm()
+    this.fillTaskForm(data)
+    this.submitForm()
+    this.api.waitForCreate()
+    return this
+  }
+
+  /**
+   * Create task from list page and wait for refresh
+   */
+  createTaskFromListWithApiWait(data: TaskFormData) {
+    this.setupApiIntercepts()
+    this.clickAdd()
+    this.waitForForm()
+    this.fillTaskForm(data)
+    this.submitForm()
+    this.api.waitForCreateAndRefresh()
+    return this
+  }
+
+  /**
+   * Update task with API waits
+   */
+  updateTaskWithApiWait(data: Partial<TaskFormData>) {
+    this.fillTaskForm(data as TaskFormData)
+    this.submitForm()
+    this.api.waitForUpdate()
+    return this
+  }
+
+  /**
+   * Delete task with API waits
+   * Flow: Navigate to detail -> Delete -> Confirm
+   */
+  deleteTaskWithApiWait(id: string) {
+    this.visitDetailWithApiWait(id)
+    this.clickDelete()
+    this.confirmDelete()
+    this.api.waitForDelete()
+    return this
+  }
+
+  /**
+   * Delete task by finding it in the list by name
+   */
+  deleteTaskByNameWithApiWait(name: string) {
+    this.clickRowByText(name)
+    this.waitForDetail()
+    this.clickDelete()
+    this.confirmDelete()
+    this.api.waitForDelete()
+    return this
+  }
+
+  // ============================================
+  // ENTITY-SPECIFIC ASSERTIONS
+  // ============================================
+
+  /**
+   * Assert task appears in list
+   */
+  assertTaskInList(title: string) {
+    return this.assertInList(title)
+  }
+
+  /**
+   * Assert task does not appear in list
+   */
+  assertTaskNotInList(title: string) {
+    return this.assertNotInList(title)
+  }
+}
+
+export default TasksPOM

package/tests/cypress/src/entities/index.ts

@@ -0,0 +1,14 @@
+/**
+ * Entity POM exports
+ *
+ * Page Object Models for specific entities:
+ * - TasksPOM: Tasks CRUD operations
+ * - CustomersPOM: Customers CRUD operations
+ * - PostsPOM: Posts list operations (use PostEditorPOM for editing)
+ * - PagesPOM: Pages list operations (use PageBuilderPOM for editing)
+ */
+
+export { TasksPOM, type TaskFormData } from './TasksPOM'
+export { CustomersPOM, type CustomerFormData } from './CustomersPOM'
+export { PostsPOM, type PostListFilters } from './PostsPOM'
+export { PagesPOM, type PageListFilters } from './PagesPOM'