Javascript debugging doesn’t work in razor pages

Chrome (and Canary) used to be able to show javascript source which was embedded in aspx files.

Typically, I would add a debugger; statement, save, and then load my web page in Chrome with the developer tools window open. When Chrome hit the debugger; statement, it would stop and then show the javascript source, so that I could inspect variable or step through code.

A recent change has changed this so that now, when the debugger; statement is executed, Chrome dutifully stops execution but it is unable to show the source.

I had the same problem. When I clicked on the aspx page, under the Sources tab, I got a blank page. What worked for me was refreshing the page in Chrome. After that, the aspx code showed up in Developer Tools, and I was able to see , debug and search the code. This seems to be a Chrome bug.

Chrome Developer tool: html script is blank (in source) debugging tutorial

TransactionScope Async Thread Fail

I updated some data access code to wrap some operations in a TransactionScope. The operations are async methods running some Dapper execute statements to write data to a SQL Server database. Something like:

public async Task InserData(SourceData sourceData)
{
    using (var transactionScope = new 
    TransactionScope(TransactionScopeAsyncFlowOption.Enabled))
    {
     using (IDbConnection connection = new  
        SqlConnection(this.ConnectionString))
      {
         connection.Open();

         await InsertSomeData(sourceData.Registers, connection);
         await InsertMoreData(sourceData.Deposits, connection);

         transactionScope.Complete();
       }
    }
}

Anyway, I wire up a unit test to this method and it fails with this message:

Result Message:
Test method ExtractSourceDataTest.CanStart threw exception:
System.InvalidOperationException: A TransactionScope must be disposed on the same thread that it was created.

As usual, Google to the rescue. I found a nice blog post that explains the issue, https://particular.net/blog/transactionscope-and-async-await-be-one-with-the-flow. Basically, TransactionScope was not made to operate asynchronously across threads, but there is a work around for that. Microsoft released a fix, TransactionScopeAsyncFlowOption.Enabled. I went from a zero

using (var transactionScope = new TransactionScope())

to a hero

using (var transactionScope = new TransactionScope(TransactionScopeAsyncFlowOption.Enabled))

Now, if this would have been turned on by default I wouldn’t of had this little problem… talking to you Microsoft. I’m sure there is some backward compatibility issue or other quirk that makes default enable difficult, but I’m ranting anyway.

Conclusion

This is awesome, but I basically just enabled a distributed transaction and that scares me. You do not know the trouble I have seen with distributed transactions. Hopefully, its not that bad since we are distributing across processes on the same machine and not over the network, but scary none the least.

Bundling and Minification in ASP.NET Core

It is the dream of every web developer to build blazing fast and high-performance web applications but this is not easy to accomplish unless we implement some performance optimizations. Web pages have evolved from static HTML pages to complex and responsive pages with a lot of dynamic contents and plugins which require a large number of CSS and JavaScript files to be downloaded to the clients. To improve the initial page request load time, we normally apply two performance techniques called bundling and minification.

Read more here…