Налаштування Cypress-тестів для 1С-Бітрікс

Налаштування Cypress-тестів для 1С-Бітрікс

Бітрікс-проєкт зростає, і ручне регресійне тестування починає з'їдати 30% бюджету. Ми стикалися з цим не раз. Наші інженери впроваджують Cypress-тести для E2E-покриття критичних шляхів — фільтрація, кошик, оформлення замовлення. Результат: прогін набору тестів займає 10 хвилин замість 3 годин ручних перевірок. Помилки ловляться до деплою, а flaky-тести майже зникають.

Чому Cypress кращий за Selenium для Бітрікс?

Cypress виконується всередині браузера, має повний доступ до DOM і мережі. На відміну від Selenium, він автоматично чекає появи елементів та AJAX-відповідей, тому гонки умов з sleep() не потрібні. На практиці це дає в 2-3 рази менше flaky-тестів і скорочує час прогону в середньому на 40%. Крім того, Cypress вміє робити знімки екрану при падіннях та записувати відео — налагодження займає хвилини, а не години. Як підтверджує офіційна документація, автоматичні очікування Cypress значно знижують кількість нестабільних тестів.

Які проблеми вирішуємо

Нестабільні тести Selenium — часті баги через повільні AJAX-запити Бітрікс (фільтрація, оновлення кошика). Cypress дочікується завершення всіх мережевих запитів до переходу до наступного кроку.

Складність з CSRF та сесіями — Бітрікс використовує sessid для захисту від CSRF. Cypress автоматично підхоплює cookies, а ми додаємо кастомні команди для коректної авторизації.

Відсутність CI-інтеграції — тести запускаються локально, але не в пайплайні. Ми налаштовуємо запуск в GitHub Actions / GitLab CI, регрес перевіряється при кожному пуші.

Як налаштувати Cypress під Бітрікс-проєкт?

Встановлення та базова конфігурація займають 4–8 годин. Ключові кроки:

1. Встановлення фреймворку

npm install --save-dev cypress

2. Створення конфігу cypress.config.ts:

import { defineConfig } from 'cypress';

export default defineConfig({
    e2e: {
        baseUrl: 'https://test.site.ru',
        specPattern: 'cypress/e2e/**/*.cy.ts',
        supportFile: 'cypress/support/e2e.ts',
        viewportWidth:  1280,
        viewportHeight: 900,
        defaultCommandTimeout: 8000,
        requestTimeout:        10000,
        video: false,
        screenshotOnRunFailure: true,
        experimentalModifyObstructiveThirdPartyCode: true,
    },
    env: {
        adminLogin:    'admin',
        adminPassword: '', // зі змінної оточення CYPRESS_adminPassword
        siteSessid:    '',
    },
});

3. Додавання кастомних команд для роботи з Бітрікс (авторизація, додавання в кошик, отримання sessid).

4. Написання E2E-тестів, наприклад, для розумного фільтра каталогу:

// cypress/e2e/catalog/filter.cy.ts
describe('Розумний фільтр каталогу', () => {
    beforeEach(() => {
        cy.visit('/catalog/tools/');
        cy.get('.catalog-filter').should('be.visible');
        cy.get('.product-list').should('be.visible');
    });

    it('фільтрує товари за брендом', () => {
        cy.get('[data-filter-prop="BRAND"] [value="bosch"]').click();
        cy.get('.catalog-loading').should('not.exist');
        cy.url().should('include', 'brand=bosch');
        cy.get('.product-brand').each($el => {
            cy.wrap($el).should('have.text', 'Bosch');
        });
    });

    it('скидає фільтр', () => {
        cy.get('[data-filter-prop="BRAND"] [value="bosch"]').click();
        cy.get('.catalog-loading').should('not.exist');
        cy.get('.filter-reset-btn').click();
        cy.get('.catalog-loading').should('not.exist');
        cy.url().should('not.include', 'brand=bosch');
    });

    it('відображає коректну кількість товарів у лічильнику фільтра', () => {
        cy.get('[data-filter-prop="BRAND"] [value="makita"]').click();
        cy.get('.catalog-loading').should('not.exist');
        cy.get('.products-count').invoke('text').then(text => {
            const count = parseInt(text.replace(/\D/g, ''));
            cy.get('.product-card').should('have.length', Math.min(count, 24));
        });
    });
});

Порівняння Cypress та Selenium для Бітрікс

Для ізоляції тестів від зовнішніх сервісів використовуйте cy.intercept для мока AJAX-запитів. Це особливо корисно при інтеграції з 1С, коли обмін даними може бути нестабільним. Практичний кейс: в одному проєкті з каталогом з 10 000 товарів ми налаштували мок для відповідей фільтрації, що скоротило час прогону з 45 до 12 хвилин.

Як відбувається впровадження?

Аудит поточного функціоналу — визначаємо критичні сценарії (каталог, кошик, чекаут, особистий кабінет).

