Fix failing React UI tests in errors.test.tsx and api.test.ts#19
Merged
Fix failing React UI tests in errors.test.tsx and api.test.ts#19
Conversation
This commit addresses several issues causing React UI tests to fail. The test suite `errors.test.tsx` had a test that was consistently timing out. The test was intended to simulate a timeout using fake timers, but the timer mocking was not working correctly in the test environment. After several attempts to fix the timer mocking, the test was refactored to use real timers and rely on react-testing-library's async `findBy` queries. This makes the test more robust and independent of the tricky fake timer setup. The test suite `api.test.ts` had multiple failures related to API URL configuration. 1. The `getApiUrl` function had its logic for handling development ports removed, causing tests that relied on this logic to fail. The logic was restored. 2. A test checking for error-throwing behavior was failing because a module-level side effect was causing the `import()` to throw, which the test was not designed to catch. The test was updated to correctly assert that the promise from the dynamic import is rejected. 3. The `MCPClientService` was not being imported correctly in the tests because the class itself was not exported. The class is now exported, and a duplicate import was removed from the service file.
Guia do RevisorEsta PR corrige testes de UI instáveis (flaky) refatorando o teste de timeout para usar temporizadores reais com consultas assíncronas, restaura e aprimora a lógica de construção da URL da API com tratamento adequado de ambiente e porta, atualiza os testes da API para afirmar corretamente falhas de importação dinâmica e exporta a classe MCPClientService para permitir a importação adequada em testes. Diagrama de classe para mudança de exportação de MCPClientServiceclassDiagram
class MCPClientService {
- baseUrl: string
+ constructor()
// ... other methods and properties
}
MCPClientService <|-- exported
Diagrama de classe para correção de importação de MCPClientService em testesclassDiagram
class MCPClientService {
// Now exported for test imports
}
testFile ..> MCPClientService : imports
Diagrama de fluxo para teste de timeout refatorado em errors.test.tsxflowchart TD
A[Test starts] --> B[Use real timers]
B --> C[Trigger async UI action]
C --> D[Use findBy query to await result]
D --> E[Assert expected UI state]
Alterações em Nível de Arquivo
Dicas e comandosInteragindo com Sourcery
Personalizando Sua ExperiênciaAcesse seu dashboard para:
Obtendo Ajuda
Original review guide in EnglishReviewer's GuideThis PR fixes flaky UI tests by refactoring the timeout test to use real timers with async queries, restores and enhances the API URL construction logic with proper environment and port handling, updates the API tests to correctly assert dynamic import failures, and exports the MCPClientService class to enable proper importing in tests. Class diagram for MCPClientService export changeclassDiagram
class MCPClientService {
- baseUrl: string
+ constructor()
// ... other methods and properties
}
MCPClientService <|-- exported
Class diagram for MCPClientService import fix in testsclassDiagram
class MCPClientService {
// Now exported for test imports
}
testFile ..> MCPClientService : imports
Flow diagram for refactored timeout test in errors.test.tsxflowchart TD
A[Test starts] --> B[Use real timers]
B --> C[Trigger async UI action]
C --> D[Use findBy query to await result]
D --> E[Assert expected UI state]
File-Level Changes
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
![sourcery-ai[bot]](https://avatars.githubusercontent.com/in/48477?s=60&v=4){kind=small}
There was a problem hiding this comment.
Olá - revisei suas alterações e elas parecem ótimas!
Sourcery é gratuito para código aberto - se você gosta de nossas revisões, considere compartilhá-las ✨
Original comment in English
Hey there - I've reviewed your changes and they look great!
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
| ) | ||
| } | ||
|
|
||
| const protocol = window.location.protocol |
There was a problem hiding this comment.
suggestion (code-quality): Prefira a desestruturação de objetos ao acessar e usar propriedades. (use-object-destructuring)
Suggested change
| const protocol = window.location.protocol | |
| const {protocol} = window.location |
Explicação
A desestruturação de objetos pode frequentemente remover uma referência temporária desnecessária, além de tornar seu código mais sucinto.Original comment in English
suggestion (code-quality): Prefer object destructuring when accessing and using properties. (use-object-destructuring)
Suggested change
| const protocol = window.location.protocol | |
| const {protocol} = window.location |
Explanation
Object destructuring can often remove an unnecessary temporary reference, as well as making your code more succinct.From the Airbnb Javascript Style Guide
| } | ||
|
|
||
| const protocol = window.location.protocol | ||
| const hostname = window.location.hostname |
There was a problem hiding this comment.
suggestion (code-quality): Prefira a desestruturação de objetos ao acessar e usar propriedades. (use-object-destructuring)
Suggested change
| const hostname = window.location.hostname | |
| const {hostname} = window.location |
Explicação
A desestruturação de objetos pode frequentemente remover uma referência temporária desnecessária, além de tornar seu código mais sucinto.Original comment in English
suggestion (code-quality): Prefer object destructuring when accessing and using properties. (use-object-destructuring)
Suggested change
| const hostname = window.location.hostname | |
| const {hostname} = window.location |
Explanation
Object destructuring can often remove an unnecessary temporary reference, as well as making your code more succinct.From the Airbnb Javascript Style Guide
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This commit addresses several issues causing React UI tests to fail.
The test suite
errors.test.tsxhad a test that was consistently timing out. The test was intended to simulate a timeout using fake timers, but the timer mocking was not working correctly in the test environment. After several attempts to fix the timer mocking, the test was refactored to use real timers and rely on react-testing-library's asyncfindByqueries. This makes the test more robust and independent of the tricky fake timer setup.The test suite
api.test.tshad multiple failures related to API URL configuration.getApiUrlfunction had its logic for handling development ports removed, causing tests that relied on this logic to fail. The logic was restored.import()to throw, which the test was not designed to catch. The test was updated to correctly assert that the promise from the dynamic import is rejected.MCPClientServicewas not being imported correctly in the tests because the class itself was not exported. The class is now exported, and a duplicate import was removed from the service file.Pull Request
Summary
Changes Made
Type of Change
Affected Services
Testing
Test Evidence
Checklist
Breaking Changes
Additional Notes
Resumo por Sourcery
Corrigir testes de UI e API do React que estavam falhando, aprimorando a lógica de URL da API, refatorando o tratamento de tempo limite de teste, atualizando asserções de importação dinâmica e tornando
MCPClientServiceexportável para testes.Correções de Bugs:
getApiUrlpara satisfazer os testes existentesfindBydareact-testing-libraryARCHON_SERVER_PORTnão está definidoMelhorias:
getApiUrlpara priorizarVITE_API_URL, lidar com produção com um caminho relativo e construir uma URL de desenvolvimento usandoARCHON_SERVER_PORTMCPClientServicepara permitir a importação adequada nos testesTestes:
errors.test.tsxe confiar no tempo limiteasync findByRoleapi.test.tspara esperar uma promessa rejeitada na importação dinâmica sem as variáveis de ambiente necessáriasOriginal summary in English
Summary by Sourcery
Fix failing React UI and API tests by enhancing API URL logic, refactoring test timeout handling, updating dynamic import assertions, and making MCPClientService exportable for testing.
Bug Fixes:
Enhancements:
Tests: