Adding data Test ID to components
This is a continuation of the work we have started here : !845 (merged).
The goal of this issue is to add data-test-ids attribute to components which helps integration tests.
Taking into account what wil help the QA team most. we need to be focus first on adding data-test-ids to buttons, checkboxes, Input text, Radios.
is better we add a default value that can be autogenerated from a string that all components have for the most cases, that could the name or id prop for example. In that way we dont have to touch all the places that a component is being called but just to the component itself as a default value, of course anywhere that a seperate data-test-ids prop is essential we can just added as a second way to add a data-test-ids different from the default value.
In order to autogenerate an automatic data-test-ids is we can use snakeCase of lodash function. which cleans the string from special characters and has a specific way of creating the string.