0

出于测试目的，我需要向 ReactJS 应用程序的组件添加自定义属性。我尝试使用 2 个不同的插件，但是，它们将属性应用于该组件中的所有 JSXElements，我想将其应用于第一个，否则，我最终会出现不必要的属性重复，这使得编写测试更加困难我正在努力挽救脆弱性。

我浏览了文档，找不到如何遍历第一个 JSXElement，所以我自己尝试了几件事，但都失败了，这些是

下面从不添加属性

visitor: {
    JSXElement( path, state ) {
        if ( path.key === 0 )
        {
            path.node.openingElement.attributes.push(
                t.jSXAttribute(
                    t.jSXIdentifier( 'data-e2e' ),
                    t.stringLiteral( `${someValue}` )
                )
            );
        }
    }
}

以下通过未定义中 firstElem 的错误

visitor: {
    Program( path, state ) {
        let arr = [];

        path.traverse( {
            enter( jsxPath )
            {
                if ( jsxPath.node.type === 'JSXElement' )
                {
                    arr.push( jsxPath );
                }
            }
        } );
        let firstElem = arr[ 0 ];   <<< undefined
        firstElem.node.openingElement.attributes.push(
            t.jSXAttribute(
                t.jSXIdentifier( 'data-e2e' ),
                t.stringLiteral( `${someValue}` )
            )
        );

    }
}
}

任何人都可以建议如何获得第一个 JSXElement。

4

1 回答 1

0

所以我纯粹靠运气找到了答案。我应该在遍历 JSXElement 后立即添加一个 stop()

JSXElement( jsxPath )
      {
        jsxPath.stop(); 
    ...

stop() 函数不会记录在案，事实上，没有一个 BabelJS 会为初学者记录。通过查看某人的插件并想知道它在那里做什么并通过反复试验发现它解决了上述问题。

于 2020-08-05T09:41:57.267 回答