Testing is in frontend-teams het vak dat iedereen belangrijk noemt en niemand in de sprint plant — tot de regressie op vrijdagmiddag komt. Het Testing Lab van NLCodeCraft Frontend Academy maakt testen tot een craft-gewoonte: wat u automatiseert, wat u met de hand blijft zien, en hoe u een test schrijft die niet breekt bij elke className. Mark van Leeuwen beoordeelt tests op intentie, niet op coverage-percentages die een dashboard groen kleuren.

Instroom: eigen componenten uit React of werk. Wie nog geen component heeft, test lucht. Wij gebruiken Testing Library-patronen en een end-to-end pad voor de kritieke flow. Jest, Vitest of Playwright zijn gereedschap; de les is de vraag “welk gedrag belooft dit scherm de gebruiker?”.

Piramide zonder dogma

Veel unit tests op pure logica. Minder tests op componenten, gericht op toegankelijke namen en zichtbare staten. Weinig end-to-end, op de flow die omzet of intake raakt. Snapshot-zeeën zonder intentie wijzen wij af. Een test die de implementatiedetails van CSS-modules vastlegt, is onderhoudsschuld.

Wij koppelen tests aan UI-patronen: een Button-variant zonder toetsenbordtest is incompleet. En aan Next.js wanneer u die module volgt: serverfouten moeten in de UI-test zichtbaar zijn, niet alleen in de netwerk-tab van de docent.

test("toont een toegankelijke fout na mislukte intake", async () => {
  render(<IntakeForm onSubmit={failingSubmit} />);
  await userEvent.click(screen.getByRole("button", { name: "Intake versturen" }));
  expect(await screen.findByRole("alert")).toHaveTextContent("Intake mislukt");
});

Huiswerk: tests bij uw bestaande component plus een korte lijst “bewust niet getest” met reden. Mark van Leeuwen is strenger op die lijst dan op het aantal its. Wie alles test, onderhoudt niets. Wie niets test, beweert craft zonder bewijs.

Leslocatie en bereik in Amsterdam

NLCodeCraft geeft klassikale en hybride frontend-opleidingen vanaf de Wibautstraat, op de Knowledge Mile tussen Amstel en Weesperplein. Cursisten komen uit de onderstaande stadsdelen; avondgroepen starten na kantoortijd zodat u vanuit Zuid, Noord of Oud-West kunt aansluiten zonder een extra reisdag in te plannen.

• Centrum
• De Pijp
• Oud-West
• Oost
• Watergraafsmeer
• Amsterdam-Noord
• Zuid
• Westerpark