Best way to locate source of Warning: Empty string passed to getElementById()

Question

Warning: Empty string passed to getElementById().
Source File: chrome://browser/content/browser.xul
Line: 0

Some days ago I star

Answer 1

Was receiving this warning in Firefox.

I just came across this warning and found that there were labels for input fields but the labels for attribute was not set/empty so just completing the for attribute fixed this issue for me.

// Label's for attribute not set which caused the warning in FF

e.g. <label for=''>Text</label><input type="text" name="text" id="text" value="" />

Answer 2

This answer was really helpful to me in finding why it was happening so I decided to share.

I've placed the following code OUTSIDE document.ready and got this error.

// Enable Line Items ONLY AFTER general info is filled out!
$( "#client_estimate_continue_next" ).click(function(e) {
//e.preventDefault();
console.log(this.id + ' click event fired.');

// DO SOMETHING...

});

I was able to fix the error by simply placing it INSIDE document.ready

Additional info:

I got the error but in my case it was coming from my own script according to FireFox.

I believe I got the error because I made a reference to the id of an element that was not yet fully rendered eg. NOT ready.

Warning: Empty string passed to getElementById().

Answer 3

In my case this was caused by Firefox performing HTML5 checks on the input fields on my form. Once the "required" property was removed from the form elements everything seemed to work fine again.

This was something brought about by the MVC framework I use which generates these properties based on the model validation rules that require a field to be non-empty.

Answer 4

Source File: chrome://browser/content/browser.xul

This means that the error is in a Firefox extension, not in your code.

Answer 5

If you are querying by '#' selector -- ensure the selector is unique (as it should be) or you will end up with this error in ff