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

package/tests/cypress/e2e/uat/auth/login-logout.cy.ts

@@ -0,0 +1,116 @@
+/// <reference types="cypress" />
+
+import * as allure from 'allure-cypress'
+
+import { DevKeyringPOM } from '../../../src/components/DevKeyringPOM'
+import { DEFAULT_THEME_USERS } from '../../../src/session-helpers'
+
+describe('Authentication - DevKeyring Flow', {
+  tags: ['@uat', '@feat-auth', '@smoke', '@regression']
+}, () => {
+  const devKeyring = DevKeyringPOM.create()
+  const users = DEFAULT_THEME_USERS
+
+  beforeEach(() => {
+    allure.epic('UAT')
+    allure.feature('Authentication')
+    allure.story('DevKeyring Login')
+    // Clear cookies and localStorage to ensure fresh state
+    cy.clearCookies()
+    cy.clearLocalStorage()
+  })
+
+  describe('LOGIN_001: Owner Login via DevKeyring', { tags: '@smoke' }, () => {
+    it('should login as Owner and access dashboard', { tags: '@smoke' }, () => {
+      allure.severity('critical')
+
+      // 1. Visit login page
+      cy.visit('/login')
+
+      // 2. Validate DevKeyring is visible
+      devKeyring.validateVisible()
+
+      // 3. Login as Owner using email
+      devKeyring.quickLoginByEmail(users.OWNER)
+
+      // 4. Validate dashboard access
+      cy.url().should('include', '/dashboard')
+      cy.get('[data-cy="dashboard-container"]').should('be.visible')
+
+      cy.log(`✅ Owner login successful (${users.OWNER})`)
+    })
+  })
+
+  describe('LOGIN_002: Member Login via DevKeyring', { tags: '@smoke' }, () => {
+    it('should login as Member and access dashboard', { tags: '@smoke' }, () => {
+      allure.severity('critical')
+
+      // 1. Visit login page
+      cy.visit('/login')
+
+      // 2. Validate DevKeyring is visible
+      devKeyring.validateVisible()
+
+      // 3. Login as Member using email
+      devKeyring.quickLoginByEmail(users.MEMBER)
+
+      // 4. Validate dashboard access
+      cy.url().should('include', '/dashboard')
+      cy.get('[data-cy="dashboard-container"]').should('be.visible')
+
+      cy.log(`✅ Member login successful (${users.MEMBER})`)
+    })
+  })
+
+  describe('LOGIN_003: Admin Login via DevKeyring', () => {
+    it('should login as Admin and access dashboard', () => {
+      // 1. Visit login page
+      cy.visit('/login')
+
+      // 2. Validate DevKeyring is visible
+      devKeyring.validateVisible()
+
+      // 3. Login as Admin using email
+      devKeyring.quickLoginByEmail(users.ADMIN)
+
+      // 4. Validate dashboard access
+      cy.url().should('include', '/dashboard')
+      cy.get('[data-cy="dashboard-container"]').should('be.visible')
+
+      cy.log(`✅ Admin login successful (${users.ADMIN})`)
+    })
+  })
+
+  describe('LOGOUT_001: User Logout Flow', () => {
+    it('should logout successfully and redirect to login', () => {
+      // Set desktop viewport to show TopNavbar (requires lg: 1024px+)
+      cy.viewport(1280, 800)
+
+      // 1. Login first as Owner
+      cy.visit('/login')
+      devKeyring.quickLoginByEmail(users.OWNER)
+
+      // Wait for dashboard to fully load
+      cy.url().should('include', '/dashboard')
+      cy.get('[data-cy="dashboard-container"]').should('be.visible')
+
+      // Wait for user menu to be available (session loaded)
+      // TopNavbar uses useAuth() which has loading state
+      cy.get('[data-cy="topnav-user-menu-trigger"]', { timeout: 15000 }).should('be.visible')
+
+      // 2. Logout via user menu
+      cy.get('[data-cy="topnav-user-menu-trigger"]').click()
+      cy.get('[data-cy="topnav-menu-signOut"]').should('be.visible').click()
+
+      // 3. Validate redirected to login and DevKeyring is visible again
+      cy.url().should('include', '/login')
+      devKeyring.validateVisible()
+
+      cy.log('✅ Logout successful')
+    })
+  })
+
+  after(() => {
+    cy.log('✅ Authentication tests completed')
+  })
+})

package/tests/cypress/e2e/uat/auth/password-reset.bdd.md

