Commit Graph

5 Commits

Author SHA1 Message Date
f625ef29e7 test: add playwright code coverage (#12294)
add playwright code coverage
merge frontend code coverage
use merged frontend for codeCov

add make command
update CI
2026-03-23 20:50:01 +00:00
0ddfed3c43 Feat: add storybook setup (#10721)
* feat(storybook): add Storybook setup and Button component stories

- Add Storybook configuration files (.storybook/main.ts, preview.ts, css.d.ts)
- Add Button component stories with interaction testing
- Add Storybook dependencies and scripts to package.json
- Support dark mode in stories via decorator
- Include play functions for automated interaction testing

* ci(storybook): add GitHub Pages deployment workflow

- Add automated deployment workflow for Storybook
- Deploy on push to main when Storybook files change
- Support manual trigger via workflow_dispatch
- Use official GitHub Actions for Pages deployment

* fix(storybook): align Storybook versions and fix TypeScript issues

- Update all @storybook/* packages from ^8.4.7 to ^8.6.14 to match main storybook version
- Fix CSS type declarations in css.d.ts (Record<string, string> instead of Record<string, never>)
- Remove @ts-ignore comments from preview.ts (CSS imports now properly typed)
- Fix darkMode type issue in button.stories.tsx with proper ArgTypes type assertion

* feat(storybook): replace Button stories with Dropdown component stories

- Remove Button stories (shadcn already has documentation)
- Add comprehensive Dropdown component stories showcasing:
  - Default, with value, combobox mode
  - With metadata, disabled, loading states
  - Many options, searchable filtering
  - Dark mode support
- Add store initialization decorator for Storybook
- Include interaction testing with play functions

* feat(storybook): add SettingsPage stories and remove dropdown stories

- Remove dropdown component stories
- Add SettingsPage stories with router, store, and dark mode decorators
- Include variants: default, with general settings, and dark mode

* feat(storybook): fix SettingsPage stories to show full page and add play functions

- Fix router setup to properly render SettingsPage with nested routes
- Add Routes configuration for all settings sub-pages (General, MCP Servers, Global Variables, Shortcuts, Messages)
- Add play functions to test page visibility and navigation
- Add stories for different routes: Default, WithGeneralSettings, NavigateToShortcuts, NavigateToGlobalVariables, DarkMode

* revert(storybook): restore SettingsPage stories to original working version

- Revert to simpler router setup without Routes configuration
- Remove play functions and complex routing
- Restore original three stories: Default, WithGeneralSettings, DarkMode

* feat(storybook): add stories for ShortcutsPage and GlobalVariablesPage with tables

- Add ShortcutsPage stories showing the shortcuts table
- Add GlobalVariablesPage stories showing the global variables table
- Include store setup for shortcuts data
- Add play functions to verify table visibility
- Support dark mode for both pages

* fix(storybook): add QueryClientProvider to GlobalVariablesPage stories

- Add QueryClientProvider decorator to support React Query hooks
- Configure QueryClient with retry disabled for Storybook

* fix(storybook): remove WithGeneralSettings story to fix nested router error

- Remove WithGeneralSettings story that was causing nested Router error
- Keep Default and DarkMode stories only

* feat(storybook): enhance SettingsPage stories with multiple states and logic variations

- Add stories showcasing different store configurations (autoLogin, hasStore)
- Demonstrate conditional General settings visibility logic
- Add interactive sidebar navigation story
- Show full configuration with all features
- Include play functions to verify state-based behavior
- Showcase how page adapts to different user/auth states

* fix(storybook): initialize Zustand stores synchronously in SettingsPage stories

- Set store state before component render instead of in useEffect
- Ensures stores are accessible when SettingsPage component mounts
- Fixes state access errors in Storybook

* feat(storybook): add story to verify store state accessibility

- Add VerifyStoreState story that demonstrates accessing Zustand store state
- Verify store values match expected configuration
- Show that state is accessible from play functions

* fix(storybook): remove router from SettingsPage stories to fix errors

- Remove MemoryRouter decorator that was causing errors
- Keep store setup and dark mode decorators
- Stories now work without router dependency

* fix(storybook): add router back to SettingsPage stories for useNavigate support

- Add MemoryRouter back to support useCustomNavigate hook in PageLayout
- Router is needed for navigation hooks to work properly
- Keep router at decorator level to avoid nested router errors

* fix(storybook): fix router decorator order in SettingsPage stories

- Move router decorator to be outermost (last in array)
- Decorators run bottom-to-top, so router should wrap everything
- Ensures useNavigate context is available to all components

* feat(storybook): add PlaygroundPage story as example for complex page stories

- Add PlaygroundPage story demonstrating how to create stories for complex pages
- Include darkMode toggle control as example for interactive story controls
- Set up decorators for query client, router, and theme switching
- Hide publish elements (Theme buttons, Built with Langflow) in story view
- Center chat title header in story view
- Configure Storybook preview and CSS types

This story serves as a reference for creating stories for full page components
rather than simple UI components, which are already documented in shadcn docs.

* chore(storybook): remove SettingsPage stories

Keep only PlaygroundPage story as the example for complex page stories.

* chore: restore pyproject.toml to match main branch

* chore: restore pyproject.toml to match main branch

* Revert "chore: restore pyproject.toml to match main branch"

This reverts commit a2b75a4028f1f046bc84a8d7999d53a2cb720fc9.

* chore: remove src/frontend/pyproject.toml as it doesn't exist in main

* fix gitignore and add make commands

* update package-json

* chore(storybook): migrate from v8.6.14 to v10.1.0

- Update all Storybook packages to v10.1.0
- Replace @storybook/addon-essentials with @storybook/addon-docs
- Remove @storybook/addon-interactions (moved to core)
- Remove @storybook/blocks and @storybook/test (consolidated)
- Fix import in PlaygroundPage.stories.tsx to use @storybook/react
- Update tsconfig.json moduleResolution to 'bundler' for better compatibility
- Add explicit types configuration for @storybook/react

* fix: update package-lock.json to sync with package.json

* fix: regenerate package-lock.json with all optional dependencies

---------

Co-authored-by: Olfa Maslah <olfamaslah@Olfas-MacBook-Pro.local>
Co-authored-by: Cristhian Zanforlin <criszl@MacBook-Pro-di-Cristhian.local>
Co-authored-by: Olfa Maslah <olfamaslah@macbookpro.war.can.ibm.com>
2025-11-26 20:39:05 +00:00
f24a064baa chore: Improve and expand Makefile help commands (#10184)
* Improve and expand Makefile help commands

Enhanced the help output in Makefile and Makefile.frontend with clearer formatting, color, and categorized command lists. Added specialized help targets for backend, frontend, testing, Docker, and advanced commands to improve developer onboarding and usability.

* Update Makefile
2025-10-10 19:29:04 +00:00
6bf60ece71 ci: add frontend test execution, reporting, and coverage in workflow (#8815)
* chore: add jest-junit dependency for improved test reporting

- Updated package.json and package-lock.json to include jest-junit version 16.0.0, enhancing test reporting capabilities in the project.

* chore: enhance Jest configuration for improved test coverage and CI reporting

- Added coverage collection settings, including coverage thresholds and report formats.
- Configured CI-specific options for Jest, including the use of jest-junit for test reporting and adjusted worker settings for better performance in CI environments.

* chore: update frontend test command for CI mode to ensure proper environment variable usage

- Modified the test command in the Makefile to set CI=true for accurate test execution in CI environments.

* chore: enhance frontend CI workflow with test reporting and coverage uploads

- Replaced the frontend dependency installation step with a command to run unit tests in CI mode.
- Added steps to publish test results using junit report and to comment on pull requests with coverage summaries.
- Implemented artifact upload for coverage reports to improve visibility and tracking of test coverage over time.

* chore: add frontend dependency installation step to CI workflow

- Introduced a step to install frontend dependencies using npm ci in the GitHub Actions workflow.
- This enhancement ensures that all necessary packages are available before running frontend unit tests, improving the reliability of the CI process.

* chore: update junit report action version in CI workflow

- Upgraded the junit report action from v5 to v5.5.1 in the GitHub Actions workflow to leverage the latest features and improvements for test result reporting.

* chore: add Jest unit test workflow for frontend

- Introduced a new GitHub Actions workflow to run Jest unit tests for the frontend.
- The workflow includes steps for checking out the repository, setting up the Node.js environment, running tests, publishing test results, adding coverage comments on pull requests, and uploading coverage reports.
- This enhancement improves the CI process by ensuring comprehensive testing and reporting for frontend components.

* chore: integrate Jest unit tests into CI workflow

- Added a new job to the CI workflow to run frontend unit tests using Jest.
- Updated the changes filter to include Jest test files, ensuring they are recognized during the CI process.
- This enhancement improves the testing coverage and reliability of the frontend components.
2025-07-01 20:38:10 +00:00
ff00eb582f fix: improves table formatting in the playground and adds Jest tests (#8743)
* feat(tests): add Jest configuration and setup for testing environment

- Introduced Jest configuration file to set up testing environment with TypeScript support and JSDOM.
- Added setupTests.ts for global test configurations, including mocks for ResizeObserver and IntersectionObserver.
- Updated package.json and package-lock.json to include Jest and related dependencies.
- Implemented utility functions for processing markdown content, including handling tables and <think> tags.
- Added comprehensive tests for markdown utility functions to ensure proper functionality.

* refactor(makefile): separate frontend commands into a dedicated Makefile

- Removed frontend-related targets from the main Makefile and created a new Makefile.frontend to manage frontend-specific commands.
- Updated the main Makefile to include a reference to the new frontend Makefile and added a help message for frontend commands.
- This restructuring improves organization and clarity for managing backend and frontend build processes.
2025-06-30 21:13:04 +00:00