Вкладка Application
Вкладка Application содержит данные, которые страница сохраняет между перезагрузками: состояние авторизации, закрытый баннер о cookie, выбранный язык. На сервере этих данных нет, они хранятся в браузере.
Cookie
Именованные значения, которые браузер прикладывает к каждому запросу к сайту; так сервер определяет сессию при переходах между страницами. У каждой cookie есть срок действия и флаги HttpOnly (недоступна скриптам) и Secure (передаётся только по HTTPS).
В таблице Cookies колонка Expires / Max-Age показывает дату истечения или время жизни, заданные сервером: сравните её с текущей датой, чтобы проверить требуемый срок. У сессионной cookie срока действия нет, она удаляется при закрытии браузера.
Пример с cookie consent: после нажатия «Принять» сайт сохраняет cookie, например cookie_consent=accepted. При следующем открытии страницы сайт читает это значение и не показывает баннер повторно. Баннер появится снова, если срок действия cookie закончится или пользователь очистит cookies.
Local storage и session storage
Оба хранят пары «ключ — значение», оба доступны скриптам, и ни одно не отправляется на сервер автоматически: страница должна явно включить значение в запрос. Различие во времени жизни: local storage сохраняется после закрытия браузера, session storage очищается при закрытии вкладки.
Кэш
Браузер сохраняет копии ранее загруженных файлов, поэтому обычная перезагрузка может вернуть устаревший скрипт или стиль. Жёсткая перезагрузка — ctrl shift r / cmd shift r — запрашивает файлы с сервера заново. Этим объясняются случаи, когда исправление выглядит невыкаченным: до оформления дефекта нужно выполнить жёсткую перезагрузку и проверить во вкладке Network отметку from disk cache.
Использование при тестировании
Чтобы вернуть браузер в состояние нового посетителя, откройте Application → Clear site data либо используйте окно в режиме инкогнито. Это стандартная процедура для всего, что должно происходить один раз: баннер о cookie, обучающий тур, отметка «новое». Если поступают жалобы на неожиданный выход из аккаунта, первым делом проверяют в этой же вкладке срок действия cookie.
На собеседовании
Эта группа про данные, которые остаются в браузере между перезагрузками, и про случаи, когда они мешают проверке. Попробуйте ответить сами, прежде чем открыть ответ.
juniorначальный уровень знаний
1. Чем cookie отличается от local storage и session storage?
Cookie браузер сам прикладывает к каждому запросу к сайту, поэтому по ней сервер узнаёт сессию. Local storage и session storage автоматически не отправляются: страница должна явно включить значение в запрос. Между самими хранилищами разница во времени жизни — local storage переживает закрытие браузера, session storage очищается при закрытии вкладки.
2. Как проверить, что баннер о cookie показывается при первом визите на страницу?
Привести браузер в состояние нового посетителя: Application → Clear site data либо открыть страницу в окне инкогнито. При первом открытии баннер должен появиться.
Дальше проверяется, что он появляется именно один раз: после «Принять» сайт сохраняет cookie — например cookie_consent=accepted, её видно в таблице Cookies, — и при следующем открытии страницы читает это значение и баннер уже не показывает. Если снова очистить данные сайта, баннер должен вернуться.
3. Исправление выкачено, но страница ведёт себя по-старому. Что проверить до оформления дефекта?
Кэш. Обычная перезагрузка может вернуть прежний скрипт или стиль, поэтому нужна жёсткая перезагрузка — ctrl shift r / cmd shift r — и проверка во вкладке Network: если в колонке Size стоит from disk cache, файл взят из кэша, а не с сервера.
middleболее продвинутый уровень
4. Что означают флаги HttpOnly и Secure у cookie?
HttpOnly — cookie недоступна скриптам на странице, это защищает значение от кражи через JavaScript. Secure — cookie передаётся только по HTTPS. Оба флага видны в таблице Cookies во вкладке Application.
5. Пользователей разлогинивает раньше срока. Что смотреть в Application?
Колонку Expires / Max-Age у cookie сессии: в ней дата истечения или время жизни, заданные сервером, — их сравнивают с требуемым сроком. Если срока нет, cookie сессионная и удаляется при закрытии браузера.
Вопросы по остальным темам собраны на странице Вопросы на собеседовании QA по DevTools.