diff --git a/src/pages/docs/elements/verify-elements.md b/src/pages/docs/elements/verify-elements.md new file mode 100644 index 00000000..2336471e --- /dev/null +++ b/src/pages/docs/elements/verify-elements.md @@ -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) + + +--- \ No newline at end of file diff --git a/src/pages/docs/test-cases/step-types/while-loop.md b/src/pages/docs/test-cases/step-types/while-loop.md index 190e5c88..510a828d 100644 --- a/src/pages/docs/test-cases/step-types/while-loop.md +++ b/src/pages/docs/test-cases/step-types/while-loop.md @@ -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) @@ -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) @@ -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. diff --git a/src/pages/docs/test-step-recorder/settings-include-exclude-attributes.md b/src/pages/docs/test-step-recorder/settings-include-exclude-attributes.md index 84ba4dcd..af3226b1 100644 --- a/src/pages/docs/test-step-recorder/settings-include-exclude-attributes.md +++ b/src/pages/docs/test-step-recorder/settings-include-exclude-attributes.md @@ -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. --- @@ -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) --- \ No newline at end of file