Object 'unavailable' in Firefox console

Question

I have a few divs with class='class_name', and also have declared

var A = document.getElementsByClassName('class_name');
console.log(A[0]);

The Chrome console shows:

<div class="class_name"> div 1 </div>

The Firefox console shows:

<unavailable>

What's the issue or what otherwise is the possible cause?

Answer 1

There are currently four solutions :

1. Use console.log(JSON.stringify(variable, null, 4)) in place of console.info(variable). This has the additional advantage of catching errors caused by any type of memory management bugs, but it may cause a cyclic redundancy on actual elements when interpolating parent/child elements. Original solution by me.

2. Use Firefox Web Console (control+shift+K, or Tools->Web Developer->Web Console) instead of the standard Firefox Browser Console (control+shift+J, or Tools->Web Developer->Browser Console). Thanks to Panos Astithas for providing this info!

3. Disable e10s in FF config. Goto about:config as an address within Firefox, and set browser.tabs.remote.autostart or loop.remote.autostart to false. Thanks to Janekptacijarabaci for providing this info!

4. Revert your FireFox Quantum version. I uninstalled Firefox 57 and 59 ("Firefox Quantum") and then installed Firefox version 56.0.2. This fixed the problem for me. Get it here: https://ftp.mozilla.org/pub/firefox/releases/56.0.2/ Original solution by me.

Firefox Development Ticket: https://bugzilla.mozilla.org/show_bug.cgi?id=1136995

UPDATE : Problem persists with Firefox v. 59.0.2, and v. 59.0.3.