În orice aplicație serioasă – fie ea un blog, un magazin online sau un dashboard enterprise – testele automate nu mai sunt un „lux”, ci o necesitate. Ele oferă încredere în cod, ușurează refactorizările și accelerează livrarea de funcționalitate. În acest articol vei învăța cum să testezi aplicația ta React + .NET Core pe toate nivelurile: domeniu, aplicație, API și frontend.
✅ 1. Testarea logicii de domeniu (xUnit/NUnit)
Începem cu cea mai pură zonă a codului: modelul de domeniu (Domain Layer), unde se află regulile de business.
Exemplu: Agregatul Post
public class Post
{
public Guid Id { get; private set; }
public Slug Slug { get; private set; }
public PostContent Content { get; private set; }
public Post(Slug slug, PostContent content)
{
Id = Guid.NewGuid();
Slug = slug;
Content = content;
}
}
public class PostTests
{
[Fact]
public void Constructor_Should_SetSlugAndContent()
{
// Arrange
var slug = new Slug("primul-post");
var content = new PostContent("Salut lume!");
// Act
var post = new Post(slug, content);
// Assert
Assert.Equal(slug, post.Slug);
Assert.Equal(content, post.Content);
}
}
✅ Bonus: Folosește FluentAssertions pentru assert-uri expresive.
✅ 2. Testarea serviciilor de aplicație
Application Layer conține logica de orchestrare. Aici lucrăm cu comenzi, query-uri și handleri (dacă folosești MediatR).
Exemplu: CreatePostCommandHandler
public class CreatePostCommandHandler : IRequestHandler<CreatePostCommand, Guid>
{
public Task<Guid> Handle(CreatePostCommand request, CancellationToken cancellationToken)
{
// Creează un nou post, salvează în repo etc.
}
}
[Fact]
public async Task Handle_ShouldReturnPostId_WhenPostIsCreated()
{
// Arrange
var command = new CreatePostCommand("titlu", "continut");
var handler = new CreatePostCommandHandler(/* mocks */);
// Act
var result = await handler.Handle(command, CancellationToken.None);
// Assert
result.Should().NotBeEmpty();
}
✅ Tool-uri utile:
✅ 3. Testarea controllerelor (integration tests)
Cu WebApplicationFactory putem scrie teste care pornesc aplicația ca într-un mediu real, dar cu DB in-memory (SQLite sau UseInMemoryDatabase()).
Setup
public class CustomWebAppFactory : WebApplicationFactory<Program>
{
protected override void ConfigureWebHost(IWebHostBuilder builder)
{
builder.ConfigureServices(services =>
{
services.RemoveAll(typeof(DbContextOptions<AppDbContext>));
services.AddDbContext<AppDbContext>(options =>
options.UseInMemoryDatabase("TestDb"));
});
}
}
[Fact]
public async Task GetPosts_ShouldReturn200()
{
var client = _factory.CreateClient();
var response = await client.GetAsync("/api/posts");
response.StatusCode.Should().Be(HttpStatusCode.OK);
}
✅ 4. Testarea componentelor React (Vitest + React Testing Library)
Pe frontend, folosim Vitest (vite-native) împreună cu @testing-library/react.
Exemplu: PostList
export function PostList({ posts }: { posts: Post[] }) {
return (
<ul>
{posts.map(p => <li key={p.id}>{p.title}</li>)}
</ul>
);
}
import { render, screen } from "@testing-library/react";
import { PostList } from "./PostList";
test("renders post titles", () => {
render(<PostList posts={[{ id: "1", title: "Salut!" }]} />);
expect(screen.getByText("Salut!")).toBeInTheDocument();
});
✅ Bonus: Folosește msw (Mock Service Worker) pentru a intercepta request-uri API în teste.
Concluzie
Acum ai o imagine completă a testării într-o aplicație React + .NET:
-
🧠 Unit tests pentru modelul de domeniu
-
🧩 Teste de aplicație pentru handleri și servicii
-
🌐 Integration tests pentru API
-
🎯 UI tests pentru React
Recomandare: Include testele în CI/CD (GitHub Actions) pentru verificări automate la fiecare commit.
