Skip to content

Commit

Permalink
Merge pull request #466 from testsigmahq/dev
Browse files Browse the repository at this point in the history
[Dev to Main] >>> Revamped Cookie banner on docs pages & Added Widget sections for Salesforce and Window Automation on index page of docs.
  • Loading branch information
Santhosh-testsigma authored Jul 29, 2024
2 parents 042d971 + 7df49f3 commit 90a7884
Show file tree
Hide file tree
Showing 20 changed files with 970 additions and 434 deletions.
18 changes: 15 additions & 3 deletions src/components/navcards.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -156,6 +156,18 @@ const data = [
},
{
id: 26,
title: "Salesforce Testing",
description: "Learn how to test applications built on Salesforce using Testsigma.",
path: "/docs/salesforce-testing/introduction/",
},
{
id: 27,
title: "Windows Automation",
description: "Learn a comprehensive approach for Windows Automation using Testsigma.",
path: "/docs/windows-automation/introduction/",
},
{
id: 28,
title: "Best Practices",
description: "Best Practices to follow for Testsigma Automation",
path: "/docs/best-practices/best-practices/",
Expand All @@ -170,11 +182,11 @@ const Card = ({ title, description, path }) => {
<span className="card_desc">{description}</span>
</div>
<div className="w-fit content-center grid">
<a className="block p-4 right-arrow">
<div className="block p-4 right-arrow">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="13" viewBox="0 0 15 13" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0.246093 6.98633C0.246093 6.75904 0.334979 6.54106 0.493195 6.38035C0.651411 6.21963 0.865998 6.12934 1.08975 6.12934L11.8643 6.12934L8.24169 2.45115C8.16325 2.37147 8.10103 2.27688 8.05857 2.17277C8.01612 2.06866 7.99427 1.95708 7.99427 1.8444C7.99427 1.73172 8.01612 1.62013 8.05857 1.51603C8.10103 1.41192 8.16325 1.31733 8.24169 1.23765C8.32013 1.15797 8.41325 1.09477 8.51573 1.05164C8.61822 1.00852 8.72806 0.986329 8.83899 0.986329C8.94992 0.986329 9.05977 1.00852 9.16226 1.05164C9.26474 1.09477 9.35786 1.15797 9.4363 1.23765L14.4982 6.37958C14.5768 6.45919 14.6391 6.55376 14.6817 6.65787C14.7242 6.76199 14.7461 6.8736 14.7461 6.98633C14.7461 7.09905 14.7242 7.21067 14.6817 7.31478C14.6391 7.4189 14.5768 7.51347 14.4982 7.59308L9.4363 12.735C9.35786 12.8147 9.26474 12.8779 9.16226 12.921C9.05977 12.9641 8.94993 12.9863 8.83899 12.9863C8.72806 12.9863 8.61822 12.9641 8.51573 12.921C8.41325 12.8779 8.32013 12.8147 8.24169 12.735C8.08327 12.5741 7.99427 12.3558 7.99427 12.1283C7.99427 12.0156 8.01612 11.904 8.05857 11.7999C8.10103 11.6958 8.16325 11.6012 8.24169 11.5215L11.8643 7.84332L1.08975 7.84332C0.865998 7.84332 0.651411 7.75303 0.493195 7.59231C0.334979 7.43159 0.246093 7.21362 0.246093 6.98633Z" fill="#000000"/>
<path fillRule="evenodd" clipRule="evenodd" d="M0.246093 6.98633C0.246093 6.75904 0.334979 6.54106 0.493195 6.38035C0.651411 6.21963 0.865998 6.12934 1.08975 6.12934L11.8643 6.12934L8.24169 2.45115C8.16325 2.37147 8.10103 2.27688 8.05857 2.17277C8.01612 2.06866 7.99427 1.95708 7.99427 1.8444C7.99427 1.73172 8.01612 1.62013 8.05857 1.51603C8.10103 1.41192 8.16325 1.31733 8.24169 1.23765C8.32013 1.15797 8.41325 1.09477 8.51573 1.05164C8.61822 1.00852 8.72806 0.986329 8.83899 0.986329C8.94992 0.986329 9.05977 1.00852 9.16226 1.05164C9.26474 1.09477 9.35786 1.15797 9.4363 1.23765L14.4982 6.37958C14.5768 6.45919 14.6391 6.55376 14.6817 6.65787C14.7242 6.76199 14.7461 6.8736 14.7461 6.98633C14.7461 7.09905 14.7242 7.21067 14.6817 7.31478C14.6391 7.4189 14.5768 7.51347 14.4982 7.59308L9.4363 12.735C9.35786 12.8147 9.26474 12.8779 9.16226 12.921C9.05977 12.9641 8.94993 12.9863 8.83899 12.9863C8.72806 12.9863 8.61822 12.9641 8.51573 12.921C8.41325 12.8779 8.32013 12.8147 8.24169 12.735C8.08327 12.5741 7.99427 12.3558 7.99427 12.1283C7.99427 12.0156 8.01612 11.904 8.05857 11.7999C8.10103 11.6958 8.16325 11.6012 8.24169 11.5215L11.8643 7.84332L1.08975 7.84332C0.865998 7.84332 0.651411 7.75303 0.493195 7.59231C0.334979 7.43159 0.246093 7.21362 0.246093 6.98633Z" fill="#000000"/>
</svg>
</a>
</div>
</div>
</a>
);
Expand Down
8 changes: 7 additions & 1 deletion src/left-nav-title.json
Original file line number Diff line number Diff line change
Expand Up @@ -682,5 +682,11 @@
"add-test-cases-for-mobile-web-app": {"/docs/test-cases/manage/add-test-cases-for-mobile-web-app/": "Test Cases (Mobile Web App)" },
"most-common-issues": { "/docs/troubleshooting/salesforce-testing/most-common-issues/": "Most Common Issues" },
"developer-mode-for-ios": {"/docs/troubleshooting/mobile-apps/developer-mode-for-ios/": "Developer Mode (iOS 16 & Above)" },
"mock-apis": {"/docs/test-cases/create-steps-restapi/mock-apis/": "Mock API Support" }
"mock-apis": {"/docs/test-cases/create-steps-restapi/mock-apis/": "Mock API Support" },
"testsigma-on-prem-architecture": {"/docs/on-premise-setup/pre-installation/testsigma-on-prem-architecture/": "On-Premise System Architecture" },
"prerequisites-and-machine-configurations": {"/docs/on-premise-setup/pre-installation/prerequisites-and-machine-configurations/": "Prerequisites" },
"setup": {"/docs/on-premise-setup/installation-process/setup/": "Installation Steps" },
"post-installation-checklist": {"/docs/on-premise-setup/post-installation/post-installation-checklist/": "Post-Installation Checklist" },
"troubleshooting": {"/docs/on-premise-setup/post-installation/troubleshooting/": "Troubleshooting" },
"faqs": {"/docs/on-premise-setup/post-installation/faqs/": "FAQs" }
}
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
title: "SMTP Configuration in Testsigma"
order: 26.6
order: 19.7
page_id: "SMTP Configuration Setup"
metadesc: "This article discusses a step-by-step guide to setup Simple Mail Transfer Protocol (SMTP) to trigger emails from a configured email address."
noindex: false
Expand Down Expand Up @@ -40,24 +40,15 @@ You'll need the following for SMTP Configuration:
## **Steps to Configure SMTP in Testsigma**

