Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] Console errors about main-menu.js #106

Open
codechefmarc opened this issue Jan 11, 2024 · 0 comments
Open

[BUG] Console errors about main-menu.js #106

codechefmarc opened this issue Jan 11, 2024 · 0 comments
Labels

Comments

@codechefmarc
Copy link
Contributor

Describe the bug
After starting up a new install of Emulsify and Compound (default components), I had to change the attach_library lines in a few files including the main-menu.twig due to this bug (emulsify-ds/emulsify-cli#191). The change was from {{ attach_library('emulsify/main-menu') }} to {{ attach_library('MY_THEME/main-menu') }}.

In loading the new theme, when logged in to Drupal, I get console errors now with this library. Here is the error:

Uncaught TypeError: e.getElementById is not a function
    at Object.attach (main-menu.js?s7433c:1:55)
    at drupal.js?v=10.2.0:166:24
    at Array.forEach (<anonymous>)
    at Drupal.attachBehaviors (drupal.js?v=10.2.0:162:34)
    at HTMLAnchorElement.<anonymous> (ajax.js?v=10.2.0:1387:20)
    at Function.each (jquery.min.js?v=3.7.1:2:3129)
    at ce.fn.init.each (jquery.min.js?v=3.7.1:2:1594)
    at Drupal.AjaxCommands.insert (ajax.js?v=10.2.0:1385:21)
    at ajax.js?v=10.2.0:1046:41

I traced it to the compiled JS file web/themes/custom/MY_THEME/dist/js/02-molecules/menus/main-menu/main-menu.js which is based on web/themes/custom/MY_THEME/components/02-molecules/menus/main-menu/main-menu.js. In the original, the context variable is used and that should normally represent document so the context.getElementById or document.getElementById is valid. In the compiled file, it is replaced with e. I'm not sure if this is the cause of it, but what I found in my initial research.

This error does not show up when logged out as an anonymous user.

To Reproduce
Steps to reproduce the behavior:

  1. Install Drupal with composer create-project drupal/recommended-project <project-name>
  2. Install Emulsify with emulsify init <theme name>
  3. Go into the newly created theme and run emulsify system install compound
  4. Also from within the theme directory, run npm install and npm run build
  5. Enable the new theme in Drupal and clear caches
  6. Visit the front-end as a logged in user
  7. Open the console and verify the error message
  8. View the site as a logged out user and open the console
  9. Verify there is no error message.

Expected behavior
No console.log errors. Also, it appears that due to this, the main menu mobile open/close does not work when logged in.

Desktop (please complete the following information):

  • OS: macOS 14.2.1
  • Browser Arc 1.25.1, Safari 17.2.1
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
Status: Incoming
Development

No branches or pull requests

1 participant