Ui Testing

Testing the event listing functionality in the user interface allows us to verify that our Spring Boot backend is correctly integrated with our frontend application and that users can view their events with pagination support.

Testing the List Events Endpoint

Let's verify that our list events functionality works correctly by testing it through the user interface:

Step 1: Compile and Run

First, we need to ensure our application builds correctly and is running:

• Run mvn clean compile to build the application
• Start the Spring Boot application
• Navigate to the organizer's landing page in your browser
• Login using your Keycloak credentials

Step 2: Inspecting the Network Requests

To verify our backend is working correctly, we can use the browser's developer tools:

1. Open the Network tab in your browser's developer tools
2. Clear any existing network requests
3. Refresh the page

The browser will make a request to /api/v1/events with query parameters:

page=0&size=2

Step 3: Analyzing the Response

The response from our endpoint contains:

• A content array containing the event data
• Pagination metadata including:
  • pageNumber: Current page (starting from 0)
  • pageSize: Number of records per page
  • totalPages: Total number of pages
  • totalElements: Total number of events

Step 4: Testing Pagination

The user interface implements pagination controls:

• Events are displayed in pages of 2 items
• Navigate between pages using the pagination controls
• The UI updates to show the next set of events when clicking "Next"
• Event details displayed include:
  • Start and end dates
  • Sales period
  • Description
  • Venue information
  • Ticket types

Summary

• We tested the list events functionality using the user interface