test: add ComparePage mock integration coverage (JhaSourav07#3319)

git push origin test-compare-mock-integrations

## Description

Fixes JhaSourav07#2801 

## Pillar

- [x] 🎨 Pillar 1 — New Theme Design
- [x] 📐 Pillar 2 — Geometric SVG Improvement
- [x] 🕐 Pillar 3 — Timezone Logic Optimization
- [x] 🛠️ Other (Bug fix, refactoring, docs)

## Visual Preview

## Checklist before requesting a review:

- [x] I have read the `CONTRIBUTING.md` file.
- [x] I have tested these changes locally
(`localhost:3000/api/streak?user=YOUR_USERNAME`).
- [x] I have run `npm run format` and `npm run lint` locally and
resolved all errors (CI will fail otherwise).
- [x] My commits follow the Conventional Commits format (e.g.,
`feat(themes): ...`, `fix(calculate): ...`).
- [x] I have updated `README.md` if I added a new theme or URL
parameter.
- [x] I have started the repo.
- [x] I have made sure that i have only one commit to merge in this PR.
- [x] The SVG output matches the CommitPulse "premium quality" aesthetic
standard (no raw elements, smooth animations, correct fonts).
- [x] (Recommended) I joined the CommitPulse Discord community for
contributor discussions, mentorship, and faster PR support.

Author: JhaSourav07

app/compare/page.mock-integrations.test.tsx

@@ -0,0 +1,46 @@
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom/vitest';
+import { describe, expect, it, vi } from 'vitest';
+
+vi.mock('./CompareClient', () => ({
+  default: () => <div>Mock Compare Client</div>,
+}));
+
+vi.mock('../components/Footer', () => ({
+  Footer: () => <div>Mock Footer</div>,
+}));
+
+import ComparePage from './page';
+
+describe('ComparePage mock integrations', () => {
+  it('renders CompareClient through mocked service layer', () => {
+    render(<ComparePage />);
+
+    expect(screen.getByText('Mock Compare Client')).toBeInTheDocument();
+  });
+
+  it('renders Footer component', () => {
+    render(<ComparePage />);
+
+    expect(screen.getByText('Mock Footer')).toBeInTheDocument();
+  });
+
+  it('renders CompareClient only once', () => {
+    render(<ComparePage />);
+
+    expect(screen.getAllByText('Mock Compare Client')).toHaveLength(1);
+  });
+
+  it('renders Footer only once', () => {
+    render(<ComparePage />);
+
+    expect(screen.getAllByText('Mock Footer')).toHaveLength(1);
+  });
+
+  it('renders page layout with both mocked integrations', () => {
+    render(<ComparePage />);
+
+    expect(screen.getByText('Mock Compare Client')).toBeInTheDocument();
+    expect(screen.getByText('Mock Footer')).toBeInTheDocument();
+  });
+});