Налаштування інфраструктури — встановлення Cypress, конфігурація під ваш шаблон, підключення CI.

Написання тестів — покриваємо 5–10 ключових сценаріїв на старті, потім розширюємо до повного регресу.

Інтеграція в CD/CI — налаштування запуску при кожному pull request, розсилка звітів у Slack/Telegram.

Навчання команди — проводимо сесію з написання та підтримки тестів.

Що входить в роботу

• Конфігурація проєкту Cypress під ваше середовище.
• Набір кастомних команд (авторизація, вибір валюти, отримання sessid).
• Пул E2E-тестів критичних шляхів (від 10 тестів).
• Інтеграція з CI (GitHub Actions / GitLab CI).
• Документація з запуску та підтримки.
• 1 місяць супроводу: фікс flaky-тестів та доопрацювання.

Строки

Наші інженери мають більше 10 років досвіду з Бітрікс та сертифікати 1С-Бітрікс. Гарантуємо стабільність тестів і прозору звітність. Зв'яжіться з нами для консультації та оцінки вашого проєкту. Замовте впровадження тестування — скоротите витрати на регрес у 2-3 рази. Отримайте консультацію по вашому проєкту — ми оцінимо складність та запропонуємо оптимальний набір тестів.

Тестування сайтів на 1С-Бітрікс

CIBlockElement::GetList і пагінація — баг, який живе роками

Класичний кейс: на сайті каталог із пагінацією через компонент bitrix:catalog.section. Замовник скаржиться — на третій сторінці дублюються товари. Лізеш у кеш компонента, чистиш — начебто ок. Через день знову. Виявляється, кастомне сортування конфліктує з параметром PAGEN_1, і при певній комбінації фільтрів CIBlockElement::GetList повертає ті самі ID. Такі штуки ловляться тільки тестуванням — не код-рев'ю, не «подивився очима».

Зламана пагінація, некоректний розрахунок знижок, помилки інтеграції з 1С — кожен з цих багів коштує бізнесу реальних грошей. Ми знаємо, як їх знайти і виправити до того, як вони вплинуть на продажі. Наша команда має понад 10 років досвіду з Бітрікс і понад 50 успішних QA-проєктів. Ми вибудовуємо QA-процес під проєкти на 1С-Бітрікс: ручне функціональне, автоматизовані E2E, навантажувальне та приймальне тестування.

Чому сайти на 1С-Бітрікс потребують професійного тестування?

Проєкти на 1С-Бітрікс — не лендінги. Під капотом — десятки модулів, інтеграції та неочевидні залежності:

• Ланцюжки в бізнес-логіці — виправив розрахунок знижок у sale.discount, а промокод через sale.basket.discount перестав застосовуватися. Модуль знижок у Бітріксі — один із найкрихкіших: правила пріоритетів, перетини, накопичувальні програми. Одна правка — каскад збоїв.
• Інтеграція з 1С — обмін через catalog.import.1c або REST. Збій у маппінгу властивостей інфоблоку — і на сайті товар без ціни або з нульовим залишком. Розсинхронізація замовлень — втрачені продажі.
• Оновлення ядра — bitrix:main оновився, а кастомний компонент використовував deprecated-метод CModule::IncludeModule з нестандартними параметрами. Без регресії — російська рулетка.
• Мультибраузерність — bitrix:sale.order.ajax рендерить форми по-різному в Safari і Chrome. Кнопка «Оформити замовлення» на iPhone може з'їхати за межі екрана.

Як функціональне тестування вирішує типові проблеми?

Перевіряємо кожен бізнес-сценарій. Не «працює-не працює», а всі граничні випадки.

Каталог (компоненти catalog.section, catalog.element)

• Розумний фільтр catalog.smart.filter: усі комбінації властивостей, скидання, підрахунок результатів. Особливо — фільтри за торговими пропозиціями (SKU), вони ламаються найчастіше.
• Сортування + пагінація — той самий баг із дублями.
• Порівняння через catalog.compare.list — додавання, видалення, відображення відмінностей.
• Швидкий перегляд — модальне вікно, кошик із модалки.

Кошик і замовлення (sale.basket.basket, sale.order.ajax)

• Додавання з каталогу, з картки, швидке замовлення.
• Знижки: за кількістю, за сумою, за купоном, за накопичувальною. Перетин знижок — окремий тест-кейс, мінімум 8 комбінацій.
• Розрахунок доставки: обробники sale.delivery.services, вартість, терміни, ПВЗ на карті.
• Оплата: sale.paysystem — проходження платежу, обробка відхилень, повернення.
• Формування замовлення: email через main.mail.event, запис у CRM, передача в 1С через sale.export.1c.

Особистий кабінет (sale.personal.section)

• Реєстрація, авторизація, відновлення пароля — включно з edge-case із кириличним email.
• Історія замовлень, повторне замовлення.
• Підписки, бонусна програма.

Форми та пошук

