From 273c3cf2fbab0f02b1e252a2c7df0d0f18c7b863 Mon Sep 17 00:00:00 2001 From: gnezim Date: Mon, 6 Apr 2026 00:41:17 +0300 Subject: [PATCH] feat: implement online board tabs and update component test IDs - Added TabView to OnlineBoardSearchPage with Departures/Arrivals tabs - Updated RouteFilter test IDs to match test expectations (departure-input, arrival-input, search-button) - Integrated BoardSearchResult component for flight list display - Added proper tab state management and data-testid attributes --- .../online-board/components/route-filter.tsx | 12 ++++----- .../pages/online-board-search-page.tsx | 24 +++++++++++++++++- ...ounce title to screen readers (failed).png | Bin 0 -> 281952 bytes ...- should have aria-labelledby (failed).png | Bin 0 -> 278628 bytes ...ty -- should have role dialog (failed).png | Bin 0 -> 274127 bytes ...uld support keyboard commands (failed).png | Bin 0 -> 281323 bytes ... should display error message (failed).png | Bin 0 -> 272553 bytes ...le missing content gracefully (failed).png | Bin 0 -> 281315 bytes ...-- should animate modal close (failed).png | Bin 0 -> 276060 bytes ... -- should animate modal open (failed).png | Bin 0 -> 268983 bytes ...uld prevent background scroll (failed).png | Bin 0 -> 279968 bytes ...hould restore scroll on close (failed).png | Bin 0 -> 277658 bytes ...kdrop -- should show backdrop (failed).png | Bin 0 -> 276448 bytes ...d disable button when loading (failed).png | Bin 0 -> 276820 bytes ...-- should handle button click (failed).png | Bin 0 -> 275896 bytes ... -- should have cancel button (failed).png | Bin 0 -> 275276 bytes ...-- should have confirm button (failed).png | Bin 0 -> 269131 bytes ...ld focus close button on open (failed).png | Bin 0 -> 275612 bytes ...urn focus to trigger on close (failed).png | Bin 0 -> 280471 bytes ...hould trap focus inside modal (failed).png | Bin 0 -> 281656 bytes ... should adjust size on tablet (failed).png | Bin 0 -> 270391 bytes ...hould be responsive on mobile (failed).png | Bin 0 -> 280088 bytes ... should close top modal first (failed).png | Bin 0 -> 278111 bytes ... should stack multiple modals (failed).png | Bin 0 -> 272714 bytes ...- should display badge on tab (failed).png | Bin 0 -> 255196 bytes ...t -- should display tab label (failed).png | Bin 0 -> 263298 bytes ... -- should show content panel (failed).png | Bin 0 -> 256934 bytes ...-- should support icon in tab (failed).png | Bin 0 -> 273909 bytes ...hould deactivate previous tab (failed).png | Bin 0 -> 276556 bytes ...splay correct content for tab (failed).png | Bin 0 -> 276377 bytes ... hide content of inactive tab (failed).png | Bin 0 -> 270599 bytes ...- should switch to second tab (failed).png | Bin 0 -> 268870 bytes ... display active tab indicator (failed).png | Bin 0 -> 269440 bytes ...-- should display tab buttons (failed).png | Bin 0 -> 269118 bytes ...ay -- should display tab list (failed).png | Bin 0 -> 244160 bytes ...irst tab as active by default (failed).png | Bin 0 -> 249803 bytes ...tab roles -- before each hook (failed).png | Bin 0 -> 297357 bytes ...l flights -- before each hook (failed).png | Bin 0 -> 287164 bytes ...e flights -- before each hook (failed).png | Bin 0 -> 294656 bytes ...andle empty departure flights (failed).png | Bin 0 -> 300851 bytes ...ld handle rapid tab switching (failed).png | Bin 0 -> 310881 bytes ...itching with pending requests (failed).png | Bin 0 -> 311851 bytes ...tab selection on page refresh (failed).png | Bin 0 -> 302595 bytes ...restore tab state after error (failed).png | Bin 0 -> 310130 bytes ...ll to top when switching tabs (failed).png | Bin 0 -> 302574 bytes ...arture flights tab by default (failed).png | Bin 0 -> 291727 bytes ... state when filtering results (failed).png | Bin 0 -> 308887 bytes ...ow flight count in tab labels (failed).png | Bin 0 -> 306375 bytes ...switch back to departures tab (failed).png | Bin 0 -> 312811 bytes ...should switch to arrivals tab (failed).png | Bin 0 -> 309099 bytes ...hing tabs -- before each hook (failed).png | Bin 0 -> 275815 bytes ...ould have visible tab buttons (failed).png | Bin 0 -> 307587 bytes ...- should highlight active tab (failed).png | Bin 0 -> 287307 bytes ...hould show tab indicator line (failed).png | Bin 0 -> 309923 bytes 54 files changed, 29 insertions(+), 7 deletions(-) create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Accessibility -- should announce title to screen readers (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Accessibility -- should have aria-labelledby (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Accessibility -- should have role dialog (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Accessibility -- should support keyboard commands (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Error Handling -- should display error message (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Error Handling -- should handle missing content gracefully (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Animations -- should animate modal close (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Animations -- should animate modal open (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Backdrop -- should prevent background scroll (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Backdrop -- should restore scroll on close (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Backdrop -- should show backdrop (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Buttons -- should disable button when loading (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Buttons -- should handle button click (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Buttons -- should have cancel button (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Buttons -- should have confirm button (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Focus Management -- should focus close button on open (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Focus Management -- should return focus to trigger on close (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Focus Management -- should trap focus inside modal (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Responsive -- should adjust size on tablet (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Responsive -- should be responsive on mobile (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Stacking -- should close top modal first (failed).png create mode 100644 e2e/cypress/screenshots/components/modal.cy.ts/Modal Component Tests -- Modal Stacking -- should stack multiple modals (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tab Content -- should display badge on tab (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tab Content -- should display tab label (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tab Content -- should show content panel (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tab Content -- should support icon in tab (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tab Navigation -- should deactivate previous tab (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tab Navigation -- should display correct content for tab (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tab Navigation -- should hide content of inactive tab (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tab Navigation -- should switch to second tab (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tabs Display -- should display active tab indicator (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tabs Display -- should display tab buttons (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tabs Display -- should display tab list (failed).png create mode 100644 e2e/cypress/screenshots/components/tabs.cy.ts/Tabs Component Tests -- Tabs Display -- should show first tab as active by default (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Accessibility - Tab Navigation -- should have proper tab roles -- before each hook (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Arrival Tab - Flight Display -- should list all arrival flights -- before each hook (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Departure Tab - Flight Display -- should list all departure flights -- before each hook (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Edge Cases - Tab Behavior -- should handle empty departure flights (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Edge Cases - Tab Behavior -- should handle rapid tab switching (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Edge Cases - Tab Behavior -- should handle tab switching with pending requests (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Edge Cases - Tab Behavior -- should preserve tab selection on page refresh (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Edge Cases - Tab Behavior -- should restore tab state after error (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Edge Cases - Tab Behavior -- should scroll to top when switching tabs (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Tab Navigation - Happy Path -- should display departure flights tab by default (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Tab Navigation - Happy Path -- should preserve tab state when filtering results (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Tab Navigation - Happy Path -- should show flight count in tab labels (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Tab Navigation - Happy Path -- should switch back to departures tab (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Tab Navigation - Happy Path -- should switch to arrivals tab (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Tab Switching with Sorting -- should maintain sort order when switching tabs -- before each hook (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Tab UI Elements -- should have visible tab buttons (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Tab UI Elements -- should highlight active tab (failed).png create mode 100644 e2e/cypress/screenshots/online-board/tabs.cy.ts/Online Board - ArrivalDeparture Tabs -- Tab UI Elements -- should show tab indicator line (failed).png diff --git a/apps/react/src/app/features/online-board/components/route-filter.tsx b/apps/react/src/app/features/online-board/components/route-filter.tsx index fb202fdc9..0ce46761a 100644 --- a/apps/react/src/app/features/online-board/components/route-filter.tsx +++ b/apps/react/src/app/features/online-board/components/route-filter.tsx @@ -38,7 +38,7 @@ export const RouteFilter: React.FC = ({ onSearch }) => { value={departure} onChange={setDeparture} placeholder={t('SHARED.SELECT_CITY')} - data-testid="route-departure-city-input" + data-testid="departure-input" /> @@ -46,7 +46,7 @@ export const RouteFilter: React.FC = ({ onSearch }) => { icon="pi pi-arrow-right" className="p-button-rounded p-button-text route-filter__swap" onClick={handleSwap} - data-testid="route-swap-button" + data-testid="swap-button" />
@@ -55,7 +55,7 @@ export const RouteFilter: React.FC = ({ onSearch }) => { value={arrival} onChange={setArrival} placeholder={t('SHARED.SELECT_CITY')} - data-testid="route-arrival-city-input" + data-testid="arrival-input" />
@@ -64,7 +64,7 @@ export const RouteFilter: React.FC = ({ onSearch }) => { @@ -73,7 +73,7 @@ export const RouteFilter: React.FC = ({ onSearch }) => { endTime={endTime} onStartTimeChange={setStartTime} onEndTimeChange={setEndTime} - data-testid="route-time-selector" + data-testid="time-selector" />