5 Testing pipes
This chapter covers
- Testing pipes
- Understanding pure functions versus functions with side effects
- Using the
transformmethod
Often, you’ll want to modify data that’s displayed in a template. For example, you may want to format a number as currency, transform a date into a format that’s easier to understand, or make some text uppercase. In situations like these, Angular provides a way to transform data using something known as a pipe.
Pipes take input, transform it, and then return some transformed value. Because the way pipes operate is straightforward, writing tests for them is too. Pipes depend only on their input. A function whose output depends on only the input passed to it is known as a pure function.
When a function can do something other than return a value, it’s said to have a side effect. A side effect could be changing a global variable or making an HTTP call. Pure functions like pipes don’t have side effects, which is why they’re easy to test.
In this chapter, we’ll cover everything you need to know to test pipes.
5.1 Introducing PhoneNumberPipe
In this chapter, you’ll be testing a custom pipe called PhoneNumberPipe. This pipe takes in a phone number as a number or string in valid format and puts it into a format that the user specifies. You need to write tests for the pipe so you can confirm that it transforms data into the right format.