问题

I would like check if an element has a specific string in the class attribute.
我想检查一个元素的class属性中是否包含特定的字符串。

The toHaveClass assertion looks promising but does not seem to allow to check for one specific class string.
toHaveClass断言看起来很有前途，但似乎不允许检查一个特定的类字符串。

Assuming the following element <div class="a b">, I would like to check for a using await expect(myLocator).toHaveClass('a') but this does not work because the api would expect class to be "a b".
假设以下元素 <div class="a b">，我想使用 await expect(myLocator).toHaveClass('a') 来检查是否包含 a，但这不起作用，因为 API 期望 class 为 "a b"。

Is there is a simple way to exist an element to have one specific string in its class list?
是否有一种简单的方法来检查元素是否存在其类列表中的一个特定字符串？

答案1

得分: 2

你可以使用正则表达式进行部分匹配，参见：https://playwright.dev/docs/api/class-locatorassertions#locator-assertions-to-have-class

答案2

得分: 1

如果你正在按照[这个答案](https://stackoverflow.com/a/76034150/6243352)中描述的方式使用正则表达式进行测试，请确保在单词边界上使用 `\b`：

```js
import {expect, test} from "@playwright/test"; // ^1.30.0

test("has class 'a'", async ({page}) => {
  await page.setContent('<div class="a b"></div>');
  await expect(page.locator("div")).toHaveClass(/\ba\b/);
});

test("does not have class 'a'", async ({page}) => {
  await page.setContent('<div class="aaa b"></div>');
  await expect(page.locator("div")).not.toHaveClass(/\ba\b/);
});

没有单词边界，测试 2 会失败，将类 a 检测为 aaa 的子字符串。

另请参阅如何在playwright中获取选择器的 classList和使用playwright检查元素类是否包含字符串，这两者展示了如何测试多个类，无论顺序如何。

import {expect, test} from "@playwright/test"; // ^1.30.0

test("has class 'a'", async ({page}) => {
  await page.setContent('<div class="a b"></div>');
  await expect(page.locator("div")).toHaveClass(/\ba\b/);
});

test("does not have class 'a'", async ({page}) => {
  await page.setContent('<div class="aaa b"></div>');
  await expect(page.locator("div")).not.toHaveClass(/\ba\b/);
});

答案3

得分: 0

是的，您仍然可以使用 toHaveClass:

await expect(locator).toHaveClass('a b');

toHaveClass 也允许在其函数参数中使用字符串。

await expect(locator).toHaveClass('a b');

答案4

得分: 0

Sure, here's the translated code snippet:

(Tested!!) 验证在定位器的类属性中是否存在字符串：

let className = await this.page.$eval(locator, element => element.className);
console.log("className--> " + className);
await expect(className).toContain('SOMETHING');

Please note that I've only translated the code part as per your request.

let className= await this.page.$eval(locator, element => element.className)
  console.log("className--> "+className)
  await expect(className).toContain('SOMETHING')