Bug 39916 - The 'Place booking' modal should have cypress tests
Summary: The 'Place booking' modal should have cypress tests
Status: Failed QA
Alias: None
Product: Koha
Classification: Unclassified
Component: Circulation (show other bugs)
Version: unspecified
Hardware: All All
: P5 - low normal
Assignee: Martin Renvoize (ashimema)
QA Contact: Testopia
URL:
Keywords:
Depends on: 35248
Blocks: 39584 40134
  Show dependency treegraph
 
Reported: 2025-05-16 10:33 UTC by Martin Renvoize (ashimema)
Modified: 2025-06-13 06:46 UTC (History)
4 users (show)

See Also:
GIT URL:
Change sponsored?: ---
Patch complexity: ---
Documentation contact:
Documentation submission:
Text to go in the release notes:
Version(s) released in:
Circulation function: Bookings


Attachments
Bug 39916: Add select2 helpers to cypress (23.37 KB, patch)
2025-05-16 10:37 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: WIP Cypress tests for the bookings modal (14.24 KB, patch)
2025-05-16 10:37 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: Add select2 helpers to cypress (24.98 KB, patch)
2025-05-16 16:08 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: WIP Cypress tests for the bookings modal (22.58 KB, patch)
2025-05-16 16:08 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: Add select2 helpers to cypress (24.98 KB, patch)
2025-05-19 18:06 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: Add cypress helpers for flatpickr (13.58 KB, patch)
2025-05-19 18:06 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: WIP Cypress tests for the bookings modal (30.44 KB, patch)
2025-05-19 18:06 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: Add select2 helpers to cypress (24.98 KB, patch)
2025-05-23 15:31 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: Add flatpickr helpers to cypress (44.44 KB, patch)
2025-05-23 15:31 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: WIP Cypress tests for the bookings modal (29.68 KB, patch)
2025-05-23 15:31 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: Add select2 helpers to cypress (23.25 KB, patch)
2025-06-12 14:51 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: Add flatpickr helpers to cypress (20.91 KB, patch)
2025-06-12 14:51 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: Cypress tests for the bookings modal (47.85 KB, patch)
2025-06-12 14:51 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: Fix booking modal redraw issue (8.90 KB, patch)
2025-06-12 14:51 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review
Bug 39916: Fix race condition in booking modal edit mode (2.36 KB, patch)
2025-06-12 14:51 UTC, Martin Renvoize (ashimema)
Details | Diff | Splinter Review

Note You need to log in before you can comment on or make changes to this bug.
Description Martin Renvoize (ashimema) 2025-05-16 10:33:34 UTC
The bookings modal is one of the more complex modal forms we have, with a lot of logic involved.

We should add cypress tests to ensure we don't see regressions here.
Comment 1 Martin Renvoize (ashimema) 2025-05-16 10:37:22 UTC Comment hidden (obsolete)
Comment 2 Martin Renvoize (ashimema) 2025-05-16 10:37:27 UTC Comment hidden (obsolete)
Comment 3 Martin Renvoize (ashimema) 2025-05-16 16:08:54 UTC Comment hidden (obsolete)
Comment 4 Martin Renvoize (ashimema) 2025-05-16 16:08:57 UTC Comment hidden (obsolete)
Comment 5 Martin Renvoize (ashimema) 2025-05-19 18:06:25 UTC Comment hidden (obsolete)
Comment 6 Martin Renvoize (ashimema) 2025-05-19 18:06:28 UTC Comment hidden (obsolete)
Comment 7 Martin Renvoize (ashimema) 2025-05-19 18:06:31 UTC Comment hidden (obsolete)
Comment 8 Martin Renvoize (ashimema) 2025-05-23 15:31:23 UTC
Created attachment 182771 [details] [review]
Bug 39916: Add select2 helpers to cypress

This patch adds some helper methods for testing with select2 selects.
Comment 9 Martin Renvoize (ashimema) 2025-05-23 15:31:26 UTC
Created attachment 182772 [details] [review]
Bug 39916: Add flatpickr helpers to cypress
Comment 10 Martin Renvoize (ashimema) 2025-05-23 15:31:29 UTC
Created attachment 182773 [details] [review]
Bug 39916: WIP Cypress tests for the bookings modal

Lots of passing tests :)
Comment 11 Marcel de Rooy 2025-06-06 06:58:37 UTC
Just curious why we have patches here and an ASSIGNED status still. Note that this is a dependency for a bug in SO queue too.
Comment 12 Martin Renvoize (ashimema) 2025-06-12 14:51:43 UTC
Created attachment 183206 [details] [review]
Bug 39916: Add select2 helpers to cypress

