In this lecture, we are going to write a test for testing the opposite behavior of our previous test.
Previously, we tested the default behavior of a component by checking the components templates in your
editor, open the tab test file.
The last test checked for the hidden class on the div elements.
If this class was present on the element, the tab was hidden from the page.
Let's try toggling the appearance of the tab by changing the active property to true.
After doing so, we can create a test assertion.
The test is going to be similar to our last test.
In fact, we can make a copy of this test to speed up the process.
Let's copy and paste the last test.
Next changed the description to the following should not have hidden class.
At the top of the test.
Let's change the component active property to true.
As a reminder, the component variable holds the instance of the component.
We have access to the methods and properties of the components class.
We can freely modify the properties.
In this example, we are changing the active property to display the tab after updating this property
called the fixture dot detect changes function.
Change detection does not run after updating a property.
Attempting to test our component without running change detection will bring back mixed results for
the most accurate results.
I always recommend running change detection after updating a component's properties.
The last step is to update our test assertion.
The queries we've written will not be able to find an element with the hidden class.
The variables will store a null value.
Therefore our test will fail.
We have different ways to assert a test.
The first solution is to change the function from to be true.
Two to be false.
See.
The to be false.
You function will check for a false value.
This solution works, but I want to present another option.
Not all matches will have a function for checking the opposite value.
Luckily, Jasmine has a solution for inverting matches.
Lets revert the function.
Let's say the to be false.
If function didn't exist.
In this case we can chain an object called not before the function.
The not object is available for all matters.
By chaining this object, the matcher becomes inverted.
The opposite behavior will be tested.
In this example, we are checking for a non true value.
Let's check out the browser.
Great.
Our tests are passing with flying colors.
In the next lecture, let's continue exploring component tests.