I've been running Blazor in production seven days after it was released. Features when right-clicking a component in the solution explorerWhen you right-click on a component in the Solution Explorer, you will see a new context menu with the following items: ![]() Creating a new Isolated CSS fileI wanted to be able to create a new Isolated CSS file directly from the Solution Explorer, and I didn't want to have to type the name of the file. Creating a new Isolated JavaScript fileI also wanted to be able to create a new Isolated JavaScript file directly from the Solution Explorer. Creating a new Codebehind fileThis feature will add a code-behind file directly from the Solution Explorer. Features when right-clicking when selecting code in a Razor file.When you select code and right-click in a component, you will see a new context menu with the following items: ![]() Move namespaces to _ImportsA common task when creating a new component is to add the namespace to the _Imports.razor file. Simply select the namespaces you want to move and right-click and choose "Move namespaces to _Imports". Extract to ComponentBlazor is a very component-based framework, and you often find yourself extracting parts of your code to a new component. This task is very common, and I wanted to make it as easy as possible. Simply select the code you want to extract and right-click and select "Extract to Component". This will create a new component with the selected code and replace the selected code with the new component. Features when right-clicking a code-behind file of a Razor component.When you right-click on a component's code behind file in the Solution Explorer you will see a new context menu with the following items: ![]() Move code-behind to razorThis is my favorite feature of the extension. Visual Studio makes moving code from the razor file to the code-behind file easy. But it doesn't have a feature to move code from the code-behind file to the razor file. I prefer to have all my code in the razor file, and I often move code from the code-behind file to the razor file. Right-click on the component.razor.cs file and select "Move code-behind to razor". This feature is in beta. I hope I have managed to cover all the edge cases, but if you find any bugs, please let me know. Generic featuresSwitching filesSwitching files between razor and code-behind is common, and I wanted to make it as easy as possible. By pressing CTRL + ALT + N (N for Next file), you can switch between the razor file and the code-behind file (or any nested files). Blazor RoutesIn a large project, it can be hard to keep track of all the routes. I wanted to be able to see all the routes in one place, so I created a new window called Blazor Routes. You can open the window by going to Extensions -> Blazm-> Show Blazor Routes. The window will show all the routes in your project, and you can double-click on a route to open the file. ![]() bUnit test generationThink writing tests is tedious? This new feature promises to eliminate much of that monotony, letting us zero in on the exciting parts! This feature is still undergoing refinement and is in its beta phase. Your feedback and suggestions would be invaluable as we refine this tool. This feature will automatically produce test code:
For those who lean towards a pure C# syntax, the generator will provide:
This generator is designed to seamlessly incorporate dependency-injected properties, render fragments, parameters, and much more. While I've tried to cover the most typical scenarios, there may be edge cases I've missed. Bear with me as I continue to tweak it. There's an ongoing challenge with line break placements, but I'm optimistic about finding a resolution. To leverage this feature, right-click on a component and choose the desired command. ![]() ConclusionI hope you find this extension useful. I will continue to add new features to the extension and I'm open to suggestions. |