From 239bc08a67c6a480d482894aa8434db27517414a Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sun, 1 Feb 2026 15:54:02 +0000
Subject: [PATCH] Improve component branch coverage from 66.66% to 77.77%
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Enhanced ContainerCard tests
  - Added test for unknown container status fallback
  - Branch coverage: 50% → 100%

- Enhanced LoginForm tests
  - Added failed login submission test (triggers shake animation)
  - Branch coverage: 80% → 100%

Side effects:
- ContainerHeader: 75% → 100% branch coverage
- ContainerCard sub-components: 88.23% → 94.11% overall

Total: 238 passing tests (up from 235)
Overall branch coverage: 72.33% → 73.51%

https://claude.ai/code/session_mmQs0
---
 .../__tests__/ContainerCard.test.tsx          | 16 ++++++++
 .../components/__tests__/LoginForm.test.tsx   | 40 ++++++++++++++++++-
 2 files changed, 55 insertions(+), 1 deletion(-)

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(
+      <ContainerCard
+        container={unknownContainer}
+        onOpenShell={mockOnOpenShell}
+        onContainerUpdate={mockOnContainerUpdate}
+      />
+    );
+
+    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(
       <ContainerCard
diff --git a/frontend/components/__tests__/LoginForm.test.tsx b/frontend/components/__tests__/LoginForm.test.tsx
index 99ce656..15037e0 100644
--- a/frontend/components/__tests__/LoginForm.test.tsx
+++ b/frontend/components/__tests__/LoginForm.test.tsx
@@ -1,9 +1,10 @@
 import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
+import { render, screen, fireEvent, waitFor } from '@testing-library/react';
 import { Provider } from 'react-redux';
 import { configureStore } from '@reduxjs/toolkit';
 import authReducer from '@/lib/store/authSlice';
 import LoginForm from '../LoginForm';
+import { apiClient } from '@/lib/api';
 
 jest.mock('next/navigation', () => ({
   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(<LoginForm />);
+
+    // 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(<LoginForm />);
+
+    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();
+  });
 });