@@ -0,0 +1,289 @@
+---
+feature: Password Reset Flow
+priority: critical
+tags: [auth, password-reset, security, user-flow]
+grepTags: [uat, feat-auth, password-reset]
+coverage: 8
+---
+
+# Password Reset Flow
+
+> Tests for the password reset flow including page access, form validation, submission, and error handling. Actual email delivery is not tested as it requires external service integration.
+
+## @test PWD-RESET-001: Access Password Reset Page
+
+### Metadata
+- **Priority:** Critical
+- **Type:** Smoke
+- **Tags:** password-reset, navigation
+- **Grep:** `@smoke`
+
+```gherkin:en
+Scenario: Access password reset page from login
+
+Given I am on the login page
+When I click on the forgot password link
+Then I should be on /forgot-password
+And the password reset form should be visible
+And the email input should be visible
+And the submit button should be visible
+```
+
+```gherkin:es
+Scenario: Acceder a pagina de reset de password desde login
+
+Given estoy en la pagina de login
+When hago click en el enlace de olvide mi password
+Then deberia estar en /forgot-password
+And el formulario de reset deberia estar visible
+And el input de email deberia estar visible
+And el boton de enviar deberia estar visible
+```
+
+### Expected Results
+- Forgot password link works
+- Password reset page loads
+- All form elements visible
+
+---
+
+## @test PWD-RESET-002: Direct URL Access
+
+### Metadata
+- **Priority:** Normal
+- **Type:** Smoke
+- **Tags:** password-reset, direct-access
+- **Grep:** `@smoke`
+
+```gherkin:en
+Scenario: Access password reset page directly via URL
+
+Given I visit /forgot-password directly
+Then the password reset container should be visible
+And the email input should be visible
+```
+
+```gherkin:es
+Scenario: Acceder a pagina de reset directamente via URL
+
+Given visito /forgot-password directamente
+Then el contenedor de reset deberia estar visible
+And el input de email deberia estar visible
+```
+
+### Expected Results
+- Direct URL access works
+- No authentication required
+
+---
+
+## @test PWD-RESET-003: Submit Valid Email
+
+### Metadata
+- **Priority:** Critical
+- **Type:** Smoke
+- **Tags:** password-reset, submit
+- **Grep:** `@smoke`
+
+```gherkin:en
+Scenario: Submit password reset with valid email format
+
+Given I am on the password reset page
+When I enter a valid email format (user@example.com)
+And I click the submit button
+Then I should see a success message
+```
+
+```gherkin:es
+Scenario: Enviar reset de password con email valido
+
+Given estoy en la pagina de reset de password
+When ingreso un email con formato valido (user@example.com)
+And hago click en el boton de enviar
+Then deberia ver un mensaje de exito
+```
+
+### Expected Results
+- Form submits successfully
+- Success message displayed
+- No email enumeration (same message for existing/non-existing)
+
+---
+
+## @test PWD-RESET-004: Validate Empty Email
+
+### Metadata
+- **Priority:** High
+- **Type:** Validation
+- **Tags:** password-reset, validation, empty
+
+```gherkin:en
+Scenario: Show error for empty email field
+
+Given I am on the password reset page
+When I click submit without entering an email
+Then I should see a required field error
+```
+
+```gherkin:es
+Scenario: Mostrar error para campo email vacio
+
+Given estoy en la pagina de reset de password
+When hago click en enviar sin ingresar email
+Then deberia ver un error de campo requerido
+```
+
+### Expected Results
+- Validation error displayed
+- Form not submitted
+
+---
+
+## @test PWD-RESET-005: Validate Invalid Email Format
+
+### Metadata
+- **Priority:** High
+- **Type:** Validation
+- **Tags:** password-reset, validation, format
+
+```gherkin:en
+Scenario: Show error for invalid email format
+
+Given I am on the password reset page
+When I enter an invalid email format (not-an-email)
+And I click the submit button
+Then I should see an invalid email error
+```
+
+```gherkin:es
+Scenario: Mostrar error para formato de email invalido
+
+Given estoy en la pagina de reset de password
+When ingreso un formato de email invalido (not-an-email)
+And hago click en el boton de enviar
+Then deberia ver un error de email invalido
+```
+
+### Expected Results
+- Format validation works
+- Clear error message
+
+---
+
+## @test PWD-RESET-006: Back to Login Link
+
+### Metadata
+- **Priority:** Normal
+- **Type:** Navigation
+- **Tags:** password-reset, navigation
+
+```gherkin:en
+Scenario: Navigate back to login page
+
+Given I am on the password reset page
+When I click the back to login link
+Then I should be on the login page
+```
+
+```gherkin:es
+Scenario: Navegar de vuelta a pagina de login
+
+Given estoy en la pagina de reset de password
+When hago click en el enlace de volver a login
+Then deberia estar en la pagina de login
+```
+
+### Expected Results
+- Back link works
+- Returns to login page
+
+---
+
+## @test PWD-RESET-007: Submit with Known Test Email
+
+### Metadata
+- **Priority:** High
+- **Type:** Regression
+- **Tags:** password-reset, existing-user
+
+```gherkin:en
+Scenario: Handle submission with existing user email
+
+Given I am on the password reset page
+When I enter a known test email (carlos.mendoza@nextspark.dev)
+And I click the submit button
+Then I should see a success message
+```
+
+```gherkin:es
+Scenario: Manejar envio con email de usuario existente
+
+Given estoy en la pagina de reset de password
+When ingreso un email de prueba conocido (carlos.mendoza@nextspark.dev)
+And hago click en el boton de enviar
+Then deberia ver un mensaje de exito
+```
+
+### Expected Results
+- Same success message as non-existing email
+- No email enumeration vulnerability
+
+---
+
+## @test PWD-RESET-008: Form Keyboard Accessibility
+
+### Metadata
+- **Priority:** Normal
+- **Type:** Accessibility
+- **Tags:** password-reset, keyboard, a11y
+
+```gherkin:en
+Scenario: Submit form with Enter key
+
+Given I am on the password reset page
+When I enter an email and press Enter
+Then the form should be submitted
+```
+
+```gherkin:es
+Scenario: Enviar formulario con tecla Enter
+
+Given estoy en la pagina de reset de password
+When ingreso un email y presiono Enter
+Then el formulario deberia ser enviado
+```
+
+### Expected Results
+- Enter key submits form
+- Keyboard navigation works
+
+---
+
+## UI Elements
+
+| Element | Selector | Description |
+|---------|----------|-------------|
+| Forgot Password Link | `[data-cy="login-forgot-password"]` | Link on login page |
+| Form | `[data-cy="forgot-password-form"]` | Password reset form |
+| Email Input | `[data-cy="forgot-password-email"]` | Email input field |
+| Submit Button | `[data-cy="forgot-password-submit"]` | Submit button |
+| Success Message | `[data-cy="forgot-password-success"]` | Success message |
+| Error Message | `[data-cy="forgot-password-error"]` | Error message |
+| Back to Login | `[data-cy="forgot-password-back"]` | Back to login link |
+
+> Note: Tests use `AuthPOM` from `src/core/AuthPOM.ts` which loads selectors from `fixtures/selectors/auth.json`
+
+---
+
+## Summary
+
+| Test ID | Block | Description | Tags |
+|---------|-------|-------------|------|
+| PWD-RESET-001 | Access | Page access from login | `@smoke` |
+| PWD-RESET-002 | Access | Direct URL access | `@smoke` |
+| PWD-RESET-003 | Submit | Submit valid email | `@smoke` |
+| PWD-RESET-004 | Validation | Empty email error | |
+| PWD-RESET-005 | Validation | Invalid format error | |
+| PWD-RESET-006 | Navigation | Back to login | |
+| PWD-RESET-007 | Submit | Existing user email | |
+| PWD-RESET-008 | A11y | Keyboard accessibility | |

