Skip to content

Add focused hero content assertions to home test #16

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
shayancoin merged 1 commit into from
Oct 15, 2025
Merged

Add focused hero content assertions to home test #16

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 19 additions & 0 deletions frontend/src/app/__tests__/home.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import { render, screen } from '@testing-library/react'

import Home from '../page'
Comment on lines +1 to +3
Copy link
Contributor

@coderabbitai coderabbitai bot Oct 15, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🔴 Critical

🧩 Analysis chain

Verify @testing-library/jest-dom is configured.

The test uses .toBeInTheDocument() matcher (lines 11, 17) which requires @testing-library/jest-dom. Ensure this is imported in your Jest setup file (e.g., jest.setup.ts or similar).

Run the following script to verify the setup:

🏁 Script executed:

#!/bin/bash
# Description: Check for @testing-library/jest-dom configuration

# Search for jest-dom setup in common configuration files
echo "=== Checking for jest-dom imports in setup files ==="
rg -l "@testing-library/jest-dom" --type=ts --type=tsx --type=js

echo -e "\n=== Checking Jest configuration ==="
fd -t f "jest.config|jest.setup|setupTests" --exec cat {}

echo -e "\n=== Checking package.json for jest-dom dependency ==="
cat package.json | jq '.dependencies["@testing-library/jest-dom"], .devDependencies["@testing-library/jest-dom"]'

Length of output: 217

Running refined checks for @testing-library/jest-dom configuration.

🏁 Script executed:

#!/bin/bash
set -e

echo "=== Locating package.json files ==="
fd --type f --name package.json

echo -e "\n=== Checking for jest-dom in package.json files ==="
for f in $(fd --type f --name package.json); do
  echo "$f:"
  jq '.dependencies["@testing-library/jest-dom"], .devDependencies["@testing-library/jest-dom"]' "$f" || echo "  (jq parse error)"
done

echo -e "\n=== Locating Jest setup/config files ==="
fd --type f --regex 'jest\.config.*|jest\.setup.*|setupTests?\..*'

echo -e "\n=== Checking for jest-dom import in setup/config files ==="
for f in $(fd --type f --regex 'jest\.config.*|jest\.setup.*|setupTests?\..*'); do
  echo "$f:"
  rg "@testing-library/jest-dom" -n "$f" || echo "  (no match)"
done

echo -e "\n=== Searching for any jest-dom import across repo ==="
rg "@testing-library/jest-dom" -n . || echo "(no matches found)"

Length of output: 286

Running refined checks for @testing-library/jest-dom configuration.

🏁 Script executed:

#!/bin/bash
echo "=== Locating package.json files ==="
find . -type f -name package.json

echo -e "\n=== Checking for '@testing-library/jest-dom' in package.json files ==="
for f in $(find . -type f -name package.json); do
  echo "$f:"
  grep -E '"@testing-library/jest-dom"' -n "$f" || echo "  (no match)"
done

echo -e "\n=== Locating Jest setup/config files ==="
find . -type f \( -name 'jest.config.*' -o -name 'jest.setup.*' -o -name 'setupTests.*' \)

echo -e "\n=== Checking for jest-dom import in setup/config files ==="
for f in $(find . -type f \( -name 'jest.config.*' -o -name 'jest.setup.*' -o -name 'setupTests.*' \)); do
  echo "$f:"
  grep -R "@testing-library/jest-dom" -n "$f" || echo "  (no match)"
done

echo -e "\n=== Searching entire repo for jest-dom imports ==="
grep -R "@testing-library/jest-dom" -n .

Length of output: 435

Add @testing-library/jest-dom and configure Jest setup

  • Add @testing-library/jest-dom to devDependencies in frontend/package.json
  • Create or update a Jest setup file (e.g. frontend/jest.setup.ts) with 
    import '@testing-library/jest-dom';
    and reference it via setupFilesAfterEnv in your Jest config.
🤖 Prompt for AI Agents 
In frontend/src/app/__tests__/home.test.tsx around lines 1 to 3, tests use
Testing Library matchers but the project is missing @testing-library/jest-dom
setup; add @testing-library/jest-dom to devDependencies in
frontend/package.json, create (or update) a Jest setup file at
frontend/jest.setup.ts that imports '@testing-library/jest-dom', and wire that
file into your Jest configuration via setupFilesAfterEnv (either in
frontend/package.json jest section or your jest.config.(ts|js)) so the custom
matchers are available in tests.


describe('Home Page', () => {
it('renders the hero heading and description', () => {
render(<Home />)
Comment on lines +1 to +7
Copy link

@chatgpt-codex-connector chatgpt-codex-connector bot Oct 15, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P1 Badge Provide test dependencies and DOM environment

The new home page test imports @testing-library/react and renders Chakra components, but frontend/package.json contains no dependency on @testing-library/react (or any jsdom setup) and the only test script runs vitest with its default Node environment. Running the suite will fail immediately with “Cannot find module '@testing-library/react'” or document is not defined. Please add the testing-library packages and configure Vitest to use a jsdom environment so the test can actually execute.

Useful? React with 👍 / 👎.


expect(
screen.getByRole('heading', { name: /AI Engineering MVP Template/i })
).toBeInTheDocument()

expect(
screen.getByText(
/A starter template for building AI-powered applications with Vector Institute branding\./i
)
).toBeInTheDocument()
})
})
Loading