Angular testing made easy

Angular testing made easy

Time and again, the testing in the frontend is put on the back burner. For a modern business application it is inevitable to write reasonable tests in the frontend as well. When developing Angular, testability was part of the concept right from the start. In this workshop Fabian Gosebrink shows how to put his Angular applications through their paces. A look is taken at the tools and the different possibilities of testing, so that in the end no case remains untested.

Fb89953d3a1b1fcb862a186585c37c25?s=128

Fabian Gosebrink

October 09, 2019
Tweet

Transcript

  1. Angular Testing

  2. None
  3. Fabian Gosebrink http://offering.solutions http://github.com/FabianGosebrink http://fabian-gosebrink.com @FabianGosebrink

  4. Why do we Test?

  5. None
  6. None
  7. Testing

  8. Unit Testing

  9. Shallow Testing

  10. Integration Testing

  11. End 2 End Testing

  12. Strategies

  13. Smallest as possible

  14. Readable

  15. Do not mock…

  16. …that often

  17. Test driven

  18. Explore the tools

  19. Explore the tools Protractor Jasmine Karma

  20. Jasmine • Behaviour Driven Development • Fast

  21. None
  22. None
  23. None
  24. Some Jasmine Matchers expect(array).toContain(member); expect(mixed).toBeDefined(); expect(mixed).toBeFalsy(); expect(mixed).toBeNull(); expect(mixed).toBeUndefined(); expect(mixed).toEqual(mixed); expect(mixed).toMatch(pattern);

    expect(number).toBeCloseTo(number, decimalPlaces); expect(number).toBeGreaterThan(number); expect(number).toBeLessThan(number); expect(number).toBeNaN(); expect(spy).toHaveBeenCalled(); expect(spy).toHaveBeenCalledTimes(numb er);
  25. None
  26. None
  27. Skip Tests

  28. Karma • Test runner • Spawns browser & runs tests

    • Also on Commandline
  29. None
  30. None
  31. Protractor • End-to-end test framework • Runs in a real

    browser • Test like a user
  32. None
  33. component.ts

  34. component.spec.ts

  35. AngularCLI

  36. None
  37. None
  38. ARRANGE ACT ASSERT

  39. None
  40. Testing Pipes

  41. Testing Services

  42. None
  43. None
  44. None
  45. None
  46. None
  47. None
  48. Code...

  49. Testing Routing

  50. None
  51. None
  52. Testing Components

  53. None
  54. None
  55. Code...

  56. Automate

  57. None
  58. https://offering.solutions https://fabian-gosebrink.com https://github.com/FabianGosebrink/Angular-Testing @FabianGosebrink