我正在使用最新版本的 Cypress (4.11.0)。我无法通过文本选择下拉列表中的条目以单击它。我很确定这是因为嵌入的撇号,因为我对不包含撇号的同类条目没有任何问题。
在带有转义撇号的代码中,我尝试了多种版本的转义。我总是需要使用奇数个反斜杠,否则我会收到语法错误。
这是我的 Cypress JS 代码:
cy.get('li:contains("Dick\'s Sporting Goods")').click({force: true}); // does not find the 'li'
cy.get('li:contains("Dick's Sporting Goods")').click({force: true}); // does not find the 'li'
cy.get('li:contains("Dick\\\'s Sporting Goods")').click({force: true}); // does not find the 'li'
cy.get('li:contains("Dick\\\\\'s Sporting Goods")').click({force: true}); // does not find the 'li'
cy.get('li:contains("Golf Galaxy")').click({force: true}); // finds the 'li'
以下是 Chrome 开发工具生成的 HTML:
<ul class="MuiList-root MuiList-padding" role="menu" tabindex="-1" id="menu-list-grow" style="padding-top: 0px;">
<li class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
tabindex="0" role="menuitem" aria-disabled="false"
style="padding-left: 0px; font-family: Archivo; font-size: 12px; font-weight: bold; background-color: transparent;">
<img alt="dsg"
src="..."
style="margin-right: 10px; width: 40px;">Dick’s Sporting Goods<span class="MuiTouchRipple-root"></span>
</li>
<li class="MuiButtonBase-root MuiListItem-root MuiMenuItem-root MuiMenuItem-gutters MuiListItem-gutters MuiListItem-button"
tabindex="-1" role="menuitem" aria-disabled="false"
style="padding-left: 0px; font-family: Archivo; font-size: 12px; font-weight: bold; background-color: transparent;">
<img alt="gg"
src="..."
style="margin-right: 10px; width: 40px;">Golf Galaxy<span class="MuiTouchRipple-root"></span></li>
</ul>
最佳答案
让我们保持简单并且应该有效:
cy.get('li').contains("Dick's Sporting Goods").click();
cy.contains("Dick's Sporting Goods").click();
Cypress 足够聪明,可以处理这个问题。更多信息:link
关于html - Cypress 使用带有嵌入式撇号的 'contains' 时出现问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63124211/