小编sle*_*mon的帖子

我有一个自定义命令，可以为我获取具有该data-cy属性的元素。

Cypress.Commands.add("getById", (id) => {
    cy.get(`[data-cy=${id}]`)
})

一切正常。

现在如果我有同样的 find 就好了。它看起来像这样：

Cypress.Commands.add("findById", { prevSubject: true }, (subject, id) => {
    cy.wrap(subject).find(`[data-cy=${id}]`)
})

问题是 cypress 使用此代码引发错误：

cy.root().then((root) => {
    if(root.findById("...").length) {
     ...
   }
})

错误是"root.findById" is not a function。

你能帮我正确编写那个自定义命令吗？

我在我的应用程序中实现了 react-datepicker。

一切都很好，除了我想自定义日期选择器的输入字段并使其适应我的其他自定义字段，如标题输入。

当我通过

customInput={<Input />}

字段，它的外观已经改变，但我不能再选择日期（选择器不再工作）。

继承人我的代码：

<DatePicker
    customInput={<Input />}
    dateFormat="DD.MM.YYYY"
    selected=...
    onChange=...

/>

有任何想法吗？

    export namespace Input { 
        export interface Props { 
            onChange: (event: any) => void; 
            placeholder?: string; 
            value?: string | number; 
            isSecure?: any; 
            id?: string; 
        }

        // ...
    } 

所以我通过以下方式添加了时钟事件：

    export namespace Input {
        export interface Props {
            onChange: (event: any) => void;
            placeholder?: string;
            value?: string | number;
            isSecure?: any;
            id?: string;
            onClick: (event: any) => void;
        }
    }

那正确吗？

组件代码：

export class Input extends …

我用以下方法渲染组件：

<PanelGroup>
    {this.renderPanel1()}
    {this.renderPanel2()}
    {this.renderPanel3()}
</PanelGroup>

现在，只有将其可用属性设置为时，我的面板之一才可用true。render（）方法否则返回null。

我<PanelGroup>应该在除最后一个元素之外的所有元素的底部添加分隔线。

我尝试使用以下代码来完成该任务，但是因为即使panel2返回null，仍然会添加分隔符，因此该代码将无法工作。

如何过滤掉所有返回null的面板？:)

<div>
   {React.Children.map(
       React.Children.toArray(props.children),
           (child: React.ReactElement<PanelProps>, i) => {
               return (
                     <div>
                        {React.cloneElement(child as React.ReactElement<PanelProps>, child.props)}
                        {/*Add divider after all elements except last*/}
                        {i < React.Children.count(props.children) -1 && <Divider/>}
                     </div>
                )
           }
        )}
</div>

我收到不兼容的调用签名错误，不知道该怎么做才能使其正常工作。

反应状态

     this.state = {
    categoryState: ...,
    categoryItemId
    }

类别声明

let category: Cat1[] | Cat2[] | Cat3[] = this.getCategory();

getMethod 返回类别

private getCategory() {
        switch (this.state.categoryState) {
            case "Cat1": {
                return this.props.cat1 as Cat1[];
            }
            case "EVENT": {
                return this.props.cat2 as Cat2[];
            }
            default: {
                return this.props.cat3 as Cat3[];
            }
        }
    }

return-Method (react) 这是错误发生的地方：

<select value={this.state.categoryItemID} onChange={this.handleSomething}>
                                {(category && category.length > 0) &&
                                category.map((item: any) => {
                                    return (
                                        <option value={item.id}
                                                key={item.id}>{item.localizations[this.props.currentLanguage].title}</option>
                                    );
                                })
                                }
                            </select>

错误消息：TS2349：无法调用类型缺少调用签名的表达式。类型 '((callbackfn: (value: …