Dropdown menu doesn't work on Heroku

Question

I have a simple drop down menu which works great locally but when I deploy my application to Heroku, it doesn't work. It doesn't show menu options. So, when I click on Account, nothing happens.

Here is the simple code:

      <nav>
        <ul class="nav pull-right">
          <% if signed_in? %>
            <li><%= link_to "Home", root_path %></li>
            <li id="fat-menu" class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                Account <b class="caret"></b>
              </a>
              <ul class="dropdown-menu">
                <li><%= link_to "Profile", current_user %></li>
                <li><%= link_to "Settings", edit_user_path(current_user) %></li>
                <li class="divider"></li>
                <li>
                  <%= link_to "Sign out", signout_path, method: "delete" %>
                </li>
              </ul>
            </li>
          <% end %>
        </ul>
      </nav>

What could be a problem? What do you think is it the problem on my side or on Heroku? Thank you.

Answer 1

Sounds like you are having problems with the asset pipeline. Check out:

https://devcenter.heroku.com/articles/rails-asset-pipeline

Are you letting Heroku precompile your assets? Personally, I precompile all my assets before deploying to Heroku.

 RAILS_ENV=production bundle exec rake assets:precompile

This will precompile all your assets and puts it under a public/assets folder. Then you can just add them to git and push to heroku.

If you do this you will be compiling manually, and you should run the precompile line before you re-deploy or update your Heroku app to catch any changes you've made in the asset pipeline.

You could also look at this question and ones linked with it:

Javascript features work on localhost but not when deployed to Heroku