https://angivillers.fr/wp-content/themes/visibilite2/assets/js/inc/rgaaMainMenu.js

1
2export default function RGAAMainMenu() {
3    const mainMenu = document.querySelectorAll("#menu_principal > li");
4
5    const menuFocus = (link, subMenu, item) => {
6        const callback = (e) => {
7            console.log(e.key)
8            if (e.key == "Tab") {
9                const subLink = subMenu.querySelectorAll("li");
10                subLink.forEach((item, index) => {
11                    if (index == subLink.length - 1) {
12                        item.querySelector("a").addEventListener("blur", () => {
13                            link.ariaExpanded = false;
14                            subMenu.classList.remove("to-open");
15                        });
16                    }
17                });
18            }
19            if (e.key == " " || e.key == "Enter") {
20                link.ariaExpanded = !link.ariaExpanded;
21                subMenu.classList.toggle("to-open");
22                e.preventDefault();
23            }
24        };
25        item.addEventListener("keydown", callback);
26    };
27
28    if (mainMenu) {
29        mainMenu.forEach((item) => {
30            const link = item.querySelector("a");
31            const subMenu = item.querySelector(".sub-menu");
32
33            if (subMenu) {
34                link.ariaExpanded = false;
35                link.removeAttribute("href");
36                link.tabIndex = 0;
37                link.ariaHasPopup = true;
38                link.role = "button";
39            }
40
41            item.setAttribute("data-toggled", false);
42
43            link.addEventListener("focus", () => {
44                if (item.getAttribute("data-toggled") == "false") {
45                    menuFocus(link, subMenu, item);
46                }
47                item.setAttribute("data-toggled", true);
48            });
49            // link.addEventListener("blur", () => {
50            //     // link.ariaExpanded = false;
51            //     // subMenu.classList.remove("to-open");
52            // });
53        });
54    }
55}