How to select an svg element with title using cypress?

在使用 Cypress 进行测试时，如果你想要通过 title 属性选择 SVG 标签元素，可以使用 cy.get() 命令结合属性选择器来实现。这里是一个实际的例子，假设你有一个 SVG 元素包含了一个 title 属性，像这样：

html
<svg>
  <title id="uniqueTitleId">Example SVG</title>
  <!-- 其他 SVG 内容 -->
</svg>

为了选择这个 SVG 标签，你可以使用以下 Cypress 命令：

javascript
cy.get('svg title[title="Example SVG"]')

在这个例子中，cy.get() 使用了一个选择器字符串来寻找匹配的元素。这个选择器指定了元素类型 title，然后通过中括号语法 [title="Example SVG"] 指定了 title 属性应该等于 "Example SVG"。

然而，上述的选择器假设 SVG 的 title 是一个属性而不是一个子元素。如果 title 实际上是一个子元素，那么你需要选择到这个 title 标签，而不是使用它的属性。这种情况下，你可以通过内容来选择 title 标签：

javascript
cy.get('svg title').contains('Example SVG')

另外，如果 title 标签有一个唯一的 ID 或者其他可以唯一标识它的属性，你也可以使用那个属性来选择元素。例如：

javascript
cy.get('svg #uniqueTitleId') // 通过 ID 选择
cy.get('svg [id="uniqueTitleId"]') // 通过属性选择器选择 ID

请注意，当你在 SVG 元素内部查找元素时，可能需要确保你的选择器正确地考虑到了 SVG 的命名空间。SVG 元素和常规的 HTML 元素可能会有一些不同的行为。在大多数情况下，Cypress 应该能够正常地处理 SVG 元素的选择，但有时可能需要额外的处理来正确地选择和交互。