Тестування віджета локально й на телефоні
Для розробників, у коді: дозволити localhost для ключа віджета, тестувати на телефоні через локальну мережу, і чим є та чим не є прев'ю в панелі.
Ключ віджета обмежений за origin, тож сторінку з http://localhost:3000 буде відхилено, доки
цей origin не з’явиться у списку ключа. Усе інше в локальному тестуванні випливає з цього.
Дозвольте свій локальний origin
На екрані API-ключі в панелі відкрийте ключ віджета і додайте свій локальний origin до
Дозволених origin — повністю, зі схемою і портом: http://localhost:3000,
http://127.0.0.1:8080. По одному в рядку. Відхилений origin видно як 403 на
GET /widget/config у вкладці мережі; кнопка запуску з’являється, але питання відхиляються.
Якщо зручніше, тримайте окремий ключ віджета для розробки — ключ нічого не коштує, а ключем, у списку якого лише продакшн-домени, не скористаєшся з ноутбука розробника.
Тестуйте на телефоні
Телефон у тій самій мережі дістається до вашого dev-сервера за LAN-адресою комп’ютера, і дві
речі у віджеті потребують там https: мікрофон (браузер дає getUserMedia лише захищеним
origin) і правила автовідтворення звуку. Роздавайте сторінку по https у локальній мережі —
самопідписаний сертифікат, якому довіряє телефон, або тунель, що дає адресу https://, — і
додайте цей origin до ключа.
На iOS звук грає лише після дотику: запам’ятована розмова повертається в спокої, і перший дотик до кнопки запуску відновлює її зі звуком. Це правило браузера, а не помилка, яку треба обходити.
Живе прев’ю в панелі
Екран віджета в панелі показує віджет в iframe з кольорами й налаштуваннями форми просто під час редагування. Це найшвидший спосіб спробувати вигляд. Дві речі, якими він не є:
- Він працює з увімкненим
previewMode, який повністю вимикає дії на сторінці — документ iframe майже порожній, і читати його означало б сказати помічнику, що екран пустий. Дії на сторінці тестуйте на справжній сторінці. - Він витрачає кредити, як будь-який інший хід, щойно сайт на тарифі. До активації тарифу він відповідає на 50 кредитів на добу і 300 на місяць, а тоді каже, що пробний обсяг вичерпано.
Віджет, вимкнений на вкладці Встановлення, у прев’ю теж нічого не показує.
Ніколи не вмикайте previewMode на справжньому сайті.
Куди дивитися, коли щось не так
| Симптом | Де шукати |
|---|---|
кнопки запуску немає, GET /widget/config відповів active: false |
у сайту закінчилися кредити або немає тарифу — GET /widget/config відповів active: false |
кнопка є, відповіді відхиляються, GET /widget/config відповів 403 |
origin сторінки не в списку дозволених для ключа |
кнопки запуску немає, GET /widget/config відповів 404 |
віджет вимкнено (Активний на вкладці Встановлення), видалено, або data-code у фрагменті не називає жодного віджета цього сайту; консоль каже про це одним рядком |
попередження про data-code |
у фрагменті немає коду; завантажився віджет default сайту |
| відповіді не тією мовою | <html lang> на сторінці не такий, як ви думаєте; відповідь іде за повідомленням відвідувача, інтерфейс — за lang |
| помічник не бачить вашу форму | дії на сторінці вимкнені на віджеті, або не входять у тариф сайту, або елементи приховані CSS — Дії на сторінці |
| заповнене поле повертається назад | ваш фреймворк перемалював елемент; дайте йому data-sa-id і прив’яжіть до стану, а не до значення в DOM |
У вкладці мережі браузера видно два виклики, що мають значення: GET /widget/config при
завантаженні і сокет WS /ws, по якому йде розмова.