title: How to invoke JS async method from Blazor
body: <p>I am trying to read some file using the <code>JSInterop</code> provided by <code>Blazor</code>.The problem is that even if in <code>.C#</code> i await the method ,  it seems it does not <code>await</code> it.Thus i can not retrieve the result provided by <code>js</code>.</p>
  
  <p><strong>C#</strong></p>
  
  <pre><code>&lt;input name="start" type="file" onchange="@(async(x)=&gt;await OnChangeS(x))" /&gt;
  
  @functions{
      private const string S = "start";
  
      public async Task OnChangeS(UIChangeEventArgs ev) {
          var str =  await JSRuntime.Current.InvokeAsync&lt;string&gt;("methods.readFile", S);
          Console.WriteLine("From blazor data is:" + (string.IsNullOrEmpty(str) ? "empty" : str));
      }
  }
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>  window.methods = {
  
      readFile: function (fileName) {
  
          let reader = new FileReader();
          var file = document.querySelector('input[type=file ][name=' + fileName + ']').files[0];
          var data = null;
          reader.onload = () =&gt; {
                  data = reader.result;
                  console.log("from load data is"+data);
  
          };
          reader.onloadend = () =&gt; {  console.log("from loadend data is"+data);return data };
          reader.readAsText(file);
      }
  }
  </code></pre>
  
  <p><strong>OUTPUT</strong>:<br>
  Given a sample <code>json</code> file :  <code>{ "name":"adita","age":33}</code> this is my output order:</p>
  
  <pre><code>WASM: Blazor S:empty
  
  Fread.js:11 from load data is: {
      "name":"adita",
      "age":33
  }
  Fread.js:14 from loadend data is: {
      "name":"adita",
      "age":33
  }
  </code></pre>
  
  <p>So my question is why is the method not awaited by <code>Blazor</code> ? </p>