webkitSpeechRecognition not recognizing

I am using Chrome's webkitSpeechRecognition to perform a simple voice recognition on the microphone input. My code looks like below:

            var final_transcript = '';
            var recognizing = false;
            var ignore_onend;

            if (!('webkitSpeechRecognition' in window)) {
              upgrade();
            } else {
              var recognition = new webkitSpeechRecognition();
              recognition.continuous = true;
              recognition.interimResults = true;
              recognition.onstart = function() {
                recognizing = true;
              };

              recognition.onerror = function(event) {
                if (event.error == 'no-speech') {
                  ignore_onend = true;
                }
                if (event.error == 'audio-capture') {
                  ignore_onend = true;
                }
              };

              recognition.onend = function() {
                recognizing = false;
                if (ignore_onend) {
                  return;
                }
              };


              recognition.onresult = function(event) {
                var interim_transcript = '';
                for (var i = event.resultIndex; i < event.results.length; ++i) {
                  if (event.results[i].isFinal) {
                    final_transcript += event.results[i][0].transcript;
                  } else {
                    interim_transcript += event.results[i][0].transcript;
                  }
                }
              }
            }

            recognition.lang = 'en-CA';
            console.log("1");
            recognition.start();
            console.log(recognizing);
            ignore_onend = false;
            console.log("3");
            console.log(final_transcript);

The code logs an empty final_transcript even if I talk to the microphone, and recognizing is "false" so which means the recognition probably hasn't started.

What did I do wrong? Thanks for your help.