The wdio-shadowdom-service's discuss from salesforce

Some CSS selectors are not working when using shadow service

When I use ShadowDomService in my wdio.config.js, some css selectors are not working(not working meaning - element is not found. sample is provided in the code)
If I remove ShadowDomService from wdio config, element with the same selector is working.
Is this something to do with how kagekiri? I'm not sure. Need your help.

const { expect, browser, $ } = require('@wdio/globals')

describe("top2", () => {
  it("tests top2", async () => {
    await browser.setWindowSize(1920, 934)
    await browser.url('file:///Users/smothkuri/Downloads/test.html')
    
    const selectBox = await browser.$("div.modal-body > div.filters > div:nth-child(1) select.templateInputs")
    console.log("selectBox", selectBox)
    await selectBox.waitForDisplayed()
    await selectBox.click()
  });
});

my HTML code(test.html)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div class="modal-container slds-modal__container" data-aura-rendered-by="3220:0" xpath="1">
        <div id="content_3202:0" class="modal-body scrollable slds-modal__content slds-p-around--medium"
            data-aura-rendered-by="3229:0" data-scoped-scroll="true"><!--render facet: 3088:0-->
            <div class="filters runtime_sales_emailtemplateuiTemplateInsertDialog" data-aura-rendered-by="3135:0"
                data-aura-class="runtime_sales_emailtemplateuiTemplateInsertDialog">
                <div data-aura-rendered-by="3136:0">
                    <div data-aura-rendered-by="3243:0" class="uiInput uiInputSelect uiInput--default uiInput--select"
                        data-aura-class="uiInput uiInputSelect uiInput--default uiInput--select"><label for="3137:0"
                            class="uiLabel-top form-element__label uiLabel" data-aura-rendered-by="3238:0"
                            data-aura-class="uiLabel"><span id="3137:0-label" title="Templates" class=""
                                data-aura-rendered-by="3239:0">Templates</span><!--render facet: 3241:0--><!--render facet: 3242:0--></label><select
                            size="1" aria-describedby="" id="" class="templateInputs select" data-aura-rendered-by="3142:0"
                            data-interactive-lib-uid="14"><!--render facet: 3143:0-->
                            <option label="My Templates" value="MyLightning">My Templates</option>
                            <option label="All Templates" value="AllLightning">All Templates</option>
                        </select></div><!--render facet: 3146:0-->
                </div>
                <div class="slds-list__item slds-m-right--large" data-aura-rendered-by="3163:0">
                    <div data-aura-rendered-by="3254:0" class="uiInput uiInputSelect uiInput--default uiInput--select"
                        data-aura-class="uiInput uiInputSelect uiInput--default uiInput--select"><label for="3164:0"
                            class="uiLabel-top form-element__label uiLabel" data-aura-rendered-by="3249:0"
                            data-aura-class="uiLabel"><span id="3164:0-label" title="Template Folders" class=""
                                data-aura-rendered-by="3250:0">Template
                                Folders</span><!--render facet: 3252:0--><!--render facet: 3253:0--></label><select size="1"
                            aria-describedby="" id="3164:0" class="templateInputs select" data-aura-rendered-by="3170:0"
                            data-interactive-lib-uid="15" style="">
                            <option class="slds-m-left--xx-small uiInputSelectOption" value="" selected="selected"
                                data-aura-rendered-by="3:2466;a" data-aura-class="uiInputSelectOption">All</option>
                            <option class="slds-m-left--xx-small uiInputSelectOption" value="005x0000000fxgJ"
                                data-aura-rendered-by="8:2466;a" data-aura-class="uiInputSelectOption">Private Email
                                Templates</option>
                            <option class="slds-m-left--xx-small uiInputSelectOption" value="00Dx000000096MA"
                                data-aura-rendered-by="13:2466;a" data-aura-class="uiInputSelectOption">Public Email
                                Templates</option>
                        </select></div><!--render facet: 3174:0-->
                </div>
                <div data-aura-rendered-by="3176:0">
                    <div data-aura-rendered-by="3263:0" class="uiInput uiInputSearch uiInput--default uiInput--input"
                        data-aura-class="uiInput uiInputSearch uiInput--default uiInput--input"><label for="3177:0"
                            class="uiLabel-top form-element__label uiLabel" data-aura-rendered-by="3258:0"
                            data-aura-class="uiLabel"><span id="3177:0-label" title="Search templates..." class=""
                                data-aura-rendered-by="3259:0">Search</span><!--render facet: 3261:0--><!--render facet: 3262:0--></label>
                        <div data-aura-rendered-by="3181:0"><input size="30" aria-describedby="" id="3177:0"
                                placeholder="Search templates..." type="search" class="templateSearch input"
                                data-aura-rendered-by="3182:0" data-interactive-lib-uid="16"><button aria-live="off"
                                type="button" class="slds-button slds-button--neutral hide clear uiButton" aria-label=""
                                data-aura-rendered-by="3186:0" data-aura-class="uiButton"><!--render facet: 3187:0--><span
                                    class="assistiveText"
                                    data-aura-rendered-by="3190:0">clear</span><!--render facet: 3192:0--></button></div>
                    </div><!--render facet: 3195:0-->
                </div>
            </div>
                </div>
    </div>
</body>
</html>

Use with webdriverIO v8 blocked.

The peerDependency setting in package.json limits the use to webdriverIO v6 and v7 only. This blocks upgrading to wdio v8 which was released recently. I have created pr #27 to fix it.

salesforce / wdio-shadowdom-service Goto Github PK

wdio-shadowdom-service's Issues

Some CSS selectors are not working when using shadow service

Use with webdriverIO v8 blocked.

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent