Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Firefox on Windows hangs with large bootstrap drop downs

  • 6 பதிலளிப்புகள்
  • 1 இந்த பிரச்சனை உள்ளது
  • 2 views
  • Last reply by henricoweb

We have updated a Web app by adding bootstrap and changing the look, functionality is basically the same.

The web app has a form with some drop downs. One has ~1500 options and the other has ~5500 options.

Using Firefox for Windows v. 55.0.3 (64-bit) it is basically impossible to use the drop downs. The one with 1500 options you click it, it takes like 5 seconds for it to appear, then you can't select anything for like 10-20 more seconds then maybe you can scroll and select something and then it takes like 10 seconds to close.

The one with ~5500 you click it, it hangs, then after 20-30 seconds the list might show up but you can't select anything, options don't highlight when hovered over, you can't scroll...

This all works perfectly in Chrome on Windows, IE (Edge) and in Safari on Mac and even Firefox on Mac. The issue is only in Firefox for Windows. If I disable Bootstrap (v. 3.3.7) both drop downs work, they work slowly but they work. So it seems to be an issue with Bootstrap and Firefox.

I did some research and tried Firefox in safe mode and also disabling dom.push.enabled but that didn't work.

Any suggestions?

We have updated a Web app by adding bootstrap and changing the look, functionality is basically the same. The web app has a form with some drop downs. One has ~1500 options and the other has ~5500 options. Using Firefox for Windows v. 55.0.3 (64-bit) it is basically impossible to use the drop downs. The one with 1500 options you click it, it takes like 5 seconds for it to appear, then you can't select anything for like 10-20 more seconds then maybe you can scroll and select something and then it takes like 10 seconds to close. The one with ~5500 you click it, it hangs, then after 20-30 seconds the list might show up but you can't select anything, options don't highlight when hovered over, you can't scroll... This all works perfectly in Chrome on Windows, IE (Edge) and in Safari on Mac and even Firefox on Mac. The issue is only in Firefox for Windows. If I disable Bootstrap (v. 3.3.7) both drop downs work, they work slowly but they work. So it seems to be an issue with Bootstrap and Firefox. I did some research and tried Firefox in safe mode and also disabling dom.push.enabled but that didn't work. Any suggestions?

All Replies (6)

To rule out a potential issue with your customizations (settings, extensions), you could try:

New Profile Test

This takes about 3 minutes, plus the time to test your app.

Inside Firefox, type or paste about:profiles in the address bar and press Enter/Return to load it.

Click the Create a New Profile button, then click Next. Assign a name like Sept2017, ignore the option to relocate the profile folder, and click the Finish button.

After creating the profile, scroll down to it and click the Set as default profile button below that profile, then scroll back up and click the Restart normally button. (There are some other buttons, but I think those are still "under construction" so please ignore them.)

Firefox should exit and then start up using the new profile, which will just look brand new.

Does your page work any better in the new profile?

When you are done with the experiment, open the about:profiles page again, click the Set as default profile button for your normal profile, then click the Restart normally button to get back to it.

If you have the same issue in a new profile:

Other than pointing you toward the Web Console and Browser Console to check for error or warning messages, I think we may have to refer you to a site that can really dig into the third party library.

Thank you, I tried this but it didn't work any better.

Of course as soon as I post the question I find someone with the same problem ( https://support.mozilla.org/en-US/questions/1175368 ) they tried Firefox portable 54 and it works for them and I tired it and it works for me too. So this basically confirms Firefox 55 is the problem.

What version of Bootstrap did you test?

A bug was filed against Firefox 54 related to the select controls on a site that uses Bootstrap v3.3.5 and the interaction problem there is scheduled to be fixed in Firefox 56. (See: [e10s] long drop down menu results in constant beach ball.)

Firefox 56 is available for testing as Firefox Beta:

But there still is an open bug with very large option sets: [e10s] There is a delay for about 1 seconds to display <select> drop-down list with 1600+ items. Before commenting, see: Bugzilla Etiquette, Voting.

Until that is fixed, you may need to disable e10s, also known as multiprocess, in order to work around the issue. Here's how:

Are you using Multiprocess (e10s)?

Multiprocess creates a second firefox.exe or plugin-container.exe process to isolate the web content from the browser UI. In Firefox 54 and later, you may see four content processes. You can check whether you have this feature turned on as follows. Either:

  • "3-bar" menu button > "?" button > Troubleshooting Information
  • (menu bar) Help > Troubleshooting Information
  • type or paste about:support in the address bar and press Enter/Return

In the first table on the page, check the row for "Multiprocess Windows" and see whether the number on the left side of the fraction is greater than zero. If so, you are using e10s.

If you are using e10s:

To help evaluate whether that feature is causing problems, you could turn it off as follows:

(1) In a new tab, type or paste about:config in the address bar and press Enter/Return. Click the button promising to be careful.

(2) In the search box above the list, type or paste autos and pause while the list is filtered

(3) Double-click the browser.tabs.remote.autostart.2 preference to switch the value from true to false

Note: the exact name of the preference may vary, but it will start with browser.tabs.remote.autostart

At your next Firefox startup, it should run in the traditional way. Any difference?

Hello and thank you again.

Bootstrap is v. 3.3.7.

I disabled e10s and that fixed the issue.

I also downloaded FF 56 and it was very similar, with e10s it was super slow almost kind of working in the end. Without e10s it worked perfectly.

Now this is a public page that has to work for the whole county/city so unfortunately a fix just for me isn't a solution and we can't tell the whole city to disable e10s. It seems like this is an option that shouldn't come enabled by default in Firefox. It should only be for advanced users.

Now I saw you posted something similar in the other thread, my URL just in case is:

http://www3.co.henrico.va.us/mapstest/

This was supposed to replace this:

http://www3.co.henrico.va.us/maps/subdivnamesearch.php

Until we found this issue. The old site doesn't have the problem, it doesn't have bootstrap but it does have the ~1 sec delay when you click the drop down boxes, specially Street Name which is the one with ~5500 options.

The delay disappears once you disable e10s so bootstrap or no bootstrap e10s causes a delay or hangs the browser.

After reading the long bug, it doesn't sound as though you can expect a fix during 2017.

Do you want to test your new design with Bootstrap 4.0.0 beta to see whether that works any better? Otherwise, I think you're stuck with your old page for the time being.

Thank you, I posted in the bug ( https://bugzilla.mozilla.org/show_bug.cgi?id=1118086 ) and I got some recommendations about changing the CSS for now and it seems they might push some fixes faster then expected.