From 08f7e36a9a1b11533295cdff59d13c5fe9325180 Mon Sep 17 00:00:00 2001 From: Bharath Krishna <118433150+bharathk08@users.noreply.github.com> Date: Fri, 16 Jun 2023 06:53:52 +0530 Subject: [PATCH 1/3] Created 3 new docs for MWA (#240) Created 3 new documents for Mobile Web Applications and updated meta descriptions for all docs under Elements as per the ticket https://testsigma.atlassian.net/browse/DOC-99. Please review. --- .../android-apps/capture-single-element.md | 12 +--- .../elements/android-apps/create-manually.md | 2 +- .../creating-locators-manually-strategies.md | 2 +- .../docs/elements/android-apps/overview.md | 8 +-- .../android-apps/record-multiple-elements.md | 14 ++--- .../android-apps/supported-locator-types.md | 2 +- .../desktop-windows/record-elements.md | 2 +- .../dynamic-elements/with-environment-data.md | 2 +- .../with-parameter-test-data.md | 2 +- .../with-runtime-test-data.md | 8 +-- .../flutter-apps/element-identification.md | 2 +- src/pages/docs/elements/import-export.md | 8 +-- .../ios-apps/capture-single-element.md | 12 +--- .../docs/elements/ios-apps/create-manually.md | 2 +- .../creating-locators-manually-strategies.md | 4 +- src/pages/docs/elements/ios-apps/overview.md | 4 +- .../ios-apps/record-multiple-elements.md | 14 ++--- .../ios-apps/supported-locator-types.md | 2 +- .../mobile-web-application/create-manually.md | 43 ++++++++++++++ .../mobile-web-application/record-elements.md | 57 +++++++++++++++++++ src/pages/docs/elements/overview.md | 26 +++++---- .../web-apps/capture-single-element.md | 2 +- .../docs/elements/web-apps/create-manually.md | 2 +- .../creating-locators-manually-strategies.md | 4 +- src/pages/docs/elements/web-apps/overview.md | 10 ++-- .../web-apps/record-multiple-elements.md | 14 ++--- .../docs/elements/web-apps/shadow-dom.md | 2 +- .../web-apps/supported-locator-types.md | 20 +++---- .../docs/elements/web-apps/verify-elements.md | 2 +- .../add-test-cases-for-mobile-web-app.md | 53 +++++++++++++++++ 30 files changed, 234 insertions(+), 103 deletions(-) create mode 100644 src/pages/docs/elements/mobile-web-application/create-manually.md create mode 100644 src/pages/docs/elements/mobile-web-application/record-elements.md create mode 100644 src/pages/docs/test-cases/manage/add-test-cases-for-mobile-web-app.md diff --git a/src/pages/docs/elements/android-apps/capture-single-element.md b/src/pages/docs/elements/android-apps/capture-single-element.md index b1c25fb4..5f75d51a 100644 --- a/src/pages/docs/elements/android-apps/capture-single-element.md +++ b/src/pages/docs/elements/android-apps/capture-single-element.md @@ -1,6 +1,6 @@ --- title: "Create One Element at a Time (Using Mobile Inspector) for an Android Project" -metadesc: " How to create one element at a time using the Testsigma mobile inspector for an android project in Testsigma." +metadesc: "Learn how to create one element at a time using the Testsigma mobile inspector for an android project in Testsigma application." noindex: false order: 6.33 page_id: "Create One Element at a Time (Using Mobile Inspector) for an Android Project" @@ -28,20 +28,14 @@ In an Android project in Testsigma, you can selectively capture elements one at
--- -##**Pre-requisites** +## **Pre-requisites** 1. You should have an android project in Testsigma. See [creating a project](https://testsigma.com/docs/projects/overview/). 2. Your android applications’ apk should be uploaded in Testsigma so that the mobile test recorder can record elements from it. See [uploading apps to Testsigma](https://testsigma.com/docs/uploads/upload-apps/).
-**Navigation** - -**Test development > Elements** - -
- --- -##**How to create one element at a time using the Testsigma mobile test recorder for an android project in Testsigma** +## **How to create one element at a time using the Testsigma mobile test recorder for an android project in Testsigma** 1. On the ‘All Elements’ page, click on the ‘Create’ button on the top right corner of the page: diff --git a/src/pages/docs/elements/android-apps/create-manually.md b/src/pages/docs/elements/android-apps/create-manually.md index bf433d43..7f17301b 100644 --- a/src/pages/docs/elements/android-apps/create-manually.md +++ b/src/pages/docs/elements/android-apps/create-manually.md @@ -1,6 +1,6 @@ --- title: "Create Elements [Manually]" -metadesc: "How to create elements manually for an android project in Testsigma." +metadesc: "Element path plays an important role in dynamic websites. Learn how to create elements manually for a android apps in Testsigma." noindex: false order: 6.34 page_id: "Create Elements [Manually]" diff --git a/src/pages/docs/elements/android-apps/creating-locators-manually-strategies.md b/src/pages/docs/elements/android-apps/creating-locators-manually-strategies.md index 89114a45..fd59931f 100644 --- a/src/pages/docs/elements/android-apps/creating-locators-manually-strategies.md +++ b/src/pages/docs/elements/android-apps/creating-locators-manually-strategies.md @@ -1,6 +1,6 @@ --- title: "Different ways to create Elements in an Android Project" -metadesc: "Various ways to create elements for an android project in Testsigma." +metadesc: "Elements refer to the different objects in your android application. Learn about various ways to create elements for an android project in Testsigma." noindex: false order: 6.36 page_id: "Different ways to create Elements in an Android Project" diff --git a/src/pages/docs/elements/android-apps/overview.md b/src/pages/docs/elements/android-apps/overview.md index 8e3ef40a..a89e8c7f 100644 --- a/src/pages/docs/elements/android-apps/overview.md +++ b/src/pages/docs/elements/android-apps/overview.md @@ -1,6 +1,6 @@ --- title: "Overview of Elements for an Android Project" -metadesc: "What are elements in an Android project in Testsigma." +metadesc: "What are elements in an Android project in Testsigma. Also learn how these elements can be captured in 2 different ways in Testsigma" noindex: false order: 6.31 page_id: "Overview of Elements for an Android Project" @@ -8,12 +8,12 @@ warning: false --- --- -n element in an Android project in Testsigma refers to an object that forms a part of the UI of the application and can be located or identified. Testsigma stores all elements corresponding to a project at one place under **‘Test Development > Elements’**. +Element in an Android project in Testsigma refers to an object that forms a part of the UI of the application and can be located or identified. These elements can be captured in 2 different ways in Testsigma: -1. Manual creation: Here, you manually give the details of the element to create them. See [creating elements manually](https://testsigma.com/docs/elements/android-apps/create-manually/). -2. Via mobile test recorder: Here, you access your application’s UI via the mobile test recorder and inspect the elements that you want to capture. See [capturing elements using Mobile test recorder](https://testsigma.com/docs/elements/android-apps/capture-single-element/). +1. **Manual creation:** Here, you manually give the details of the element to create them. See [creating elements manually](https://testsigma.com/docs/elements/android-apps/create-manually/). +2. **Via mobile test recorder:** Here, you access your application’s UI via the mobile test recorder and inspect the elements that you want to capture. See [capturing elements using Mobile test recorder](https://testsigma.com/docs/elements/android-apps/capture-single-element/). Testsigma supports 5 locator types to identify these elements for your automated tests: diff --git a/src/pages/docs/elements/android-apps/record-multiple-elements.md b/src/pages/docs/elements/android-apps/record-multiple-elements.md index 791ab762..f3cb1453 100644 --- a/src/pages/docs/elements/android-apps/record-multiple-elements.md +++ b/src/pages/docs/elements/android-apps/record-multiple-elements.md @@ -1,6 +1,6 @@ --- title: "Record Multiple Elements for an Android Application" -metadesc: "How to record multiple elements for an android project in Testsigma." +metadesc: "Elements path play an important role in Automation Testsing. Learn how to record multiple elements for a Mobile Web Application project in Testsigma." noindex: false order: 6.32 page_id: "Record Multiple Elements for an Android Application" @@ -23,26 +23,20 @@ contextual_links: --- --- -##**Introduction** +## **Introduction** When automating test cases for an android application, you can capture multiple elements from the application in one go. This article covers how to do that.
--- -##**Pre-requisites** +## **Pre-requisites** 1. You should have an android project in Testsigma. See [creating a project](https://testsigma.com/docs/projects/overview/). 2. Your android applications’ apk should be uploaded in Testsigma so that the mobile test recorder can record elements from it. See [uploading apps to Testsigma](https://testsigma.com/docs/uploads/upload-apps/).
-**Navigation** - -**Test Development > Elements** - -
- --- -##**How to record multiple elements for an android project in Testsigma** +## **How to record multiple elements for an android project in Testsigma** 1. On the ‘All Elements’ page, click on the ‘Record’ button on the top right corner of the page: ![record-button-under-record-multiple-elements-for-an-android-project-in-Testsigma](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/elements/android-apps/record-multiple-elements/record-button-under-record-multiple-elements-for-an-android-project-in-Testsigma.png) diff --git a/src/pages/docs/elements/android-apps/supported-locator-types.md b/src/pages/docs/elements/android-apps/supported-locator-types.md index 0c20c92f..1a7ddb6c 100644 --- a/src/pages/docs/elements/android-apps/supported-locator-types.md +++ b/src/pages/docs/elements/android-apps/supported-locator-types.md @@ -1,6 +1,6 @@ --- title: "Supported Locator Types in an Android Project" -metadesc: "Supported locator types for creating elements for an android application in Testsigma." +metadesc: "Supported locator types for creating elements for an android application in Testsigma. Learn five ways to uniquely identify or locate elements in your automated tests." noindex: false order: 6.35 page_id: "Supported Locator Types in an Android Project" diff --git a/src/pages/docs/elements/desktop-windows/record-elements.md b/src/pages/docs/elements/desktop-windows/record-elements.md index 1899213b..d79c3a12 100644 --- a/src/pages/docs/elements/desktop-windows/record-elements.md +++ b/src/pages/docs/elements/desktop-windows/record-elements.md @@ -1,6 +1,6 @@ --- title: "Recording elements" -metadesc: "How to record one element at a time by using the Testsigma mobile inspector for an dekstop application project in Testsigma." +metadesc: "Learn how to record one element at a time by using the Testsigma mobile inspector for a dekstop application project in Testsigma application." noindex: false order: 6.51 page_id: "Create One Element at a Time (Using Mobile Inspector) for an desktop windows project" diff --git a/src/pages/docs/elements/dynamic-elements/with-environment-data.md b/src/pages/docs/elements/dynamic-elements/with-environment-data.md index 1d3bf975..75b833b4 100644 --- a/src/pages/docs/elements/dynamic-elements/with-environment-data.md +++ b/src/pages/docs/elements/dynamic-elements/with-environment-data.md @@ -1,6 +1,6 @@ --- title: "Using Environment Test Data for Dynamic locators" -metadesc: "How to use Environment parameters for creating dynamic locator values in Elements." +metadesc: "Leanr how to use Environment parameters for creating dynamic locator values in Elements. Automate the testing of dynamic elements in Testsigma application." noindex: false order: 6.63 page_id: "Using Environment Test Data for Dynamic locators" diff --git a/src/pages/docs/elements/dynamic-elements/with-parameter-test-data.md b/src/pages/docs/elements/dynamic-elements/with-parameter-test-data.md index c6f75b5a..7b16205b 100644 --- a/src/pages/docs/elements/dynamic-elements/with-parameter-test-data.md +++ b/src/pages/docs/elements/dynamic-elements/with-parameter-test-data.md @@ -1,6 +1,6 @@ --- title: "Using Parameter Test Data for Dynamic locators" -metadesc: "Elaborates on the usage of Parameter Test Data for creating dynamic locators for use in Data-driven Testing." +metadesc: "This article discusses the usage of Parameter Test Data for creating dynamic locators to use in Data-driven Testing | Learn about Parameter Test Data" noindex: false order: 6.61 page_id: "Using Parameter Test Data for Dynamic locators" diff --git a/src/pages/docs/elements/dynamic-elements/with-runtime-test-data.md b/src/pages/docs/elements/dynamic-elements/with-runtime-test-data.md index eebcea5f..6dc10a0b 100644 --- a/src/pages/docs/elements/dynamic-elements/with-runtime-test-data.md +++ b/src/pages/docs/elements/dynamic-elements/with-runtime-test-data.md @@ -1,6 +1,6 @@ --- title: "Using Runtime Test Data for Dynamic locators" -metadesc: "Elaborates on the usage of Runtime Test Data for creating dynamic locators" +metadesc: "This article discusses the usage of Runtime Test Data for creating dynamic locators | Learn about Runtime Test Data in Testsigma application" order: 6.62 page_id: "Using Runtime Test Data for Dynamic locators" warning: false @@ -27,7 +27,7 @@ You should be familiar with [Runtime Test Data](https://testsigma.com/docs/test-
--- -##**Case Study - OrangeHRM** +## **Case Study - OrangeHRM** Here, we will be using a popular application such as OrangeHRM for our demonstration. We will be doing the following steps on the OrangeHRM website: 1. **Navigate to the OrangeHRM website**
@@ -40,7 +40,7 @@ Here, we will be using a popular application such as OrangeHRM for our demonstra
--- -##**Actual Steps - Implementation** +## **Actual Steps - Implementation** 1. **Navigate to https://opensource-demo.orangehrmlive.com**
This step is self-explanatory. Navigate to the OrangeHRM website using grammar Navigate to test data. @@ -68,7 +68,7 @@ Verify that an element(welcome_ username_ link) with dynamic XPath containing th
--- -##**Creating Dynamic Elements using run-time test data** +## **Creating Dynamic Elements using run-time test data** In step #6, we are verifying that the page displays an Element 'welcome_ username_ link' containing text 'Welcome Admin'. Here, 'Admin' is the username that we got from the 'Username' field in step #4. The username of the currently logged-in user can be dynamic and so we need to create a dynamic XPath containing the current Username. diff --git a/src/pages/docs/elements/flutter-apps/element-identification.md b/src/pages/docs/elements/flutter-apps/element-identification.md index c6bc9f4f..ab5c336f 100644 --- a/src/pages/docs/elements/flutter-apps/element-identification.md +++ b/src/pages/docs/elements/flutter-apps/element-identification.md @@ -1,6 +1,6 @@ --- title: "Element identification" -metadesc: "How to identify element in flutter applications" +metadesc: "Testsigma supports automating mobile apps built using Flutter SDK, if app enables element identification. Learn how to identify element in flutter applications" noindex: false order: 6.7 page_id: "Element identification" diff --git a/src/pages/docs/elements/import-export.md b/src/pages/docs/elements/import-export.md index d8403a1a..2b932bbc 100644 --- a/src/pages/docs/elements/import-export.md +++ b/src/pages/docs/elements/import-export.md @@ -1,6 +1,6 @@ --- title: "Import and Export Elements" -metadesc: "How to import and export Elements to the Elements list" +metadesc: "How to import and export Elements to the Elements list | Import functionality helps to copy Elements between Application Versions within Testsigma app." noindex: false order: 6.8 page_id: "Import and Export Elements" @@ -35,7 +35,7 @@ Another less common application is when we want to load the Test locators for th
--- -##**Import File Format** +## **Import File Format** The Import file has the following Columns: | **Column Name** | **Description** | @@ -53,7 +53,7 @@ The Import file has the following Columns:
--- -##**Import Elements** +## **Import Elements** From the Elements page, click on the Import button to open the Import Element Dialog which appears as shown below: ![Import Elements overlay in Elements page](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/elements/import-export/elements-page-import-elements-overlay.png) @@ -77,7 +77,7 @@ It will show a success message saying that the import has started. The Elements
--- -##**Export Elements** +## **Export Elements** From the Elements page, click on the Export button to export all the Elements to a Spreadsheet file. It will show a success message saying that the export has started. The Elements will be exported in the background and you will receive an Email once the Export process is complete. diff --git a/src/pages/docs/elements/ios-apps/capture-single-element.md b/src/pages/docs/elements/ios-apps/capture-single-element.md index f5d5168d..b4992937 100644 --- a/src/pages/docs/elements/ios-apps/capture-single-element.md +++ b/src/pages/docs/elements/ios-apps/capture-single-element.md @@ -1,6 +1,6 @@ --- title: "Create One Element at a Time (Using Mobile Inspector) for an iOS Project" -metadesc: "How to create one element at a time by using the Testsigma mobile inspector for an iOS project in Testsigma." +metadesc: "Learn how to selectively capture elements one at a time by using the Testsigma mobile inspector for an iOS project in Testsigma application." noindex: false order: 6.43 page_id: "Create One Element at a Time (Using Mobile Inspector) for an iOS Project" @@ -27,20 +27,14 @@ In an iOS project in Testsigma, you can selectively capture elements one at a ti
--- -##**Pre-requisites** +## **Pre-requisites** 1. You should have an iOS project in Testsigma. See [creating a project](https://testsigma.com/docs/projects/overview/). 2. Your iOS applications’ apk should be uploaded in Testsigma so that the Test recorder can record elements from it. See [uploading apps to Testsigma](https://testsigma.com/docs/uploads/upload-apps/).
-**Navigation** - -**Test development > Elements** - -
- --- -##**How to create one element at a time by using the Test recorder for an iOS project in Testsigma** +## **How to create one element at a time by using the Test recorder for an iOS project in Testsigma** 1. On the ‘All Elements’ page, click on the ‘Create’ button on the top right corner of the page: ![create button on elements page under create one element at a time for an iOS project in Testsigma](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/elements/ios-apps/capture-single-element/create-button-create-one-element-ios-testsigma.png) diff --git a/src/pages/docs/elements/ios-apps/create-manually.md b/src/pages/docs/elements/ios-apps/create-manually.md index 9d931958..63506b81 100644 --- a/src/pages/docs/elements/ios-apps/create-manually.md +++ b/src/pages/docs/elements/ios-apps/create-manually.md @@ -1,6 +1,6 @@ --- title: "Create Elements [Manually]" -metadesc: "How to create elements manually for an iOS project in Testsigma." +metadesc: "Element path plays an important role in dynamic websites. Learn how to create elements manually for a iOS Applications in Testsigma." noindex: false order: 6.44 page_id: "Create Elements [Manually]" diff --git a/src/pages/docs/elements/ios-apps/creating-locators-manually-strategies.md b/src/pages/docs/elements/ios-apps/creating-locators-manually-strategies.md index ac661f10..d9d9c32c 100644 --- a/src/pages/docs/elements/ios-apps/creating-locators-manually-strategies.md +++ b/src/pages/docs/elements/ios-apps/creating-locators-manually-strategies.md @@ -1,9 +1,9 @@ --- title: " Different ways to create Elements in an iOS Project" -metadesc: "The meta description should provide an accurate description of the content of the page." +metadesc: "Elements refer to the different objects in your iOS application. Leaen two ways to create/locate Elements in Testsigma Application." noindex: false order: 6.46 -page_id: " Different ways to create Elements in an iOS Project" +page_id: "Different ways to create Elements in an iOS Project" warning: false --- diff --git a/src/pages/docs/elements/ios-apps/overview.md b/src/pages/docs/elements/ios-apps/overview.md index 93a754ca..ad8da9e2 100644 --- a/src/pages/docs/elements/ios-apps/overview.md +++ b/src/pages/docs/elements/ios-apps/overview.md @@ -1,6 +1,6 @@ --- title: "Overview of Elements for an iOS Project" -metadesc: "What are elements in an iOS project in Testsigma." +metadesc: "What are elements in an iOS project in Testsigma | Learn different ways to create elements of iOS application in Testsigma application." noindex: false order: 6.41 page_id: "Overview of Elements for an iOS Project" @@ -8,7 +8,7 @@ warning: false --- --- -An element in an iOS project in Testsigma refers to an object that forms a part of the UI of the application and can be located or identified. Testsigma stores all elements corresponding to a project at one place under ‘Test Development > Elements’. +An element in an iOS project in Testsigma refers to an object that forms a part of the UI of the application and can be located or identified. These elements can be captured in 2 different ways in Testsigma: diff --git a/src/pages/docs/elements/ios-apps/record-multiple-elements.md b/src/pages/docs/elements/ios-apps/record-multiple-elements.md index 1de164af..222ed398 100644 --- a/src/pages/docs/elements/ios-apps/record-multiple-elements.md +++ b/src/pages/docs/elements/ios-apps/record-multiple-elements.md @@ -1,6 +1,6 @@ --- title: "Record Multiple Elements for an iOS Application" -metadesc: "How to record multiple elements for an iOS project in Testsigma." +metadesc: "Elements play an important role in Automation Testsing. Learn how to record multiple elements for a iOS project in Testsigma Appication." noindex: false order: 6.42 page_id: "Record Multiple Elements for an iOS Application" @@ -28,7 +28,7 @@ When automating test cases for an iOS application, you may sometimes want to cap
--- -##**Pre-requisites** +## **Pre-requisites** You should already know: 1. About Projects overview. @@ -37,14 +37,8 @@ See uploading apps to Testsigma.
-**Navigation** - -**Test Development > Element** - -
- --- -##**How to record multiple elements for an iOS project in Testsigma** +## **How to record multiple elements for an iOS project in Testsigma** 1. On the ‘All Elements’ page, click on the ‘Record’ button on the top right corner of the page: ![record button under record multiple elements for an iOS project in Testsigma](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/elements/ios-apps/record-multiple-elements/record-button-record-multiple-elements-ios-testsigma.png) @@ -69,7 +63,7 @@ See uploading apps to Testsigma. The elements can also be edited or deleted from this list using the ‘edit’ and ‘delete’ buttons that appear at the end of the element rows. 8. Repeat steps 6 and 7 for every element you want to capture. -9. Once you have captured the elements, click on the ‘Save’ button on the ‘Elements’ list to save the changes in the project. Once saved, a checkmark icon will appear corresponding to all the saved elements in the element list: +9. Once you have captured the elements, click on the **Save** button on the **Elements** list to save the changes in the project. Once saved, a checkmark icon will appear corresponding to all the saved elements in the element list: ![Multiple Elements Saved in Element Recorder for iOS](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/elements/ios-apps/record-multiple-elements/iOS-element-recorder-multiple-elements-saved-1.png) diff --git a/src/pages/docs/elements/ios-apps/supported-locator-types.md b/src/pages/docs/elements/ios-apps/supported-locator-types.md index 724686f8..31ceee58 100644 --- a/src/pages/docs/elements/ios-apps/supported-locator-types.md +++ b/src/pages/docs/elements/ios-apps/supported-locator-types.md @@ -1,6 +1,6 @@ --- title: "Supported Locator Types in an iOS Project" -metadesc: "The meta description should provide an accurate description of the content of the page." +metadesc: "Supported locator types for creating elements for an iOS application in Testsigma. Learn five ways to uniquely identify or locate elements in your automated tests." noindex: false order: 6.45 page_id: "Supported Locator Types in an iOS Project" diff --git a/src/pages/docs/elements/mobile-web-application/create-manually.md b/src/pages/docs/elements/mobile-web-application/create-manually.md new file mode 100644 index 00000000..3c293e9e --- /dev/null +++ b/src/pages/docs/elements/mobile-web-application/create-manually.md @@ -0,0 +1,43 @@ +--- +title: "Create Elements [Manually]" +metadesc: "Element path plays an important role in dynamic websites. Learn how to create elements manually for a Mobile Web Application project in Testsigma." +noindex: false +order: 6.92 +page_id: "Create Elements for a Mobile Web Application" +warning: false +contextual_links: +- type: section + name: "Contents" +- type: link + name: "Prerequisites" + url: "#prerequisites" +- type: link + name: "Steps to create Elements manually for Mobile Web Application" + url: "#steps-to-create-elements-manually-for-mobile-web-application" +--- + +
+ +In dynamic websites, elements can have varying attributes/properties across sessions. In such cases, we need to create elements manually. For more information, refer to [elements](https://testsigma.com/docs/elements/overview/). + +
+ +## **Steps to create Elements manually for Mobile Web Application** + +1. Navigate to **Test Development > Elements**. + +2. Click on **Create**. +![Create](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/elementcreate.png) + +3. On **Create Element** Overlay, enter all the details: +![Overlay](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/createelementoverlay.png) + + - **Name:** Enter the name of the Element. + - **Screen Name:** Screen Name will be helpful to group your Elements by each screen in your application. This helps you search Elements on each screen in your application. + - **Locate By:** Select the suitable locator from a drop-down box: ID, Name, XPath, CSS Selectors, link text, partial link text, class name, or tag name + - **Value:** Enter the value for the selected element type. + +4. Click on **Create** to create the Element. + +5. Verify the Element on the Elements page. + diff --git a/src/pages/docs/elements/mobile-web-application/record-elements.md b/src/pages/docs/elements/mobile-web-application/record-elements.md new file mode 100644 index 00000000..374254f2 --- /dev/null +++ b/src/pages/docs/elements/mobile-web-application/record-elements.md @@ -0,0 +1,57 @@ +--- +title: "Record Elements for a Mobile Web Application" +metadesc: "Element path plays an important role in Automation Testsing. Learn how to record elements for a Mobile Web Application project in Testsigma." +noindex: false +order: 6.91 +page_id: "Record Elements for a Mobile Web Application" +warning: false +contextual_links: +- type: section + name: "Contents" +- type: link + name: "Prerequisites" + url: "#prerequisites" +- type: link + name: "Steps to Record Elements for Mobile Web Application" + url: "#steps-to-record-elements-for-mobile-web-application" +--- + +
+ +The path of an element plays a crucial role in test automation. It specifies locating a UI element within a web page or application, such as a button, textbox, or link. This article will discuss how to capture elements with a Chrome recorder extension. + + +## **Prerequisites** + +- You should know how to create a Test Case. If not, then refer to the document [here](https://testsigma.com/docs/test-cases/manage/add-edit-delete/). + +- You should have the Testsigma test step recorder chrome extension already installed. If not, then refer to the document [here](https://testsigma.com/docs/test-step-recorder/install-chrome-extension/). + +
+ +## **Steps to Record Elements for Mobile Web Application** + +1. Navigate to **Test Development > Elements**. + +2. Click on **Record**. +![Click on Record](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/record.png) + +3. Go to a new tab and enter the **URL** in which you want to capture the element. The Testsigma test recorder will appear and will be ready to start recording. + +4. Hover over the element you want to capture and make sure that it is highlighted in green as shown in the screenshot below (here we wanted to capture the login button): +![Highlighted](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/loginhighlight.png) + +5. Now click on the element and wait for the element to appear in the **Record Elements** and click on **Done**. + +![Record Elements](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/recordelement.png) + +6. You will be taken back to the Elements page. + +7. Verify the Element on the Elements page. +![Verify Elemet](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/verify.png) + + +Here is a quick GIF that demonstrates how to record Elements for Mobile Web Applications. + +![GIF to record elements](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/recordelementgif.gif) + diff --git a/src/pages/docs/elements/overview.md b/src/pages/docs/elements/overview.md index 862dbfdf..c50bb61b 100644 --- a/src/pages/docs/elements/overview.md +++ b/src/pages/docs/elements/overview.md @@ -1,6 +1,6 @@ --- title: "Element List Actions" -metadesc: "Actions you can perform in the Elements List View, such as search, sort and filter." +metadesc: "Learn about all the actions you can perform in the Elements List View, such as search, sort and filter in Testsigma Application." noindex: false order: 6.11 page_id: "Element List Actions" @@ -26,7 +26,7 @@ Elements Repository is a shared list that contains all the elements created in a
--- -##**Affected List** +## **Affected List** The affected List column in the Elements page shows the Test Cases that will be affected by modification on the corresponding element. The Test Suites and the Test Plans containing these Test Cases can also be viewed from this page. @@ -34,14 +34,14 @@ The Test Suites and the Test Plans containing these Test Cases can also be viewe
--- -##**Sort Elements $elements-sort** +## **Sort Elements $elements-sort** The Elements list can be sorted on the basis of Name, Created Date, and Update Date in ascending or descending order. ![Sort-Elements](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/elements/overview/Sort-Elements.png) --- -##**Filter Elements** +## **Filter Elements** To filter Elements, click on the Filter icon on the top left corner of the Elements List page. In the overlay that opens up, you can see the following options for filtering the Elements: * Name * Type @@ -55,17 +55,19 @@ To filter Elements, click on the Filter icon on the top left corner of the Eleme ![Element-List-Filters-overlay](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/elements/overview/Element-List-Filters-overlay.png) -* Name: Filter the Elements by their Name. This can be used to search Elements by name as well. -* Type: Filter the Elements on the basis of locator type -* Screen name: Filter by Screen name of the Element -* Created By: Filter by the creator of Element -* Created Date, Updated Date: Filter by created and updated dates -* Value: Filter the Elements by their locator value. This can be used to search Elements by their locator value as well. -* Labels: Filter by the tag/label for an element -* Usage in Test Cases: Filter on the basis of the Element’s usage in Test Cases - Used, unused, or all. +* **Name:** Filter the Elements by their Name. This can be used to search Elements by name as well. +* **Type:** Filter the Elements on the basis of locator type +* **Screen name:** Filter by Screen name of the Element +* **Created By:** Filter by the creator of Element +* **Created Date, Updated Date:** Filter by created and updated dates +* **Value:** Filter the Elements by their locator value. This can be used to search Elements by their locator value as well. +* **Labels:** Filter by the tag/label for an element +* **Usage in Test Cases:** Filter on the basis of the Element’s usage in Test Cases - Used, unused, or all. Modify the filtering options and click on the Filter button to filter the list. + When you click on the Filter button, the Elements list would be filtered as per your selected filtering options. If you want to filter more, make changes to the filtering options and click on Filter again. + Click on the Close button to get to the filtered list. Saving and updating Element Filters work the same as Test Case Filters. Refer to the [Test Case Filters](https://testsigma.com/docs/test-cases/manage/filters/) article to learn more about Filter Actions. diff --git a/src/pages/docs/elements/web-apps/capture-single-element.md b/src/pages/docs/elements/web-apps/capture-single-element.md index 00f6afad..7e69bd1a 100644 --- a/src/pages/docs/elements/web-apps/capture-single-element.md +++ b/src/pages/docs/elements/web-apps/capture-single-element.md @@ -1,6 +1,6 @@ --- title: "Capture Single Element for a Web Project" -metadesc: "How to capture a single element using Testsigma’s test recorder chrome extension." +metadesc: "Elements play an important role in Automation Testsing. Learn how to capture single element for a Web Application project in Testsigma" noindex: false order: 6.23 page_id: "Capture Single Element for a Web Project" diff --git a/src/pages/docs/elements/web-apps/create-manually.md b/src/pages/docs/elements/web-apps/create-manually.md index 449500ba..6446d6dd 100644 --- a/src/pages/docs/elements/web-apps/create-manually.md +++ b/src/pages/docs/elements/web-apps/create-manually.md @@ -1,6 +1,6 @@ --- title: "Create Element Manually" -metadesc: "Dynamic Element locators and how to create Elements manually in Testsigma." +metadesc: "Element path plays an important role in dynamic websites. Learn how to create elements manually for a Web Application project in Testsigma." noindex: false order: 6.24 page_id: "Create Element Manually" diff --git a/src/pages/docs/elements/web-apps/creating-locators-manually-strategies.md b/src/pages/docs/elements/web-apps/creating-locators-manually-strategies.md index 78f2d809..10dbb1d6 100644 --- a/src/pages/docs/elements/web-apps/creating-locators-manually-strategies.md +++ b/src/pages/docs/elements/web-apps/creating-locators-manually-strategies.md @@ -1,6 +1,6 @@ --- -title: " Different strategies for formulating Elements" -metadesc: " How to find and create locators for the Elements using single attributes, text, or Xpath and CSS Selectors" +title: "Different strategies for formulating Elements" +metadesc: "Learn how to find and create locators for the Elements using single attributes, text, or Xpath and CSS Selectors in Testsigma Application" noindex: false order: 6.26 page_id: "Different Strategies for Formulating Elements" diff --git a/src/pages/docs/elements/web-apps/overview.md b/src/pages/docs/elements/web-apps/overview.md index 9e4aabd3..d36a270f 100644 --- a/src/pages/docs/elements/web-apps/overview.md +++ b/src/pages/docs/elements/web-apps/overview.md @@ -1,6 +1,6 @@ --- title: "Overview of Elements for a Web Project" -metadesc: " An overview of everything regarding Elements for a web project in Testsigma." +metadesc: "Elements for a web project are needed to direct the interactions of UI. Here's an overview of Elements for a web project in Testsigma. " noindex: false order: 6.21 page_id: "Overview of Elements for a Web Project" @@ -39,7 +39,7 @@ We will be using an Element’s name in the Test Steps while writing Test Cases.
--- -##**Creating Elements** +## **Creating Elements** We can [create multiple Elements using Testsigma test Recorder](https://testsigma.com/docs/elements/web-apps/record-multiple-elements/) which is the easiest and recommended way. Creating all the Elements in advance helps you to speed up the Test Case creation process. @@ -63,7 +63,7 @@ The Test Suites and the Test Plans containing these Test Cases can also be viewe ![Sort-Elements](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/elements/web-apps/overview/Sort-Elements.png) --- -##**Filter Elements** +## **Filter Elements** To filter Elements, click on the Filter icon on the top left corner of the Elements List page. In the overlay that opens up, you can see the following options for filtering the Elements: * Name @@ -98,13 +98,13 @@ Saving and updating Element Filters work the same as Test Case Filters. Refer to
--- -##**Element Review Management** +## **Element Review Management** Larger teams can enable Review Management for the Elements so that the Elements used in the Test Cases are reviewed similar to a Test Case before finalizing and adding to the Regression Test Suite. [Learn more here](https://testsigma.com/docs/collaboration/elements-review-management/)
--- -##**Dynamic Elements with Test Data** +## **Dynamic Elements with Test Data** Some advanced use-cases call for Elements with dynamic locators. A few of them are listed below: [Using Parameter Test Data for Dynamic locators](https://testsigma.com/docs/elements/dynamic-elements/with-parameter-test-data/)
diff --git a/src/pages/docs/elements/web-apps/record-multiple-elements.md b/src/pages/docs/elements/web-apps/record-multiple-elements.md index 805a6cd8..3f50b319 100644 --- a/src/pages/docs/elements/web-apps/record-multiple-elements.md +++ b/src/pages/docs/elements/web-apps/record-multiple-elements.md @@ -1,6 +1,6 @@ --- title: "Record Multiple Elements Using Chrome Extension for a web application" -metadesc: "How to record multiple elements using Testsigma’s test recorder chrome extension" +metadesc: "Elements play an important role in Test Automation. Learn how to create elements using Testsigma's test recorder extension for a Web Application." order: 6.22 page_id: "Record Multiple Elements Using Chrome Extension for a web application" warning: false @@ -19,7 +19,7 @@ Sometimes, during test creation, we need to capture the details of multiple elem
--- -##**Pre-requisite** +## **Pre-requisite** You should have the Testsigma test step recorder chrome extension already installed. If not, then refer to the document [here](https://testsigma.com/docs/test-step-recorder/install-chrome-extension/). @@ -28,7 +28,7 @@ You should have the Testsigma test step recorder chrome extension already instal Here we will be capturing multiple elements via the Elements page. Learn more about [Elements](https://testsigma.com/docs/elements/web-apps/overview/). -1. Go to the Elements page via **Test Development > Elements.** The Elements page should look something like the below screenshot: +1. Go to the Elements page via **Test Development > Elements**. The Elements page should look something like the below screenshot: ![all-Elements-page-in-Testsigma](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/elements/web-apps/record-multiple-elements/all-Elements-page-in-Testsigma.png) @@ -37,7 +37,7 @@ Here we will be capturing multiple elements via the Elements page. Learn more ab ![record button on All Elements page in Testsigma](https://docs.testsigma.com/images/record-multiple-elements/record-button-all-elements-page-testsigma.png) -3. When you click on the ‘Record’ button, a new tab will open. +3. When you click on the **Record** button, a new tab will open. 4. Enter the URL from which you want to capture the elements. For example, we opened a new tab and entered the URL for orangehrmlive. @@ -47,7 +47,7 @@ Here we will be capturing multiple elements via the Elements page. Learn more ab ![hover over element to record Elements in Testsigma](https://docs.testsigma.com/images/record-multiple-elements/hover-over-element-record-elements-testsigma.png) -7. Now click on the hovered element and wait for the element to appear in the ‘Record Elements’ window as shown below: +7. Now click on the hovered element and wait for the element to appear in the **Record Elements** window as shown below: ![click hovered element while recording Elements in Testsigma](https://docs.testsigma.com/images/record-multiple-elements/click-hovered-element-record-elements-testsigma.png) @@ -55,11 +55,11 @@ Here we will be capturing multiple elements via the Elements page. Learn more ab ![record multiple elements via test step recorder in Testsigma](https://docs.testsigma.com/images/record-multiple-elements/record-multiple-elements-test-step-recorder-testsigma.png) -9. Now click on the save button on the ‘Record Elements’ window. The Element will be saved and a message ‘Elements created successfully’ will appear, the message is also highlighted below: +9. Now click on the save button on the **Record Elements** window. The Element will be saved and a message **Elements created successfully** will appear, the message is also highlighted below: ![Elements created successfully via the test step recorder in Testsigma](https://docs.testsigma.com/images/record-multiple-elements/elements-created-successfully-test-step-recorder-testsigma.png) -10. You can also check if the Element was created successfully by searching for it on the ‘Elements’ page as shown below: +10. You can also check if the Element was created successfully by searching for it on the **Elements** page as shown below: ![filter-Elements-in-Testsigma](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/elements/web-apps/record-multiple-elements/filter-Elements-in-Testsigma.png) diff --git a/src/pages/docs/elements/web-apps/shadow-dom.md b/src/pages/docs/elements/web-apps/shadow-dom.md index 6f1ae749..6f220ed6 100644 --- a/src/pages/docs/elements/web-apps/shadow-dom.md +++ b/src/pages/docs/elements/web-apps/shadow-dom.md @@ -1,6 +1,6 @@ --- title: "How to locate shadow DOM elements" -metadesc: "How to locate shadow DOM elements with testsigma." +metadesc: "Shadow DOM provides a way to attach a hidden DOM to a DOM element of your choice. Learn how to locate shadow DOM elements with testsigma." noindex: false order: 6.27 page_id: "Shadow DOM" diff --git a/src/pages/docs/elements/web-apps/supported-locator-types.md b/src/pages/docs/elements/web-apps/supported-locator-types.md index 796522c4..5b89331a 100644 --- a/src/pages/docs/elements/web-apps/supported-locator-types.md +++ b/src/pages/docs/elements/web-apps/supported-locator-types.md @@ -1,6 +1,6 @@ --- title: "Supported Element Locator Types" -metadesc: "The guide explains different types of locators used for creating Elements in Testsigma." +metadesc: "The guide explains different types of locators used for creating Elements in Testsigma | Locators supported by Testsigma to create Elements" noindex: false order: 6.25 page_id: "Supported Element Locator Types" @@ -41,7 +41,7 @@ Webpages offer a bunch of location mechanisms to search and locate Elements on t
--- -##**Locators supported by Testsigma to create Elements** +## **Locators supported by Testsigma to create Elements** * XPath
* CSS Selector
* Link Text and Partial Link Text
@@ -53,7 +53,7 @@ Webpages offer a bunch of location mechanisms to search and locate Elements on t ![Create Element Locator Type Dropdown](https://docs.testsigma.com/images/supported-locator-types/create-element-locator-dropdown.png) --- -##**1. XPath** +## **1. XPath** XPath is a query language used to navigate through elements and attributes in an XML document. XPath locators are very powerful and flexible. @@ -70,7 +70,7 @@ Learn how to create [Dynamic Element locators](https://testsigma.com/docs/elemen --- -##**2. CSS Selector** +## **2. CSS Selector** CSS Selector is a string pattern used to identify an element based on a combination of HTML tag, id, class, and/or attributes. @@ -90,7 +90,7 @@ Also only a CSS selector can access elements present inside shadow DOM. *For mor --- -##**3. Link Text & Partial Link Text** +## **3. Link Text & Partial Link Text** Finding an element with Link Text/Partial Link Text is very simple. But make sure that the link text is unique on the web page. If there are multiple links with the same link text (such as repeated header and footer menu links), in such cases action will be performed on the first matching element with the link. @@ -99,12 +99,12 @@ Finding an element with Link Text/Partial Link Text is very simple. But make sur Link text of the element is **“Forgot password?”** -Partial link text of the element can be “Forgot”, “password”, or “For” +Partial link text of the element can be **Forgot**, **password**, or **For**
--- -##**4. ID** +## **4. ID** ID is the most common way of locating elements since IDs are supposed to be unique for each element as per the W3C standard. If ID tags are available for an Element and they are unique, it is the most preferred option. @@ -117,7 +117,7 @@ The ID of the element is **“email”** --- -##**5. Name** +## **5. Name** Locating elements by Name is very similar to locating by ID, except that we use the value of the name attribute instead of the ID. And moreover, name attributes are not strictly unique. @@ -130,7 +130,7 @@ The name of the element is **“userName”** --- -##**6. Class Name** +## **6. Class Name** Class name locator selects the element which matches the values specified in the attribute name “class”. @@ -143,7 +143,7 @@ The class name of the element is **“inputtext”** --- -##**7. Tag Name** +## **7. Tag Name** Tag Name locator is used to find the elements matching the specified Tag/Type Name. It is very helpful when we want to extract the content within a Tag. diff --git a/src/pages/docs/elements/web-apps/verify-elements.md b/src/pages/docs/elements/web-apps/verify-elements.md index e891f3df..5176cf53 100644 --- a/src/pages/docs/elements/web-apps/verify-elements.md +++ b/src/pages/docs/elements/web-apps/verify-elements.md @@ -1,6 +1,6 @@ --- title: "Verifying elements in Chrome DevTools" -metadesc: "Learn how to verify elements in Chrome DevTools during testing in Testsigma to avoid test case failures. Click here to know how to verify elements in DevTools." +metadesc: "Learn how to verify elements in Chrome DevTools during testing in Testsigma to avoid test case failures. Click here to know how to verify elements in Chrome DevTools." noindex: false order: 6.28 page_id: "Verify elements in Chrome DevTools" diff --git a/src/pages/docs/test-cases/manage/add-test-cases-for-mobile-web-app.md b/src/pages/docs/test-cases/manage/add-test-cases-for-mobile-web-app.md new file mode 100644 index 00000000..fd932220 --- /dev/null +++ b/src/pages/docs/test-cases/manage/add-test-cases-for-mobile-web-app.md @@ -0,0 +1,53 @@ +--- +title: "Test cases for Mobile Web Application" +metadesc: "This document explains how to create Test Cases for Mobile Web Application in detail | Learn how to write test cases for Mobile Web Application in Testsigma" +noindex: false +order: 4.18 +page_id: "How to create Test cases for Mobile Web Application?" +warning: false +contextual_links: +- type: section + name: "Contents" +- type: link + name: "Prerequisites" + url: "#prerequisites" +- type: link + name: "Steps to create Test cases for Mobile Web Application" + url: "#steps-to-create-test-cases-for-mobile-web-application" +--- + +
+ +In Testsigma, you can easily create Test Cases for Desktop Windows. This article discusses how to create Test Cases for Desktop Windows. + + +## **Prerequisites** +- You need to have a project with Mobile Web Application. For more information on how to create a project, refer to [manage projects](https://testsigma.com/docs/projects/overview/). + + +Here is a quick GIF that demonstrates how to create test cases for mobile web applications. +![GIF with Steps](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/testcasessteps.gif) + + +
+ + +## **Steps to Create Test Cases for Mobile Web Application** + +1. Open your **Mobile Web Application** Project. + +2. Navigate to **Test Development > Test Cases**. + +3. Click on **Create Test Case**. + +![Click on Create TC](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/createtc.png) + +4. On the **Create Test Case** page, enter **Name** and click on either **Record Steps** or **Write Test Manually** to create Test Steps. + +![Steps](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/steps.png) + +5. Once all the test steps are added, click on **Run**. + +![Run TC](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/run.png) + +6. On the **Ad-hoc Run** overlay, select **Test Machine**, **Environment**, **App Path**, and click on **Run Now**. From 81b0b15a5f0deeffd4fa8d1783c46b41efc651fc Mon Sep 17 00:00:00 2001 From: Sangith Ravichandran <119392848+sangithravichandran@users.noreply.github.com> Date: Wed, 21 Jun 2023 15:19:23 +0530 Subject: [PATCH 2/3] Updated Headless Browser Testing Document (#241) * Updated Headless Browser Testing Doc * Updated Headless Browser Testing Doc --- .../desired-capabilities/incognito-mode.md | 35 +++++++--- .../test-plans/headless-testing.md | 67 +++++++++++++------ 2 files changed, 70 insertions(+), 32 deletions(-) diff --git a/src/pages/docs/desired-capabilities/incognito-mode.md b/src/pages/docs/desired-capabilities/incognito-mode.md index 5b7eae98..a9d69df1 100644 --- a/src/pages/docs/desired-capabilities/incognito-mode.md +++ b/src/pages/docs/desired-capabilities/incognito-mode.md @@ -1,15 +1,18 @@ --- title: "Run Browser in Incognito/Private mode" -page_title: "Incognito Mode" -metadesc: "How to run tests in Incognito/Private mode" +page_title: "Incognito/Private Mode Browser Testing - Testsigma" +metadesc: "Execute browser tests in incognito/private mode with Testsigma for secure and confidential testing environments, safeguarding your web application's privacy." noindex: false order: 15.99 -page_id: "IC/PM" +page_id: "run-browser-incognito-tests" search_keyword: "" warning: false contextual_links: - type: section name: "Contents" +- type: link + name: "Desired Capabilities for Incognito or Private Browser" + url: "#desired-capabilities-for-incognito-or-private-browser" - type: link name: "Add Desired capabilities in Ad-hoc Run Screen" url: "#add-desired-capabilities-in-ad-hoc-run-screen" @@ -23,9 +26,15 @@ Desired Capabilities are a set of properties used for customizing the Test Envir Desired capabilities have now been added to the browser's Incognito/Private tab to launch the new browser or not save details and run every time a new test case in browsers. -[[info | NOTE:]] -| - You should know how to [Create Ad-hoc Runs](https://testsigma.com/docs/runs/adhoc-runs/), [Create Test Cases](https://testsigma.com/docs/test-cases/manage/add-edit-delete/#creating-a-test-case), and [Create Test Plans](https://testsigma.com/docs/test-management/test-plans/overview/).
-| - Desired Capabilities for Incognito/Private Tab Browsers Support **Google Chrome**, **Mozilla Firefox**, and **Microsoft Edge**. +--- + +### **Prerequisites** + +Before using the Incognito/Private Mode Browser Testing feature, you should understand the concepts of [Create Ad-hoc Runs](https://testsigma.com/docs/runs/adhoc-runs/), [Create Test Cases](https://testsigma.com/docs/test-cases/manage/add-edit-delete/#creating-a-test-case), and [Create Test Plans](https://testsigma.com/docs/test-management/test-plans/overview/). in Testsigma. + +--- + +## **Desired Capabilities for Incognito or Private Browser** |Capability - Key|Data Type|Value|Function| |---|---|---|---| @@ -33,10 +42,12 @@ Desired capabilities have now been added to the browser's Incognito/Private tab |testsigma.privateBrowsing|Boolean|False|The selected browser will be launched in **Normal mode**| |No Capability|Boolean|False|The selected browser will be launched in **Normal mode**| +[[info | NOTE:]] +| Desired Capabilities for Incognito/Private Tab Browsers Support **Google Chrome**, **Mozilla Firefox**, and **Microsoft Edge**. + --- -## **Add Desired capabilities in Ad-hoc Run Screen** -![gif for test case](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/overview/dc_ad_hoc_run.gif) +## **Add Desired capabilities in Ad-hoc Run Screen** 1. Navigate to **Test Development** > **Test Cases**. Create a new project or open an existing project. ![Choose Project](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/overview/testcase_dc.png) @@ -52,9 +63,11 @@ Desired capabilities have now been added to the browser's Incognito/Private tab 5. Test steps will be executed in the Incognito/Private tab. -## **Add Desired capabilities in Test Plan** +Here is a quick GIF demonstrating the above workflow: ![gif for test case](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/overview/dc_ad_hoc_run.gif) -![Test Plan Gif](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/overview/dcd_ad_testplan.gif) +--- + +## **Add Desired capabilities in Test Plan** 1. Navigate to **Select project** > **Test Development** > **Test plan**. ![Choose Test plan](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/overview/testplan_dc.png) @@ -73,4 +86,6 @@ Desired capabilities have now been added to the browser's Incognito/Private tab 6. To update the test plan, click **Next** > **Update**. +Here is a quick GIF demonstrating the above workflow: ![Test Plan Gif](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/overview/dcd_ad_testplan.gif) + --- diff --git a/src/pages/docs/test-management/test-plans/headless-testing.md b/src/pages/docs/test-management/test-plans/headless-testing.md index 8badf560..031bc3ea 100644 --- a/src/pages/docs/test-management/test-plans/headless-testing.md +++ b/src/pages/docs/test-management/test-plans/headless-testing.md @@ -1,51 +1,74 @@ --- -title: "Headless testing" -metadesc: "Learn how to perform headless testing using Testsigma. Simplify your testing process and improve the performance of your application with Testsigma." +title: "Headless Browser Testing" +page_title: "Headless Browser Testing in Testsigma: Automate Web Testing Efficiently" +metadesc: "Learn how to perform headless browser testing in Testsigma. Automate tests without a visual browser interface, ensuring efficient and reliable web app testing." noindex: false order: 8.28 -page_id: "Headless testing" +page_id: "headless-browser-testing-testsigma" warning: false contextual_links: - type: section name: "Contents" - type: link - name: "Step to enable headless testing" - url: "#step-to-enable-headless-testing" + name: "Enabling Headless Browser Testing in Test Case" + url: "#enabling-headless-browser-testing-in-test-case" +- type: link + name: "Enabling Headless Browser Testing in Test Plan" + url: "#enabling-headless-browser-testing-in-test-plan" +- type: link + name: "Results of Headless Browser Testing" + url: "#results-of-headless-browser-testing" +- type: link + name: "Benefits of Headless Browser Testing" + url: "#benefits-of-headless-browser-testing" --- --- -A headless browser is a browser without a graphical user interface. Executing your web tests on a headless browser is called headless testing. +Headless browser testing simulates browser behaviour without a graphical interface to enable efficient automation and validation of different aspects of web applications. + +This guide will explain how to do headless browser testing in Testsigma. It will cover what you need to know beforehand, how to enable headless testing in a test case and plan, verify the results of headless testing, and discuss the benefits. + +--- + +### **Prerequisites** -In Testsigma, you can add headless test execution on a machine while creating a test plan and also while editing it. The following article discusses the steps to enable headless testing in your test cases: +Before using the Headless browser testing feature, you should understand the concepts of [Projects](https://testsigma.com/docs/projects/overview/), [Test Cases](https://testsigma.com/docs/test-cases/manage/add-edit-delete/), [Test Plans](https://testsigma.com/docs/test-management/test-plans/overview/), [Ad-hoc Runs](https://testsigma.com/docs/runs/adhoc-runs/), and [Test Machines](https://testsigma.com/docs/test-management/test-plans/manage-test-machines/) in Testsigma. [[info | NOTE:]] -| Headless testing are used only for testing web applications. -  +| Headless testing can test web applications + +--- -### **When to use**: +## **Enabling Headless Browser Testing in Test Case** -When you need quick results for your testing and your test cases aren’t supposed to evaluate graphical elements on your website. +Click the toggle button for **Headless Tes**t on the **Ad-hoc Run** page of the test case to enable headless testing for a specific test case. Then, start the test by clicking **Run Now**. ![Headless Test in Test Case](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/overview/headlesstest_testcase.gif) -[[info | WARNING:]] -|Headless testing are not accompanied by video recordings of executions on Testsigma cloud. - +--- - --- +## **Enabling Headless Browser Testing in Test Plan** -## **Step to enable headless testing** +1. To enable headless testing for a test plan, navigate to the **Test Machines & Suites Selection** tab on the **Create** or **Edit Test Plan** page. ![Add Machine in Test Plan](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/overview/addmachines_testplan_ht.png) +2. Enable the toggle for **Headless Test** on the **Add** or **Edit Machine/Device page** and click **Update**. ![Enable Headless in Test Plan](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/overview/enable_ht_testplan.png) +Here is a quick GIF demonstrating the above workflow: ![Headless in Test Plan](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/overview/headlesstest_testplan.gif) -
+--- -1. Navigate to **Test Machines & Suites Selection** under the **Create test plan** form. *If you are not familiar with creating a test plan, refer to [add, edit,delete a test plan](https://testsigma.com/docs/test-management/test-plans/overview/)*. +## **Results of Headless Browser Testing** -2. Under the **Test machines & suites selection** tab,select the test suite for which you want to add the test machine for test execution. *For more information refer to [adding test suites](https://testsigma.com/docs/test-management/test-plans/manage-test-suites/)*. +After running the test case, click on the **Watch Video** tab in the test execution results to check if the browser was running in headless mode. Please note that Testsigma does not record videos during headless testing. ![Results of Headless Test](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/overview/watchvideo_ht.png) -3. Once you have selected the test suites, select the test machines to run the coressponding test suite. *For more information refer to [add test machines](https://testsigma.com/docs/test-management/test-plans/manage-test-machines/)*. +--- -4. On the **Add machine/Device** overlay, enable the toggle **Headless testing** to enable headless testing. ![headless testing](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/test-management/test-plans/headless-testing/headless_testing.png) -See the below GIF to enable headless testing:![headless testing gif](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/test-management/test-plans/headless-testing/headless_testing.gif) +## **Benefits of Headless Browser Testing** +|Benefits|Description| +|---|---| +|**Faster Execution**|Headless browsers can run tests faster than traditional GUI-based testing because they do not render graphical elements.| +|**Improved Scalability**|Headless browser testing enables faster test cycles and improved scalability by allowing parallel execution of tests on multiple virtual machines or containers.| +|**Lower Resource Consumption**|Headless testing allows you to maximise resource allocation for other critical tasks without needing a GUI by requiring fewer system resources.| +|**Compatibility Testing**|Headless browser testing allows you to test web applications on different browsers and versions without manual intervention.| +--- \ No newline at end of file From a7db5e18929b4f94ec3e0b5369029f2ba4bd73fb Mon Sep 17 00:00:00 2001 From: Bharath Krishna <118433150+bharathk08@users.noreply.github.com> Date: Thu, 22 Jun 2023 06:36:25 +0530 Subject: [PATCH 3/3] Updated MWA doc & meta descriptions (#243) Updated Mobile Web Applications doc as per the feedback & all metas under desired capabilities section for the ticket https://testsigma.atlassian.net/browse/DOC-99. --- .../desired-capabilities/add-chrome-extension.md | 6 +++--- src/pages/docs/desired-capabilities/app-resigning.md | 2 +- .../avoid-unsafe-download-prompt.md | 4 ++-- .../custom-user-profile-chrome.md | 4 ++-- .../emulate-mobile-devices-with-chrome.md | 2 +- .../enable-browser-console-logs.md | 4 ++-- .../geo-location-for-localization.md | 2 +- src/pages/docs/desired-capabilities/most-common.md | 2 +- .../docs/desired-capabilities/network-throttling.md | 2 +- src/pages/docs/desired-capabilities/overview.md | 12 ++++++------ .../docs/desired-capabilities/screen-shot-capture.md | 2 +- .../docs/desired-capabilities/set-geo-location.md | 2 +- src/pages/docs/desired-capabilities/webviews.md | 2 +- .../manage/add-test-cases-for-mobile-web-app.md | 2 +- 14 files changed, 24 insertions(+), 24 deletions(-) diff --git a/src/pages/docs/desired-capabilities/add-chrome-extension.md b/src/pages/docs/desired-capabilities/add-chrome-extension.md index e150a06d..24809845 100644 --- a/src/pages/docs/desired-capabilities/add-chrome-extension.md +++ b/src/pages/docs/desired-capabilities/add-chrome-extension.md @@ -1,6 +1,6 @@ --- title: "Automate Add Chrome Extension Functionality" -metadesc: "How to add Chrome extension to one of your test sessions" +metadesc: "Learn how to add Chrome extension to one of your test sessions in Testsigma Application | Add a Chrome Extension to your Automation Session in 2 simple steps" noindex: false order: 15.9 page_id: "Automate Add Chrome Extension Functionality" @@ -26,7 +26,7 @@ You can add a Chrome Extension to your Automation Session in 2 simple steps: 2.Specify the Extensions path in the Desired Capabilities. --- -##**Obtaining the CRX file for the extension** +## **Obtaining the CRX file for the extension** 1.If you already have the CRX file, you can skip to the next step. @@ -38,7 +38,7 @@ You can add a Chrome Extension to your Automation Session in 2 simple steps: https://docs.testsigma.com/images/add-chrome-extension/chrome-extension-to-install-testsigma.png) --- -##**Specify the Extensions path in the Desired Capabilities** +## **Specify the Extensions path in the Desired Capabilities** Add an Execution Configuration in Testsigma and add the following Desired Capability: diff --git a/src/pages/docs/desired-capabilities/app-resigning.md b/src/pages/docs/desired-capabilities/app-resigning.md index 8c9607bc..b7fc37b7 100644 --- a/src/pages/docs/desired-capabilities/app-resigning.md +++ b/src/pages/docs/desired-capabilities/app-resigning.md @@ -1,7 +1,7 @@ --- title: "Enable app resigning in iOS" page_title: "Enable app resigning" -metadesc: "How to enable app resigning in iOS" +metadesc: "Learn how to set a desired capability to re-sign the app with the uploaded provisioning profile to install your app on the device during test execution" noindex: false order: 15.94 page_id: "How to enable app resigning" diff --git a/src/pages/docs/desired-capabilities/avoid-unsafe-download-prompt.md b/src/pages/docs/desired-capabilities/avoid-unsafe-download-prompt.md index b71052f6..57cbf0a4 100644 --- a/src/pages/docs/desired-capabilities/avoid-unsafe-download-prompt.md +++ b/src/pages/docs/desired-capabilities/avoid-unsafe-download-prompt.md @@ -1,6 +1,6 @@ --- title: "Bypass unsafe download prompt in Chrome" -metadesc: "How to bypass the unsafe download warning prompt while downloading a file in your test using Testsigma" +metadesc: "Learn how to bypass the unsafe download warning prompt by setting a desired capability while downloading a file in your test using Testsigma application" noindex: false order: 15.5 page_id: "Bypass unsafe download prompt in Chrome" @@ -25,7 +25,7 @@ However, there is a workaround for this issue and that is to enable the Safe Bro You should already know how to add Desired Capabilities to your Tests. See [Desired Capabilities - Overview.](https://testsigma.com/docs/desired-capabilities/overview/) --- -##**Adding the Capability** +## **Adding the Capability** |Name|Data Type|Value| |---|---|---| diff --git a/src/pages/docs/desired-capabilities/custom-user-profile-chrome.md b/src/pages/docs/desired-capabilities/custom-user-profile-chrome.md index d850f120..32e4fba3 100644 --- a/src/pages/docs/desired-capabilities/custom-user-profile-chrome.md +++ b/src/pages/docs/desired-capabilities/custom-user-profile-chrome.md @@ -1,7 +1,7 @@ --- title: "Using custom User Profile in Chrome for Tests" page_title: "Using custom User Profile in Chrome for Tests in Testsigma" -metadesc: "How to start the Chrome Browser with a custom User Profile in Test Session using Testsigma" +metadesc: "Custom user profiles help you emulate settings such as pre-installed extensions. Learn how to start the Chrome Browser with a custom User Profile in Test Session using Testsigma" noindex: false order: 15.7 page_id: "Using custom User Profile in Chrome for Tests" @@ -24,7 +24,7 @@ To do the same, create a new profile, customize it as per your requirements by i You should already know how to add Desired Capabilities to your Tests. See [Desired Capabilities - Overview](https://testsigma.com/docs/desired-capabilities/overview/) --- -##**Steps for using Custom User Profile in Testsigma** +## **Steps for using Custom User Profile in Testsigma** 1. Finding your current Profile path 2. Making changes in the Profile folder diff --git a/src/pages/docs/desired-capabilities/emulate-mobile-devices-with-chrome.md b/src/pages/docs/desired-capabilities/emulate-mobile-devices-with-chrome.md index 75353d50..beffd157 100644 --- a/src/pages/docs/desired-capabilities/emulate-mobile-devices-with-chrome.md +++ b/src/pages/docs/desired-capabilities/emulate-mobile-devices-with-chrome.md @@ -1,6 +1,6 @@ --- title: "Emulate Mobile devices with Chrome Browser" -metadesc: "How to emulate mobile devices using the Google Chrome Web Browser for Mobile Websites" +metadesc: "With Chrome Browser you emulate mobile device screen resolutions. Learn how to emulate mobile devices using the Google Chrome Web Browser for Mobile Websites" noindex: false order: 15.8 page_id: "Emulate Mobile devices with Chrome Browser" diff --git a/src/pages/docs/desired-capabilities/enable-browser-console-logs.md b/src/pages/docs/desired-capabilities/enable-browser-console-logs.md index 88f5dda1..4473e404 100644 --- a/src/pages/docs/desired-capabilities/enable-browser-console-logs.md +++ b/src/pages/docs/desired-capabilities/enable-browser-console-logs.md @@ -26,7 +26,7 @@ However, there are times when the reason for failure is not enough to fix the fa To learn how to add Desired Capabilities, see [Desired Capabilities - Overview](https://testsigma.com/docs/desired-capabilities/overview/) --- -##**Enable Browser Console - Extended Debugging** +## **Enable Browser Console - Extended Debugging** Pass the below given desired capabilities in case of respective Test Lab Type @@ -39,7 +39,7 @@ Pass the below given desired capabilities in case of respective Test Lab Type | The above desired capabilities are valid for Adhoc Runs and Test Plan Runs. --- -##**View Browser Logs** +## **View Browser Logs** Once the desired Capabilities are added, you can execute it. The Test Result will show up as shown below: diff --git a/src/pages/docs/desired-capabilities/geo-location-for-localization.md b/src/pages/docs/desired-capabilities/geo-location-for-localization.md index 86218268..7f2b46ab 100644 --- a/src/pages/docs/desired-capabilities/geo-location-for-localization.md +++ b/src/pages/docs/desired-capabilities/geo-location-for-localization.md @@ -1,6 +1,6 @@ --- title: "Geolocation emulation for Localization Testing" -metadesc: "How to use Desired Capabilities to set the Geographical Location for running tests in Mobile Web." +metadesc: "Learn how to use Desired Capabilities to set the Geographical Location for running tests in Mobile Web in Testsigma Application" noindex: false order: 15.4 page_id: "Geolocation emulation for Localization Testing" diff --git a/src/pages/docs/desired-capabilities/most-common.md b/src/pages/docs/desired-capabilities/most-common.md index 86e520c9..a903af37 100644 --- a/src/pages/docs/desired-capabilities/most-common.md +++ b/src/pages/docs/desired-capabilities/most-common.md @@ -1,6 +1,6 @@ --- title: "Common Desired Capabilities" -metadesc: "Commonly used Desired Capabilities and explainer articles" +metadesc: "Learn about most commonly used Desired Capabilities for Chrome, Mozilla Firefox, Microsoft Edge, Execution Timeouts Specific and Environment Customizations in Testsigma Labs in Testsigma" noindex: false order: 15.2 page_id: "Common Desired Capabilities" diff --git a/src/pages/docs/desired-capabilities/network-throttling.md b/src/pages/docs/desired-capabilities/network-throttling.md index 7000cc24..4878b04f 100644 --- a/src/pages/docs/desired-capabilities/network-throttling.md +++ b/src/pages/docs/desired-capabilities/network-throttling.md @@ -1,6 +1,6 @@ --- title: "Network throttling" -metadesc: "How to enable and use Network Throttling feature in Testsigma" +metadesc: "Network throttling is an intentional slowing down of internet speed. Learn how to enable and use Network Throttling feature in Testsigma" noindex: false order: 15.91 page_id: "Network Throttling" diff --git a/src/pages/docs/desired-capabilities/overview.md b/src/pages/docs/desired-capabilities/overview.md index 84d379d8..9e39e623 100644 --- a/src/pages/docs/desired-capabilities/overview.md +++ b/src/pages/docs/desired-capabilities/overview.md @@ -1,6 +1,6 @@ --- title: "Desired Capabilities - Overview" -metadesc: "What are desired capabilities and how to add them to your test execution in Testsigma" +metadesc: "Desired Capabilities are used for customizing the Test Environment. Learn about desired capabilities in detail and how to add them to your test execution in Testsigma" noindex: false order: 15.1 page_id: "Desired Capabilities - Overview" @@ -35,7 +35,7 @@ Desired Capabilities are added while selecting the Test Environment in Testsigma In this document, we will cover how to use these capabilities in Ad Hoc Run, Quick Run, and Normal Execution. To do this, you should already know how to [Create Ad Hoc Runs](https://testsigma.com/docs/runs/adhoc-runs/) and [Create Test Plans.](https://testsigma.com/docs/test-management/test-plans/overview/) --- -##**Adding Desired Capabilities in Adhoc Run** +## **Adding Desired Capabilities in Adhoc Run** **Navigation: Test Development > Test Cases** Selecting a Test Case from the Test Cases page will take us to the Test Case details page. Click on the Run button on the top right corner to open the Ad-hoc Run overlay page. @@ -47,7 +47,7 @@ Click on the Desired Capabilities link to reveal the Desired Capabilities field Enter one or more desired capabilities set as mentioned in the below section - ‘Desired Capabilities Format’ --- -##**Adding Desired Capabilities in Test Plan** +## **Adding Desired Capabilities in Test Plan** **Navigation: Test Development > Test plan** Clicking on the Create Test Plan Button on the Test Plans page opens the Create Test Plan page. Enter the details and move onto the next page by clicking on the Next button. @@ -59,7 +59,7 @@ On the second page - ‘Test Machines and Suite Selection’, click on the Desir Enter one or more desired capabilities set as mentioned in the below section - ‘Desired Capabilities Format’ --- -##**Desired Capabilities Format** +## **Desired Capabilities Format** Desired Capabilities are entered as ‘key-value’ pairs. Enter the details for Desired Capabilities as specified below: - **Name:** Enter the name of the capability. @@ -75,14 +75,14 @@ For example, we can allow invalid certificates for a webpage using the ‘accept |acceptInsecureCerts|boolean|True| --- -##**Removing Desired Capabilities from Test Environment** +## **Removing Desired Capabilities from Test Environment** While editing a Test Plan or Ad-hoc Run Configuration, click on the delete button(trash icon) towards the right of the desired capability row to remove the corresponding row of desired capability. ![Create Test Plan Remove Desired Capability](https://docs.testsigma.com/images/desired-capabilities/create-testplan-remove-desired-caps.png) --- -##**Available Capabilities** +## **Available Capabilities** Here are some links to some of the available Desired Capabilities: diff --git a/src/pages/docs/desired-capabilities/screen-shot-capture.md b/src/pages/docs/desired-capabilities/screen-shot-capture.md index 762a9475..021a0dca 100644 --- a/src/pages/docs/desired-capabilities/screen-shot-capture.md +++ b/src/pages/docs/desired-capabilities/screen-shot-capture.md @@ -1,7 +1,7 @@ --- title: "Enable capturing screenshots for Android and iOS" page_title: "Enable capturing screenshots for Android and iOS" -metadesc: "How to enable capturing screenshots for Android and iOS" +metadesc: "While testing application in Testsigma, it is important to enable capturing screenshots. Learn how to enable capturing screenshots for Android and iOS" noindex: false order: 15.95 page_id: "How to enable Screen shot capture for Android and iOS" diff --git a/src/pages/docs/desired-capabilities/set-geo-location.md b/src/pages/docs/desired-capabilities/set-geo-location.md index 54fde618..3f730531 100644 --- a/src/pages/docs/desired-capabilities/set-geo-location.md +++ b/src/pages/docs/desired-capabilities/set-geo-location.md @@ -1,7 +1,7 @@ --- title: "Set Geolocation for Tests in Chrome and Firefox" page_title: "Set Geolocation for your Tests" -metadesc: "How to set the location of your Test Machine by using desired capabilities in Testsigma" +metadesc: "Learn how to set the location of your Test Environment where tests are run by using a pair of desired capabilities in Testsigma Application." noindex: false order: 15.6 page_id: "Set Geolocation for Tests in Chrome and Firefox" diff --git a/src/pages/docs/desired-capabilities/webviews.md b/src/pages/docs/desired-capabilities/webviews.md index 929c08b7..e8a92885 100644 --- a/src/pages/docs/desired-capabilities/webviews.md +++ b/src/pages/docs/desired-capabilities/webviews.md @@ -1,7 +1,7 @@ --- title: "Configure Android WebViews" page_title: "webviews" -metadesc: "How to configure Android WebViews" +metadesc: "To inspect WebView elements in Testsigma, WebView debugging must be enabled within your application. Learn how to configure Android WebViews." noindex: false order: 15.98 page_id: "webviews" diff --git a/src/pages/docs/test-cases/manage/add-test-cases-for-mobile-web-app.md b/src/pages/docs/test-cases/manage/add-test-cases-for-mobile-web-app.md index fd932220..c1c3cd84 100644 --- a/src/pages/docs/test-cases/manage/add-test-cases-for-mobile-web-app.md +++ b/src/pages/docs/test-cases/manage/add-test-cases-for-mobile-web-app.md @@ -18,7 +18,7 @@ contextual_links:
-In Testsigma, you can easily create Test Cases for Desktop Windows. This article discusses how to create Test Cases for Desktop Windows. +In Testsigma, you can easily create Test Cases for Mobile Web Application. This article discusses how to create Test Cases for Mobile Web Application. ## **Prerequisites**