You know how it goes; you build your shiny new feature using Blazor, React, Vue, <insert framework here>.

You test locally; everything works as it should.

Then you push to production and…

… everything is broken!

Any number of things can break your app in prod but one of the biggies is data coming back (or being posted) via your network calls which doesn’t match what you expected.

For some time we’ve been able to inspect those network requests via the browser’s Dev Tools, to see what’s really going on.

You can inspect the request, check what parameters are being sent across, then look at the response and inspect the resulting data to see why your feature might be working the way it is.

But, what if you want to play with that request, tweak it’s parameters, or just replay the request, without having to drive everything from the UI?

Microsoft Edge now includes an Edit and Replay feature comes in, and it’s pretty darn useful.

Considering Blazor for your next project?

Try this simple, repeatable process for transforming ideas into features using Blazor's component model.

4 days; 4 emails; enter your email in the box below and I'll send you lesson #1.

I respect your email privacy. No spam, unsubscribe anytime with one click.

 

So long as you’re using the new (actually really good) Chromium version of Edge, you can enable the shiny new Network Console for your browser.

With that, head over to any network request in the Dev Tools, right-click and select Edit and Replay and…

The Network Console springs into life and shows you the request, including things like Query parameters, the request Body and Auth tokens etc.

From here you can click Send to replay the request, at which point you can easily inspect the response for that request…

Then you can download the resulting json, or just edit the request and try again.

There are of course other ways to achieve similar results. I’ve been a big fan of a tool called Insomnia in recent years.

But, for testing authenticated requests it was always a bit of a pain to locate the JWT auth token, copy it and paste it across to Insomnia, then set up the request etc.

Now, with a couple of clicks you can replay requests right there in the browser, Auth tokens and everything!

It’s worth noting this is an “Experimental Feature so expect a few bugs here and there, but overall this looks like a big step forward for testing your client applications.

Check out this post by Microsoft for all the details (including how to enable this in Edge).

Build better ASP.NET web applications, faster

I email every week with hints, tips and advice on how to push through all the noise to get your ASP.NET applications built.

Drop your email in the box below and I'll send new articles straight to your inbox.

I respect your email privacy. No spam, unsubscribe anytime with one click.

 

Next up

With so many Blazor Component Libraries, which one is best for you?
There’s no shortage of component libraries available for Blazor, but how do you figure out which one you should use?
Will .NET 6 fix Blazor Prerendering?
Prerendering eradicates Blazor WASM’s initial load time and .NET 6 promises to address its one key limitation
Persisting your users preferences using Blazor and Local Storage
Now your app supports dark mode, let’s make sure your visitors only have to choose it once (or ideally, not at all)