小编Zah*_*ebi的帖子

我想测试工具提示标题是否等于特定文本。这是我的 antd 工具提示，我想为此编写一个测试：

<Tooltip
  title={
     this.props.connection ? "Connected" : "Disconnected (Try again)"
         }>
  <Badge status="default" data-testid="connection-sign" />
</Tooltip>

这是我开玩笑的测试：

 test("Show error title in tooltip", async () => {
    baseDom = render(cardComponent);
    fireEvent.mouseMove(await baseDom.findByTestId("connection-sign")); //To hover element and show tooltip
    expect(
      baseDom.getByTitle(
        "Disconnected (Try again)"
      )
    ).toBeInTheDocument();
  });

但此测试失败，无法找到具有此标题的元素。如何测试我的工具提示是否包含“已断开连接（再试一次）”？

我InputNumber在Form.Item一个 React 项目中有一个 antd 。我对此输入的验证是检查输入值的长度。

这是我的代码：

render() {
    return (
      <Form.Item
        label="Value"
        name="numberValue"
        rules={[
          {
            pattern: /^(?:\d*)$/,
            message: "Value should contain just number",
          },
          {
            maxLength: 50,
            message: "Value should be less than 50 character",
          },
        ]}
        validateTrigger="onBlur"
      >
        <InputNumber
          onChange={(value) => {
            this.props.setValue(value);
          }}
        />
      </Form.Item>
    );
  }

我有两个问题：

1. 我想Value should contain just number在用户输入非数字字符时显示消息。但这条消息根本不显示。

2. 我想Value should be less than 50 character在用户输入超过 10 个字符的数字/值时显示消息。但现在，输入第一个字符后，就会显示此消息！

我有一个 API 可以在 React 项目中返回我的预期结果。

我写了这个函数来调用API并获取结果：

async function getUsers() {
  const token = store.getState().token;
  const data = { token };
  await MyApi.getUsers(data)
    .then((result) => {
      console.log(result);
      return result;
    })
    .catch((error) => {
      console.log(error);
      return null;
    });
}

const userList = getUsers();

当我在函数部分result中console.log 时，它打印了预期的用户列表（即 json 数组）。then但是当我 console.log 时，userList它promise如下图所示：

这意味着函数的返回值getUsers是 a Promise。

1- 我怎样才能得到这个承诺的结果？

2-为什么PromiseResultisundefined而resultinthen部分是 json 数组？

** 这些代码不在react组件中

预期result是：

[ …

我正在使用 i18n 翻译我的多语言 React 项目。\n我将在我的翻译文件中使用版权符号 (©)。但它无法显示 \xc2\xa9 符号并显示“©” 作为字符串。

这是我的翻译文件：

"footer.copyright":\n    "Copyright © {{current_year}} {{COMPANY_NAME}}. All right reserved."\n

我将其放入我的组件中，如下所示：

<Trans\n   i18nKey="footer.copyright"\n   values={{ current_year, COMPANY_NAME}}\n/>\n

我想显示：版权所有 \xc2\xa9 2020 我的公司。保留所有权利。

我开始了解有关使用 Jest 和测试库测试 React 组件的更多信息。我已使用模拟 API 返回用户数据并在测试中呈现它，并希望user_active = true在第一个 API 调用和user_active = false第二个 API 调用中返回。

这是我在模拟文件夹中模拟 getUsers API 的代码：

"use strict";
module.exports = {
  getUsers: () => {
    return Promise.resolve({
      data: {
        id: 27,
        full_name: "john doe",
        username: "jhon",
        is_active: true,
      },
    });
  },
}

这是我的组件，用户信息是一个包含（id、full_name、username、is_active）的对象：

  class Users extends Component {
      constructor(props) {
        super(props);
        this.state = {
          userInfo: null,
        };
      }


  getUsers = () => {
    const token = this.props.token;
    myAPI.getUsers(token)
      .then((res) => { …