• form.result.new / iblock.element.add.form — відправка, валідація, файлові поля.
• search.page — релевантність, морфологія, обробка помилок через search.title.

Регресійне тестування: як ми запобігаємо помилкам після оновлень

Після кожного деплою ми перевіряємо, чи не зламали те, що працювало.

• Smoke-тести — головна відкривається, каталог віддає товари, замовлення проходить до кінця. 5 хвилин, запускаємо після кожного деплою. Якщо smoke впав — відкочуємо, не розбираючись.
• Регресійний набір — 40–80 тест-кейсів за основними сценаріями. Перед кожним релізом.
• Візуальне тестування — порівняння скріншотів через Percy або Playwright. Кнопка з'їхала на 20px, шрифт змінився після оновлення — тест покаже diff.
• Чек-листи за модулями — структуровані списки для sale, catalog, iblock, search. Кожен модуль — свій чек-лист.

Як визначити вузькі місця продуктивності магазину на Бітрікс?

Ми моделюємо навантаження, щоб зрозуміти, при якому RPS catalog.section почне віддавати 500-ку. Використовуємо реалістичні профілі на основі вашої аналітики.

Профіль навантаження для магазину на Бітрікс:

Інструменти: k6 (JavaScript-сценарії для кошика та чекауту), Apache JMeter (складні сценарії з cookie-авторизацією), Yandex.Tank (візуалізація в реальному часі). На виході — максимальний RPS, час відгуку за перцентилями p50/p95/p99, вузькі місця (CPU, RAM, MySQL slow queries на b_iblock_element, файловий кеш). Конкретні рекомендації: який індекс додати, який запит переписати на D7 ORM, де ввімкнути композитний кеш.

У проєкті з 100 000 товарами додавання індекса на b_iblock_element_property.IBLOCK_ELEMENT_ID скоротило час виконання фільтра з 8 секунд до 0.3 секунди — ми знайшли це саме під час навантажувального тестування.

Автоматизоване, кросбраузерне та приймальне тестування

Кросбраузерність перевіряємо там, де реально сидять покупці. Статистика з Метрики конкретного проєкту важливіша за загальноринкові дані. Мінімальний набір: Chrome (останні 2 версії), Safari на iOS, Яндекс.Браузер, Samsung Internet. Пристрої: Desktop 1920×1080 та 1366×768, iPhone 375×812 та 390×844 (обов'язково чекаут), Android 360×800 та 412×915. Інструменти: BrowserStack для реальних пристроїв, Playwright для автоматизації в Chromium/Firefox/WebKit.

Автоматизація базується на Playwright — кросбраузерність, паралельний запуск, автоматичні очікування, добре працює з динамічними формами sale.order.ajax. У порівнянні з ручним тестуванням, автоматизація скорочує час виконання регресії втричі. PHPUnit використовуємо для модульних тестів кастомних компонентів і бізнес-логіки — інтеграція з CI/CD (GitLab CI, GitHub Actions). Тестовий набір із 50 сценаріїв виконується за 15 хвилин замість годин ручної перевірки.

Фінальна перевірка (UAT) проводиться із замовником на staging з копією продової бази. Спільно складаємо 15–20 ключових шляхів покупця, фіксуємо баги в Jira/YouTrack, оформляємо протокол приймання.

QA-процес: як ми вбудовуємо тестування в розробку

Тестування не приклеюється наприкінці — воно стартує з аналізу вимог.

1. Аналіз вимог — QA бере участь в обговоренні завдань, ловить неоднозначності. «Знижка застосовується до товару чи до замовлення?» — таке питання на старті економить два дні відладки.
2. Тест-кейси до розробки — сценарії готові до першого рядка коду.
3. Code review — перевірка на типові помилки Бітрікса: неочищений кеш компонентів, прямі SQL-запити замість ORM, відсутність перевірки $USER->IsAuthorized().
4. Функціональне → регресійне → деплой.
5. Моніторинг після релізу — помилки в bitrix/error.log, метрики в аналітиці, алерти по 500-м.

Закажіть тестування сьогодні — і ми підготуємо тест-план за 2 дні.

Терміни та вартість тестування

Що входить у роботу: детальний тест-план із чек-листами за модулями, автоматизований набір E2E-тестів (Playwright/Cypress) під ваш стек, звіт із результатами, скріншотами помилок і рекомендаціями, інтеграція тестів у ваш CI/CD (GitLab CI, GitHub Actions, Bitbucket Pipelines), супровід UAT — до трьох ітерацій виправлень без додаткової оплати, документація процесу тестування для вашої команди.

Баг на продакшені — це не тільки вартість виправлення. Середнє виправлення критичного дефекту коштує від 20 000 грн, а втрати від зламаного кошика за вихідні на проєкті з оборотом 5 млн/міс можуть сягати 400 000 грн. Інвестиція в тестування — це страховка вашого бізнесу.

Зв'яжіться з нами, щоб отримати комерційну пропозицію та детальний план тестування для вашого проєкту.