SourceBuffer buffered not updating length

Question

In the following code, console.log(sb.buffered) is giving me a TimeRanges object of length 0. Why is this? I checked what xhr.response is, and it is an ArrayBuffer of approximately 58000 byteLength.

var ms;
var sb;
var mimeCodec = 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"';

function example() {
  ms = new MediaSource;
  var video = document.querySelector('video');
  video.src = URL.createObjectURL(ms);
  ms.addEventListener('sourceopen', function() {
    sb = ms.addSourceBuffer(mimeCodec);
    fetch('test0.mp4');
  }, false);
}

function fetch(url) {
  var xhr = new XMLHttpRequest;
  xhr.open('get', url);
  xhr.responseType = 'arraybuffer';
  xhr.onload = function() {
    if (ms.readyState === 'open') {
      sb.appendBuffer(xhr.response);
      sb.addEventListener('updateend', function() {
        console.log(sb.buffered);
      });
    }
  };
  xhr.send();
}