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?
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?
Share Improve this question edited Jan 22, 2018 at 18:42 TylerH 21.1k77 gold badges79 silver badges112 bronze badges asked Jul 28, 2017 at 12:15 br00xbr00x 1611 silver badge5 bronze badges 6- 1 add firefox version. and a snippet too – Sagar V Commented Jul 28, 2017 at 12:17
- Had similar issue once with Firefox + Firebug. Turns out Firebug is not being maintened anymore, had to switch to the Firefox Developer Edition to get a working console again. – JiFus Commented Jul 28, 2017 at 12:21
- @Sagar V7 - Firefox version is 52.0.2 (32-bit) - Please explain what you mean by 'snippet' ? Working example in Fiddle or some like that? – br00x Commented Jul 28, 2017 at 12:28
- @JiFus -Thnx 4 suggestion - Strange thing is that many other logs in console.log are showing just fine – br00x Commented Jul 28, 2017 at 12:29
- @br00x Same for me, just saying you might want to give it a try. Might also just be another problem of course. – JiFus Commented Jul 28, 2017 at 12:31
2 Answers
Reset to default 8There are currently four solutions :
Use
console.log(JSON.stringify(variable, null, 4))
in place ofconsole.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.Use Firefox Web Console (
control+shift+K
, orTools->Web Developer->Web Console
) instead of the standard Firefox Browser Console (control+shift+J
, orTools->Web Developer->Browser Console
). Thanks to Panos Astithas for providing this info!Disable e10s in FF config. Goto
about:config
as an address within Firefox, and setbrowser.tabs.remote.autostart
orloop.remote.autostart
to false. Thanks to Janekptacijarabaci for providing this info!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.
Two possible workarounds:
1) Use the "Web-Console".
The "Web-Console" (CtrlShiftK instead of the "Browser-Console" CtrlShiftJ) shows the expected output.
2) Disable "e10s" multiprocessor support:
- about:config
- browser.tabs.remote.autostart = False
The Browser-Console will show the expected output if e10s is disabled.
Recap (02.01.2018):
The problem still persists in FF 64.0:
in general, objects will be shown as "unavailable" in the Browser-Console.
To reproduce (e10s enabled):
<html><head>
<script type="text/javascript">
console.log( 'test' );
console.log( 123 );
console.log( [ 1, 2, 3 ] );
console.log( { x: 'x' } );
console.log( document.getElementById('myDiv') );
window.onload = function() {
console.log( document.getElementById('myDiv') );
};
</script>
</head><body>
<div id="myDiv"></div>
</body></html>
Output in Browser-Console (wrong output):
test
123
<unavailable>
<unavailable>
null
<unavailable>
Output in Web-Console (as expected):
test
123
Array(3) [ 1, 2, 3 ]
Object { x: "x" }
null
<div id="myDiv">
See also: https://bugzilla.mozilla.org/show_bug.cgi?id=1136995