Updated Test Cases Content Section (#326)

src/pages/docs/elements/android-apps/capture-single-element.md

@@ -17,7 +17,12 @@ contextual_links:
 - type: link
   name: "How to create one element at a time using the Testsigma mobile inspector for an android project in Testsigma"
   url: "#how-to-create-one-element-at-a-time-using-the-testsigma-mobile-inspector-for-an-android-project-in-testsigma"
-
+- type: link
+  name: "Updating an Element"
+  url: "#updating-an-element"
+- type: link
+  name: "Reusing Elements Recorded"
+  url: "#reusing-elements-recorded"
 ---
 
 
@@ -61,3 +66,75 @@ In an Android project in Testsigma, you can selectively capture elements one at
 
 You can also [capture multiple elements at once via mobile test recorder](https://testsigma.com/docs/elements/android-apps/record-multiple-elements/).
 
+
+## **Updating an Element**
+
+ 1. Create a Test Case using Testsigma’s test Recorder in your Android Project. 
+ 2. On the Recorder UI, hover over the step that has the element you want to edit. The elements appear in green on the Testsigma test Recorder UI
+
+![Highlighted example elements in Testsigma Recorder](https://docs.testsigma.com/images/update-elements/highlighted-example-elements-android-testsigma-Recorder.png)
+
+
+ 3. Click on the ‘More Details’ button corresponding to the step that you want to edit. The button corresponding to the step is highlighted in the screenshot below:
+
+![more details button for a test step in an Android Project in Testsigma while using the Recorder](https://docs.testsigma.com/images/update-elements/more-details-button-for-a-test-step-android-testsigma-Recorder.png)
+
+ 4. Click on ‘More details’ button:
+
+![test step details for an Android test case on Testsigma Recorder UI](https://docs.testsigma.com/images/update-elements/test-step-details-testsigma-Recorder-android.png)
+
+ 5. Click on the edit button corresponding to the element on the Test Step Details:
+
+![edit element button on test step details section for testsigma Recorder for android](https://docs.testsigma.com/images/update-elements/edit-element-button-test-step-details-testsigma-Recorder-android.png)
+
+ 
+
+![edit element UI from test step details section on the Recorder UI for an android project in Testsigma](https://docs.testsigma.com/images/update-elements/edit-element-ui-from-test-step-details-Recorder-android-testsigma.png)
+
+ 
+
+Here are the fields that appear on the ‘Edit Element’ window:
+
+ * **Name**: Text input field, you can edit the name of the Element here
+ * **Screen Name**: This is an editable field, you can edit the screen name for the Element here.
+ * **Element Type**: This is a drop-down field that has values:
+   1. Xpath
+   2. ID
+   3. Name
+   4. Class Name
+   5. Accessibility ID
+
+You can select any of these options for element type.
+ * **Enter Value**: Here, the value should correspond to the element type selected. This is also an editable field.
+
+
+6. Click on the ‘Update’ button to finalize the changes.
+
+---
+
+
+## **Reusing Elements Recorded**
+
+ 1. Create a test case in which you will be reusing your pre-recorded elements.
+ 2. Start recording test steps for the test case.
+ 3. Manually add a test step where you want to reuse elements:
+
+
+![example of test steps that contain elements in an android project in Testsigma](https://docs.testsigma.com/images/reuse-elements/test-steps-that-contain-elements-testsigma-android.png)
+
+ 
+
+Alternatively, you can record a test step that uses an element. Given below is an example of test steps as they appear on Recorder UI. The text in green is an element.
+
+![example of recorded test steps that contain elements for an android project in Testsigma](https://docs.testsigma.com/images/reuse-elements/recorded-test-steps-that-contain-element-testsigma-android.png)
+
+ 4. Hover on the test step that you want to edit and click on the corresponding edit button. 
+ 5. Click on the green text that represents ‘element’. The ‘Elements’ section appears on the test Recorder UI, listing all pre-recorded elements in the project:
+
+![Elements screen to reuse elements in Testsigma Recorder for an android project](https://docs.testsigma.com/images/reuse-elements/Element-screen-reuse-elements-testsigma-Recorder-android.png)
+
+ 6. Start typing the name of the element that you want to reuse, the elements will be filtered by name. You can search the elements by name or by Screen name.
+ 7. From the filtered results, you can click on the element that you want to use, and the element text in your test step will be replaced by the chosen element.
+ 8. Click on ‘Update’ button corresponding to the test step on the Testsigma test Recorder UI to finalize the change.
+
+---

src/pages/docs/elements/ios-apps/capture-single-element.md

@@ -17,7 +17,12 @@ contextual_links:
 - type: link
   name: "How to create one element at a time by using the Testsigma mobile inspector for an iOS project in Testsigma"
   url: "#how-to-create-one-element-at-a-time-by-using-the-testsigma-mobile-inspector-for-an-ios-project-in-testsigma"
-
+- type: link
+  name: "Update an Element"
+  url: "#update-an-element"
+- type: link
+  name: "Reusing Elements"
+  url: "#reusing-elements"
 ---
 
 
@@ -54,4 +59,85 @@ In an iOS project in Testsigma, you can selectively capture elements one at a ti
 
 6. Once you enter the required details in the element form, click on the button ‘Save & Close’. The element will be saved in the project’s element list and the Test recorder will be closed. 
 
-You can also [capture multiple elements at once via Test recorder](https://testsigma.com/docs/elements/ios-apps/record-multiple-elements/).
+You can also [capture multiple elements at once via Test recorder](https://testsigma.com/docs/elements/ios-apps/record-multiple-elements/).
+
+
+---
+
+## **Update an Element**
+1. Create a Test Case using Test Recorder in your iOS Project. 
+
+2. On the Test Recorder UI, hover over the step that has the element you want to edit. The elements appear in green on the Testsigma Mobile Test Recorder UI:
+
+
+![Highlighted example elements in Testsigma Recorder for iOS](https://docs.testsigma.com/images/update-elements/highlighted-example-elements-ios-testsigma-mobile-inspector.png)
+
+3. Click on the ‘More Details’ button corresponding to the step that you want to edit. The button corresponding to the step is highlighted in the screenshot below:
+
+![more details button for a test step in an iOS Project in Testsigma while using the Recorder](https://docs.testsigma.com/images/update-elements/more-details-button-for-a-test-step-ios-testsigma-mobile-inspector.png)
+
+4. Click on ‘More details’ button:
+
+![test step details for an iOS test case on Testsigma Mobile Inspector UI](https://docs.testsigma.com/images/update-elements/test-step-details-testsigma-mobile-inspector-ios.png)
+
+5. Click on the edit button corresponding to the element on the Test Step Details:
+
+![edit element button on test step details section for Testsigma Recorder for iOS](https://docs.testsigma.com/images/update-elements/edit-element-button-test-step-details-testsigma-mobile-inspector-ios.png)
+
+
+![edit element UI from test step details section on the Recorder UI for an iOS project in Testsigma](https://docs.testsigma.com/images/update-elements/edit-element-ui-from-test-step-details-mobile-inspector-ios-testsigma.png)
+
+
+Here are the fields that appear on the ‘Edit Element’ window:
+
+ **1. Name:** Text input field, you can edit the name of the Element here.
+
+ **2. Screen Name:** This is an editable field, you can edit the screen name for the UI identifier here.
+
+ **3. Element Type:** This is a drop-down field that has values:
+
+  a. Xpath
+
+  b. ID
+
+  c. Name
+
+  Class Name
+
+  sAccessibility ID
+
+ You can select any of these options for an identifier type.
+
+ **4. Enter Value:** Here, the value should correspond to the identifier type selected. This is also an editable field.
+
+6. Click on the ‘Update’ button to finalize the changes.
+
+---
+
+## **Reusing Elements**
+
+1. Create a test case in which you will be reusing your pre-recorded elements.
+
+2. Start recording test steps for the test case.
+
+3. Manually add a test step where you want to reuse elements:
+
+![example of test steps that contain elements in an iOS project in Testsigma](https://docs.testsigma.com/images/reuse-elements/test-steps-that-contain-elements-testsigma-ios.png)
+
+Alternatively, you can record a test step that uses an element. Given below is an example of test steps as they appear on the Recorder UI. The text in green is an element.
+
+![example of recorded test steps that contain elements for an ios project in Testsigma](https://docs.testsigma.com/images/reuse-elements/recorded-test-steps-that-contain-element-testsigma-ios.png)
+
+4. Hover on the test step that you want to edit and click on the corresponding edit button. 
+
+5. Click on the green text that represents ‘element’. The ‘Elements’ section appears on the Test Recorder UI, listing all pre-recorded elements in the project:
+
+![elements screen to reuse elements in Testsigma recorder for an ios project](https://docs.testsigma.com/images/reuse-elements/elements-screen-reuse-elements-testsigma-recorder-ios.png)
+
+6. Start typing the name of the element that you want to reuse, the elements will be filtered by name. You can search the elements by name or by Screen name.
+
+7. From the filtered results, you can click on the element that you want to use, and the element text in your test step will be replaced by the chosen element.
+
+8. Click on the ‘Update’ button corresponding to the test step on the Test Recorder UI to finalize the change.
+
+---

src/pages/docs/elements/overview.md

@@ -28,8 +28,8 @@ contextual_links:
   name: "View Saved Element Filters"
   url: "#view-saved-element-filters"
 - type: link
-  name: "Update Saved Element Filter"
-  url: "#update-saved-element-filter"
+  name: "Reusing Saved Elements"
+  url: "#reusing-saved-elements"
 ---
 
 ---
@@ -95,3 +95,8 @@ You can use user-defined custom fields and the default fields to filter elements
 
 ---
 
+## **Reusing Saved Elements**
+
+Once you create and add elements to a test case, they are saved in the corresponding project in Testsigma. You can reuse these elements in new test steps in the same project. 
+
+---

src/pages/docs/elements/web-apps/capture-single-element.md

@@ -20,6 +20,12 @@ contextual_links:
 - type: link
   name: "Steps to Create an Element From the Test Case Result Page"
   url: "#steps-to-create-an-element-from-the-test-case-result-page"
+- type: link
+  name: "Updating elements via Test recorder"
+  url: "#updating-elements-via-test-recorder"
+- type: link
+  name: "Reusing elements recorded"
+  url: "#reusing-elements-recorded"
 ---
 
 ---
@@ -102,5 +108,60 @@ Here’s a quick GIF demonstrating how to create an element from the Elements pa
 
 ---
 
+## **Updating elements via Test recorder**
+
+ 1. Create a Test Case using the Test recorder. 
+ 2. Click on the element/Elements that you want to edit. The Elements appear in green on the Test recorder UI. 
+
+![Highlighted example Elements in Test recorder](https://docs.testsigma.com/images/update-elements/highlighted-example-Elements-testsigma-recorder.png)
+
+ 3. Click ‘edit Elements’ from the three dots on the far right
+
+![Multiple options on the edit Elements screen window in Test recorder](https://docs.testsigma.com/images/update-elements/edit-Element-screen-multiple-options-testsigma-recorder.png)
+
+These are the fields that will appear:
+
+ * **Name**
+ * **Screen Name**
+ * **Identifier Type**: This is a drop-down field that has values:
+   1. Xpath
+   2. CSS Selector
+   3. ID
+   4. Name
+   5. Link Text
+   6. Partial Link Text
+   7. Class Name
+   8. Tag Name
+
+You can select any of these options for identifier type.
+ * **Enter Value**: Here, the value should correspond to the identifier type selected.
+ * **View details**: Once you click on this, you will be able to see more details about the Elements.
+
+Click ‘Update’ button to finalize the changes.
+
+
+---
+
+## **Reusing Elements Recorded**
+
+ 1. Create a new test case in the same Project.
+ 2. Start recording the test steps.
+ 3. Add a test step as follows:
+
+
+![example of test steps that contain Element in Testsigma](https://docs.testsigma.com/images/reuse-elements/test-steps-that-contain-Element-testsigma.png)
+
+You can also record a test step that uses an Element.
+
+![example of recorded test steps that contain Elements in Testsigma](https://docs.testsigma.com/images/reuse-elements/recorded-test-steps-that-contain-Element-testsigma.png)
+
+ 4. Hover on the test step that you want to edit and click on the corresponding edit button. 
+ 5. Click on the green text that says ‘Element’. The ‘Elements’ page appears on the Test recorder UI. This will have all the Elements in the project:
+
+![Elements screen to reuse elements in Testsigma recorder](https://docs.testsigma.com/images/reuse-elements/Elements-screen-reuse-elements-testsigma-recorder.png)
 
+ 6. Start typing the name of the Element that you want to use. The Elements can be filtered by name. You can also search the identifiers by name or by Screen name.
+ 7. From the filtered results, you can click on the Element that you want to use, and the Element text in your test step will be replaced by the chosen Element.
+ 8. Click on ‘Update’ button corresponding to the test step on the Test recorder UI to finalize the change.
 
+---