diff --git a/frontend/components/__tests__/ContainerCard.test.tsx b/frontend/components/__tests__/ContainerCard.test.tsx index 5005f4f..7820e96 100644 --- a/frontend/components/__tests__/ContainerCard.test.tsx +++ b/frontend/components/__tests__/ContainerCard.test.tsx @@ -83,6 +83,22 @@ describe('ContainerCard', () => { expect(card).toHaveStyle({ borderColor: '#718096' }); }); + it('should use default border color for unknown status', () => { + const unknownContainer = { ...mockContainer, status: 'unknown' }; + + const { container } = render( + + ); + + const card = container.querySelector('.MuiCard-root'); + // Should fallback to 'stopped' color (#718096) + expect(card).toHaveStyle({ borderColor: '#718096' }); + }); + it('should call useContainerActions with correct parameters', () => { render( ({ useRouter: jest.fn(() => ({ @@ -112,4 +113,41 @@ describe('LoginForm', () => { const submitButton = screen.getByRole('button', { name: /logging in/i }); expect(submitButton).toBeDisabled(); }); + + it('renders without shake animation by default', () => { + renderWithProvider(); + + // The component should render successfully + expect(screen.getByRole('button', { name: /access dashboard/i })).toBeInTheDocument(); + }); + + it('handles form submission with failed login', async () => { + jest.useFakeTimers(); + + (apiClient.login as jest.Mock).mockResolvedValue({ + success: false, + message: 'Invalid credentials', + }); + + renderWithProvider(); + + const usernameInput = screen.getByLabelText(/username/i); + const passwordInput = screen.getByLabelText(/password/i); + const submitButton = screen.getByRole('button', { name: /access dashboard/i }); + + fireEvent.change(usernameInput, { target: { value: 'wronguser' } }); + fireEvent.change(passwordInput, { target: { value: 'wrongpass' } }); + fireEvent.click(submitButton); + + // Wait for error to appear + await waitFor(() => { + expect(screen.getByText('Invalid credentials')).toBeInTheDocument(); + }); + + // The shake animation should be triggered (isShaking: true) + // We can't directly test CSS animations, but we verify the component still renders + expect(screen.getByRole('button', { name: /access dashboard/i })).toBeInTheDocument(); + + jest.useRealTimers(); + }); });