Skip to content

Commit 420d93e

Browse files
Ishavyas9Ishavyas9
authored
Merge pull request LambdaTest#1237 from amanchopra1905/stage
smartui advanced configs
2 parents b861112 + e475bff commit 420d93e

File tree

3 files changed

+126
-1
lines changed

3 files changed

+126
-1
lines changed

‎docs/smartui-multiple-assets-hosts.md‎

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
---
2+
id: smartui-multiple-assets-hosts
3+
title: Capturing Multiple Assets Hosts
4+
sidebar_label: Capturing multiple asset hosts
5+
description: In this documentation, learn about how to capture multiple assts hosts
6+
keywords:
7+
- Visual Regression
8+
- Visual Regression Testing Guide
9+
- Visual Regression Test Automation
10+
- Visual Regression Automation Testing
11+
- Running Visual Regression Tests
12+
- Visual Regression Testing Online
13+
- Run Visual Regression
14+
- Visual Regression Run Specific Test
15+
- Visual Regression Testing Environment
16+
- How to Run Visual Regression Tests
17+
url: https://www.lambdatest.com/support/docs/smartui-multiple-assets-hosts/
18+
slug: smartui-multiple-assets-hosts/
19+
---
20+
21+
import Tabs from '@theme/Tabs';
22+
import TabItem from '@theme/TabItem';
23+
import NewTag from '../src/component/newTag';
24+
25+
<script type="application/ld+json"
26+
dangerouslySetInnerHTML={{ __html: JSON.stringify({
27+
"@context": "https://schema.org",
28+
"@type": "BreadcrumbList",
29+
"itemListElement": [{
30+
"@type": "ListItem",
31+
"position": 1,
32+
"name": "LambdaTest",
33+
"item": "https://www.lambdatest.com"
34+
},{
35+
"@type": "ListItem",
36+
"position": 2,
37+
"name": "Support",
38+
"item": "https://www.lambdatest.com/support/docs/"
39+
},{
40+
"@type": "ListItem",
41+
"position": 3,
42+
"name": "Smart Multiple Assets",
43+
"item": "https://www.lambdatest.com/support/docs/smartui-multiple-assets-hosts/"
44+
}]
45+
})
46+
}}
47+
></script>
48+
In the SmartUI SDK, the `allowedHostnames` option is used to configure the capture of assets from specific hostnames during UI testing. By default, SmartUI captures only assets that are hosted on the same domain as the snapshot location. For example, if snapshots are taken on `https://xyz.com`, assets hosted on `https://cdn.xyz.com` will not be captured unless explicitly specified. The `allowedHostnames` configuration allows you to define multiple hostnames, ensuring assets from those sources are included during test execution.
49+
50+
## Purpose of `allowedHostnames`
51+
52+
The primary purpose of the `allowedHostnames` is to allow users to specify which external domains or subdomains should be trusted for asset capture. This is particularly useful when assets are hosted across multiple servers or CDNs, and you want to ensure that the complete set of resources required for rendering a page is captured during your tests.
53+
54+
## Configuration File Structure
55+
The `allowedHostnames` configuration option can be defined in your config file for SmartUI. You need to explicitly list each hostname from which assets should be captured. The SmartUI configuration file follows a JSON structure. Below is a sample configuration file:
56+
57+
```javascript title=".smartui.json"
58+
{
59+
..// mobile or web configurations...
60+
"allowedHostnames": ["cdn.xyz.com"]
61+
}
62+
```

‎docs/smartui-shadow-dom.md‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
---
2+
id: smartui-shadow-dom
3+
title: Shadow DOM
4+
sidebar_label: Shadow DOM
5+
description: In this documentation, learn about about the shadow dom feature of smartui
6+
keywords:
7+
- Visual Regression
8+
- Visual Regression Testing Guide
9+
- Visual Regression Test Automation
10+
- Visual Regression Automation Testing
11+
- Running Visual Regression Tests
12+
- Visual Regression Testing Online
13+
- Run Visual Regression
14+
- Visual Regression Run Specific Test
15+
- Visual Regression Testing Environment
16+
- How to Run Visual Regression Tests
17+
url: https://www.lambdatest.com/support/docs/smartui-shadow-dom/
18+
slug: smartui-shadow-dom/
19+
---
20+
21+
import Tabs from '@theme/Tabs';
22+
import TabItem from '@theme/TabItem';
23+
import NewTag from '../src/component/newTag';
24+
25+
<script type="application/ld+json"
26+
dangerouslySetInnerHTML={{ __html: JSON.stringify({
27+
"@context": "https://schema.org",
28+
"@type": "BreadcrumbList",
29+
"itemListElement": [{
30+
"@type": "ListItem",
31+
"position": 1,
32+
"name": "LambdaTest",
33+
"item": "https://www.lambdatest.com"
34+
},{
35+
"@type": "ListItem",
36+
"position": 2,
37+
"name": "Support",
38+
"item": "https://www.lambdatest.com/support/docs/"
39+
},{
40+
"@type": "ListItem",
41+
"position": 3,
42+
"name": "Smart Multiple Assets",
43+
"item": "https://www.lambdatest.com/support/docs/smartui-shadow-dom/"
44+
}]
45+
})
46+
}}
47+
></script>
48+
The Shadow DOM feature in SmartUI allows for testing and capturing assets from content encapsulated within web components. Web components often use Shadow DOM to encapsulate their internal structure and styling, isolating it from the main document. As a result, traditional DOM queries and asset capturing methods might not access or interact with content inside the shadow tree.
49+
50+
SmartUI's Shadow DOM support ensures that assets and UI components rendered within shadow roots are correctly captured and tested, making it easier to handle and test web applications built using web components that leverage the Shadow DOM.
51+
52+
## Purpose of the Shadow DOM Feature
53+
In typical UI tests, SmartUI captures assets and evaluates elements directly from the DOM of the page under test. However, when content is encapsulated inside a Shadow DOM (within a web component), it becomes isolated, and the test framework might not be able to access or interact with it.
54+
55+
SmartUI's Shadow DOM feature addresses this limitation by:
56+
57+
- Enabling SmartUI to traverse and interact with shadow trees.
58+
- Allowing tests to capture assets from the shadow DOM.
59+
- Ensuring that resources (e.g., styles, images, scripts) inside shadow roots are included in the testing process.
60+
61+
This feature is critical for comprehensive testing of modern web applications that make use of custom elements and web components, which are often built with Shadow DOM for encapsulation.

‎sidebars.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2775,12 +2775,14 @@ module.exports = {
27752775
{
27762776
type: "category",
27772777
collapsed: true,
2778-
label: "CLI Configurations",
2778+
label: "Advanced CLI Configurations",
27792779
items: [
27802780
"smartui-sdk-build-name",
27812781
"smartui-sdk-fetch-results",
27822782
"smartui-cli-responsive-dom",
27832783
"smartui-sdk-config-options",
2784+
"smartui-multiple-assets-hosts",
2785+
"smartui-shadow-dom",
27842786
{
27852787
type: "category",
27862788
collapsed: true,

0 commit comments

Comments
 (0)