1. Navigate to **Settings > SMTP Configuration**.
![SMTP Configuration](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/smtp.png)


2. Turn on the **SMTP Configuration** toggle.
![SMTP Toggle](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/smtp_toggle.png)


[[info | **NOTE**:]]
| You will stop getting emails if you turn off the SMTP Configuration toggle.


3. Select **@own**, and enter all the details.
![Own](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/SMTP_details.png)


4. Click on **Save**.
![Save](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/Save.png)


[[info | **NOTE**:]]
|If you select Testsigma, the mails will go with default email. For **@own** configuration, you need to enter the following details:<br>
Expand Down Expand Up @@ -97,7 +88,7 @@ Here’s a quick GIF demonstrating how to generate the password.


[[info | **NOTE**:]]
|These steps are specific for generating an app password in a Google account. The process may be different for other email clients/services.
| These steps are specific for generating an app password in a Google account. The process may be different for other email clients/services.



Expand Down
122 changes: 56 additions & 66 deletions src/pages/docs/debugging/debugging-localdevices-web.md
Original file line number Diff line number Diff line change
@@ -1,105 +1,95 @@
---
title: "Debug results on local devices (Web applications)"
title: "Debugging Results on Local Devices for Web Applications"
pagetitle: "Debugging Web Application Results on Local Devices"
metadesc: "Learn how to debug test cases on local devices for web applications, using detailed steps and troubleshooting tips to ensure accurate and efficient testing."
noindex: false
order: 10.3
page_id: "Debug Results on Local Devices"
metadesc: "Debugging issues in complex tests might require enhanced techniques. This article discusses in detail step-by-step guide on how to debug results on local devices in Testsigma."
page_id: "debugging-results-local-devices-web-applications"
search_keyword: ""
warning: false
contextual_links:
- type: section
name: "Contents"
- type: link
name: "Steps to execute test cases in debugger mode"
url: "#steps-to-execute-test-cases-in-debugger-mode"
name: "Prerequisites"
url: "#prerequisites"
- type: link
name: "Adding debug points to debug the test"
url: "#adding-debug-points-to-debug-the-test"
name: "Executing Test Cases in Debugger Mode"
url: "#executing-test-cases-in-debugger-mode"
- type: link
name: "Fixing an error using debugging feature"
url: "#fixing-an-error-using-debugging-feature"
---
name: "Adding Debug Points"
url: "#adding-debug-points"
- type: link
name: "Interacting with Debug Points"
url: "#interacting-with-debug-points"
- type: link
name: "Identifying and Fixing Errors During Test Case Execution"
url: "#identifying-and-fixing-errors-during-test-case-execution"
- type: link
name: "Troubleshooting Element Not Found Error"
url: "#troubleshooting-element-not-found-error"
---
Debugging issues in complex test cases might require enhanced techniques. This article describes Testsigma's interactive debugging feature for web applications that will not only fix test step issues but also save a good amount of debugging time.

