Spaces:

Ma-Ri-Ba-Ku
/

Picarones

Running

Claude commited on May 2

Commit

43d25a5

unverified ·

1 Parent(s): 563a0f0

feat(sprint-A6): WCAG niveau A bloquant — skip-link, canvas a11y, scope=col

Sprint A6 — Accessibilité WCAG niveau A (3 PJ, items B-9, B-10, m-3, m-4).

Items résolus :

- B-10 (WCAG 2.4.1 Bypass Blocks) : skip-to-content link
- <a class="skip-link" href="#main"> en premier enfant focusable du body
- .skip-link CSS : caché hors :focus, top:0 + outline:3px solid #fbbf24 au focus
- id="main" + role="main" sur le <main> (cible du lien)
- Libellé i18n FR "Aller au contenu" / EN "Skip to content"

- B-9 (WCAG 1.1.1 Non-text Content) : graphiques Chart.js accessibles
- role="img" + aria-label posés statiquement sur les 11 <canvas>
Chart.js (cer-hist, radar, cer-doc, duration, quality-cer,
taxonomy, reliability, bootstrap-ci, gini-cer, ratio-anchor,
pareto-chart)
- data-a11y-label sur chaque canvas pour permettre au JS d'enrichir
- Helper JS attachChartA11y() : génère pour chaque canvas un bouton
"Voir les données" + une <table class="chart-data-table"> jumelle
avec scope="col"/scope="row", reliée par aria-describedby. Génération
paresseuse au premier clic via _populateChartDataTable() qui
construit le tableau depuis chartInstances[id].data.
- showView() ré-attache les a11y aux charts qui s'instancient
paresseusement au switch de vue.

- m-3 : bouton "Réinitialiser" du bandeau d'exclusion globale passe
à data-i18n="reset_all" (FR "Réinitialiser" / EN "Reset").

- m-4 : scope="col" sur tous les <th> des tableaux.
- 16 <th> dans view_ranking.html
- 53 <th> dans 23 modules de rendu Python (ner, calibration,
philological, levers, throughput, longitudinal, etc.)
- Patch Python utilise scope=\"col\" (escaped quotes) pour ne pas
casser les délimiteurs de f-strings.

i18n FR/EN :
- Nouvelles clés : skip_to_content, reset_all, view_data, hide_data,
chart_no_data, chart_data_caption (× 2 langues = 12 clés ajoutées).

Tests : tests/report/test_a11y_level_a.py (13 cas) qui valident :
- Présence du skip-link en tête de body avant <nav>
- aria-label + role="img" sur tous les canvas Chart.js
- scope="col" sur les <th> rendus (regex strict, exclut <thead>
et le contenu inline des <script>/<style>)
- data-i18n="reset_all" sur le bouton Reset
- Libellés a11y bilingues (FR + EN distincts)
- Méta-test smoke des 7 marqueurs WCAG niveau A

Tests totaux : 3636 passed, 3 skipped, 4 deselected (network), 0 failed.
Coverage : 86.82% (plancher 85% maintenu).

Files changed (31) hide show

picarones/report/calibration_render.py +1 -1
picarones/report/comparison.py +6 -6
picarones/report/error_absorption_render.py +1 -1
picarones/report/i18n/en.json +7 -1
picarones/report/i18n/fr.json +7 -1
picarones/report/image_predictive_render.py +7 -7
picarones/report/incremental_comparison_render.py +1 -1
picarones/report/inter_engine_render.py +3 -3
picarones/report/lexical_modernization_render.py +1 -1
picarones/report/longitudinal_render.py +1 -1
picarones/report/module_audit_render.py +1 -1
picarones/report/multirun_stability_render.py +1 -1
picarones/report/ner_render.py +4 -4
picarones/report/numerical_sequences_render.py +3 -3
picarones/report/philological_render.py +7 -7
picarones/report/pipeline_render.py +3 -3
picarones/report/readability_render.py +1 -1
picarones/report/robustness_projection_render.py +2 -2
picarones/report/searchability_render.py +1 -1
picarones/report/specialization_render.py +1 -1
picarones/report/stratification_render.py +1 -1
picarones/report/taxonomy_comparison_render.py +3 -3
picarones/report/taxonomy_cooccurrence_render.py +2 -2
picarones/report/templates/_app.js +119 -1
picarones/report/templates/_header.html +10 -3
picarones/report/templates/_styles.css +74 -0
picarones/report/templates/view_analyses.html +11 -11
picarones/report/templates/view_ranking.html +16 -16
picarones/report/throughput_render.py +1 -1
picarones/report/worst_lines_render.py +1 -1
tests/report/test_a11y_level_a.py +237 -0

picarones/report/calibration_render.py CHANGED Viewed

@@ -85,7 +85,7 @@ def build_calibration_summary_html(
     for hdr in (engine_label, ece_label, mce_label,
                 acc_label, conf_label, n_label, docs_label):
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid var(--border);font-weight:600">'
             f'{_e(hdr)}</th>'
         )

     for hdr in (engine_label, ece_label, mce_label,
                 acc_label, conf_label, n_label, docs_label):
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid var(--border);font-weight:600">'
             f'{_e(hdr)}</th>'
         )

picarones/report/comparison.py CHANGED Viewed

