Files
school_compare/nextjs-app/QA_CHECKLIST.md
Tudor ff7f5487e6
Some checks failed
Build and Push Docker Images / Build Backend (FastAPI) (push) Successful in 1m26s
Build and Push Docker Images / Build Frontend (Next.js) (push) Failing after 1m48s
Build and Push Docker Images / Trigger Portainer Update (push) Has been skipped
Complete Next.js migration with SSR and Docker deployment
- Migrate from vanilla JavaScript SPA to Next.js 16 with App Router
- Add server-side rendering for all pages (Home, Compare, Rankings)
- Create individual school pages with dynamic routing (/school/[urn])
- Implement Chart.js and Leaflet map integrations
- Add comprehensive SEO with sitemap, robots.txt, and JSON-LD
- Set up Docker multi-service architecture (PostgreSQL, FastAPI, Next.js)
- Update CI/CD pipeline to build both backend and frontend images
- Fix Dockerfile to include devDependencies for TypeScript compilation
- Add Jest testing configuration
- Implement performance optimizations (code splitting, caching)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-02-02 20:34:35 +00:00

7.3 KiB

QA Checklist - SchoolCompare Next.js Migration

Functionality Testing

Home Page

  • Page loads with SSR (view source shows rendered HTML)
  • Featured schools display correctly
  • Search by school name filters results
  • Search by postcode finds nearby schools
  • Radius filter works with postcode search
  • Local authority filter updates results
  • School type filter updates results
  • Pagination works correctly
  • "Add to Compare" button adds schools to basket
  • Comparison badge shows correct count
  • School cards display all information (name, type, location, metrics)
  • Trend indicators show correct direction (↗ ↘ →)
  • Links to school detail pages work
  • Empty state shows when no results

Individual School Pages

  • School detail page loads with SSR
  • URL format: /school/{urn} works
  • School name and meta information display
  • Latest results summary shows correctly
  • Performance chart displays multi-year data
  • All metrics sections render (Reading, Writing, Maths)
  • Absence data shows if available
  • Map displays school location
  • Historical data table shows all years
  • "Add to Compare" button works
  • "In Comparison" state shows when already added
  • Meta tags are correct (check view source)
  • JSON-LD structured data validates
  • 404 page shows for invalid URN

Compare Page

  • Compare page loads with SSR
  • URL format: /compare?urns=... works
  • Selected schools load from URL
  • Schools display in comparison grid
  • Metric selector changes chart
  • Performance chart displays all schools
  • Comparison table shows correct values
  • "Remove" button removes school from comparison
  • "+ Add School" opens search modal
  • School search modal works
  • Maximum 5 schools enforced
  • URL updates when schools added/removed
  • Empty state shows when no schools selected
  • Comparison persists in localStorage
  • Sharing URL loads same comparison

Rankings Page

  • Rankings page loads with SSR
  • Default metric displays (RWM Expected)
  • Metric selector updates rankings
  • Area filter updates rankings
  • Year filter updates rankings
  • Rankings display in correct order
  • Top 3 schools have special styling (medals)
  • "Add to Compare" button works
  • School links navigate to detail pages
  • Rankings table is responsive

Navigation & Layout

  • Navigation bar displays correctly
  • Active page is highlighted in nav
  • Comparison badge updates in real-time
  • Footer displays correctly
  • Logo links to home page
  • Mobile menu works (if applicable)

Cross-Browser Testing

Desktop Browsers

  • Chrome (latest)
  • Firefox (latest)
  • Safari (latest)
  • Edge (latest)

Mobile Browsers

  • iOS Safari
  • Android Chrome
  • Samsung Internet

Responsive Design

Breakpoints

  • Desktop (1280px+): Full layout
  • Tablet (768px-1279px): Adjusted layout
  • Mobile (<768px): Stacked layout

Components

  • School cards adapt to screen size
  • Charts are responsive
  • Maps are responsive
  • Tables scroll horizontally on mobile
  • Navigation adapts to mobile
  • Filters stack on mobile

Performance Testing

Lighthouse Scores (Target: 90+)

  • Performance: ____
  • Accessibility: ____
  • Best Practices: ____
  • SEO: ____

Core Web Vitals

  • LCP (Largest Contentful Paint): < 2.5s
  • FID (First Input Delay): < 100ms
  • CLS (Cumulative Layout Shift): < 0.1

Load Times

  • Home page: < 2s
  • School detail page: < 2s
  • Compare page: < 2s
  • Rankings page: < 2s

SEO Testing

  • Sitemap generates correctly (/sitemap.xml)
  • Robots.txt accessible (/robots.txt)
  • Meta titles are unique per page
  • Meta descriptions are descriptive
  • Open Graph tags present
  • Twitter Card tags present
  • Canonical URLs set correctly
  • JSON-LD structured data validates (use Google Rich Results Test)
  • School pages indexed in Google (post-launch)

Accessibility Testing

WCAG 2.1 AA Compliance

  • Keyboard navigation works
  • Focus indicators visible
  • Color contrast ratios meet standards
  • Alt text on images (if any)
  • ARIA labels on interactive elements
  • Form labels present
  • Headings in logical order
  • No accessibility errors in axe DevTools
  • No accessibility errors in WAVE

Screen Reader Testing

  • Page structure makes sense
  • All interactive elements announced
  • Navigation is clear

Data Integration Testing

API Integration

  • All API endpoints respond correctly
  • Error handling works (try invalid URN)
  • Loading states display
  • Data formats correctly
  • Caching works (check Network tab)

Edge Cases

  • Schools with null data values display "-"
  • Schools with no yearly data handled
  • Schools with no location don't break map
  • Empty search results show empty state
  • Invalid postcode shows error

Security Testing

  • HTTPS enabled (production)
  • Security headers present (X-Frame-Options, etc.)
  • No API keys exposed in client code
  • CORS configured correctly
  • XSS prevention (try injecting scripts)
  • No console errors or warnings

State Management Testing

URL State

  • Filter changes update URL
  • Browser back/forward buttons work
  • Sharing URLs preserves state
  • Page refresh preserves filters

LocalStorage

  • Comparison basket persists across sessions
  • Invalid data in localStorage handled gracefully

Error Handling

  • 404 page displays for invalid routes
  • API errors show user-friendly messages
  • Network errors handled gracefully
  • Invalid data doesn't crash app
  • Error boundaries catch React errors

Integration Testing

User Flows

  • Flow 1: Search → View School → Add to Compare → Go to Compare Page
  • Flow 2: Browse Home → Add Multiple Schools → Compare → Remove School
  • Flow 3: View Rankings → Click School → View Details → Add to Compare
  • Flow 4: Search by Postcode → View Map → Click School → View Details
  • Flow 5: Filter by Area & Type → View Results → Paginate

Build & Deployment Testing

  • npm run build succeeds without errors
  • npm run lint passes
  • npm test passes
  • Production build runs correctly
  • Docker image builds successfully (if using Docker)
  • Environment variables load correctly

Documentation Review

  • README.md is complete and accurate
  • DEPLOYMENT.md covers all deployment options
  • Environment variables documented
  • API integration documented

Final Checks

  • All console errors resolved
  • All console warnings reviewed
  • No TODO comments in production code
  • Version numbers updated
  • Change log updated (if applicable)
  • Git repository clean
  • All tests passing

Sign-Off

Role Name Date Signature
Developer
QA Lead
Product Owner
Tech Lead

Notes

Add any additional notes or issues discovered during QA: