Menu stops working sometimes

  • joehealy

    (@joehealy)


    5 years, 9 months ago

    We are using the Jalbee theme and love it!

    However, we find the menu functionality on mobile (narrow screens) a little bit unreliable – particularly on Chrome (desktop with narrow window or mobile).

    Sometimes when you click on the MENU button, nothing happens and an exception is raised:

    Uncaught TypeError: Cannot read property ‘querySelector’ of null
    at jalbeeInitMenuToggle (navigation.js?ver=20180514:121)
    at navigation.js?ver=20180514:23
    at navigation.js?ver=20180514:262

    This only seems to occur every second time.

    Other times, it works fine.

    This makes it pretty difficult to use the theme on mobiles.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter joehealy

    (@joehealy)

    5 years, 9 months ago

    This issue in wprig is relevant:

    https://github.com/wprig/wprig/issues/136

    Thread Starter joehealy

    (@joehealy)

    5 years, 9 months ago

    I fixed it with the following patch:

    diff navigation.js_orig navigation.js
    2a3
    >
    11,13c12,13
    < var JALBEE_SITENAV = document.querySelector(‘.main-navigation’),
    < JALBEE_KEYMAP = {
    < TAB: 9
    —
    > var JALBEE_KEYMAP = {
    > TAB: 9
    16,20c16,22
    < // Initiate the menus when the DOM loads.
    < // document.addEventListener(‘DOMContentLoaded’, function () {
    < // jalbeeInitMainNavigation();
    < // jalbeeInitMenuToggle();
    < // });
    —
    > if ( ‘loading’ === document.readyState ) {
    > // The DOM has not yet been loaded.
    > document.addEventListener( ‘DOMContentLoaded’, initNavigation );
    > } else {
    > // The DOM has already been loaded.
    > initNavigation();
    > }
    21a24,25
    > // Initiate the menus when the DOM loads.
    > function initNavigation() {
    24c28,31
    < /**
    —
    > doSomethingElse();
    > };
    >
    > /**
    28a36,37
    > const JALBEE_SITENAV = document.querySelector(‘.main-navigation’);
    >
    120a130,136
    > const JALBEE_SITENAV = document.querySelector(‘.main-navigation’);
    >
    > // No point if no site nav.
    > if (!JALBEE_SITENAV) {
    > return;
    > }
    >
    235a252,259
    > function doSomethingElse() {
    > const JALBEE_SITENAV = document.querySelector(‘.main-navigation’);
    >
    > // No point if no site nav.
    > if (!JALBEE_SITENAV) {
    > return;
    > }
    >
    262c286,288
    < })();
    \ No newline at end of file
    —
    > }
    >
    > })();

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Menu stops working sometimes’ is closed to new replies.