how to remove the blob error while reading a file?

i am getting this error on uploading a file in the input text box.

Uncaught TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'

i have to upload the html file and preview the text in that file but while uploading it is throwing this error in the console. how to resolve this error. here is my javascript code--

  $(".image-preview-input input:file").change(function (){    
                    var file = this.files[0];
                    var reader = new FileReader();
                    var FileExtension = file.name.split('.')[file.name.split('.').length - 1].toLowerCase();
                    if(FileExtension !== 'html'){
                      $('#fileValidationMessage').css("color", "red");
                      $('#fileValidationMessage').html("Please select the html extension file.");
                      self.set('templateforHTML','');   
                      $('.image-preview-input input:file').val(""); 
                    }
                    // Set preview image into the popover data-content
                    reader.readAsText(file);
                    reader.onload = function (e) {
                        $('#fileValidationMessage').empty();
                        $(".image-preview-input-title").text("Change");
                        $(".image-preview-clear").show();
                        $(".image-preview-filename").val(file.name);                      
                        self.set('templateforHTML',e.target.result); 
                        reader.readAsDataURL(e.target.file);
                    }    

                });