[[info | **NOTE**:]]
|This feature is available in beta version only. Contact [support](mailto:[email protected]) for enabling the feature in your account.

---

## **Steps to execute test cases in debugger mode**

1. Navigate to the test case you want to debug and interact with.<br>
[[info | **NOTE**:]]
|If the test case uses a test data profile, users can choose only one data profile to use the debugging feature.
2. On the test case details page, click the drop-down arrow beside the **Run** button.

3. Select **Run in debug mode** from the drop-down list. ![Run in debug mode](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/debugging/debugging-localdevices-web/run_in_debug_mode.png)<br>Optionally you can select **Record in debug mode** to capture screen shots during test execution for each UI-interactive action. Looking at the screen shots it is easier to identify where your test cases failed.
![Record in debug mode](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/debugging/debugging-localdevices-web/record_in_debug_mode.png)
4. On the **Ad-hoc run** overlay window,
1. Specify the test lab. The default test lab in debugging mode for web applications is **Local Device**.
2. Select the checkbox **Run only if the configured browser version is available in the Agent machine**.
3. Select your local test machine. To run tests on your local machine you need to set up a Testsigma agent. *For more information, refer to [set up Testsigma agent](https://testsigma.com/docs/agent/setup-on-windows-mac-linux/)*.
4. If you want to execute the test steps until the failed step, select the toggle **Run till failed step**. If this toggle button is disabled, the test case will be executed from start to end. Thereby, identifying the test step that is failing would be difficult.
5. If you want to execute the step till a particular step (that is setting a debug point), select the step from the **Run till step** drop-down list. For more information on debug points, refer to the section debug points.
6. Click **Run now** to execute the test case.
Debugging in Testsigma helps identify and resolve errors in test cases through its interactive debugging feature. This feature lets you execute tests step-by-step, pausing at specific points to inspect behaviour. It provides users with detailed resources like step results, metadata, screenshots, source codes, and step settings to pinpoint failures accurately, thus saving time and enhancing the reliability of test executions.

---

## **Adding debug points to debug the test**
## **Prerequisites**

Debug points are locations in your test steps where you want the test step to start or pause test case executions. This helps to observe the behavior of the test case. Multiple debug points can be added in a test case. Breaking up test execution this way ensures that you can carefully investigate each of the steps for potential bugs, instead of using a more inconvenient alternative. For example, letting the test case run at once and then trying to figure out in which step the things went wrong.
To add debug points to your test case, follow the below steps:
Before you begin debugging in Testsigma, ensure the following:

1. To add a debug point, click on the **Show more** icon next to the test step.

2. Select **Add debug point** from the drop-down list. When the test case is executed, the execution is performed until the debug point. Multiple debug points can be added as and when desired.
![Add debug points](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/debugging/debugging-localdevices-web/add_debug_point.png)
- The Testsigma Agent is started and active.
- Debugging can only be done through a Local Device.
- If the test case uses a test data profile, only one test data profile can be selected for debugging.

---

## **Fixing an error using debugging feature**

On the execution of the test case, a user can visually view the execution move from step to step. Thus, it is easy to understand the execution workflow.
The execution is paused when an error is encountered or at a debug point. On the test steps window, Testsigma highlights the step that failed and caused the execution to stop.
With the execution paused, the debugging feature offers various resources to help you debug the error in the test step.
## **Executing Test Cases in Debugger Mode**

### **Debug resources**
1. Navigate to the test case you want to debug.
2. On the test case details page, click the **Launch Debugger** button in the top right corner of the screen.
3. On the Run in Debug Overlay, ensure the **Test Lab** is set to **Local Device** and that the **Agent** is in **Active Status** for debugging.
4. To execute the test steps until a failed step, enable the **Run till failed step toggle** and set a debug point by selecting the test step from the dropdown. If this toggle is disabled, the test case will execute from start to end.
5. Click **Debug now** to execute the test case. ![click launch debugger in test case details page](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/launch_debugger_in_web_application.gif)

The debug resources provide a detailed and interactive analysis of the issue. The debugging resources include step results, metadata, screenshots, source codes, and step settings. These resources are available for all test steps including passed and failed test steps.

1. To view the debugging resources, click **More**.
![view debugging resources](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/debugging/debugging-localdevices-web/debugging_resources_more.png)
2. Hover the mouse over each icon to find the details related to step results, metadata, screenshots, source codes, and step settings.
---

### **Troubleshoot ‘element not found error’**
## **Adding Debug Points**

A common failure while executing test cases is that a particular element is not found during test execution. In some cases, the element is visibly available on the page but is still reported as not found by Testsigma. In such cases, follow the below steps to debug the error.
Debug points are specific locations in your test steps where you want the execution to start or pause. These points help you observe the behaviour of the test case more closely.

1. **Explore debug resources**: To explore debug resources, click on **More** next to the failed step. The debug resources provide a detailed analysis of the issue.![explore debug resources](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/debugging/debugging-localdevices-web/element_not_found_error_2.png)
1. A new window with the webpage's URL provided will open to debug the test steps.
2. In the Testsigma Debugger overlay, hover over the yet to execute test step and click the **Place Debug Point** icon to add a debug point.
3. To add multiple debug points, hover over the test step and click on the corresponding debug point that appears to enable it.
4. Execution will pause when it reaches an enabled debug point. ![add debug point in debugger mode](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/adding_debugging_point_in_web_applications.gif)

2. **Check the UI element**: To check the UI element which cannot be found, click **Show more**>**Element search** next to the test step. The relevant element is highlighted for 2 sec. You can compare the properties of the saved element with that of the element displayed on the screen.
---

3. **Edit element**: To edit an element, click on **Show more**>**Edit step** next to the failed step.
1. Click on the saved element.
## **Interacting with Debug Points**

2. You can add the element from the list of elements provided.
1. When the test execution pauses at a debug point, you can perform the following actions by clicking **Options** for the test step that has yet to be executed and selecting the option from the dropdown:
- **Resume Execution**: Continue the test execution.
- **Run this Step**: Execute the current step.
- **Step Over**: Skip the current step.
2. Interact with the page to skip the failed test step, click **Step Over** to skip the current step, and continue the executions. ![interact with debug points in web](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/interact_debugg_web_application.gif)

3. Optionally, you can create a new element. To create an element, click on **Create element**.![create an element](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/debugging/debugging-localdevices-web/create_elements_debugger.png)
---

4. Click on your desired element to automatically populate the element details field.![create element 2](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/debugging/debugging-localdevices-web/capture_element_webdebugger.png)

5. Click **Create**.
## **Identifying and Fixing Errors During Test Case Execution**

6. Optionally, you can add element details and click **Verify** to view the element highlighted on the page.
During test case execution, you can visually follow each step. If an error occurs or a debug point is reached, execution pauses, and Testsigma highlights the problematic step. Various resources are provided to help you debug the error, offering a detailed and interactive analysis.

7. Click **Update**, to update the test step.
- Hover over the Step **Options** for Executed Test Step and then click **Step Result** to view the outcome of each test step. ![identifying and fixing errors during test case execution](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/identifing_error_teststep_debug.gif)

4. **Test Execution**: To re-execute, the test step after editing, click **Show more > Re-run**.
5. To resume the execution of a test case from the previously paused test step, click **Show more**>**Resume**.
---

## **Troubleshooting Element Not Found Error**

A common issue during test execution is the "Element Not Found" error, where an element visible on the page is still reported as not found. To debug this issue, follow these steps:

- View the message for the test step. If the element is not found, click **Element** to view its properties, analyse the issue, and [update the element](https://testsigma.com/docs/elements/web-apps/create-manually/).
- After updating the element, click **Options** and select **Resume Execution** from the previously paused step. ![troubleshoot element not found error](https://s3.amazonaws.com/static-docs.testsigma.com/new_images/projects/applications/troubleshooting_element_error.gif)

---

Loading

0 comments on commit 90a7884

Please sign in to comment.