Jest реагировать ожидать.stringcontaining сбой в сочетании с tohavevalue

#reactjs #jestjs #babel-jest

#reactjs #jestjs #babel-jest

Вопрос:

Я попытался использовать expect.stringcontaining в тестовом скрипте jest с create-react-app для выполнения параллельного сопоставления строки, но это не сработало. Если я использую его с toStrictEqual, он работает. Это ошибка?

тест:

 test("should update text when typing", () => {
    render(<EditorWindow />);
    userEvent.type(screen.getByRole("textbox"), "bar");
    expect(screen.getByRole("textbox")).toHaveValue(
      expect.stringContaining("bar")
    );
  });

  test("should match text", () => {
    const a = "#title<br>type text here..bar";
    expect(a).toStrictEqual(expect.stringContaining("bar"));
  });

 

Результат:

   <EditorWindow> />
   
    × should update text when typing (46 ms)
    √ should match text

  ● <EditorWindow> /> › should update text when typing

    expect(element).toHaveValue(StringContaining)

    Expected the element to have value:
      StringContaining "bar"
    Received:
      #title<br>type text here..bar

      15 |     render(<EditorWindow />);
      16 |     userEvent.type(screen.getByRole("textbox"), "bar");
    > 17 |     expect(screen.getByRole("textbox")).toHaveValue(
         |                                         ^
      18 |       expect.stringContaining("bar")
      19 |     );
      20 |   });

      at Object.<anonymous> (src/components/EditorWindow.test.tsx:17:41)

 

Я использую следующие библиотеки:

 "@testing-library/jest-dom": "^5.11.9",
    "@testing-library/react": "^11.2.5",
    "@testing-library/user-event": "^12.6.3",
    "@types/jest": "^26.0.20",
    "@types/node": "^14.14.25",
    "@types/react": "^17.0.1",
    "@types/react-dom": "^17.0.0",
...
 

Надеюсь, кто-нибудь может мне помочь с этим? Заранее спасибо!

Комментарии:

1. Это будет работать для вас? expect(a.includes('bar')).toBe(true)

2. Спасибо, я получил тест, работающий с этим кодом: test(«должен обновлять текст при вводе», () => { render(<EditorWindow />); UserEvent.type(screen.getByRole(«текстовое поле»), «bar»); const myTextAreaVal = screen.getByRole(«текстовое поле»).value; ожидать (myTextAreaVal.includes(«bar»)).toBe(true); }); Это работает, но при компиляции я получаю предупреждение typescript: свойство ‘value’ не существует для типа ‘HTMLElement’.ts(2339) на экране code:.getByRole(«текстовое поле»).value;

Ответ №1:

Мне удалось получить рабочий код без предупреждений typescript, подобных этому:

  test("should update text when typing", () => {
    render(<EditorWindow />);
    userEvent.type(screen.getByRole("textbox"), "bar");
    const myTextAreaVal = (screen.getByRole("textbox") as HTMLInputElement)
      .value;
    expect(myTextAreaVal.includes("bar")).toBe(true);
  });
 

Мне пришлось использовать приведение as HTMLInputElement типов, чтобы избавиться от предупреждений typescript и иметь возможность сохранять значение текстовой области в переменной myTextAreaVal . Затем я использовал myTestAreaVal.includes частичное совпадение для строки.

Спасибо Adrisolid за этот совет!