Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Created a document for Verifying Elements #430

Merged
merged 2 commits into from
Jun 10, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
91 changes: 91 additions & 0 deletions src/pages/docs/elements/verify-elements.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
---
title: "Verify Elements from Test Recorder"
metadesc: "You can verify elements during recording to quickly resolve issues in execution. This article discusses verifying elements from the Test Recorder in Testsigma"
noindex: false
order: 6.93
page_id: "Verify Elements"
warning: false
contextual_links:
- type: section
name: "Contents"
- type: link
name: "Prerequisites"
url: "#prerequisites"
- type: link
name: "Steps to Verify Elements from Test Steps"
url: "#steps-to-verify-elements-from-test-steps"
- type: link
name: "Steps to Verify Elements from Elements"
url: "#steps-to-verify-elements-from-elements"
---

---


There is no need for additional effort to verify elements manually!

When using the Test Recorder to create test steps and elements, you might encounter issues where the Test Recorder captures incorrect locators for UI elements. These elements can impact test executions. You can verify elements during recording to quickly resolve this issue. This article discusses how to verify elements from the Test Recorder in Testsigma.


---

## **Prerequisites**

- You should know how to create a [project](https://testsigma.com/docs/projects/overview/) in Testsigma.

- An application to test.

---

## **Steps to Verify Elements from Test Steps**

1. From the left navigation bar, go to **Create Tests > Test Cases**.

2. Create a test case by selecting Create Test Case in the top right corner, or open an existing test case.

3. On the **Test Case Details** page, click **Record** in the top right corner.

4. A new window with the given URL will open, allowing you to record the test steps.

5. Go to the test step and hover over the element which you want to verify.

6. Click on element and choose **Edit Element** from the drop down menu. This will open the **Update Element** screen on Recorder.

7. Click on **Verify** to validate the element location. The element will be highlighted on the web page.

8. If the element location is incorrect, a message will display indicating that the element doesn't exist.

9. Correct the element location and continue verifying until the recorder highlights the correct element on the web page.

Here’s a quick GIF demonstrating steps to verify elements from test steps.

![Verify Elements from Test Steps](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/HighlightElement.gif)

---

## **Steps to Verify Elements from Elements**

1. From the left navigation bar, go to **Create Tests > Elements**.

2. Create an element by clicking on **Create Element** in the top right corner.

3. A new window with the given URL will open, allowing you to record the element.

4. Click on the element you want to record and verify.

5. Click on **Verify** to validate the element location. The element will be highlighted on the web page.

6. If the element location is incorrect, a message will display indicating that the element doesn't exist.

7. Correct the element location and continue verifying until the recorder highlights the correct element on the web page.

[[info | **NOTE**:]]
| You can also verify while updating the element details. Open the existing element and click on **Edit** on the **Update Element** overlay and follow the same steps as above.


Here’s a quick GIF demonstrating steps to verify elements from test steps.

![Verify Elements from Elements](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/ElementHighlisht-EC.gif)


---
7 changes: 5 additions & 2 deletions src/pages/docs/test-cases/step-types/while-loop.md
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,7 @@ Here's a quick GIF demonstrating using While Loop in Test Cases.
![While Loop GIF](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/wlsteptype.gif)

---

## **Adding While Loop in Test Cases Using Recorder [Web & Mobile web]**
1. Navigate to **Create Tests > Test Cases**, and click on **Create Test Case**.
![Test Cases](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/navtcwl.png)
Expand All @@ -92,12 +93,14 @@ Here's a quick GIF demonstrating using While Loop in Test Cases.
7. Click on **Done**.
![Done](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/donewlr.png)

*For more information on creating steps using recorder, refer to [recording test steps](https://testsigma.com/docs/test-cases/create-steps-recorder/web-apps/overview/).*
*For more information on creating steps using recorder, refer to [recording test steps](https://testsigma.com/docs/test-cases/create-test-steps/overview/#creating-test-steps-using-test-recorder).*



---

## **Adding While Loop in Test Cases Using Recorder [Android & iOS]**

1. Navigate to **Create Tests > Test Cases**, and click on **Create Test Case**.
![Test Cases](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/wlmapptc.png)

Expand All @@ -115,7 +118,7 @@ Here's a quick GIF demonstrating using While Loop in Test Cases.
6. Record all the steps and click on **Stop Recording** to quit the session.
![Stop Recording](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/aswlsr.png)

7.You’ll be redirected to the test case creation page where you can see the recorded steps.
7. You’ll be redirected to the test case creation page where you can see the recorded steps.
![Test Case Details](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/redirectwltcpage.png)

Here's a quick GIF demonstrating adding While Loop in test cases using the recorder.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,19 +20,13 @@ contextual_links:

Sometimes, while capturing elements from your website, you would want to exclude certain attributes/classes. The reason could be that they could be changed soon, whereas you want your elements to be stable and accurate. In this document, we will discuss how to exclude certain attributes/classes while recording test steps via the Testsigma test recorder.

 

---

## **Prerequisites**

You should already have and know:

1. [installed Testsigma test recorder for google chrome](https://testsigma.com/docs/test-step-recorder/install-chrome-extension/).

2. [how to create a test case via the Testsigma test recorder](https://testsigma.com/docs/test-cases/create-test-steps/overview/#creating-test-steps-using-test-recorder).
1. You should have Chrome Extension Installed.

 
2. You should know how to create test steps using recorder.

---

Expand All @@ -42,14 +36,14 @@ You should already have and know:

2. On the Testsigma test step recorder, hover over the settings button on the top right, also highlighted in the screenshot below:

![settings button highlighted for excluding attributes and classes in Testsigma recorder](https://docs.testsigma.com/images/settings-include-exclude-attributes/settings-button-highlighted-exclude-attributes-classes-testsigma-recorder.png)
![Settings button highlighted for excluding attributes and classes in Testsigma recorder](https://docs.testsigma.com/images/settings-include-exclude-attributes/settings-button-highlighted-exclude-attributes-classes-testsigma-recorder.png)

3. On hover, menu options would appear (as also shown in the screenshot below) - click on the option ‘Excluded Attributes’.

![excluded attributes menu in Testsigma recorder](https://docs.testsigma.com/images/settings-include-exclude-attributes/excluded-attributes-menu-testsigma-recorder.png)
![Excluded attributes menu in Testsigma recorder](https://docs.testsigma.com/images/settings-include-exclude-attributes/excluded-attributes-menu-testsigma-recorder.png)

4. On the excluded attributes and classes UI that appears, you can add the attributes and classes that you want to be excluded while test step recording:

![excluded attributes UI in testsigma recorder UI](https://docs.testsigma.com/images/settings-include-exclude-attributes/excluded-attributes-ui-testsigma-recorder-ui.png)
![Excluded attributes UI in testsigma recorder UI](https://docs.testsigma.com/images/settings-include-exclude-attributes/excluded-attributes-ui-testsigma-recorder-ui.png)

---
Loading