XMLHttpRequest: responseText disappears after receiving a server error

When doing a HTTP GET or POST with XMLHttpRequest and the server reports an error (400,404,500 etc...), whatever content responseText had when readyState was LOADING(3) will be discarded before readyState changes to DONE(4). This makes it impossible to receive additional error information typically reported by the server unless you specifically handle the LOADING state.

function (url, credential) {
        var request = new XMLHttpRequest
        request.open("Post", url)
        request.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");
        console.debug(credential)
        request.setRequestHeader("Authorization", credential);
        request.onreadystatechange = function() {
            var str = "" + request.readyState + '\n' + request.status + request.statusText + '\n' + request.responseText
            console.debug(str)
        }
        request.send()
}

when 401 (need authorization) or 500 (Internal Error)

//---- 401 given a wrong password
2
401Auth

3
401Auth
{"error": {"data": null, "message": "....", "code": 10, "type": 1}}
3
401Auth

4
401Auth
//-----
I found in the first '3' state, it has responseText, and after this the responseText become empty

//---- 500 given a wrong url
2
500Internal Error

3
500Internal Error
{"error": {"data": null, "message": "....", "code": 9, "type": 1}}
4
00
//----
In '4' state the request.status and request.statusText both become '0' and also responseText become empty

It is work correct when everything is all right(status will be 200 and statusText will be 'ok')