This adds helper methods for cypress to work with select2 dropdowns:
- selectFromSelect2ByIndex() - select by option index
- selectFromSelect2() - select by text value
- clearSelect2() - clear selection

These helpers handle the complexities of interacting with Select2
components which cannot be selected using standard Cypress commands.
Comment 13 Martin Renvoize (ashimema) 2025-06-12 14:51:45 UTC
Created attachment 183207 [details] [review]
Bug 39916: Add flatpickr helpers to cypress

This adds helper methods for cypress to work with flatpickr date pickers:
- openFlatpickr() - open the calendar
- selectFlatpickrDate() - select a single date
- selectFlatpickrDateRange() - select date range
- clearFlatpickr() - clear the selected dates
- getFlatpickrDate() - get specific date element
- navigateToFlatpickrMonth() - navigate calendar

These helpers simplify date picker testing when using flatpickr.
Comment 14 Martin Renvoize (ashimema) 2025-06-12 14:51:47 UTC
Created attachment 183208 [details] [review]
Bug 39916: Cypress tests for the bookings modal

This adds comprehensive end-to-end tests for the booking modal functionality:

- Modal loading and field validation
- Form field enabling sequence
- Item type and item selection dependencies
- Date picker validation and restrictions
- Booking conflict detection
- Lead/trail period handling
- Form submission (create and edit)
- Error handling and form reset

Tests use optimized shared mock data generation with cy.task() for
realistic test data while minimizing memory usage. Tests cover
both positive and negative scenarios.
Comment 15 Martin Renvoize (ashimema) 2025-06-12 14:51:49 UTC
Created attachment 183209 [details] [review]
Bug 39916: Fix booking modal redraw issue

Fixes an issue where the booking modal's date picker and form fields
were not properly updating when switching between different booking
scenarios or after form submissions.

The fix ensures proper redraw and state management of the flatpickr
component and associated form elements.
Comment 16 Martin Renvoize (ashimema) 2025-06-12 14:51:51 UTC
Created attachment 183210 [details] [review]
Bug 39916: Fix race condition in booking modal edit mode

When editing an existing booking, the item type field was not being
populated because setFormValues() was triggering the wrong Select2 event.

The fix ensures both 'change' and 'select2:select' events are triggered
with proper data structure, allowing the item type to be automatically
populated based on the selected item's effective_item_type_id.

A small timeout prevents race conditions during DOM initialization.
Comment 17 Martin Renvoize (ashimema) 2025-06-12 14:59:15 UTC
(In reply to Marcel de Rooy from comment #11)
> Just curious why we have patches here and an ASSIGNED status still. Note
> that this is a dependency for a bug in SO queue too.

Because I was still working on tests and I didn't want those subsequent bugs to go in without any.

As for why the other one got signed off.. just a matter of people testing things in real life.. there's not a hard code dependency here, so the patches applied without this bug and they tested them in the UI and they're were good there.

Anyway.. I think we're in a good place now.. I'm about to revisit the other bug and add tests for it that add to the one's here at which point we'll be covered well
Comment 18 David Nind 2025-06-13 06:46:29 UTC
One test is failing for me - 1) should edit an existing booking successfully.

Testing notes (using KTD):
1, Apply the patches.
2. Restart everything.
3. Run the tests, they should all pass:
   yarn cypress run --spec t/cypress/integration/Biblio/bookingsModal_spec.ts

Test results:

 Booking Modal Tests
    ✓ should load the booking modal correctly (3924ms)
    ✓ should enable fields in proper sequence (3490ms)
    ✓ should handle item type and item dependencies correctly (4836ms)
    ✓ should disable dates before today and between today and selected start date (4575ms)
    ✓ should disable dates with existing bookings for same item (4978ms)
    ✓ should handle lead and trail period hover highlighting (3642ms)
    ✓ should disable click when lead/trail periods overlap with disabled dates (3439ms)
    ✓ should show event dots for dates with existing bookings (3456ms)
    ✓ should show only the correct bold dates for issue and renewal periods (3797ms)
    ✓ should set correct max date based on circulation rules (3952ms)
    ✓ should handle visible and hidden fields on date selection (3763ms)
    ✓ should submit a new booking successfully (3378ms)
    1) should edit an existing booking successfully
    ✓ should handle booking failure gracefully (3357ms)
    ✓ should reset form when modal is closed (3421ms)


  14 passing (1m)
  1 failing

  1) Booking Modal Tests
       should edit an existing booking successfully:

      Timed out retrying after 10000ms
      + expected - actual

      -'19'
      +'456'
      
      at Context.eval (webpack://koha/./t/cypress/integration/Biblio/bookingsModal_spec.ts:1212:37)