Конспект — Урок 11: Флак — это правило, которое не внедрили

Главное за урок

Тест сегодня зелёный. Завтра красный. Продукт не деплоили, Playwright не ломался.

Это флак: один и тот же код даёт два исхода. На уроке его разбирали не как «магию CI», а как дырку в правилах.

Правило не внедрили — в одном из трёх мест:

1. Не написали (нет договора, что так нельзя).
2. Не включили в линтер (машина могла поймать, но молчит).
3. Не посмотрели в PR (машина не умеет, человек не открыл).

Три фильтра идут в этом порядке: правило → линтер → ревью. Trace и UI Mode — если фильтры уже проспали. Не вместо них.

Словарь

Без этих слов остальной конспект не читается.

typescript-eslint — не «ещё один линтер тестов». Это парсер: ESLint понимает type Page. Правила Playwright живут в плагине.

Когда что внедрять

Не всё кладём в линтер. Не всё оставляем на глаза.

Проблема повторилась
        │
        ▼
 Есть ли синтаксис, который машина узнает
 (waitForTimeout, force: true, нет await)?
        │
   да   │   нет — это смысл
        ▼                    ▼
 Внедряем в линтер       Внедряем в кодекс
 как error               и смотрим на ревью
        │                    │
        ▼                    ▼
 npm run lint            комментарий «кодекс N»

Порядок не наоборот. Сначала линтер съедает то, что видит сам. Потом ревьюер смотрит смысл. Если на ревью пишешь про waitForTimeout — сначала спроси, почему линтер молчал: его нет или правило выключили.

Что такое линтер на нашем репо

Три пакета, три роли.

Сегодня не включаем весь TypeScript-recommended (any, unused). Иначе утонем в чужом шуме. Внедряем только правила тестов.

Установи зависимости:

npm install -D eslint typescript-eslint eslint-plugin-playwright

Создай в корне проекта файл eslint.config.mjs:

import tseslint from "typescript-eslint";
import playwright from "eslint-plugin-playwright";

const playwrightRecommended = playwright.configs["flat/recommended"];

export default [
  {
    ...playwrightRecommended,
    files: ["tests/**/*.ts"],
    languageOptions: {
      parser: tseslint.parser,
    },
    rules: {
      ...playwrightRecommended.rules,
      "playwright/no-wait-for-timeout": "error",
      "playwright/no-force-option": "error",
      "playwright/missing-playwright-await": "error",
      "playwright/no-commented-out-tests": "error",
      "playwright/no-page-pause": "error",
      "playwright/no-focused-test": "error",
      "playwright/expect-expect": "error",
      "playwright/no-conditional-in-test": "off",
      "playwright/valid-title": "warn",
    },
  },
];

В package.json добавь скрипт:

{
  "scripts": {
    "lint": "eslint tests"
  }
}

Команда одна: npm run lint. Она смотрит папку tests. Ноль ошибок — можно отдавать на ревью. Красный линт — не проси ревьюера искать sleep.

Документация плагина: https://github.com/mskelton/eslint-plugin-playwright

Правила, которые внедряем в линтер

В recommended плагина часть из них — warning. Warning не роняет npm run lint. В курсе их подняли до error, иначе домашка «линт ноль» пропускает sleep.

playwright/no-wait-for-timeout

Запрещает page.waitForTimeout(200).

Когда внедрять: как только в репо появились UI-тесты. Sleep — первая привычка «на всякий случай».

Почему: 200 мс на ноуте хватает, в CI очередь — мало. Это лотерея по сети, не ожидание. Жди сигнал: URL, ответ сервера, видимость элемента.

Документация: no-wait-for-timeout

playwright/no-force-option

Запрещает { force: true } на клике и подобных действиях.

Когда внедрять: вместе с первым правилом. force обходит actionability с Урока 8.

Почему: клик вслепую. Кнопка под оверлеем, элемент ещё не готов — тест «прошёл», в проде пользователь не нажмёт. Флак куплен заранее.

Документация: no-force-option

playwright/missing-playwright-await

Запрещает вызов Playwright без await.

Когда внедрять: в том же конфиге. Это Урок 4, теперь машина тоже видит.

Почему: в коде порядок есть, в браузере нет. Тест идёт дальше, пока expect ещё не закончился — зелёный вранье или гонка.

Документация: missing-playwright-await

Ещё четыре, тоже error в курсе

Два исключения в конфиге курса — не «правило плохое», а история репо:

• no-conditional-in-test выключен: гонка guest2 через if/throw так учили с Урока 4.
• valid-title оставлен warning: в unit/api эталона есть пробел в конце describe. Не валим домашку из-за этого.

Правило не выключаем пачкой, «чтобы CI был зелёный». Если одной строке правда нужен exception — комментарий с причиной рядом, не тихий off на файл.

Что в линтер не внедряем

Машина не читает смысл. Три дырки с эфира — только кодекс и глаза.

Общий email. fill("shared-hw11@example.com") для ESLint — строка как строка. Для двух воркеров — гонка за один ящик. Правило: свои данные на тест, makeUser(role, Date.now()). Пароль можно хардкодить. Имя и почту — нет. Это кодекс 7.

Ложный expect. fill("Новое имя") и сразу toHaveValue("Новое имя") — синтаксис идеальный. Проверяешь сам fill, не имя с сервера. Имя с сервера видно после reload, до reload дождись POST. Линтер молчит. Это кодекс 9.

Retries вместо фикса. retries: 2 — второй заход зелёный, в отчёте flaky, причина жива. В CI retries — страховка после того, как линтер и ревью уже стоят. Вместо правила их не внедряем. В ДЗ не пишем.

Если проблему нельзя выразить синтаксисом — не мучай ESLint кастомным правилом в первый день. Запиши в кодекс, гоняй на ревью. На Уроке 14 те же файлы прочитает ИИ.

Кодекс и ревью — второй фильтр, не замена линтеру

CODEX.md — десять пунктов. REVIEW.md — те же номера галочками.

Комментарий: кодекс 4, нет test.step. Не «тут плохо».

Ревью не ищет sleep. Если линт красный — сначала себе. Пустой LGTM без чеклиста не считается.

Кратко, что в кодексе, кроме «нет timeout»:

Ключевые тезисы для теста

• Флак — один код, два исхода. Лечится внедрением правила, не retries и не Trace.
• Внедрить = записать правило и включить его в линтер (если машина видит) или в кодекс (если нужен смысл).
• Линтер читает код без запуска тестов. ESLint — движок. eslint-plugin-playwright — правила автотестов.
• В линтер внедряем то, что узнаётся по буквам: waitForTimeout, force, забытый await, .only, pause, закомментированный test.
• warning не валит npm run lint. Правило, без которого домашка врёт, поднимаем до error.
• Смысл (общий email, expect до reload) в линтер не внедряем — это ревью.
• Сначала линтер, потом глаза. Искать sleep на ревью — фильтр поставили не туда.