在TypeScript中为影子根元素自定义TestCafe选择器 [英] Customize TestCafe Selector in TypeScript for Shadow root Element
问题描述
请帮助我在TypeScript中定义Selector
部分
Please help me to define Selector
part in TypeScript
import { Selector, t } from 'testcafe'
fixture `Scenario Name : Validation`
.page `https://chrisbateman.github.io/guide-to-web-components/demos/shadow-dom.htm`;
const demoPage = Selector('#demo1');
const paragraph = Selector(() => {
return demoPageSelector().shadowRoot.querySelectorAll('p');
}, { dependencies: { demoPageSelector: demoPage } });
test('Test ShadowDom', async t => {
await t
.expect(paragraph.value).eql('Some text');
});
推荐答案
您好 Debashish Samanta ,
在运行时将依赖项添加到函数的作用域中,因此TypeScript在编译期间找不到它们.您可以使用// @ts-ignore
注释取消此验证.
Dependencies are added to the function's scope at runtime, so TypeScript cannot find them during compilation. You can suppress this validation using the // @ts-ignore
comment.
对于类型'{依赖项:{demoPageSelector:Selector;};}'的参数不能分配给类型'SelectorOptions'的参数."错误,在SelectorOptions
类型声明中似乎缺少了dependencies
属性.您可以使用<SelctorOptions>
类型断言来解决此问题.
As for the "Argument of type '{ dependencies: { demoPageSelector: Selector; }; }' is not assignable to parameter of type 'SelectorOptions'." error, it seems like the dependencies
property is somehow missing in the SelectorOptions
type declaration. You can work around this using the <SelctorOptions>
type assertion.
import { Selector, t } from 'testcafe'
fixture `Scenario Name : Validation`
.page `https://chrisbateman.github.io/guide-to-web-components/demos/shadow-dom.htm`;
const demoPage = Selector('#demo1');
const paragraph = Selector(() => {
// @ts-ignore: Cannot find name 'demoPageSelector'.
return demoPageSelector().shadowRoot.querySelectorAll('p');
}, <SelectorOptions> { dependencies: { demoPageSelector: demoPage } });
test('Test ShadowDom', async t => {
await t
.expect(paragraph.innerText).eql('These paragraphs are in a shadow root.');
});
这篇关于在TypeScript中为影子根元素自定义TestCafe选择器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!