@@ -335,12 +335,12 @@ _COMPARISON_TEMPLATE = """<!DOCTYPE html>
 <table>
   <thead>
     <tr>
-      <th>Moteur</th>
-      <th class="num">CER A</th>
-      <th class="num">CER B</th>
-      <th class="num">Δ CER</th>
-      <th class="num">Docs A → B</th>
-      <th>État</th>
     </tr>
   </thead>
   <tbody>

 <table>
   <thead>
     <tr>
+      <th scope=\"col\">Moteur</th>
+      <th scope=\"col\" class="num">CER A</th>
+      <th scope=\"col\" class="num">CER B</th>
+      <th scope=\"col\" class="num">Δ CER</th>
+      <th scope=\"col\" class="num">Docs A → B</th>
+      <th scope=\"col\">État</th>
     </tr>
   </thead>
   <tbody>

picarones/report/error_absorption_render.py CHANGED Viewed

@@ -170,7 +170,7 @@ def build_error_absorption_html(
                 h_corrected, h_introduced, h_corr_rate,
                 h_intro_rate, h_net, h_sample):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

                 h_corrected, h_introduced, h_corr_rate,
                 h_intro_rate, h_net, h_sample):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/i18n/en.json CHANGED Viewed

@@ -408,5 +408,11 @@
   "audit_license": "Licence",
   "audit_io": "Input → output",
   "audit_citation": "Citation",
-  "audit_homepage": "Project page"
 }

   "audit_license": "Licence",
   "audit_io": "Input → output",
   "audit_citation": "Citation",
+  "audit_homepage": "Project page",
+  "skip_to_content": "Skip to content",
+  "reset_all": "Reset",
+  "view_data": "View data",
+  "hide_data": "Hide data",
+  "chart_no_data": "No data available",
+  "chart_data_caption": "Chart data"
 }

picarones/report/i18n/fr.json CHANGED Viewed

@@ -408,5 +408,11 @@
   "audit_license": "Licence",
   "audit_io": "Entrée → sortie",
   "audit_citation": "Citation",
-  "audit_homepage": "Page projet"
 }

   "audit_license": "Licence",
   "audit_io": "Entrée → sortie",
   "audit_citation": "Citation",
+  "audit_homepage": "Page projet",
+  "skip_to_content": "Aller au contenu",
+  "reset_all": "Réinitialiser",
+  "view_data": "Voir les données",
+  "hide_data": "Masquer les données",
+  "chart_no_data": "Aucune donnée disponible",
+  "chart_data_caption": "Données du graphique"
 }

picarones/report/image_predictive_render.py CHANGED Viewed

@@ -86,17 +86,17 @@ def _render_complexity_block(
         '<table style="border-collapse:collapse;width:100%;'
         'font-size:.9rem;margin-bottom:.8rem">'
         f'<thead><tr>'
-        f'<th style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_mean)}</th>'
-        f'<th style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_median)}</th>'
-        f'<th style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_min)}</th>'
-        f'<th style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_max)}</th>'
-        f'<th style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_stdev)}</th>'
-        f'<th style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_docs)}</th>'
         f'</tr></thead>'
         f'<tbody><tr>'
@@ -143,7 +143,7 @@ def _render_homogeneity_block(
     ]
     for col in (h_feat, h_mean, h_stdev, h_norm):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

         '<table style="border-collapse:collapse;width:100%;'
         'font-size:.9rem;margin-bottom:.8rem">'
         f'<thead><tr>'
+        f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_mean)}</th>'
+        f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_median)}</th>'
+        f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_min)}</th>'
+        f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_max)}</th>'
+        f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_stdev)}</th>'
+        f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">{_e(h_docs)}</th>'
         f'</tr></thead>'
         f'<tbody><tr>'
     ]
     for col in (h_feat, h_mean, h_stdev, h_norm):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/incremental_comparison_render.py CHANGED Viewed

@@ -143,7 +143,7 @@ def build_incremental_comparison_html(
     ]
     for col in (h_value, h_mean, h_stdev, h_rank, h_n_obs):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

     ]
     for col in (h_value, h_mean, h_stdev, h_rank, h_n_obs):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/inter_engine_render.py CHANGED Viewed

@@ -102,10 +102,10 @@ def build_divergence_matrix_html(
     )
     parts.append('<table class="divergence-matrix" style="border-collapse:collapse;font-size:.8rem">')
     # En-tête
-    parts.append("<thead><tr><th></th>")
     for b in engines:
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:center;'
             f'border-bottom:1px solid var(--border)">{_e(b)}</th>'
         )
     parts.append("</tr></thead>")
@@ -114,7 +114,7 @@ def build_divergence_matrix_html(
     for a in engines:
         parts.append("<tr>")
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:right;'
             f'border-right:1px solid var(--border);font-weight:600">{_e(a)}</th>'
         )
         for b in engines:

     )
     parts.append('<table class="divergence-matrix" style="border-collapse:collapse;font-size:.8rem">')
     # En-tête
+    parts.append("<thead><tr><th scope=\"col\"></th>")
     for b in engines:
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:center;'
             f'border-bottom:1px solid var(--border)">{_e(b)}</th>'
         )
     parts.append("</tr></thead>")
     for a in engines:
         parts.append("<tr>")
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:right;'
             f'border-right:1px solid var(--border);font-weight:600">{_e(a)}</th>'
         )
         for b in engines:

picarones/report/lexical_modernization_render.py CHANGED Viewed

@@ -87,7 +87,7 @@ def build_lexical_modernization_html(
     ]
     for col in (gt_label, hyp_label, n_label, rate_label):
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

     ]
     for col in (gt_label, hyp_label, n_label, rate_label):
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/longitudinal_render.py CHANGED Viewed

@@ -112,7 +112,7 @@ def build_longitudinal_html(
     for col in (h_engine, h_n_runs, h_first, h_last, h_delta,
                 h_slope, h_r2, h_change):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

     for col in (h_engine, h_n_runs, h_first, h_last, h_delta,
                 h_slope, h_r2, h_change):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/module_audit_render.py CHANGED Viewed

@@ -113,7 +113,7 @@ def build_module_audit_html(
     for col in (h_module, h_status, h_version, h_author,
                 h_license, h_io, h_citation, h_homepage):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

     for col in (h_module, h_status, h_version, h_author,
                 h_license, h_io, h_citation, h_homepage):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/multirun_stability_render.py CHANGED Viewed

@@ -108,7 +108,7 @@ def build_multirun_stability_html(
     ]
     for col in (h_engine, h_n_runs, h_cer, h_cv, h_identical, h_distinct):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

     ]
     for col in (h_engine, h_n_runs, h_cer, h_cv, h_identical, h_distinct):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/ner_render.py CHANGED Viewed

@@ -96,7 +96,7 @@ def build_ner_summary_html(
     for hdr in (engine_label, f1_label, p_label, r_label,
                 docs_label, halluc_label, missed_label):
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid var(--border);font-weight:600">'
             f'{_e(hdr)}</th>'
         )
@@ -194,12 +194,12 @@ def build_ner_per_category_html(
     )
     parts.append("<thead><tr>")
     parts.append(
-        f'<th style="padding:.3rem .5rem;text-align:left;'
         f'border-bottom:1px solid var(--border)">{_e(engine_label)}</th>'
     )
     for cat in categories:
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:center;'
             f'border-bottom:1px solid var(--border)">{_e(cat)}</th>'
         )
     parts.append("</tr></thead><tbody>")
@@ -207,7 +207,7 @@ def build_ner_per_category_html(
         per_cat = (engine["aggregated_ner"] or {}).get("per_category") or {}
         parts.append("<tr>")
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:right;'
             f'border-right:1px solid var(--border);font-weight:600">'
             f'{_e(engine.get("name", ""))}</th>'
         )

     for hdr in (engine_label, f1_label, p_label, r_label,
                 docs_label, halluc_label, missed_label):
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid var(--border);font-weight:600">'
             f'{_e(hdr)}</th>'
         )
     )
     parts.append("<thead><tr>")
     parts.append(
+        f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:left;'
         f'border-bottom:1px solid var(--border)">{_e(engine_label)}</th>'
     )
     for cat in categories:
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:center;'
             f'border-bottom:1px solid var(--border)">{_e(cat)}</th>'
         )
     parts.append("</tr></thead><tbody>")
         per_cat = (engine["aggregated_ner"] or {}).get("per_category") or {}
         parts.append("<tr>")
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:right;'
             f'border-right:1px solid var(--border);font-weight:600">'
             f'{_e(engine.get("name", ""))}</th>'
         )

picarones/report/numerical_sequences_render.py CHANGED Viewed

@@ -103,16 +103,16 @@ def build_numerical_sequences_html(
         '<table style="border-collapse:collapse;width:100%;'
         'font-size:.9rem">',
         '<thead><tr>',
-        f'<th style="padding:.4rem .6rem;text-align:left;'
         f'border-bottom:1px solid #ccc;font-weight:600">'
         f'{_e(col_engine)}</th>',
-        f'<th style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">'
         f'{_e(col_global)}</th>',
     ]
     for cat in visible_cats:
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:right;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(cat_label.get(cat, cat))}</th>'
         )

         '<table style="border-collapse:collapse;width:100%;'
         'font-size:.9rem">',
         '<thead><tr>',
+        f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
         f'border-bottom:1px solid #ccc;font-weight:600">'
         f'{_e(col_engine)}</th>',
+        f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">'
         f'{_e(col_global)}</th>',
     ]
     for cat in visible_cats:
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:right;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(cat_label.get(cat, cat))}</th>'
         )

picarones/report/philological_render.py CHANGED Viewed

@@ -99,13 +99,13 @@ def _table_header(
     """Construit l'entête d'un tableau moteur × colonnes."""
     parts = [
         '<thead><tr>',
-        f'<th style="padding:.3rem .5rem;text-align:left;'
         f'border-bottom:1px solid var(--border);font-weight:600">'
         f'{_e(engine_label)}</th>',
     ]
     for col in columns:
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:center;'
             f'border-bottom:1px solid var(--border);font-weight:600">'
             f'{_e(col)}</th>'
         )
@@ -424,30 +424,30 @@ def build_modern_archives_section(
     )
     parts.append("<thead><tr>")
     parts.append(
-        f'<th rowspan="2" style="padding:.3rem .5rem;text-align:left;'
         f'border-bottom:1px solid var(--border);font-weight:600">'
         f'{_e(engine_label)}</th>'
     )
     parts.append(
-        f'<th colspan="2" style="padding:.3rem .5rem;text-align:center;'
         f'border-bottom:1px solid var(--border);font-weight:600">'
         f'{_e(global_label)}</th>'
     )
     for cat in cats:
         parts.append(
-            f'<th colspan="2" style="padding:.3rem .5rem;text-align:center;'
             f'border-bottom:1px solid var(--border);font-weight:600">'
             f'{_e(cat)}</th>'
         )
     parts.append("</tr><tr>")
     for _ in range(1 + len(cats)):
         parts.append(
-            f'<th style="padding:.2rem .4rem;text-align:center;'
             f'font-size:.75rem;font-weight:500;opacity:.7">'
             f'{_e(strict_label)}</th>'
         )
         parts.append(
-            f'<th style="padding:.2rem .4rem;text-align:center;'
             f'font-size:.75rem;font-weight:500;opacity:.7">'
             f'{_e(expansion_label)}</th>'
         )

     """Construit l'entête d'un tableau moteur × colonnes."""
     parts = [
         '<thead><tr>',
+        f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:left;'
         f'border-bottom:1px solid var(--border);font-weight:600">'
         f'{_e(engine_label)}</th>',
     ]
     for col in columns:
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:center;'
             f'border-bottom:1px solid var(--border);font-weight:600">'
             f'{_e(col)}</th>'
         )
     )
     parts.append("<thead><tr>")
     parts.append(
+        f'<th scope=\"col\" rowspan="2" style="padding:.3rem .5rem;text-align:left;'
         f'border-bottom:1px solid var(--border);font-weight:600">'
         f'{_e(engine_label)}</th>'
     )
     parts.append(
+        f'<th scope=\"col\" colspan="2" style="padding:.3rem .5rem;text-align:center;'
         f'border-bottom:1px solid var(--border);font-weight:600">'
         f'{_e(global_label)}</th>'
     )
     for cat in cats:
         parts.append(
+            f'<th scope=\"col\" colspan="2" style="padding:.3rem .5rem;text-align:center;'
             f'border-bottom:1px solid var(--border);font-weight:600">'
             f'{_e(cat)}</th>'
         )
     parts.append("</tr><tr>")
     for _ in range(1 + len(cats)):
         parts.append(
+            f'<th scope=\"col\" style="padding:.2rem .4rem;text-align:center;'
             f'font-size:.75rem;font-weight:500;opacity:.7">'
             f'{_e(strict_label)}</th>'
         )
         parts.append(
+            f'<th scope=\"col\" style="padding:.2rem .4rem;text-align:center;'
             f'font-size:.75rem;font-weight:500;opacity:.7">'
             f'{_e(expansion_label)}</th>'
         )

picarones/report/pipeline_render.py CHANGED Viewed

@@ -187,7 +187,7 @@ def build_pipeline_steps_table_html(
         dmean_label, dmedian_label, metrics_label, errors_label,
     ):
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )
@@ -428,7 +428,7 @@ def build_pipeline_ranking_table_html(
     ]
     for col in (rank_label, name_label, value_label):
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )
@@ -504,7 +504,7 @@ def build_pipeline_gain_table_html(
     ]
     for col in (name_label, value_label, abs_label, rel_label):
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

         dmean_label, dmedian_label, metrics_label, errors_label,
     ):
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )
     ]
     for col in (rank_label, name_label, value_label):
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )
     ]
     for col in (name_label, value_label, abs_label, rel_label):
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/readability_render.py CHANGED Viewed

@@ -94,7 +94,7 @@ def build_readability_summary_html(
     for col in (col_engine, col_mean, col_median, col_over,
                 col_under, col_docs):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

     for col in (col_engine, col_mean, col_median, col_over,
                 col_under, col_docs):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/robustness_projection_render.py CHANGED Viewed

@@ -89,7 +89,7 @@ def _build_summary_table(
     ]
     for col in (h_engine, h_total, h_n_types, h_worst):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )
@@ -147,7 +147,7 @@ def _build_detail_table(
     for col in (h_engine, h_deg_type, h_n_docs,
                 h_n_with_data, h_deficit, h_above):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

     ]
     for col in (h_engine, h_total, h_n_types, h_worst):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )
     for col in (h_engine, h_deg_type, h_n_docs,
                 h_n_with_data, h_deficit, h_above):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/searchability_render.py CHANGED Viewed

@@ -87,7 +87,7 @@ def build_searchability_summary_html(
     ]
     for col in (col_engine, col_recall, col_count, col_docs):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

     ]
     for col in (col_engine, col_recall, col_count, col_docs):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/specialization_render.py CHANGED Viewed

@@ -89,7 +89,7 @@ def build_specialization_html(
     ]
     for col in (h_a, h_b, h_score, h_cat):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

     ]
     for col in (h_a, h_b, h_score, h_cat):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/stratification_render.py CHANGED Viewed

@@ -157,7 +157,7 @@ def build_stratified_ranking_html(
         parts.append("<thead><tr>")
         for hdr in (engine_label, median_label, mean_label, docs_label):
             parts.append(
-                f'<th style="padding:.3rem .5rem;text-align:left;'
                 f'border-bottom:1px solid var(--border);font-weight:600">'
                 f'{_e(hdr)}</th>'
             )

         parts.append("<thead><tr>")
         for hdr in (engine_label, median_label, mean_label, docs_label):
             parts.append(
+                f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:left;'
                 f'border-bottom:1px solid var(--border);font-weight:600">'
                 f'{_e(hdr)}</th>'
             )

picarones/report/taxonomy_comparison_render.py CHANGED Viewed

@@ -158,13 +158,13 @@ def _build_recoverability_summary_html(
         '<table style="border-collapse:collapse;font-size:.85rem;'
         'margin-top:.5rem">',
         '<thead><tr>',
-        '<th style="padding:.2rem .5rem;text-align:left;'
         'border-bottom:1px solid #ccc">'
         f'{_e(labels.get("taxocomp_level_label", "Catégorie"))}</th>',
-        '<th style="padding:.2rem .5rem;text-align:right;'
         'border-bottom:1px solid #ccc">'
         f'{_e(_e(data["engine_a"]))}</th>',
-        '<th style="padding:.2rem .5rem;text-align:right;'
         'border-bottom:1px solid #ccc">'
         f'{_e(_e(data["engine_b"]))}</th>',
         '</tr></thead><tbody>',

         '<table style="border-collapse:collapse;font-size:.85rem;'
         'margin-top:.5rem">',
         '<thead><tr>',
+        '<th scope=\"col\" style="padding:.2rem .5rem;text-align:left;'
         'border-bottom:1px solid #ccc">'
         f'{_e(labels.get("taxocomp_level_label", "Catégorie"))}</th>',
+        '<th scope=\"col\" style="padding:.2rem .5rem;text-align:right;'
         'border-bottom:1px solid #ccc">'
         f'{_e(_e(data["engine_a"]))}</th>',
+        '<th scope=\"col\" style="padding:.2rem .5rem;text-align:right;'
         'border-bottom:1px solid #ccc">'
         f'{_e(_e(data["engine_b"]))}</th>',
         '</tr></thead><tbody>',

picarones/report/taxonomy_cooccurrence_render.py CHANGED Viewed

@@ -122,10 +122,10 @@ def _build_top_pairs_table(
         '<table style="border-collapse:collapse;font-size:.85rem;'
         'margin-top:.5rem">',
         '<thead><tr>',
-        f'<th style="padding:.3rem .5rem;text-align:left;'
         f'border-bottom:1px solid #ccc;font-weight:600">'
         f'{_e(pair_label)}</th>',
-        f'<th style="padding:.3rem .5rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">'
         f'{_e(jaccard_label)}</th>',
         '</tr></thead><tbody>',

         '<table style="border-collapse:collapse;font-size:.85rem;'
         'margin-top:.5rem">',
         '<thead><tr>',
+        f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:left;'
         f'border-bottom:1px solid #ccc;font-weight:600">'
         f'{_e(pair_label)}</th>',
+        f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:right;'
         f'border-bottom:1px solid #ccc;font-weight:600">'
         f'{_e(jaccard_label)}</th>',
         '</tr></thead><tbody>',

picarones/report/templates/_app.js CHANGED Viewed

@@ -26,6 +26,11 @@ function _switchView(name) {
 function showView(name) {
   _switchView(name);
   updateURL(name);
 }
 // ── Formatage ───────────────────────────────────────────────────
@@ -2600,4 +2605,117 @@ function init() {
   });
 }
-document.addEventListener('DOMContentLoaded', init);

 function showView(name) {
   _switchView(name);
   updateURL(name);
+  // Sprint A6 — re-attache les boutons d'a11y aux nouveaux charts
+  // qui ont été instanciés paresseusement au switch de vue.
+  if (typeof attachChartA11y === 'function') {
+    setTimeout(attachChartA11y, 50);
+  }
 }
 // ── Formatage ───────────────────────────────────────────────────
   });
 }
+// ─── Sprint A6 (B-9) — accessibilité des graphiques Chart.js ──────────
+//
+// Les <canvas> Chart.js ne sont **pas** accessibles aux lecteurs d'écran
+// par défaut (le rendu est purement pixel). Pour respecter WCAG 1.1.1
+// (Non-text Content) niveau A, on ajoute :
+//
+// 1. ``role="img"`` + ``aria-label`` (déjà posés statiquement dans le
+//    HTML via le helper Python ``_enrich_canvas_with_aria``) ;
+// 2. une table de données jumelle générée à la demande à partir de
+//    l'instance Chart.js, avec un bouton "Voir les données" qui la
+//    révèle pour TOUS (utile aussi pour la copie / vérification).
+//
+// Cette fonction est idempotente : on peut l'appeler plusieurs fois
+// sans dupliquer les boutons (test ``data-a11y-attached``).
+function attachChartA11y() {
+  const canvases = document.querySelectorAll('canvas[data-a11y-label]');
+  canvases.forEach(canvas => {
+    if (canvas.dataset.a11yAttached === '1') return;
+    canvas.dataset.a11yAttached = '1';
+    const id = canvas.id;
+    if (!id) return;
+    // Bouton "Voir les données" en dessous du canvas.
+    const btn = document.createElement('button');
+    btn.type = 'button';
+    btn.className = 'btn-toggle-data';
+    btn.setAttribute('data-i18n', 'view_data');
+    btn.textContent = (typeof I18N !== 'undefined' && I18N.view_data)
+      ? I18N.view_data : 'Voir les données';
+    btn.setAttribute('aria-controls', id + '-data');
+    btn.setAttribute('aria-expanded', 'false');
+    // Conteneur de table (caché visuellement mais lu par les AT via
+    // aria-describedby ; révélé visuellement au clic via .is-revealed).
+    const wrapper = document.createElement('div');
+    wrapper.id = id + '-data';
+    wrapper.className = 'chart-data-table visually-hidden';
+    wrapper.setAttribute('role', 'region');
+    wrapper.setAttribute('aria-label',
+      ((typeof I18N !== 'undefined' && I18N.chart_data_caption)
+        ? I18N.chart_data_caption
+        : 'Données du graphique')
+      + ' : ' + (canvas.dataset.a11yLabel || id));
+    // Lien aria-describedby pour que le lecteur d'écran annonce
+    // l'existence de la table dès qu'il atteint le canvas.
+    canvas.setAttribute('aria-describedby', wrapper.id);
+    btn.addEventListener('click', () => {
+      const expanded = wrapper.classList.toggle('is-revealed');
+      btn.setAttribute('aria-expanded', expanded ? 'true' : 'false');
+      btn.textContent = expanded
+        ? ((typeof I18N !== 'undefined' && I18N.hide_data) ? I18N.hide_data : 'Masquer les données')
+        : ((typeof I18N !== 'undefined' && I18N.view_data) ? I18N.view_data : 'Voir les données');
+      // Génération paresseuse du tableau au premier clic.
+      if (expanded && !wrapper.dataset.populated) {
+        _populateChartDataTable(wrapper, id);
+        wrapper.dataset.populated = '1';
+      }
+    });
+    canvas.parentElement.appendChild(btn);
+    canvas.parentElement.appendChild(wrapper);
+  });
+}
+function _populateChartDataTable(wrapper, canvasId) {
+  const chart = (typeof chartInstances !== 'undefined') ? chartInstances[canvasId] : null;
+  if (!chart || !chart.data) {
+    wrapper.innerHTML = '<p>' +
+      ((typeof I18N !== 'undefined' && I18N.chart_no_data)
+        ? I18N.chart_no_data : 'Aucune donnée disponible')
+      + '</p>';
+    return;
+  }
+  const labels = chart.data.labels || [];
+  const datasets = chart.data.datasets || [];
+  // En-tête : colonne libellé puis une colonne par dataset.
+  let html = '<table class="chart-data-table is-revealed">';
+  html += '<thead><tr><th scope="col">—</th>';
+  datasets.forEach(ds => {
+    html += '<th scope="col">' + esc(ds.label || '') + '</th>';
+  });
+  html += '</tr></thead><tbody>';
+  // Une ligne par label.
+  for (let i = 0; i < labels.length; i++) {
+    html += '<tr><th scope="row">' + esc(String(labels[i])) + '</th>';
+    datasets.forEach(ds => {
+      const v = ds.data ? ds.data[i] : '';
+      html += '<td>' + esc(String(v == null ? '' : v)) + '</td>';
+    });
+    html += '</tr>';
+  }
+  // Cas particulier : pas de labels (scatter, radar) — on dump les datasets.
+  if (labels.length === 0 && datasets.length > 0) {
+    datasets.forEach(ds => {
+      html += '<tr><th scope="row">' + esc(ds.label || '') + '</th><td>' +
+              esc(JSON.stringify(ds.data).slice(0, 200)) + '</td></tr>';
+    });
+  }
+  html += '</tbody></table>';
+  wrapper.innerHTML = html;
+}
+document.addEventListener('DOMContentLoaded', () => {
+  init();
+  // Délai pour laisser les charts s'instancier au switch de vue.
+  // Les boutons sont posés sur les canvas déjà visibles ; pour les
+  // canvas qui se créent au premier showView('analyses'), on rappelle
+  // attachChartA11y depuis showView aussi.
+  setTimeout(attachChartA11y, 200);
+});

picarones/report/templates/_header.html CHANGED Viewed

@@ -1,4 +1,10 @@
 <!-- ── Navigation ─────────────────────────────────────────────────── -->
 <nav>
   <div class="brand">
@@ -22,9 +28,10 @@
 <!-- ── Bandeau exclusion globale ───────────────────────────────────── -->
 <div id="global-exclusion-banner" style="display:none;background:#fef3c7;border-bottom:2px solid #f59e0b;padding:.5rem 1.5rem;font-size:.85rem;font-weight:600;color:#92400e;text-align:center">
   <span id="global-exclusion-text"></span>
-  <button onclick="resetAllExclusions()" style="margin-left:1rem;font-size:.75rem;padding:.15rem .5rem;border:1px solid #d97706;background:#fff;border-radius:.25rem;cursor:pointer">Réinitialiser</button>
 </div>
-<!-- ── Main ───────────────────────────────────────────────────────── -->
-<main>

+<!-- ── Skip-to-content (Sprint A6, B-10) ───────────────────────────────
+     Lien WCAG 2.4.1 (Bypass Blocks) — premier enfant tabbable du body,
+     visible uniquement au focus, saute la nav et le bandeau pour
+     l'utilisateur clavier ou lecteur d'écran. -->
+<a class="skip-link" href="#main" data-i18n="skip_to_content">Aller au contenu</a>
 <!-- ── Navigation ─────────────────────────────────────────────────── -->
 <nav>
   <div class="brand">
 <!-- ── Bandeau exclusion globale ───────────────────────────────────── -->
 <div id="global-exclusion-banner" style="display:none;background:#fef3c7;border-bottom:2px solid #f59e0b;padding:.5rem 1.5rem;font-size:.85rem;font-weight:600;color:#92400e;text-align:center">
   <span id="global-exclusion-text"></span>
+  <button onclick="resetAllExclusions()" data-i18n="reset_all" style="margin-left:1rem;font-size:.75rem;padding:.15rem .5rem;border:1px solid #d97706;background:#fff;border-radius:.25rem;cursor:pointer">Réinitialiser</button>
 </div>
+<!-- ── Main (Sprint A6, B-10 : id=main pour le skip-link) ──────────── -->
+<main id="main" role="main">

picarones/report/templates/_styles.css CHANGED Viewed

@@ -913,3 +913,77 @@ body.present-mode .btn-customize { display: none !important; }
   text-decoration: underline;
 }
 body.present-mode .synth-cases-link { display: none; }

   text-decoration: underline;
 }
 body.present-mode .synth-cases-link { display: none; }
+/* ── Sprint A6 — Accessibilité WCAG niveau A ─────────────────────────
+   Skip-to-content link (B-10) : caché hors :focus pour ne pas polluer
+   le visuel mais immédiatement disponible au clavier (Tab depuis la URL
+   bar atteint le contenu en 1 tabulation). Contraste AA ≥ 4.5:1 sur
+   fond bleu institutionnel. */
+.skip-link {
+  position: absolute;
+  top: -40px;
+  left: 0;
+  background: #1d4ed8;
+  color: #ffffff;
+  padding: .5rem 1rem;
+  font-weight: 600;
+  text-decoration: none;
+  z-index: 9999;
+  border-radius: 0 0 .25rem 0;
+  transition: top 120ms ease-out;
+}
+.skip-link:focus {
+  top: 0;
+  outline: 3px solid #fbbf24;
+  outline-offset: 2px;
+}
+/* Sprint A6 (B-9) — table jumelle des charts pour lecteurs d'écran.
+   ``visually-hidden`` cache le contenu visuellement tout en le
+   conservant accessible aux AT (NVDA, JAWS, VoiceOver). Le bouton
+   ``Voir les données`` peut révéler la table à tous via toggle de
+   classe. */
+.visually-hidden {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+.chart-data-table {
+  margin-top: .5rem;
+  font-size: .85rem;
+  border-collapse: collapse;
+}
+.chart-data-table th, .chart-data-table td {
+  border: 1px solid var(--border-light, #e2e8f0);
+  padding: .25rem .5rem;
+  text-align: left;
+}
+.chart-data-table.is-revealed {
+  position: static;
+  width: auto;
+  height: auto;
+  clip: auto;
+  white-space: normal;
+}
+.btn-toggle-data {
+  margin-top: .5rem;
+  font-size: .78rem;
+  padding: .15rem .5rem;
+  border: 1px solid var(--border-light, #cbd5e1);
+  background: #ffffff;
+  border-radius: .25rem;
+  cursor: pointer;
+}
+.btn-toggle-data:hover {
+  background: #f1f5f9;
+}
+.btn-toggle-data:focus {
+  outline: 2px solid #1d4ed8;
+  outline-offset: 2px;
+}

picarones/report/templates/view_analyses.html CHANGED Viewed

@@ -6,14 +6,14 @@
     <div class="chart-card">
       <h3 data-i18n="h_cer_dist">Distribution du CER par moteur</h3>
       <div class="chart-canvas-wrap">
-        <canvas id="chart-cer-hist"></canvas>
       </div>
     </div>
     <div class="chart-card">
       <h3 data-i18n="h_radar">Profil des moteurs (radar)</h3>
       <div class="chart-canvas-wrap">
-        <canvas id="chart-radar"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.5rem" data-i18n="radar_note">
         Axe radar : CER, WER, MER, WIL — valeurs inversées (plus c'est haut, meilleur est le moteur).
@@ -23,21 +23,21 @@
     <div class="chart-card">
       <h3 data-i18n="h_cer_doc">CER par document (tous moteurs)</h3>
       <div class="chart-canvas-wrap">
-        <canvas id="chart-cer-doc"></canvas>
       </div>
     </div>
     <div class="chart-card">
       <h3 data-i18n="h_duration">Temps d'exécution moyen (secondes/document)</h3>
       <div class="chart-canvas-wrap">
-        <canvas id="chart-duration"></canvas>
       </div>
     </div>
     <div class="chart-card">
       <h3 data-i18n="h_quality_cer">Qualité image ↔ CER (scatter plot)</h3>
       <div class="chart-canvas-wrap">
-        <canvas id="chart-quality-cer"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="quality_cer_note">
         Chaque point = un document. Axe X = score qualité image [0–1]. Axe Y = CER. Corrélation négative attendue.
@@ -47,7 +47,7 @@
     <div class="chart-card" style="grid-column:1/-1">
       <h3 data-i18n="h_taxonomy">Taxonomie des erreurs par moteur</h3>
       <div class="chart-canvas-wrap" style="max-height:300px">
-        <canvas id="chart-taxonomy"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="taxonomy_note">
         Distribution des classes d'erreurs (classes 1–9 de la taxonomie Picarones).
@@ -58,7 +58,7 @@
     <div class="chart-card" style="grid-column:1/-1">
       <h3 data-i18n="h_reliability">Courbes de fiabilité</h3>
       <div class="chart-canvas-wrap" style="max-height:300px">
-        <canvas id="chart-reliability"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="reliability_note">
         Pour les X% documents les plus faciles (triés par CER croissant), quel est le CER moyen cumulé ?
@@ -70,7 +70,7 @@
     <div class="chart-card">
       <h3 data-i18n="h_bootstrap">Intervalles de confiance à 95 % (bootstrap)</h3>
       <div class="chart-canvas-wrap">
-        <canvas id="chart-bootstrap-ci"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="bootstrap_note">
         IC à 95% sur le CER moyen par moteur (1000 itérations bootstrap).
@@ -106,7 +106,7 @@
     <div class="chart-card">
       <h3 data-i18n="h_gini_cer">Gini vs CER moyen <span style="font-size:.72rem;font-weight:400;color:var(--text-muted)" data-i18n="gini_cer_ideal">— idéal : bas-gauche</span></h3>
       <div class="chart-canvas-wrap">
-        <canvas id="chart-gini-cer"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="gini_cer_note">
         Axe X = CER moyen, Axe Y = coefficient de Gini. Un moteur idéal a CER bas ET Gini bas (erreurs rares et uniformes).
@@ -117,7 +117,7 @@
     <div class="chart-card">
       <h3 data-i18n="h_ratio_anchor">Ratio longueur vs ancrage <span style="font-size:.72rem;font-weight:400;color:var(--text-muted)" data-i18n="ratio_anchor_subtitle">— hallucinations VLM</span></h3>
       <div class="chart-canvas-wrap">
-        <canvas id="chart-ratio-anchor"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="ratio_anchor_note">
         Axe X = score d'ancrage trigrammes [0–1]. Axe Y = ratio longueur sortie/GT.
@@ -137,7 +137,7 @@
                 onclick="setParetoAxis('co2')" data-i18n="pareto_axis_co2"
                 title="Estimation expérimentale">Carbone (g CO₂)</button>
       </div>
-      <div class="chart-canvas-wrap"><canvas id="pareto-chart"></canvas></div>
       <div id="pareto-method-note" class="pareto-note" data-i18n="pareto_note">
         Les moteurs sur la frontière de Pareto (en évidence) sont ceux pour
         lesquels aucun autre moteur n'offre simultanément un meilleur CER ET

     <div class="chart-card">
       <h3 data-i18n="h_cer_dist">Distribution du CER par moteur</h3>
       <div class="chart-canvas-wrap">
+        <canvas id="chart-cer-hist" role="img" aria-label="Distribution des CER par moteur" data-a11y-label="Distribution des CER par moteur"></canvas>
       </div>
     </div>
     <div class="chart-card">
       <h3 data-i18n="h_radar">Profil des moteurs (radar)</h3>
       <div class="chart-canvas-wrap">
+        <canvas id="chart-radar" role="img" aria-label="Profil radar par moteur" data-a11y-label="Profil radar par moteur"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.5rem" data-i18n="radar_note">
         Axe radar : CER, WER, MER, WIL — valeurs inversées (plus c'est haut, meilleur est le moteur).
     <div class="chart-card">
       <h3 data-i18n="h_cer_doc">CER par document (tous moteurs)</h3>
       <div class="chart-canvas-wrap">
+        <canvas id="chart-cer-doc" role="img" aria-label="CER par document" data-a11y-label="CER par document"></canvas>
       </div>
     </div>
     <div class="chart-card">
       <h3 data-i18n="h_duration">Temps d'exécution moyen (secondes/document)</h3>
       <div class="chart-canvas-wrap">
+        <canvas id="chart-duration" role="img" aria-label="Durée d'inférence par moteur" data-a11y-label="Durée d'inférence par moteur"></canvas>
       </div>
     </div>
     <div class="chart-card">
       <h3 data-i18n="h_quality_cer">Qualité image ↔ CER (scatter plot)</h3>
       <div class="chart-canvas-wrap">
+        <canvas id="chart-quality-cer" role="img" aria-label="Corrélation qualité d'image / CER" data-a11y-label="Corrélation qualité d'image / CER"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="quality_cer_note">
         Chaque point = un document. Axe X = score qualité image [0–1]. Axe Y = CER. Corrélation négative attendue.
     <div class="chart-card" style="grid-column:1/-1">
       <h3 data-i18n="h_taxonomy">Taxonomie des erreurs par moteur</h3>
       <div class="chart-canvas-wrap" style="max-height:300px">
+        <canvas id="chart-taxonomy" role="img" aria-label="Taxonomie d'erreurs par moteur" data-a11y-label="Taxonomie d'erreurs par moteur"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="taxonomy_note">
         Distribution des classes d'erreurs (classes 1–9 de la taxonomie Picarones).
     <div class="chart-card" style="grid-column:1/-1">
       <h3 data-i18n="h_reliability">Courbes de fiabilité</h3>
       <div class="chart-canvas-wrap" style="max-height:300px">
+        <canvas id="chart-reliability" role="img" aria-label="Diagramme de fiabilité (calibration)" data-a11y-label="Diagramme de fiabilité (calibration)"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="reliability_note">
         Pour les X% documents les plus faciles (triés par CER croissant), quel est le CER moyen cumulé ?
     <div class="chart-card">
       <h3 data-i18n="h_bootstrap">Intervalles de confiance à 95 % (bootstrap)</h3>
       <div class="chart-canvas-wrap">
+        <canvas id="chart-bootstrap-ci" role="img" aria-label="Intervalles de confiance bootstrap" data-a11y-label="Intervalles de confiance bootstrap"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="bootstrap_note">
         IC à 95% sur le CER moyen par moteur (1000 itérations bootstrap).
     <div class="chart-card">
       <h3 data-i18n="h_gini_cer">Gini vs CER moyen <span style="font-size:.72rem;font-weight:400;color:var(--text-muted)" data-i18n="gini_cer_ideal">— idéal : bas-gauche</span></h3>
       <div class="chart-canvas-wrap">
+        <canvas id="chart-gini-cer" role="img" aria-label="Gini vs CER" data-a11y-label="Gini vs CER"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="gini_cer_note">
         Axe X = CER moyen, Axe Y = coefficient de Gini. Un moteur idéal a CER bas ET Gini bas (erreurs rares et uniformes).
     <div class="chart-card">
       <h3 data-i18n="h_ratio_anchor">Ratio longueur vs ancrage <span style="font-size:.72rem;font-weight:400;color:var(--text-muted)" data-i18n="ratio_anchor_subtitle">— hallucinations VLM</span></h3>
       <div class="chart-canvas-wrap">
+        <canvas id="chart-ratio-anchor" role="img" aria-label="Score d'ancrage par moteur" data-a11y-label="Score d'ancrage par moteur"></canvas>
       </div>
       <div style="font-size:.72rem;color:var(--text-muted);margin-top:.4rem" data-i18n="ratio_anchor_note">
         Axe X = score d'ancrage trigrammes [0–1]. Axe Y = ratio longueur sortie/GT.
                 onclick="setParetoAxis('co2')" data-i18n="pareto_axis_co2"
                 title="Estimation expérimentale">Carbone (g CO₂)</button>
       </div>
+      <div class="chart-canvas-wrap"><canvas id="pareto-chart" role="img" aria-label="Front Pareto coût/qualité" data-a11y-label="Front Pareto coût/qualité"></canvas></div>
       <div id="pareto-method-note" class="pareto-note" data-i18n="pareto_note">
         Les moteurs sur la frontière de Pareto (en évidence) sont ceux pour
         lesquels aucun autre moteur n'offre simultanément un meilleur CER ET

picarones/report/templates/view_ranking.html CHANGED Viewed

@@ -8,22 +8,22 @@
       <table id="ranking-table">
         <thead>
           <tr>
-            <th data-col="rank" class="sortable sorted" data-dir="asc" data-i18n="col_rank">#<i class="sort-icon">↑</i></th>
-            <th data-col="name" class="sortable" data-i18n="col_engine">Concurrent<i class="sort-icon">↕</i></th>
-            <th data-col="cer"  class="sortable" data-glossary-key="cer" data-i18n="col_cer">CER exact<i class="sort-icon">↕</i></th>
-            <th data-col="cer_diplomatic" class="sortable" id="th-cer-diplo" data-glossary-key="cer_diplomatic" data-i18n="col_cer_diplo">CER diplo.<i class="sort-icon">↕</i></th>
-            <th data-col="wer"  class="sortable" data-glossary-key="wer" data-i18n="col_wer">WER<i class="sort-icon">↕</i></th>
-            <th data-col="mer"  class="sortable" data-glossary-key="mer" data-i18n="col_mer">MER<i class="sort-icon">↕</i></th>
-            <th data-col="wil"  class="sortable" data-glossary-key="wil" data-i18n="col_wil">WIL<i class="sort-icon">↕</i></th>
-            <th data-col="ligature_score" class="sortable" id="th-ligatures" data-glossary-key="ligature_score" data-i18n="col_ligatures">Ligatures<i class="sort-icon">↕</i></th>
-            <th data-col="diacritic_score" class="sortable" id="th-diacritics" data-glossary-key="diacritic_score" data-i18n="col_diacritics">Diacritiques<i class="sort-icon">↕</i></th>
-            <th data-col="gini" class="sortable" id="th-gini" data-glossary-key="gini" data-i18n="col_gini">Gini<i class="sort-icon">↕</i></th>
-            <th data-col="anchor_score" class="sortable" id="th-anchor" data-glossary-key="anchor_score" data-i18n="col_anchor">Ancrage<i class="sort-icon">↕</i></th>
-            <th data-i18n="col_cer_median">CER médian</th>
-            <th data-i18n="col_cer_min">CER min</th>
-            <th data-i18n="col_cer_max">CER max</th>
-            <th id="th-overnorm" data-i18n="col_overnorm">Sur-norm.</th>
-            <th data-i18n="col_docs">Docs</th>
           </tr>
         </thead>
         <tbody id="ranking-tbody"></tbody>

       <table id="ranking-table">
         <thead>
           <tr>
+            <th scope="col" data-col="rank" class="sortable sorted" data-dir="asc" data-i18n="col_rank">#<i class="sort-icon">↑</i></th>
+            <th scope="col" data-col="name" class="sortable" data-i18n="col_engine">Concurrent<i class="sort-icon">↕</i></th>
+            <th scope="col" data-col="cer"  class="sortable" data-glossary-key="cer" data-i18n="col_cer">CER exact<i class="sort-icon">↕</i></th>
+            <th scope="col" data-col="cer_diplomatic" class="sortable" id="th-cer-diplo" data-glossary-key="cer_diplomatic" data-i18n="col_cer_diplo">CER diplo.<i class="sort-icon">↕</i></th>
+            <th scope="col" data-col="wer"  class="sortable" data-glossary-key="wer" data-i18n="col_wer">WER<i class="sort-icon">↕</i></th>
+            <th scope="col" data-col="mer"  class="sortable" data-glossary-key="mer" data-i18n="col_mer">MER<i class="sort-icon">↕</i></th>
+            <th scope="col" data-col="wil"  class="sortable" data-glossary-key="wil" data-i18n="col_wil">WIL<i class="sort-icon">↕</i></th>
+            <th scope="col" data-col="ligature_score" class="sortable" id="th-ligatures" data-glossary-key="ligature_score" data-i18n="col_ligatures">Ligatures<i class="sort-icon">↕</i></th>
+            <th scope="col" data-col="diacritic_score" class="sortable" id="th-diacritics" data-glossary-key="diacritic_score" data-i18n="col_diacritics">Diacritiques<i class="sort-icon">↕</i></th>
+            <th scope="col" data-col="gini" class="sortable" id="th-gini" data-glossary-key="gini" data-i18n="col_gini">Gini<i class="sort-icon">↕</i></th>
+            <th scope="col" data-col="anchor_score" class="sortable" id="th-anchor" data-glossary-key="anchor_score" data-i18n="col_anchor">Ancrage<i class="sort-icon">↕</i></th>
+            <th scope="col" data-i18n="col_cer_median">CER médian</th>
+            <th scope="col" data-i18n="col_cer_min">CER min</th>
+            <th scope="col" data-i18n="col_cer_max">CER max</th>
+            <th scope="col" id="th-overnorm" data-i18n="col_overnorm">Sur-norm.</th>
+            <th scope="col" data-i18n="col_docs">Docs</th>
           </tr>
         </thead>
         <tbody id="ranking-tbody"></tbody>

picarones/report/throughput_render.py CHANGED Viewed

@@ -139,7 +139,7 @@ def build_throughput_html(
     ]
     for col in (h_engine, h_raw, h_effective, h_drag, h_pages, h_errors):
         parts.append(
-            f'<th style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

     ]
     for col in (h_engine, h_raw, h_effective, h_drag, h_pages, h_errors):
         parts.append(
+            f'<th scope=\"col\" style="padding:.4rem .6rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

picarones/report/worst_lines_render.py CHANGED Viewed

@@ -115,7 +115,7 @@ def build_worst_lines_table_html(
     cols.append(diff_label)
     for col in cols:
         parts.append(
-            f'<th style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

     cols.append(diff_label)
     for col in cols:
         parts.append(
+            f'<th scope=\"col\" style="padding:.3rem .5rem;text-align:left;'
             f'border-bottom:1px solid #ccc;font-weight:600">'
             f'{_e(col)}</th>'
         )

tests/report/test_a11y_level_a.py ADDED Viewed

	@@ -0,0 +1,237 @@

+"""Tests Sprint A6 — accessibilité WCAG niveau A bloquant.
+Items B-9, B-10, m-3, m-4 de l'audit institutional-readiness-2026-05.
+Ce fichier valide le **socle a11y bloquant** pour une déclaration de
+conformité RGAA / WCAG 2.1 niveau A :
+- WCAG 2.4.1 (Bypass Blocks) — skip-to-content link (B-10)
+- WCAG 1.1.1 (Non-text Content) — Canvas charts → aria-label + table
+  jumelle accessible aux AT (B-9)
+- WCAG 1.3.1 (Info and Relationships) — ``scope="col"`` sur les
+  ``<th>`` (m-4)
+- Pas de chaîne hardcodée FR/EN dans la nav (m-3)
+Ces tests se contentent de vérifier la présence des marqueurs HTML
+attendus dans le rapport généré. L'audit sémantique complet (NVDA /
+JAWS / VoiceOver) reste manuel et tracé dans
+``docs/audits/external-audits-2026/`` (Sprint A15).
+"""
+from __future__ import annotations
+import re
+import pytest
+from picarones.fixtures import generate_sample_benchmark
+from picarones.report.generator import ReportGenerator
+@pytest.fixture(scope="module")
+def demo_html(tmp_path_factory) -> str:
+    """Rapport démo (FR) généré une fois pour tous les tests du module."""
+    out = tmp_path_factory.mktemp("a11y") / "report.html"
+    bench = generate_sample_benchmark(n_docs=4)
+    ReportGenerator(bench, lang="fr").generate(out)
+    return out.read_text(encoding="utf-8")
+@pytest.fixture(scope="module")
+def demo_html_en(tmp_path_factory) -> str:
+    """Rapport démo (EN) — pour vérifier que les libellés a11y sont
+    bilingues."""
+    out = tmp_path_factory.mktemp("a11y_en") / "report_en.html"
+    bench = generate_sample_benchmark(n_docs=4)
+    ReportGenerator(bench, lang="en").generate(out)
+    return out.read_text(encoding="utf-8")
+# ---------------------------------------------------------------------------
+# B-10 — Skip-to-content (WCAG 2.4.1)
+# ---------------------------------------------------------------------------
+def test_skip_link_present(demo_html: str) -> None:
+    """Un lien ``href="#main"`` avec class ``skip-link`` doit exister."""
+    assert 'class="skip-link"' in demo_html
+    assert 'href="#main"' in demo_html
+def test_skip_link_first_focusable_in_body(demo_html: str) -> None:
+    """Le skip-link doit être le **premier** élément focusable du body
+    (sinon Tab depuis l'URL bar atteint d'abord la nav, ce qui défait
+    le but)."""
+    body_start = demo_html.find("<body>")
+    assert body_start > 0
+    body_part = demo_html[body_start : body_start + 1500]
+    skip_pos = body_part.find('class="skip-link"')
+    nav_pos = body_part.find("<nav")
+    assert skip_pos > 0 and nav_pos > 0
+    assert skip_pos < nav_pos, (
+        "Le skip-link doit précéder le <nav> dans le DOM."
+    )
+def test_main_has_id_main(demo_html: str) -> None:
+    """Le ``<main>`` doit avoir ``id="main"`` pour que le skip-link
+    pointe vers une cible existante."""
+    assert re.search(r'<main[^>]*\bid="main"', demo_html), (
+        '<main id="main"> attendu pour la cible du skip-link.'
+    )
+def test_skip_link_label_is_i18n(demo_html: str, demo_html_en: str) -> None:
+    """Le libellé du skip-link doit être en français en mode FR et en
+    anglais en mode EN (pas de chaîne hardcodée)."""
+    # FR : "Aller au contenu"
+    assert "Aller au contenu" in demo_html
+    # EN : "Skip to content"
+    assert "Skip to content" in demo_html_en
+# ---------------------------------------------------------------------------
+# B-9 — Canvas charts accessibles (WCAG 1.1.1)
+# ---------------------------------------------------------------------------
+def test_all_canvases_have_aria_label(demo_html: str) -> None:
+    """Tout ``<canvas>`` Chart.js (avec ``id="chart-..."`` ou
+    ``pareto-chart``) doit avoir ``aria-label`` non vide.
+    Tolérance : un ``<canvas>`` créé dynamiquement côté JS sans id
+    pré-déclaré reste possible (Chart.js peut en générer pour des
+    sub-charts). Le test ne valide que les canvas que les templates
+    Jinja2 produisent — pas ceux du DOM dynamique."""
+    html = _strip_inline_scripts(demo_html)
+    canvases = re.findall(r"<canvas[^>]*>", html)
+    chart_canvases = [
+        c for c in canvases
+        if 'id="chart-' in c or 'id="pareto-chart"' in c
+    ]
+    canvases_no_label = [
+        c for c in chart_canvases
+        if 'aria-label="' not in c and "data-a11y-label" not in c
+    ]
+    assert not canvases_no_label, (
+        f"Canvas Chart.js sans aria-label : {canvases_no_label}"
+    )
+def test_canvases_have_role_img(demo_html: str) -> None:
+    """``role="img"`` doit être posé sur les canvas pour les annoncer
+    comme images aux AT."""
+    canvases = re.findall(r"<canvas[^>]*>", demo_html)
+    chart_canvases = [c for c in canvases if "chart-" in c]
+    if not chart_canvases:
+        pytest.skip("Aucun canvas Chart.js dans le rapport démo")
+    canvases_no_role = [c for c in chart_canvases if 'role="img"' not in c]
+    assert not canvases_no_role, (
+        f"Canvas Chart.js sans role=img : {canvases_no_role[:3]}"
+    )
+def test_data_table_helpers_present(demo_html: str) -> None:
+    """La fonction ``attachChartA11y`` qui génère les tables jumelles
+    doit être incluse dans le JS embarqué."""
+    assert "attachChartA11y" in demo_html
+    assert "_populateChartDataTable" in demo_html
+def test_view_data_button_label_localized(
+    demo_html: str, demo_html_en: str
+) -> None:
+    """Les libellés du bouton « Voir les données » doivent être dans
+    l'objet I18N côté JS (pas hardcodés en français)."""
+    assert "Voir les données" in demo_html
+    assert "View data" in demo_html_en
+# ---------------------------------------------------------------------------
+# m-4 — scope="col" sur les <th>
+# ---------------------------------------------------------------------------
+def _strip_inline_scripts(html: str) -> str:
+    """Retire les blocs ``<script>...</script>`` et ``<style>...</style>``
+    avant d'analyser les balises HTML.
+    Nécessaire car Chart.js minifié contient des chaînes comme
+    ``<this._cachedMeta`` qui matchent le regex ``<th[\\s>]`` faussement
+    (sequence ``<t`` + word boundary). On limite l'analyse au HTML rendu
+    par les templates Jinja2, pas au JS embarqué.
+    """
+    cleaned = re.sub(r"<script\b[^>]*>.*?</script>", "", html, flags=re.DOTALL)
+    cleaned = re.sub(r"<style\b[^>]*>.*?</style>", "", cleaned, flags=re.DOTALL)
+    return cleaned
+def test_table_headers_have_scope(demo_html: str) -> None:
+    """Tout ``<th>`` rendu par les templates doit avoir ``scope="col"``
+    ou ``scope="row"``."""
+    html = _strip_inline_scripts(demo_html)
+    # Regex strict : <th suivi d'un espace ou >, qui n'a PAS d'attribut scope=
+    th_no_scope = re.findall(
+        r"<th(?:\s+(?![^>]*\bscope=)[^>]*)?>",
+        html,
+    )
+    # On filtre faux positifs : <thead, <tbody, <tfoot etc. ne doivent pas matcher.
+    th_no_scope = [t for t in th_no_scope if re.match(r"<th(\s|>)", t)]
+    total_th = len(re.findall(r"<th(\s|>)", html))
+    if total_th == 0:
+        pytest.skip("Pas de <th> dans le rapport démo")
+    assert not th_no_scope, (
+        f"{len(th_no_scope)}/{total_th} <th> sans scope= "
+        f"dans le HTML rendu (hors <script>/<style>). "
+        f"Premiers : {th_no_scope[:3]}"
+    )
+# ---------------------------------------------------------------------------
+# m-3 — Bouton Reset i18n
+# ---------------------------------------------------------------------------
+def test_reset_button_uses_i18n_key(demo_html: str) -> None:
+    """Le bouton « Réinitialiser » du bandeau d'exclusion doit avoir
+    ``data-i18n="reset_all"`` (pas de chaîne FR hardcodée sans
+    mécanisme i18n)."""
+    # Le bouton apparaît avec data-i18n="reset_all"
+    assert 'data-i18n="reset_all"' in demo_html
+def test_reset_label_in_i18n_dicts(demo_html: str, demo_html_en: str) -> None:
+    """Les clés ``reset_all`` doivent exister dans les deux
+    dictionnaires i18n embarqués."""
+    # Le JSON I18N est embarqué inline dans le HTML.
+    # On cherche un fragment JSON ``"reset_all":"..."``
+    assert re.search(r'"reset_all"\s*:\s*"R[ée]initialiser"', demo_html)
+    assert re.search(r'"reset_all"\s*:\s*"Reset"', demo_html_en)
+# ---------------------------------------------------------------------------
+# Synthèse
+# ---------------------------------------------------------------------------
+def test_html_has_lang_attribute(demo_html: str, demo_html_en: str) -> None:
+    """``<html lang="...">`` doit être posé pour les AT (déjà cas mais
+    on renforce)."""
+    assert 'lang="fr"' in demo_html
+    assert 'lang="en"' in demo_html_en
+def test_global_a11y_smoke(demo_html: str) -> None:
+    """Méta-test : tous les marqueurs a11y de niveau A sont présents
+    dans un rapport démo standard."""
+    markers = [
+        'class="skip-link"',
+        'href="#main"',
+        'id="main"',
+        'role="img"',
+        "attachChartA11y",
+        'scope="col"',
+        'data-i18n="reset_all"',
+    ]
+    missing = [m for m in markers if m not in demo_html]
+    assert not missing, f"Marqueurs WCAG niveau A manquants : {missing}"