Фреймворк не должен иметь значения, и вы не используете microservices et c. Cypress - это инструмент, который может переключаться в вашем пользовательском интерфейсе независимо от того, используете ли вы VueJS, Angular, raw html или что-то еще. В общем, я бы рекомендовал осторожно относиться к любому фреймворку, который диктует конкретную c архитектуру.
Для начала у вас есть много плюсов: https://docs.cypress.io/guides/references/best-practices.html.
Еще один совет, так как они предлагают использовать data-cy
атрибуты для выбора данных. Не указывайте их слишком точно, указав c, вместо этого создавайте иерархии. Вы всегда можете сделать cy.get("foo").find("baz")
и cy.get("bar").find("baz")
и указать baz
быть определенным c в контексте foo
и bar
соответственно.
Другой совет заключается в том, чтобы сделать вещи, задаваемые c для их цель, а не их компоненты. Простой пример, скажем, у вас есть интернет-магазин, где вы можете добавлять товары в корзину. Имеет ли значение, если вы добавите в корзину ссылку или кнопку? Нет конечно нет, так что data-cy="add-to-basket-button"
или data-cy="add-to-basket-link"
это плохо. Вместо этого сделайте data-cy="add-to-basket-action"
или, может быть, даже лучше: data-cy="add-to-basket"
(в конце концов, укажите ли action
часть имени какую-либо информацию, которая еще не ясна?). Итак, для итерации компонент не имеет значения, цель имеет значение, сосредоточиться на требованиях и абстрагироваться от решения.
Надеюсь, этого достаточно, чтобы вы начали работать над хорошей структурой