Фронтальное тестирование с использованием React и Selenium-Webdriver с Rails в качестве Backend

Question

Я просто хочу протестировать интерфейсную часть. Итак, вот моя проблема:

Фон

У меня есть мощное внутреннее приложение Ruby on Rails (V3.2) и новое отдельное интерфейсное приложение с ReactJs (V16.4).

Проблема

Мы начинаем тестировать приложение React с помощью Selenium-Webdriver и JestJ, нам удалось попробовать несколько представлений, но проблема возникла, когда мы выполняли POST-запросы к API рельсов.

Я не хочу заполнять свою базу данных (разработку) мусором из-за тестов.

Пример: Что происходит, когда я хочу проверить создание нового пользователя?.

Возможные решения мысли

Я думал о 3 решениях:

1. Перехватывает вызовы API и имитирует их, имитируя их ответ (например, при отправке клика с использованием selenium-webdriver).
2. Используйте тестовую среду Rails через React
3. Просто отмените вызов API, сделав обратное, это будет означать создание часто нежелательных действий в контроллере. (например: удаление для каждого сообщения)

Answer 1

У вас может быть тестовая среда.Исходя из моего опыта, мусорные данные, сгенерированные тестами, не такая уж большая проблема.Вы можете периодически убирать это.Или вы можете раскрутить новую среду для каждого теста.

Answer 2

Наконец я решил использовать энзим с шут и синон .

пример кода:

import { mount } from "enzyme";
import sinon from "sinon";

beforeAll(() => {
 server = sinon.fakeServer.create();
 const initialState = {
  example: ExampleData,
  auth: AuthData
 };
 wrapper = mount(
  <Root initialState={initialState}>
    <ExampleContainer />
  </Root>
 );
});

it("example description", () => {
  server.respondWith("POST", "/api/v1/example", [
    200,
      { "Content-Type": "application/json" },
      'message: "Example message OK"'
    ]);
  server.respond();
  expect(wrapper.find(".response").text().to.equal('Example message OK');
})

В приведенном выше коде мы видим, как перехватывать вызовы API с помощью тестового DOM, созданного ферментом, а затем имитировать ответы API с помощью sinon.

Answer 3

Зависит от того, хотите ли вы проверить весь стек (внешний интерфейс / бэкэнд) или только часть внешнего интерфейса.

Тесты внешнего интерфейса

Если вы хотите проверить только часть внешнего интерфейса, используйтеПервое решение: фиктивные вызовы API.

Вы будете ограничены, если будете просто использовать selenium-webdriver напрямую.Я бы порекомендовал использовать ночные часы или testcafe .Testcafe не зависит от селена.Это также необязательно в последних версиях Nightwatch.

Testcafe включает API-интерфейс для проверки запросов: http://devexpress.github.io/testcafe/documentation/test-api/intercepting-http-requests/mocking-http-responses.html

С Nightwatch вы можете использовать nock .См. Запросы Nightwatch Mock HTTP

Тесты с полным стеком

Если вы хотите протестировать весь стек, вы можете использовать этот подход: реализовать пользовательскую конечную точку API, чтобы разрешить сбросваша база данных в чистом состоянии до или после выполнения тестов.(например, "/ myapi / clean")

Вы должны отключить доступ к этой конечной точке в производственных средах.

Затем вы можете реализовать тестовые перехватчики (до / после) для вызова вашей пользовательской конечной точки API:

• http://nightwatchjs.org/guide#using-before-each-and-after-each-hooks
• http://devexpress.github.io/testcafe/documentation/test-api/test-code-structure.html#test-hooks