Implement data attribute and set Cypress tests

[ericbraz]

There are two reasons to use data attributes in an application. First, they can be used to track user behavior by monitoring their clicks using Google Tag Manager (GTM). Second, they can be used to perform end-to-end tests, and it is recommended to use data attributes to find the elements in the DOM.

To prepare for end-to-end tests, implement data attributes on all clickable elements that will be used in the test. There should be two data attributes: data-action and data-label. The data-action attribute should be used exclusively for GTM purposes, while the data-label attribute can be used in the Cypress tests as well.

Where should data attributes be implemented:

1. At the component menu at the bottom:
2. At the top menu that scrolls side ways;
3. At the items listed;
4. At the button that returns to the home screen;
5. At the buttons that decide the toppings;
6. At the buttons that set the quanity;
7. At the close button after you click more then the max amount of toppings:
8. At the buttons that increase or decrease the quantity;
9. At the X button that excludes that item option;
10. The button that exclude the entire order;
11. The "yes" and "no" buttons when you try to exlude all items;
12. The confirmation button;
13. The "Ok" button;

Finally set the Cypress test following the user journey as defined: