#баг дня

Сегодня Google опрокинул миллионы пользователей расширений Google Sheets.

Для многих станет сюрпризом, но этот рынок огромен: аналитика, SEO, рассылки, бюджет, ведение рекламных кампаний, анализ опросов из Google Forms... всё там.

Только у нашего расширения — под миллион установок, например.

Так вот, когда-то давно в Chrome 83 появилась очередная директива Content-Security Policy (CSP): Trusted Types.

MDN: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/trusted-types

Web.Dev: https://web.dev/articles/trusted-types

Когда она включена, любую загрузку скриптов надо предварительно одобрить. Любое изменение innerHTML и документа вообще — тоже.

Звучит разумно? Давайте дальше.

Практически любой скрипт на свете использует innerHTML, но это полбеды. Если директива неправильно описана, загрузка и исполнение скриптов внутри iframe тоже становится невозможной.

И сегодня в Google Sheets появился заголовок, включающий директиву, а код настройки — нет.

Масштабы ошибки оказались сокрушительными. Полегли все расширения Google Sheets, просто потому что каждое из них использовало какой-нибудь скрипт, загружающийся извне. Повторю, миллионы пользователей потеряли возможность нормально работать.

Ах да, директива учитывается только в Chrome 🤡

Баг-трекер: https://issuetracker.google.com/issues/313466551

Мы достаточно быстро нашли решение и указали на него в трекере, но далеко не все разработчики отреагировали так же быстро, потому ситуация остаётся плачевной.

А решение, собственно, заключается в минимальной настройке директивы.

Это то, что должны были сделать разработчики Google Sheets:

<script>
  if (window.trustedTypes && window.trustedTypes.createPolicy) {
    window.trustedTypes.createPolicy('default', {
      createHTML: string => string,
      createScriptURL: string => string,
      createScript: string => string,
    });
  }
</script>

В общем, день был насыщенный.

P. S. По состоянию на 23:00 EET, Google откатывают изменения.

#google #sheets #workspace #bug

#инструмент дня

Вчера на Future Frontend (а вот, кстати, стрим на сегодня) деврелы Google представляли новые и неизвестные возможности Chrome DevTools.

Конечно же, почти вся презентация была посвящена AI, но они мельком напомнили о Workspaces (рабочих пространствах, средах).

Короче говоря, можно редактировать код своего проекта прямо в девтулзах. А учитывая, что девтулзы — штука мощная, да ещё и отладчик под рукой — идея становится весьма привлекательной.

Но настраивать Workspace — задача довольно раздражающая. Вот бы они создавались автоматически при дев-сборке...

Так можно же! Ну или вот, чуть более подробная дока из сорсов.

Короче, суть в чём. Создаём файл .well-known/appspecific/com.chrome.devtools.json:

{
"workspace": {
"root": "/home/user/awesome-project",
"uuid": "53b029bb-c989-4dca-969b-835fecec3717"
}
}

Ну, в общем, всё! Девтулзы распознают конфигурацию и позволят редактировать проект прямо в браузере. Что, повторю, сильно удобнее, чем кажется.

Особенно если ты умеешь пользоваться отладчиком.

Кстати, в будущем релизе Bun это будет включено по умолчанию для dev-среды.

А если хочется попробовать прямо сейчас, есть официальный плагин для Vite и пример его использования.

В Chrome 137 все нужные флаги уже включены по-умолчанию, кстати.

#devtools #workspace