Opened 4 years ago
Last modified 4 years ago
#46948 new defect (bug)
Twenty Nineteen - JS error on mobile menu when no visible items
Reported by: |
|
Owned by: | |
---|---|---|---|
Milestone: | Awaiting Review | Priority: | normal |
Severity: | normal | Version: | |
Component: | Bundled Theme | Keywords: | reporter-feedback |
Focuses: | Cc: |
Description
Looks like there's an issue with the JS that populates the 'more' (...) menu on mobile. If there are no visible menu links inside the main menu on mobile and all of them are inside the 'more' menu, then the JS will break. I do not think this is an issue on a Child Theme.
Line 128 priority-menu.js:
prependElement( hiddenList, ! visibleList.lastChild || null === visibleList.lastChild ? visibleList.previousElementSibling : visibleList.lastChild );
Regarding .lastChild
.
The visibleList
element:
// Adds the necessary UI to operate the menu. var visibleList = container.parentNode.querySelector('.main-menu[id]');
If no items are inside the visible list (and all items are inside the more menu) then visibleList
will indeed return as a Node, however lastChild
will return null.
This means the value will not be catched properly by this inline condition:
visibleList.previousElementSibling : visibleList.lastChild
And null
will be passed to the second argument of the prependElement
function when it is not a node - and cause a JS error.
_https://wordpress.org/support/topic/javascript-error-on-child-theme/#post-11433882_
Change History (5)
#2
@
4 years ago
If you visit the URL provided by the second participant in that thread, you'll see on their site they have zero items visible in the menu at 767px or below.
#3
@
4 years ago
Has there been any progress on this bug?
To see it in action simply resize the following website to less than 768px and check the JS errors in priority-menu.js.
@anevins can you provide some more steps to recreate this? The error noted on the support ticket is
Uncaught TypeError: Failed to execute ‘insertBefore’ on ‘Node’: parameter 1 is not of type ‘Node’. at prependElement (priority-menu.js:47)
I am only able to trigger the following similar but different error when the screen size is less than about 100 pixels wide:
TypeError: Argument 1 of Node.insertBefore is not an object.