From 62016ed929fd2ffc578ccd4649b52ca3223d5168 Mon Sep 17 00:00:00 2001
From: Pierre Ecarlat <pecarlat@grandlyon.com>
Date: Fri, 14 Mar 2025 10:12:18 +0000
Subject: [PATCH] fix: nvda focus
---
src/app/carto/carto.component.html | 9 ++++++++-
.../navigation/navigation.component.html | 2 +-
.../orientation-form-view.component.html | 6 +++---
.../orientation-form-view.component.ts | 9 +++++----
4 files changed, 17 insertions(+), 9 deletions(-)
diff --git a/src/app/carto/carto.component.html b/src/app/carto/carto.component.html
index 929cb0409..b533a2787 100644
--- a/src/app/carto/carto.component.html
+++ b/src/app/carto/carto.component.html
@@ -1,11 +1,18 @@
<div class="content-container no-pt" [ngClass]="{ orientationHeight: isOrientationForm }">
<h1 class="visually-hidden">Cartographie</h1>
<div class="hide-on-print">
- <app-structure-list-search [filters]="filters" (searchEvent)="getStructures($event)" />
+ <app-structure-list-search
+ role="region"
+ aria-label="Filtres"
+ [filters]="filters"
+ (searchEvent)="getStructures($event)"
+ />
</div>
<div class="panes-container">
<app-structure-list
class="left-pane"
+ role="region"
+ aria-label="Liste des structures"
[structureList]="structures"
[isLoading]="isLoadingStructures"
[selectedStructureList]="structuresSelected"
diff --git a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html
index 448826ffa..962721abb 100644
--- a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html
+++ b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html
@@ -1,4 +1,4 @@
-<div class="footerForm">
+<div class="footerForm" role="region" aria-label="Boutons de navigation">
<ng-container *ngIf="!failedOrientation">
<app-button
*ngIf="showPrevButton()"
diff --git a/src/app/form/orientation-form-view/orientation-form-view.component.html b/src/app/form/orientation-form-view/orientation-form-view.component.html
index b02627584..f62897c72 100644
--- a/src/app/form/orientation-form-view/orientation-form-view.component.html
+++ b/src/app/form/orientation-form-view/orientation-form-view.component.html
@@ -1,9 +1,9 @@
-<div class="orientation" cdkTrapFocus [cdkTrapFocusAutoCapture]="true">
- <h1 class="visually-hidden">Orientation</h1>
+<div class="orientation" aria-live="polite" cdkTrapFocus [cdkTrapFocusAutoCapture]="true">
+ <h1 class="visually-hidden" id="pageTitle" tabindex="-1">Orientation</h1>
<div *ngIf="!isLogged" class="notConnected">
<img src="../../assets/form/profileSkip.svg" alt="" />
- <div class="count" aria-live="polite">
+ <div class="count">
<p>Connectez vous pour accéder à cette page !</p>
</div>
<div class="access">
diff --git a/src/app/form/orientation-form-view/orientation-form-view.component.ts b/src/app/form/orientation-form-view/orientation-form-view.component.ts
index 4c0fdc3f9..bd5c4d59d 100644
--- a/src/app/form/orientation-form-view/orientation-form-view.component.ts
+++ b/src/app/form/orientation-form-view/orientation-form-view.component.ts
@@ -1,4 +1,4 @@
-import { AfterContentChecked, ChangeDetectorRef, Component, OnInit, ViewChild } from '@angular/core';
+import { AfterContentChecked, ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { AbstractControl, FormGroup, UntypedFormGroup } from '@angular/forms';
import { Router } from '@angular/router';
import { lastValueFrom } from 'rxjs';
@@ -28,7 +28,6 @@ import {
OnlineMediationSteps,
StructuresListSteps,
} from './enums/orientation.enums';
-import { NavigationComponent } from './global-components/navigation/navigation.component';
import { FiltersForm } from './interfaces/filtersForm.interface';
import { IOrientation } from './interfaces/orientation.interface';
import {
@@ -114,8 +113,6 @@ export class OrientationFormViewComponent implements OnInit, AfterContentChecked
public showConfirmationModal = false;
private resolve: CanExitResolver;
- @ViewChild(NavigationComponent) navComponent!: NavigationComponent;
-
constructor(
public orientationService: OrientationService,
private notificationService: NotificationService,
@@ -165,6 +162,10 @@ export class OrientationFormViewComponent implements OnInit, AfterContentChecked
public validatePage(event: boolean): void {
this.isPageValid = event;
+ const mainHeader = document.querySelector('#pageTitle');
+ if (mainHeader) {
+ (mainHeader as HTMLElement)?.focus();
+ }
}
public setFailedOrientation(): void {
--
GitLab