#Enzyme iconmenu material ui testing how to
#Enzyme iconmenu material ui testing code

#Enzyme iconmenu material ui testing code

DonвЂ™t duplicate componentвЂ™s code in tests you will never keep in mind to change it in tests. In order to test inline styles, you need to duplicate object with styles in your test if styles object changes, you must change it in the test too.

Inline styles (if you use them in component).

They are not changeable it is a set of static code that is not intended to vary. Skip it or imitate implementation if you need it to test your code. DonвЂ™t test functionality that is taken from another library you are not responsible for that code. LetвЂ™s define what should be omitted in test coverage: Of course, the structure of your project can differ it can have other directory names or can have additional components, actions, and reducers, but the logic of defining the order for testing the components is the same. Be consistent in your choices, donвЂ™t take the first component that comes into your mind, and switch on logic.

#Enzyme iconmenu material ui testing how to

DonвЂ™t take for testing, for example, вЂarrayвЂ™ field, if you are not sure how to test вЂtextвЂ™ field donвЂ™t take components decorated with redux-form if you havenвЂ™t tested вЂformвЂ™ field itself. The final components order (based on our example) will look like this:ДЇollowing this order, you increase the complexity of the tested components step by step thus, when it comes to operating with the more complex components, you already know how the smallest ones behave.

The last one is the fields folder it contains components connected with redux-forms.

Thus, component from hocdirectory was present in widgets component thatвЂ™s why I already know where and with which purpose this directory and its component are used. How do you define which one should be tested first? I take the directory from which components have already been used in tested components. They are hoc directory and fieldsfrom forms folder.

The most complex for testing components are left in the end.

It is modals directory in our case these components will be explained in detail below.

Further, analyze the rest of the directories and define more complex components, which can be used independently or in conjunction with other components.

They will be the third item in the queue for test coverage. From our structure, it is widget little components with simple functionality.

The next step is to define which components can be used independently too.

They are frequently reusable and help with repeated actions. Components in this folder are not complicated, but very important.

Next, I need to define auxiliary components that are often used in inputs components but should be tested apart from them.It contains input components to redux-forms, such as TextInput, SelectInput, CheckboxInput, DateInput, etc.

From the structure above, it is input directory in forms folder. Analyze each directory and define which components are independent - namely, their rendering doesnвЂ™t depend on the other components they are self-completed and can be used separately as a single unit. Always follow the rule from simple to complex.How to define the correct order of component testing in shared the directory: DonвЂ™t strive for the percentages, avoid writing fake tests, and just try not to lose main component details. As well, there is no guarantee it will notify you if something has been changed. Even more, 100% test coverage does not always ensure that the component is fully tested. We will find out why and what should be left out of tests. Why? Because you shouldnвЂ™t test all code. Information about installation and configuration can be easily found on the web or official websites.ДЄssume the following case: You need to cover the project codebase with tests, so what should you start with and what should you get at the end of testing? 100% test coverage? It is the indicator to which you should aspire, but in most situations, you wonвЂ™t get it. The article requires that the reader already has knowledge about Jest and Enzyme setup. Define what to test in the component and in which order.

Identify the necessity of Snapshot Testing.Find what to omit in test coverage (what not to test).Define the correct order of componentsвЂ™ testing based on project structure.During the reading, IвЂ™ll cover the next topics: