school_compare/nextjs-app/__tests__/components/PlaceView.test.tsx

import { render, screen } from '@testing-library/react';
import { PlaceView } from '@/components/places/PlaceView';
import type { PlaceDetail } from '@/lib/places';

const detail: PlaceDetail = {
  place: { kind: 'town', slug: 'brentwood', name: 'Brentwood', count: 29,
           parent_authority: 'Essex' },
  schools: [
    { urn: 1, school_name: 'Alpha Primary', rwm_expected_pct: 82,
      ofsted_grade: 1 } as never,
    { urn: 2, school_name: 'Beta Primary', rwm_expected_pct: 44,
      ofsted_grade: 3 } as never,
  ],
  averages: { rwm_expected_pct: 63, attainment_8_score: null },
};

describe('PlaceView', () => {
  it('leads with an H1 that matches how the place is searched', () => {
    render(<PlaceView detail={detail} phase="primary" englandAverage={61}
      neighbours={[]} />);
    expect(screen.getByRole('heading', { level: 1 }))
      .toHaveTextContent(/primary schools in brentwood/i);
  });

  it('states the count so the page says something before the table', () => {
    render(<PlaceView detail={detail} phase="primary" englandAverage={61}
      neighbours={[]} />);
    expect(screen.getByText(/29 schools/i)).toBeInTheDocument();
  });

  it('compares the local average against England, which a list cannot', () => {
    render(<PlaceView detail={detail} phase="primary" englandAverage={61}
      neighbours={[]} />);
    expect(screen.getByTestId('local-vs-england')).toHaveTextContent('63');
    expect(screen.getByTestId('local-vs-england')).toHaveTextContent('61');
  });

  it('links every school in scope, which is what de-orphans them', () => {
    render(<PlaceView detail={detail} phase="primary" englandAverage={61}
      neighbours={[]} />);
    expect(screen.getAllByRole('link', { name: /Primary$/ })).toHaveLength(2);
  });

  it('links to the parent authority so the place sits in a hierarchy', () => {
    render(<PlaceView detail={detail} phase="primary" englandAverage={61}
      neighbours={[]} />);
    expect(screen.getByRole('link', { name: /Essex/i }))
      .toHaveAttribute('href', '/schools/authority/essex');
  });

  it('shows the Ofsted distribution, not just a count of Outstanding', () => {
    render(<PlaceView detail={detail} phase="primary" englandAverage={61}
      neighbours={[]} />);
    expect(screen.getByTestId('ofsted-distribution')).toBeInTheDocument();
  });

  it('links to neighbouring places so the page is not a dead end', () => {
    render(<PlaceView detail={detail} phase="primary" englandAverage={61}
      neighbours={[{ kind: 'town', slug: 'romford', name: 'Romford', count: 40 }]} />);
    expect(screen.getByRole('link', { name: /Romford/ }))
      .toHaveAttribute('href', '/schools/romford');
  });

  it('says nothing about an average it does not have', () => {
    render(<PlaceView detail={{ ...detail, averages:
      { rwm_expected_pct: null, attainment_8_score: null } }}
      phase="primary" englandAverage={61} neighbours={[]} />);
    expect(screen.queryByTestId('local-vs-england')).not.toBeInTheDocument();
  });
});

describe('PlaceView structured data', () => {
  function jsonLd() {
    const { container } = render(<PlaceView detail={detail} phase="primary"
      englandAverage={61} neighbours={[]} />);
    const el = container.querySelector('script[type="application/ld+json"]');
    return JSON.parse(el!.textContent!);
  }

  it('declares the page as a ranked list, not prose', () => {
    const types = jsonLd()['@graph'].map((n: { '@type': string }) => n['@type']);
    expect(types).toContain('ItemList');
    expect(types).toContain('BreadcrumbList');
  });

  it('gives every listed school an absolute URL on the canonical host', () => {
    const list = jsonLd()['@graph'].find((n: { '@type': string }) => n['@type'] === 'ItemList');
    expect(list.itemListElement).toHaveLength(2);
    for (const item of list.itemListElement) {
      expect(item.url).toMatch(/^https:\/\/www\.schoolcompare\.co\.uk\/school\//);
    }
  });
});