feat(legal): polished UX for 5 legal pages + AGPL external link (sticky TOC, prev/next, breadcrumb)
Refonte visuelle et accessibilité (WCAG 2.2 AA) de la section /legal/ sans toucher au contenu juridique signé (dc4ac97). Templates : - templates/legal/index.html : grille 6 cartes (5 internes + AGPL externe) avec icônes SVG sémantiques, hero gradient, bloc info sous-processeurs, carte AGPL ↗ (target=_blank, rel=noopener noreferrer). - templates/legal/_layout.html : breadcrumb sticky, TOC sticky desktop + collapsible mobile (Alpine.js + IntersectionObserver), prev/next nav entre les 6 docs, skip link, landmarks (main / aside / nav), typographie améliorée (h2 avec accent gradient, tables zebrées, blockquotes), print stylesheet (cache header/breadcrumb/TOC/prev-next). Routes (src/legal/routes.py) : - DISPLAY_ORDER + EXTERNAL_LINKS + PAGE_ICONS exposés. - legal_page() calcule prev/next via _neighbour() helper. - legal_index() concatène pages internes + EXTERNAL_LINKS dans `pages`. Footer : lien AGPL déjà présent depuisdc4ac97(col 4 Compte, ligne 49). Tests (tests/test_legal_pages.py) : 9 anciens + 9 nouveaux = 18/18 PASS - AGPL external link (target+rel) - 5 internes + 1 externe sur l'index - Skip link présent partout - Prev/next existe sur chaque page - Conditions (1ère) sans prev / Mentions (dernière) sans next - Landmarks aside aria-label="Table des matières" - Landmark main role + id="main-content" - Breadcrumb avec aria-current="page" Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Allison
@@ -164,3 +164,168 @@ def test_legal_pages_have_loi25_draft_callout():
|
||||
)
|
||||
finally:
|
||||
db.session.rollback(); db.drop_all()
|
||||
|
||||
|
||||
# ---------------------------------------------------------------------------
|
||||
# B-2.10 — UX upgrade tests : AGPL external link, skip link, breadcrumb,
|
||||
# landmarks, prev/next navigation, sticky TOC.
|
||||
# ---------------------------------------------------------------------------
|
||||
|
||||
def test_legal_index_includes_agpl_external_link():
|
||||
"""The /legal/ index must surface the AGPL source code as an external link."""
|
||||
with app.app_context():
|
||||
db.create_all()
|
||||
try:
|
||||
client = app.test_client()
|
||||
resp = client.get('/legal/')
|
||||
assert resp.status_code == 200
|
||||
body = resp.data.decode('utf-8')
|
||||
assert 'https://gitea.dictia.ca' in body
|
||||
assert 'target="_blank"' in body
|
||||
assert 'rel="noopener noreferrer"' in body
|
||||
assert 'AGPL' in body
|
||||
finally:
|
||||
db.session.rollback(); db.drop_all()
|
||||
|
||||
|
||||
def test_legal_index_lists_5_internal_pages_plus_agpl():
|
||||
"""Index must show internal pages + AGPL external card (count >=6)."""
|
||||
with app.app_context():
|
||||
db.create_all()
|
||||
try:
|
||||
client = app.test_client()
|
||||
resp = client.get('/legal/')
|
||||
body = resp.data.decode('utf-8')
|
||||
for slug in ('conditions', 'confidentialite', 'cookies',
|
||||
'remboursement', 'accessibilite'):
|
||||
assert f'/legal/{slug}' in body, f'Missing internal card: {slug}'
|
||||
# External AGPL link
|
||||
assert 'gitea.dictia.ca' in body
|
||||
# Count cards via the legal-card class
|
||||
assert body.count('legal-card') >= 6, (
|
||||
f'Expected at least 6 legal-card occurrences, found {body.count("legal-card")}'
|
||||
)
|
||||
finally:
|
||||
db.session.rollback(); db.drop_all()
|
||||
|
||||
|
||||
def test_legal_pages_have_skip_link():
|
||||
"""Every legal page must include a WCAG skip link to #main-content."""
|
||||
with app.app_context():
|
||||
db.create_all()
|
||||
try:
|
||||
client = app.test_client()
|
||||
for page in VALID_PAGES:
|
||||
resp = client.get(f'/legal/{page}')
|
||||
body = resp.data.decode('utf-8')
|
||||
assert 'href="#main-content"' in body, (
|
||||
f'/legal/{page} missing skip link to #main-content'
|
||||
)
|
||||
assert 'Aller au contenu principal' in body, (
|
||||
f'/legal/{page} missing French skip link label'
|
||||
)
|
||||
finally:
|
||||
db.session.rollback(); db.drop_all()
|
||||
|
||||
|
||||
def test_legal_pages_have_prev_next_navigation():
|
||||
"""Each legal page (except first/last) must have prev OR next link to neighbours."""
|
||||
with app.app_context():
|
||||
db.create_all()
|
||||
try:
|
||||
client = app.test_client()
|
||||
for page in VALID_PAGES:
|
||||
resp = client.get(f'/legal/{page}')
|
||||
body = resp.data.decode('utf-8')
|
||||
# The wrapping nav must always be present (rel="prev" OR rel="next").
|
||||
assert 'rel="prev"' in body or 'rel="next"' in body, (
|
||||
f'/legal/{page} has neither prev nor next neighbour link'
|
||||
)
|
||||
finally:
|
||||
db.session.rollback(); db.drop_all()
|
||||
|
||||
|
||||
def test_legal_first_page_no_prev_link():
|
||||
"""The first page (conditions) must not expose a 'prev' link."""
|
||||
with app.app_context():
|
||||
db.create_all()
|
||||
try:
|
||||
client = app.test_client()
|
||||
resp = client.get('/legal/conditions')
|
||||
body = resp.data.decode('utf-8')
|
||||
assert 'rel="prev"' not in body, "conditions page should not have a prev link"
|
||||
assert 'rel="next"' in body, "conditions page should have a next link"
|
||||
finally:
|
||||
db.session.rollback(); db.drop_all()
|
||||
|
||||
|
||||
def test_legal_last_page_no_next_link():
|
||||
"""The last page (mentions) must not expose a 'next' link."""
|
||||
with app.app_context():
|
||||
db.create_all()
|
||||
try:
|
||||
client = app.test_client()
|
||||
resp = client.get('/legal/mentions')
|
||||
body = resp.data.decode('utf-8')
|
||||
assert 'rel="next"' not in body, "mentions page should not have a next link"
|
||||
assert 'rel="prev"' in body, "mentions page should have a prev link"
|
||||
finally:
|
||||
db.session.rollback(); db.drop_all()
|
||||
|
||||
|
||||
def test_legal_pages_aside_toc_landmark():
|
||||
"""Every legal page must expose an <aside aria-label='Table des matières'> landmark."""
|
||||
with app.app_context():
|
||||
db.create_all()
|
||||
try:
|
||||
client = app.test_client()
|
||||
for page in VALID_PAGES:
|
||||
resp = client.get(f'/legal/{page}')
|
||||
body = resp.data.decode('utf-8')
|
||||
assert 'aria-label="Table des matières"' in body, (
|
||||
f'/legal/{page} missing TOC aside landmark'
|
||||
)
|
||||
finally:
|
||||
db.session.rollback(); db.drop_all()
|
||||
|
||||
|
||||
def test_legal_pages_main_landmark():
|
||||
"""Every legal page must wrap its article in role='main' with id='main-content'."""
|
||||
with app.app_context():
|
||||
db.create_all()
|
||||
try:
|
||||
client = app.test_client()
|
||||
for page in VALID_PAGES:
|
||||
resp = client.get(f'/legal/{page}')
|
||||
body = resp.data.decode('utf-8')
|
||||
assert 'id="main-content"' in body, (
|
||||
f'/legal/{page} missing id="main-content"'
|
||||
)
|
||||
assert 'role="main"' in body, (
|
||||
f'/legal/{page} missing role="main"'
|
||||
)
|
||||
finally:
|
||||
db.session.rollback(); db.drop_all()
|
||||
|
||||
|
||||
def test_legal_pages_breadcrumb_present():
|
||||
"""Every legal page must include a Fil d'Ariane breadcrumb."""
|
||||
with app.app_context():
|
||||
db.create_all()
|
||||
try:
|
||||
client = app.test_client()
|
||||
for page in VALID_PAGES:
|
||||
resp = client.get(f'/legal/{page}')
|
||||
body = resp.data.decode('utf-8')
|
||||
assert "aria-label=\"Fil d'Ariane\"" in body, (
|
||||
f'/legal/{page} missing breadcrumb landmark'
|
||||
)
|
||||
assert 'aria-current="page"' in body, (
|
||||
f'/legal/{page} missing aria-current="page" on breadcrumb'
|
||||
)
|
||||
# Breadcrumb chain should reference Accueil and Documents légaux
|
||||
assert 'Accueil' in body and 'Documents légaux' in body, (
|
||||
f'/legal/{page} breadcrumb chain incomplete'
|
||||
)
|
||||
finally:
|
||||
db.session.rollback(); db.drop_all()
|
||||
|
||||
Reference in New Issue
Block a user