pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] web: check if navLink exists

Browse Source 
__Current behavior before commit:__
If there is no link in one of the hamburger menu element,
`el.querySelector` will return `null` and an error will be thrown when
it tries to access `classList`.

__Description of the fix:__
Add a check on `itemLink` and `navLink` before accessing `classList`.

__To reproduce:__
1. Add 2 pages with long names to the website, make sure they are
included in the navbar
1. Open Website Editor
1. Click on the navbar
1. In the **CUSTOMIZE** tab, inside the **Navbar** section, change
**Mobile Menu** to `Off-Canvas`
1. Set **Mobile Menu > Off-Canvas Logo** to `Text`
1. Reduce the width of the page *just enough* so that the hamburger menu
appears instead of the navbar menus only when the web editor is on
1. Click on the hamburger menu, and remove the link of the "My Website"
text at the bottom
1. Exit the Web Editor

([Video](https://watch.screencastify.com/v/dWI3g6NnT5uRcp2KmBOO))

opw-3443200

closes odoo/odoo#131373

X-original-commit: 5b9eb3a1d016a16d395e9888ccd1606543eb99e2
Signed-off-by: Luca Vitali (luvi) <luvi@odoo.com>
This commit is contained in:
Julien (jula)
2023-08-16 16:05:22 +02:00
parent e3da5f1b7d
commit a44fb24cb5
1 changed files with 9 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/website/static/src/js/content/auto_hide_menu.js
+9 -5
View File
@@ -68,8 +68,10 @@ async function autoHideMenu(el, options) {
if (!isUserNavbar) {
item.classList.add('nav-item');
const itemLink = item.querySelector('.dropdown-item');
itemLink.classList.remove('dropdown-item');
itemLink.classList.add('nav-link');
if (itemLink) {
itemLink.classList.remove('dropdown-item');
itemLink.classList.add('nav-link');
}
} else {
item.classList.remove('dropdown-item');
const dropdownSubMenu = item.querySelector('.dropdown-menu');
@@ -133,9 +135,11 @@ async function autoHideMenu(el, options) {
if (!isUserNavbar) {
const navLink = el.querySelector('.nav-link, a');
el.classList.remove('nav-item');
navLink.classList.remove('nav-link');
navLink.classList.add('dropdown-item');
navLink.classList.toggle('active', el.classList.contains('active'));
if (navLink) {
navLink.classList.remove('nav-link');
navLink.classList.add('dropdown-item');
navLink.classList.toggle('active', el.classList.contains('active'));
}
} else {
const dropdownSubMenu = el.querySelector('.dropdown-menu');
const dropdownSubMenuButton = el.querySelector('.dropdown-toggle');