Cypress无法播放指定曲目：如何播放网页中索引为10的第11首歌

以下是针对该问题的具体排查和解决步骤：

• 确认元素定位器准确性
  先验证定位曲目的选择器是否能正确获取所有列表项。在浏览器控制台执行document.querySelectorAll('你的曲目选择器')[10]，检查是否返回《Money for Nothing》对应的元素。如果选择器错误，调整为准确的定位器（比如基于类名、data属性等），再在Cypress中验证列表长度：

  // 验证列表至少包含11首歌
  cy.get('.track-item').should('have.length.gte', 11)
  

• 等待曲目列表完全加载
  若曲目列表是异步加载的，Cypress可能在列表未渲染完成时执行操作，导致选中旧元素。需等待目标元素可见后再交互：

  cy.get('.track-item').eq(10).should('be.visible').click()
  

  也可以先等待加载状态消失：

  cy.get('.loading-indicator').should('not.exist')
  cy.get('.track-item').eq(10).click()
  

• 模拟真实用户交互流程
  部分播放器需要先选中曲目再点击播放按钮，而非直接点击曲目播放：

  // 选中目标曲目
  cy.get('.track-item').eq(10).click()
  // 触发播放
  cy.get('.player-play-btn').click()
  

  如果需要双击触发播放，改用dblclick()：

  cy.get('.track-item').eq(10).dblclick()
  

• 处理元素遮挡或不可交互问题
  若目标元素被遮挡，可强制点击或滚动到可见区域：

  // 强制点击（忽略遮挡）
  cy.get('.track-item').eq(10).click({ force: true })
  // 滚动到元素可见后点击
  cy.get('.track-item').eq(10).scrollIntoView().click()
  

• 验证播放状态
  点击后验证当前播放曲目是否正确，确保操作生效：

  cy.get('.track-item').eq(10).click()
  cy.get('.current-playing-title').should('contain', 'Money for Nothing')
  

内容的提问来源于stack exchange，提问作者ekin deniz yıldız