Build a Reusable Mega Navbar - Step 8

JavaScript
1

Tell us what’s happening:

Step 8 is failing even when I use the code revealed in the next step of the workshop (using the N hotkey).

Step 8: Still inside the third li element, create a ul element for the popup. Give it a className of sub-menu and an aria-label of Apps .

I’m getting this error:

You should create a ul element inside your third li element.

Your code so far

/* file: index.jsx */
export const Navbar = () => {
  return (
    <nav className="navbar">
      <ul>
        <li className="nav-item">
          <a href='#'>Dashboard</a>
        </li>
        <li className="nav-item">
          <a href="#">Widgets</a>
        </li>
        <li className="nav-item">
          <button aria-expanded="false">Apps</button>

{/* User Editable Region */}

          <ul className="sub-menu" aria-label="Apps">
            
          </ul>

{/* User Editable Region */}

        </li>
      </ul>
    </nav>
  )
}

It should be pretty straightforward but I even tried using code from the next step in the workshop, which was exactly the same as my code:

<ul className="sub-menu" aria-label="Apps">
            
</ul>

I also noticed this error message in the dev tools console:

Uncaught ReferenceError: ReactDOM is not defined

Maybe this is a bug?

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36

Challenge Information:

Build a Reusable Mega Navbar - Step 8

2

Your solution works from my end. Please try one of the following steps to move forward.

Click on the “Reset” step button and force a refresh of your page with CTRL + F5 if you’re on Windows then try to paste the code in again. On other systems, please follow the instructions here.

or - Try the step in incognito or private mode.

or - Disable any/all extensions that interface with the freeCodeCamp website (such as Dark Mode, Ad Blockers, or Spellcheckers), and set your browser zoom level to 100%. Both of these factors can cause tests to fail erroneously.

or - Ensure your browser is up-to-date or try a different browser.

or - Turn off high contrast themes on Windows (from accessibility settings menu)

I hope one of these will work for you.

3

Unfortunately, nothing worked… I’ll try again on a different machine when I can. Appreciate the quick response.

1 Like
4

Tried another machine and that worked, and now it’s also working on my original machine as well… :person_shrugging: Thanks for you help!

1 Like