Angular4 Testing (with Jasmine)

If your component uses both a service (to talk to an API endpoint) and the router, what do you do for those in unit tests?

Mock them!

What helpful class does Angular use to create an instance of a component/service for you in integration tests?

TestBed

What method from TestBed do you use to create an instance of your component, usually in the beforeEach() block?

TestBed.createComponent(ComponentType)

End-to-end tests should only be written for what?

The key functions of the app

What is automated testing?

The practice of writing code to test our code, and then running those tests in an automated fashion.

True or False: The execution of one test should never impact the execution of another test.

True (Each test should run in an isolated world.)

What Jasmine method can be changed to essentially check for the opposite of all the standard methods like toBe(), toBeTruthy(), etc?

.not expect(whatever).not.toBe(0)

All test files should end with what?

.spec.ts (Karma looks for all files with this ending, and then runs the tests in those files)

What are three good practices when writing tests (and code in general)?

1) Small functions/methods - or tests (less than 10 lines) 2) Proper naming 3) Single responsibility (test only one thing)

What are two types of situations where it doesn't really make sense to use automated tests within your team?

1) Team doesn't have discipline in writing clean tests and maintaining them. (Too much time spent fixing broken tests that are hard to read/understand.) 2) Working on a very tight time-crunch (like at a startup where you have 3 months to turn a concept into real working software). The business/app might not even succeed!

In general, writing automated tests at an early-stage startup doesn't make nearly as much sense. Why? (Give 2 reasons.)

1) The business/app might not even succeed! And you have a very small amount of time to develop a beta product. 2) The needs of the business/app change too rapidly.

What are the two ways to disable a specific test, without just commenting it out?

1. Put an x before the it() block, making it xit() 2. Replace the it() with test.skip()

What are the two main limitations of unit tests (compared to integration tests)?

1. Router 2. Template bindings

What is a test suite?

A group of related tests

With Jasmine's spyOn() method, what are you spying on?

A method in a class

What is fixture.debugElement?

A wrapper around fixture.nativeElement that gives us useful methods for querying the DOM.

fixture.nativeElement returns what?

An HTML element, the root DOM element for the component's template.

In unit tests, you 'new up' a component in the beforeEach() block. In integration tests, you have to ask ______________ to create an ________________ of that component for you.

Angular instance (This is done with the TestBed class.)

Many unit tests typically follow the "AAA" structure, which stands for what?

Arrange (setting up or instantiating component) Act (calling method from that component) Assert (making sure method does what it's supposed to)

TestBed.createComponent() does NOT return an instance of that component. What does it return?

ComponentFixture<ComponentType> ComponentFixture is a generic class, and the generic argument is the ComponentType. The ComponentFixture is a "wrapper" around our component instance.

Give two benefits and one drawback of unit tests.

Easiest to write Super-fast Don't give us much confidence

True or False: Automated tests should be used by every product and every team.

False

True or False: In Angular, unit tests test both the component and its template binding.

False (Integration tests test both the component and its template. Unit tests are only for the component -- a Typescript class.)

True or False: You should spend most of your time writing end-to-end tests, since they give you the most confidence about your app as a whole.

False Spend most time writing unit/integration tests.

What is the testing framework we use with Angular?

Jasmine

What is the test runner with Angular?

Karma

Moving from unit tests to integration tests in Angular means going from looking at your component as a _____________ __________ to looking at it as an ____________ _____________. This means the tests now need to run in the __________________ ___________________.

Typescript class Angular component Angular environment

What are the three main types of tests?

Unit Integration End-to-end

What are Jasmine's three other functions similar to beforeEach()?

afterEach() beforeAll() -- executed once before all tests afterAll() -- executed once after all tests

What function from Jasmine can be used to reduce repeating yourself when setting up a test?

beforeEach()

Automated tests enforce you to write ___________ and ___________ _____________ code.

better more reliable

What two methods can be chained to... spyOn(service, 'methodName').and._________________ To give fake data that won't really call the service's method?

callFake() returnValue()

Integration tests test a _______________ with ____________ ______________.

component external resources (file system, template, database, API endpoints)

Unit tests test a _____________ in _____________, without ___________ _____________.

component isolation external resources (file system, template, database, API endpoints)

Integration tests = _____________ + _______________ Unit tests = _______________

component + template component

How can you get access to a particular form input (assuming it's built with FormBuilder) with the name 'email' inside a test?

component.form.get('email')

In a real-world app, you put ____________________ inside _______________. With integration tests, you do the same.

components modules (This is done with TestBed.configureTestingModule())

The main benefit of integration tests vs unit tests is increased __________________ about the functionality of a component.

confidence

Automated tests help you catch ___________ before releasing your software.

defects (or bugs)

Jasmine is a testing framework that provides a bunch of functions we can use to write tests. Two of the basic, most common ones are what?

describe() -- defines a test suite it() --

End-to-end tests test the ____________ __________________ as a whole.

entire application

Tests are _________-____________ citizens.

first-class

Getting ComponentFixture (by using TestBed.createComponent()) gives us access to both the component ________________ as well as its ___________________.

instance template

What two lines are needed to set the value of a form input inside a test (assuming it's built with FormBuilder)?

let control = component.form.get('email') control.setValue('[email protected]')

What Angular command is used to run tests?

ng test

Jasmine's beforeEach() function is for the _____________. The afterEach() function is for the _________________.

setup teardown (These terms are used in many testing frameworks besides Jasmine.)

Integration tests in Angular require much more __________ _________ than unit tests.

setup code

We use Jasmine's it() method to define a ________ (or a ________).

spec (or a test)

In Angular, the main difference between unit tests and integration tests is that integration tests test the component along with its ______________.

template

In Angular, unit tests would test a component in isolation without its ____________.

template

We use Jasmine's describe() method to define a _________ ____________.

test suite

What is one method (chained to expect()) that can be used with arrays and strings to make tests less fragile?

toContain() Instead of using toBe() and checking for something exact, just use toContain() so the test won't break if there's a minor change in the component's method.

In Angular, because things like services and router are still mocked out in integration tests, they can often be confused for _________ _________.

unit tests

What is the main benefit and two big drawbacks of end-to-end tests?

very high confidence (in the app as a whole) very slow very fragile (simple HTML changes can break e2e tests)

The ComponentFixture class is a __________________ around the component. With it you can get an __________________ of the component with fixture.__________________. You can also get that component's DOM element via either _________________ or ________________. You can also run ______________________ manually, or get one or more of the injected ___________________ of the component.

wrapper instance componentInstance nativeElement or debugElement() changeDetection .... dependencies