package/tests/cypress/e2e/uat/auth/password-reset.cy.ts

@@ -0,0 +1,200 @@
+/// <reference types="cypress" />
+
+/**
+ * Password Reset Flow Tests
+ *
+ * Tests the complete password reset flow:
+ * - Request password reset link
+ * - Validate form fields
+ * - Handle errors (invalid email, rate limiting)
+ * - Success message display
+ *
+ * Note: Actual email delivery and token validation are not tested here
+ * as they require external email service integration.
+ * Tests verify up to the point of email send request.
+ *
+ * Tags: @uat, @feat-auth, @password-reset
+ */
+
+import * as allure from 'allure-cypress'
+
+import { AuthPOM } from '../../../src/core/AuthPOM'
+
+describe('Authentication - Password Reset Flow', {
+  tags: ['@uat', '@feat-auth', '@password-reset']
+}, () => {
+  const auth = new AuthPOM()
+
+  beforeEach(() => {
+    allure.epic('Authentication')
+    allure.feature('Password Reset')
+    // Clear any existing session
+    cy.clearCookies()
+    cy.clearLocalStorage()
+  })
+
+  describe('PWD-RESET-001: Access Password Reset Page', { tags: '@smoke' }, () => {
+    it('should access password reset page from login', { tags: '@smoke' }, () => {
+      allure.severity('critical')
+      allure.story('Page Access')
+
+      // 1. Visit login page
+      auth.visitLogin()
+
+      // 2. Show email form (forgot password link is inside email form section)
+      auth.showEmailLogin()
+      auth.waitForLoginForm()
+
+      // 3. Click on forgot password link
+      auth.clickForgotPassword()
+
+      // 4. Validate password reset page
+      cy.url().should('include', '/forgot-password')
+      cy.get(auth.selectors.forgotPasswordForm).should('be.visible')
+      cy.get(auth.selectors.forgotPasswordEmail).should('be.visible')
+      cy.get(auth.selectors.forgotPasswordSubmit).should('be.visible')
+
+      cy.log('✅ Password reset page accessible')
+    })
+  })
+
+  describe('PWD-RESET-002: Direct URL Access', { tags: '@smoke' }, () => {
+    it('should access password reset page directly via URL', { tags: '@smoke' }, () => {
+      allure.severity('normal')
+      allure.story('Direct Access')
+
+      // 1. Visit directly
+      auth.visitForgotPassword()
+
+      // 2. Validate page elements
+      cy.get(auth.selectors.forgotPasswordForm).should('be.visible')
+      cy.get(auth.selectors.forgotPasswordEmail).should('be.visible')
+
+      cy.log('✅ Direct access to password reset works')
+    })
+  })
+
+  describe('PWD-RESET-003: Submit Valid Email', { tags: '@smoke' }, () => {
+    it('should show success message for valid email format', { tags: '@smoke' }, () => {
+      allure.severity('critical')
+      allure.story('Submit Request')
+
+      // 1. Visit password reset page
+      auth.visitForgotPassword()
+
+      // 2. Request password reset
+      auth.requestPasswordReset('user@example.com')
+
+      // 3. Should show success message (even if email doesn't exist for security)
+      auth.waitForPasswordResetSuccess()
+
+      cy.log('✅ Password reset request submitted successfully')
+    })
+  })
+
+  describe('PWD-RESET-004: Validate Empty Email', () => {
+    it('should show error for empty email field', () => {
+      allure.severity('high')
+      allure.story('Validation')
+
+      // 1. Visit password reset page
+      auth.visitForgotPassword()
+
+      // 2. Submit without entering email
+      cy.get(auth.selectors.forgotPasswordSubmit).click()
+
+      // 3. Should show Zod validation error in UI
+      // The form uses react-hook-form with zod validation
+      // Empty email triggers validation error from zod schema
+      cy.contains('.text-destructive', 'Please enter a valid email address').should('be.visible')
+
+      cy.log('✅ Empty email validation works')
+    })
+  })
+
+  describe('PWD-RESET-005: Validate Invalid Email Format', () => {
+    it('should show error for invalid email format', () => {
+      allure.severity('high')
+      allure.story('Validation')
+
+      // 1. Visit password reset page
+      auth.visitForgotPassword()
+
+      // 2. Enter invalid email format
+      cy.get(auth.selectors.forgotPasswordEmail).type('not-an-email')
+
+      // 3. Submit form
+      cy.get(auth.selectors.forgotPasswordSubmit).click()
+
+      // 4. Should show validation error (HTML5 or custom)
+      cy.get(auth.selectors.forgotPasswordEmail).then(($input) => {
+        const input = $input[0] as HTMLInputElement
+        if (input.validity) {
+          expect(input.validity.valid).to.be.false
+        }
+      })
+
+      cy.log('✅ Invalid email format validation works')
+    })
+  })
+
+  describe('PWD-RESET-006: Back to Login Link', () => {
+    it('should navigate back to login page', () => {
+      allure.severity('normal')
+      allure.story('Navigation')
+
+      // 1. Visit password reset page
+      auth.visitForgotPassword()
+
+      // 2. Click back to login
+      auth.backToLogin()
+
+      // 3. Should be on login page
+      auth.assertOnLoginPage()
+
+      cy.log('✅ Back to login navigation works')
+    })
+  })
+
+  describe('PWD-RESET-007: Submit with Known Test Email', () => {
+    it('should handle submission with existing user email', () => {
+      allure.severity('high')
+      allure.story('Submit Request')
+
+      // 1. Visit password reset page
+      auth.visitForgotPassword()
+
+      // 2. Request reset for known test email
+      auth.requestPasswordReset('carlos.mendoza@nextspark.dev')
+
+      // 3. Should show success (same message for security - no email enumeration)
+      auth.waitForPasswordResetSuccess()
+
+      cy.log('✅ Password reset for existing user handled correctly')
+    })
+  })
+
+  describe('PWD-RESET-008: Form Keyboard Accessibility', () => {
+    it('should submit form with Enter key', () => {
+      allure.severity('normal')
+      allure.story('Accessibility')
+
+      // 1. Visit password reset page
+      auth.visitForgotPassword()
+
+      // 2. Enter email and press Enter
+      cy.get(auth.selectors.forgotPasswordEmail)
+        .type('user@example.com{enter}')
+
+      // 3. Should process submission and show success (async operation)
+      // Wait for the success message to appear after API call completes
+      auth.waitForPasswordResetSuccess()
+
+      cy.log('✅ Keyboard submission works')
+    })
+  })
+
+  after(() => {
+    cy.log('✅ Password reset flow tests completed')
+  })
+})