Component testing

Regardless of the complexity of your application, short independent component tests is a good place to start integrating DogQ into your processes.

What kind of component tests can I create with DogQ?

These are the common scenarios:

• clicking buttons, selecting dropdown options

• clicking links and other navigational UI elements

• interacting with input forms, checkboxes, etc

• testing input forms validation and security

• checking error handling and notifications

• validating the retrival and displaying of data

Why component tests?

Such tests check a single piece of functionality, hence they are normally more independent and can be bundled into regression testing suites for scheduling sessions, saving precious time for the team.

How to create automated component tests with DogQ?

Here's a simple formula:

1. explore the component correct behavior

2. create a test interacting with the component

3. verify the result matches the expected post-condition

Without verifiable results this won't even be a valid test to begin with, so let's take a closer look at some of the ways you can perform checks on different types of component behavior with Check URL, Find text, Find element and No element.

Common types of behavior to be tested:

• change of URL (navigational elements)

• element added/removed (e-carts)

• text appearing (notifications)

• element changing value (editing info)

How can I verify the URL change?

Check URL is the usual go-to when it comes to testing links and other navigational elements. Go though the test you're creating manually, interact with the navigational element you're testing, then simply copy the changed URL and paste it into the Check URL step in the test. It can also be a good idea to create a linking map of the web app you're testing.

Step 4 checks that the clicked link navigates to the correct URL

How can I check that an element exists in DOM?

If the element interaction you're testing leads to some element being added or removed from the page, you can use Find element and No element to verify the correct behavior. For more complex checks you can use XPath and CSS selectors.

Steps 2 and 5 verify that the component being tested actually creates a new project

How can I check that the text is visible?

Simply insert the text value you're looking for in Find text step. Keep in mind that this step will only pass if the text it's looking for is there to be seen. If, for example, you're checking a text value that is hidden in a collapsible module of a page, for DogQ to see it you must first add steps that will open that module and make the text visible.