- Restructure OnlineBoardFilter to use radio tabs (flight/departure/
arrival/route) with dynamic fields matching e2e test expectations
- Fix error page e2e tests to use client-side navigation (SSR renders
empty outside [lang]/layout) and use specific CSS class locators
- Replace deprecated transparentize() with rgba() in _shadows.scss
- Handle WebSocket upgrades explicitly in dev-server to prevent HMR
reconnection spam
- Resolve DEP0190 by spawning modern binary directly without shell
- Add tests/e2e-angular to tsconfig excludes
Copies Playwright e2e tests (58 specs, 300+ tests) designed for cross-app
testing. Adapts API mocks to match real Aeroflot dictionary format (title
objects with multilingual keys), adds board/schedule/days endpoint mocks,
and provides Angular-specific Playwright config on port 4203.
Modern.js SSR intercepts all routes before any Express middleware,
so the API proxy runs as a separate Express server on port 8080.
Modern.js runs on 8081. The proxy uses curl subprocesses which go
through the system HTTPS proxy (GOST) with a proper TLS fingerprint
that the Aeroflot WAF accepts.
Usage: node scripts/dev-server.mjs (replaces pnpm dev for full-stack)
Also: remove stray e2e-angular test directory, fix env default to
same-origin /api.
Root cause of search not working: globalThis.fetch stored as a class
field loses its Window binding, causing 'Illegal invocation'. Fixed
with fetch.bind(globalThis).
Also fix calendar days endpoint date format from yyyyMMdd to
yyyy-MM-ddT00:00:00 matching Angular's ApiFormatterService.
- Point API_BASE_URL to localhost:4200 (Angular's dev proxy) which
correctly forwards to flights.test.aeroflot.ru with proper headers
- Convert URL date format (yyyyMMdd) to API format (yyyy-MM-ddT00:00:00)
matching Angular's ApiFormatterService behavior
- Add standalone api-proxy.mjs script for running without Angular
- Root page redirect uses both loader and client-side navigate
- SignalR hub URL points to platform.yc.webzavod.ru/tracker/hub
- Remove broken server/modern-js.server.ts (proxy handled externally)
useCitySearch hook loads cities from /api/dictionary/1/cities on first
use, then searches in-memory by name prefix and code -- matching the
Angular CitiesSearchService behavior. Wired into OnlineBoardFilter,
ScheduleStartPage, and FlightsMapFilter AutoComplete components.
API functions now build the full localized path matching the Angular
EndpointService pattern (/api/flights/{version}/{locale}/{endpoint}).
The dev proxy forwards /api and /flights to the test backend.
Tests failed because PageTabs uses Link from @modern-js/runtime/router
which wasn't included in the router mock. Added Link to the router mock,
added mocks for PageTabs, OnlineBoardFilter, and other transitive deps,
and updated error text assertions to match the new Russian strings.
When the API fetch fails (backend unavailable), show a styled white
error card with a Russian-language message and retry button instead
of barely-visible text on a dark background.
Wrap connection.start() in try/catch so that when the SignalR hub is
unreachable the status transitions to "offline" silently instead of
throwing unhandled errors that flood the browser console.
OnlineBoardFilter and ScheduleStartPage city fields now use PrimeReact
AutoComplete for visual parity with Angular's PrimeNG city-autocomplete.
ScheduleStartPage labels switched from hardcoded English to i18n keys.
PopularRequestsPanel uses stable content-based keys instead of array index.
Error page loads i18n translations on mount and supports all locale strings.
PageTabs now reads the FEATURE_FLIGHTS_MAP flag directly via useFeatureFlag
instead of relying on a prop default, matching the Angular page-tabs pattern.
FlightsMapFilter uses PrimeReact AutoComplete and Calendar instead of plain
HTML inputs, with i18n labels. MapCanvas init effect uses refs to avoid
React exhaustive-deps warnings. Root layout imports leaflet CSS and
PrimeReact theme globally. Env schema accepts NODE_ENV "test" for vitest.
- Move public/ to config/public/ (Modern.js serves static files
from config/public/, not public/)
- Add explicit background-size: 45px 45px on info tile icons
- All SVGs, fonts, and images now serve with correct MIME types
Enable flights-map tab by default (showFlightsMap=true) to match Angular
production config where flightsMap feature flag is true. The other three
items (tile icons, body background, popular-requests panel) were already
ported identically in the React SCSS.
Fix search button background to use $blue-light (#4a90e2) matching Angular's
color.blue-light class. Add missing !important flags on PopularRequestsPanel
mobile breakpoint rules to match Angular specificity.
Flights Map now uses PageLayout with PageTabs (flights-map tab active),
filter in content-left column, and map in a .frame section. Added SCSS
for filter panel and map wrapper matching Angular structure.
Error pages now show lady404/lady500 illustrations, large error code,
action buttons matching Angular (Buy Ticket, Home Page, Support), and
proper two-column flex layout with mobile fallback.
Schedule start page now uses PageLayout with PageTabs (schedule tab active),
filter form in content-left column, and the info section with titles-container
and PopularRequests in the main content area. SCSS matches Angular start.scss.
When the API is unavailable the popular requests panel was hidden
because the hook returned empty data on error. Add fallback mock data
matching Angular's test fixtures so the panel renders in dev and
degraded environments.
Add blue background/hover styles to the search button matching Angular's
.color.blue button pattern. Fix page title width to calc(100% - 120px)
matching Angular layout. Conditionally render sticky-content wrapper
to avoid empty DOM nodes.
Added SCSS for OnlineBoardSearchPage (calendar strip, connection badges,
day selector) and OnlineBoardDetailsPage (flight legs, station details,
status sections). Ported from Angular component styles with Angular-
specific selectors removed.
Ported Angular SCSS for station, time-group, flight-status, duration,
flight-card, flight-list, and flight-list-skeleton to React equivalents.
Aligned class names in JSX with Angular BEM conventions and added SCSS
imports to all flight display components.
- Copy 134 image files and 28 font files from ClientApp/src/assets/
to public/assets/ for browser-side serving
- Set tools.cssLoader.url=false in modern.config.ts so the CSS loader
leaves url() references as-is instead of trying to resolve them as
webpack modules
- Add .playwright-mcp/, coverage/, and screenshot artifacts to .gitignore
Rewrite OnlineBoardStartPage to use PageLayout two-column structure,
add OnlineBoardFilter with PrimeNG-style accordion tabs, and render
the info tiles and popular requests section matching the Angular
template. Update tests for the new component structure.
Port the Angular page-layout wrapper and flights-page-tabs navigation
to React, preserving identical DOM structure and CSS class names so
global SCSS styles apply without modification.
Replace Google Fonts CDN import with self-hosted @font-face declarations
from the Angular app, pointing to /assets/fonts/*.woff2 in public/.
Configure rspack css-loader to skip url() resolution so the browser
fetches assets from the dev server's public/ directory at runtime.
5511-line PrimeNG theme adapted for PrimeReact: Angular element
selectors replaced with class selectors, ng-dirty/ng-invalid
validation patterns replaced with PrimeReact's .p-invalid class.
Calendar component styles ported with updated asset paths.
The server build was failing with "window is not defined" during SSR because
@modern-js/runtime@3.1.3 had an SSR-unsafe window reference in its router
plugin. Pinning runtime to 2.70.8 (matching app-tools) resolves the version
mismatch and eliminates the server-side window access.
Three root causes of blank page:
1. Modern.js layouts use <Outlet /> not {children} for nested routes
2. process.env not available in browser — guard with typeof checks
3. getEnv() schema required all fields — add defaults for browser context
Also: add source.entriesDir, runtime.router to modern.config.ts,
disable SSR temporarily until the SSR server build alias issue is
resolved (framework-level @_modern_js_src resolution).
gnezim