Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Angular Ruhr @ Comline GmbH

Dominik Pieper
May 17, 2024
34

Angular Ruhr @ Comline GmbH

Dominik Pieper

May 17, 2024
Tweet

Transcript

  1. Agenda Talk 1: Bessere Architekturen mit modernem Angular und Nx

    Speaker: Dominik Pieper - Topic Lead Frontend, Conciso GmbH Talk 2: Testing all the things - e2e testing patterns Speaker: Tobias Brenner - Principal Expert Application Development
  2. Dominik Pieper Topic Lead Frontend / Solution Architect +49 160

    99527824 [email protected] https://conciso.de Bessere Architekturen mit modernem Angular und Nx
  3. 4

  4. 9

  5. Testing all the things - e2e testing patterns Tobias Brenner

    E-Mail: [email protected] Handy: +49 175 4751 883 E.ON Digital Technology GmbH
  6. What is the problem? • Scaling the test codebase >

    Scaling ordinary code • Test code prone to refactoring • Selector bleeding • Slow test executions • Flaky tests • Setup test code vs. Actual test code • Too complex test code • It‘s too much work to write tests • Are you testing too much? <ul> </ul>
  7. Easy stuff first - Selectors • Don‘t use complex dom

    selectors • Don‘t bind it to your components dom structure • Instead: • Use test-id attributes • Use Naming conventions for them • Don‘t expose them • … later more about that
  8. How to write test code which ages well • Strict

    encapsulation • Create action files for each component • Write utility fns for state checks (expections) • Write utility fns for interaction (state change) • Keep the test code DRY • Use fns composition • Delegate work to other, existing action files • Create action file for each view • Create scenario files • Static test data • Mock HTTP Layer (Disclaimer)
  9. FAQ • Do I need a specific testing library? •

    Mocking the HTTP in e2e tests, really? • Isn’t this too much effort?
  10. How to write test code which ages well - recap

    Congrats: you‘ve created you own testing DSL Create action file per component Create action file per view Compose atomic actions to flows Create scenarios out of flows Use static test data