Задать вопрос
  • Кто должен устанавливать cookie, клиент или сервер?

    1. Клиент - ваш враг! Это единственно-верный подход при разработке web-сервисов. У клиента может быть дырявый древний браузер насквозь пробитый вирусами и вредоносными расширениями. Ваша задача - максимально обезопасить и сервер и бедного юзверя от этой гадости.

    2. Поэтому лучше всего генерировать куку на сервере. И не простую, а минимум:
    • HttpOnly
    • Secure
    • SameSite=lax


    3. Приложите уникальный CSRF-токен, и спите относительно спокойно.

    4. Если же вашему JavaScript ну очень нужна именно в куке какая-то дополнительная информация, не содержащая критических защищённых данных, то можете установить вторую куку откуда угодно. Но эти данные также надо считать вражескими и везде перепроверять.
    Ответ написан
    Комментировать
  • Как можно избежать повторной отправки формы на сайте при переходе назад и вперед мышью?

    Не используйте Javascript везде, где попало. Однако, решение с использованием AJAX-отправки формы отлично работает. Но пользователи, у которых Javascript отключён, могут столкнуться с неверной работой страницы. А если забыть отключить кнопку отправки пока отправляется запрос, то можно так же нарваться на повторную отправку. Поэтому, лучше всегда такое на сервере поддерживать.

    Серверное решение без JS более надёжно:

    Реализуем паттерн Post/Redirect/Get (PRG) плюс одноразовый уникальный токен.

    - Допустим у нас форма по адресу "/form".
    <form id="myForm" action="/save-data" method="post">
      <!-- ...поля... -->
      <button type="submit">Отправить</button>
    </form>


    - Когда сервер принимает POST запрос по адресу, по которому была отправлена форма "/save-data", он проверяет валидность данных, и ежели всё верно, то не рисует ответ с успешным успехом прямо по этому адресу, а делает серверный редирект 303 на страницу "/success". Т.е. другой адрес. Почему 303? Потому что такой редирект даёт браузеру понять, что на страницу "/save-data" нет смысла возвращаться и хранить его в истории, ведь 303 нам сказал искать контент по другому адресу.
    - Это решает проблему с клавишей "F5" (обновление страницы). К тому же в истории у нас всё нормально без никакого редиректа.
    - Однако кнопка назад может заставить браузер вернуться на страницу с заполненной формой "/form". И повторная отправка сработает.

    Для решения этой проблемы мы вводим для каждого отображения формы специальный уникальный токен.

    - При загрузке страницы с формой генерируем этот токен на сервере.
    - Сохраняем токен в сессию
    - Рисуем в HTML формы дополнительное невидимое поле, содержащее этот же токен.

    <form id="myForm" action="/save-data" method="post">
      
      <input type="hidden" name="form_token" value="уникальное_значение_12345">
      
      <!-- ...другие поля... -->
      <button type="submit">Отправить</button>
    </form>


    Когда пользователь нажимает кнопку Отправить правильно, без возвратов назад, происходит следующее:

    1. Сервер получает POST запрос с данными формы на "/save-data"
    2. Забираем значение form_token и сравниваем его с сохранённым ранее токеном из сессии.
    3. Если токены совпадают, то немедленно удаляем его из сессии. Это и есть решение.
    4. Делаем редирект на страницу "/success"
    5. Пользователь видит красивую зелёную галочку и сообщение об успешном успехе. Он доволен.

    Если же он вернётся-таки на страницу формы через кнопку Назад, увидит там всё ту же заполненную форму с данными, и подумает, что он не отправил данные, и попробует снова отправить форму, то произойдёт следующее:

    1. Сервер получает POST запрос с данными формы на "/save-data"
    2. Забираем значение form_token и сравниваем его с сохранённым ранее токеном из сессии.
    3. Т.к. токены не совпадают (в сессии токена нет, мы его удалили ранее), то делаем редирект на страницу "/error", где сообщаем пользователю, что он уже отправлял эту форму раньше, и всё в порядке, пусть не переживает.
    4. Пользователь видит сообщение и утирает пот со лба. Он доволен.

    Решение только выглядит сложным. На самом деле оно простейшее.

    Очистку данных формы конечно можно делать, очищая поля формы с помощью Javascript. Но... Зачем?
    Но если надо, то обрабатывайте событие 'pageshow'. Проверяйте, ежели браузер действительно загрузил страницу из bfcache, и очищаете форму. Можно еще и кнопку снова активировать, если задизаблили её раньше.

    window.addEventListener('pageshow', function(event) {
      // event.persisted бывает true, когда страница загружается из bfcache
      if (event.persisted) {
        const form = document.getElementById('myForm');
        if (form) {
          form.reset(); // Сбрасываем все поля формы
          const button = form.querySelector('button[type="submit"]');
          button.disabled = false; // Убедимся, что кнопка снова активна
          console.log('Страница восстановлена из кэша. Форма сброшена.');
        }
      }
    });
    Ответ написан
    1 комментарий
  • Symfony 6.4 php 8.4 много сыплется deprecated, есть ли пути решения?

    Если сыплются deprecated, и вы не хотите их совсем отключать, можете для канала deprecation создать отдельный хэндлер в монологе. Если пишете в файлы, то настроить ротацию. И тогда и сами deprecated сохранятся, и основные логи не будут замусорены.
    Ответ написан
    Комментировать
  • Как называется такая вложенность в php?

    Это называется PHP. Потому как PHP изначально создавался как сам себе шаблонизатор HTML. Именно поэтому в коде присутствуют открывающие и закрывающие конструкции "<?php" и "?>"

    Люди, разрабатывавшие PHP, прекрасно понимали, как отвратительно будет выглядеть и читаться код, если они заставят людей писать так, как на вашем скрине. Именно поэтому они придумали совершенно другой синтаксис для условий и циклов, который как раз хорошо подходит для написания шаблонов. Ваш пример можно было бы переписать вот так:

    <?php if ($isSent): ?>
    
        <p>Email sent successfully!</p>
    
    <?php else: ?>
    
    <form method="post" action="<?php echo $_SERVER["PHP_SELF"]; ?>">
        <label for="subject">Тема письма : </label> <br>
        <input type="text" name="subject" size="30"> <br>
    
        <label for="elvismail">Содержание письма : </label> <br>
        <textarea name="elvismail" id="" cols="30" rows="10"></textarea> <br>
    
        <input type="submit" name="submit">
    </form>
    
    <?php endif; ?>


    Погуглите "php endif endfor"
    https://www.php.net/manual/en/control-structures.a...
    Ответ написан
    4 комментария
  • Почему PHP считает int числа после математических операций как float?

    Все коллеги, ответившие выше, правы. float заразен. Всё, чего он касается в математических выражениях, превращается во float.

    Я лишь хотел посоветовать эдакий костыльный подход, который позволит вам не так сильно напрягаться, вспоминая, как же эти динамические языки приводят одно к другому.

    Чем больше программисту надо держать в голове подобных правил динамических языков, тем больше в программе багов. Поэтому строгая типизация - это большое добро, ведь она минусует целый класс багов.

    На наше счастье в PHP завезли хоть какую-то типизацию. К сожалению, на данный момент она касается только аргументов и возвращаемых значений функций, а так же свойств и методов классов. Явно типизировать обычную переменную не получится.

    Попробуем использовать хотя бы то, что нам дали. Для этого будем придерживаться простого правила:

    все вычисления всегда выносить в отдельные функции, а эти функции всегда типизировать по-максимуму.

    Видим деление, умножение и т.д. - выносим это выражение в функцию. Это, конечно, не идеальное решение, но оно избавит нас хотя бы от какого-то количества проблем. Если в вашем случае вынести код в функцию, то результат не только будет целым числом, но PHP ещё и сообщение DEPRECATED нам выдаст.

    <?php
    
    $sum = 400;
    
    // Было
    $all = $sum * (55 / 100);
    var_dump($all); // На выходе float(220.00000000000003)
    
    // Стало
    $all2 = calculateAll($sum);
    var_dump($all2); // На выходе int(220)
    
    function calculateAll(int $sum): int
    {
        return $sum * (55 / 100);
    }


    Вывод
    float(220.00000000000003)
    PHP Deprecated:  Implicit conversion from float 220.00000000000003 to int loses precision in /Users/vitiok78/Downloads/float.php on line 12
    
    Deprecated: Implicit conversion from float 220.00000000000003 to int loses precision in /Users/vitiok78/Downloads/float.php on line 12
    int(220)
     
    Ответ написан
  • Как отследить кнопку "назад" на телефонах?

    Опишу только принцип, реализацию уже сделаете сами, либо попросите AI.

    Кнопка "назад" работает просто: переводит браузер на предыдущий урл.

    Это можно использовать. Вы же, наверняка, используете history API в вашем приложении.
    Так вот, при открытии модального окна добавляйте хэш к адресу в history.

    https://example.com/page // окна нет
    https://example.com/page#modal1 // окно открыто


    Таким образом, при нажатии пользователем кнопки "назад", этот хэш удалится из адреса, потому что браузер перейдет на предыдущую страницу, которая имеет тот же адрес, но без этого хэша.

    Ваша программа должна добавлять к текущему адресу хэш при открытии окна, и закрывать окно, когда хэш из адреса убирается.
    Ответ написан
    Комментировать
  • Не пойму как скопировать?

    Решение уважаемого historydev полностью работоспособно, к нему претензий нет никаких, но можно предложить и альтернативу при помощи cloneNode(true) (глубокое клонирование объекта DOM).
    таким образом переменная html у нас остаётся объектом DOM, и её можно далее использовать по коду.
    - var html = e.target.parentNode.querySelector('.firmware-window');
    + var html = e.target.parentNode.querySelector('.firmware-window').cloneNode(true);
    			$('.modal-wrapper').attr('class', 'modal-wrapper').html(html);
    			html.classList.remove('hiden');


    cloneNode намного эффективнее, чем преобразование элемента в текст, а потом из текста в элемент, если исользовать подход с innerHTML, и если бы это был какой-то цикл с очень большим количеством элементов, то разница почти в 2 раза была бы видна невооружённым взглядом.
    Ответ написан
    Комментировать
  • Чем frontend разработчик занят на реальных проектах?

    С резким ростом популярности React Server Components и Next.js в последнее время происходит некий сдвиг в понимании, что такое фронтенд.
    BFF уже почти становится неотъемлемой частью "фронтенда", и становится обременительно разделять браузер и сервер на разные команды.
    На Западе, вообще, уже очень давно и макетами, и вёрсткой, и анимациями очень часто занимается один человек - дизайнер, фронтендеры занимаются связкой браузер + BFF, а бэкендеры занимаются более сложной бизнес-логикой.
    К тому же, джуниорам зачастую дают те задачи, которыми сами не хотят заниматься, и на что нет времени. Т.е. это что-то занудное, работа с legacy, передвижение кнопки на 5px влево и т.д. Крайне редко джуниорам дают интересные творческие задачи. Не факт, что вам на новом месте не дадут такие же неинтересные задачи.
    Вы можете либо молча сильно стараться в надежде, что вам потом дадут что-то интересное, заметив ваше рвение, либо, лучше всего, пообщаться по-человечески с коллегами и начальством, объяснив, что вы рветесь в бой, а вас в тылу держат. Попросите рассказать об их планах на ваш счёт.
    Не исключено, что у вас как раз хорошо получается "Настройка тестов, CI/CD, OLAP CUBE, оптимизация запросов к БД", и поэтому вам эти задачи и дают)
    В общем, человеческое общение с коллегами очень часто решает проблемы.
    Если же вы к ним придёте с открытой душой, а вас токсично отошьют, вот тогда подумайте о смене работы.
    Ответ написан
    7 комментариев
  • Установлена CMS Drupal версия 7.60 нужно ли обновлять?

    Поддержка Drupal 7 закончилась 5 января этого года. Без обновлений безопасности сайт может стать уязвимым.
    Варианты:
    - Купить у них расширенную поддержку.
    - Обновить на текущую версию. Но!!! Версии после 7-й перешли на Symfony в качестве базы. Они даже шаблонизатор на Twig перевели. Это означает, что миграция сайта с Drupal 7 на более свежую версию становится такой попоболью, что зачастую сайт проще полностью переписать, чем мучиться. Контент можно экспортировать со старого и импортировать в новый. У них на сайте есть какие-то инструкции и модули, которые могут с этим помочь. Но это крайне серьезная, долгая и ответственная задача
    Ответ написан
  • Какой посоветуете фреймворк (с роутингом, orm и мидлваре) для Golang?

    Не рекомендую даже пробовать.
    В Go не принято использовать такое. Какие-то люди пишут и ORM (например Gorm), и различные роутеры, но это пользуется всё меньшей популярностью. В результате вы не получите много информации, когда вам понадобится решать какие-то проблемы с этими монстрами.
    Я когда-то приходил в Go с навыками Symfony + Doctrine ORM, и тоже не понимал, как они без этого живут. И в результате понял, что в подавляющем большинстве проектов эти монстры просто не нужны и становятся обузой, когда проект развивается. Да, поначалу всё хорошо и быстро, а когда в проект приходят новые сложные фичи, начинается борьба не только с этими фичами, но и с самим фреймворком, и, особенно, с ORM. В результате получается Франкенштейн, пляшущий на костылях. Всё это еле ворочается, а Доктрина выплёвывает такие запросы, что их даже читать страшно.

    P.S. Если вот всё же хотите пойти против системы и пользоваться наворотами, то можно рассмотреть связку Gin + Gorm
    Ответ написан
    3 комментария
  • На каком слое принято обрабатывать ошибки?

    Вот вам видео про логгирование, но там как раз обсуждается, где, в каких случаях, и на каких этапах разработки лучше логгировать.
    Логгирование напрямую связано с ошибками, поэтому будет вам крайне полезно.

    https://www.youtube.com/live/p9XiOOU52Qw?si=CO1Sqx...
    Ответ написан
    2 комментария
  • Почему GORM создает пустую таблицу?

    Сделайте типы object и reference экспортируемыми. Иначе у Gorm будут проблемы с рефлексией, и он не увидит поля.
    Ответ написан
    Комментировать
  • Как сделать правильную табуляцию в html?

    Ситуация следующая: нет никаких официальных стандартов оформления HTML. Это в документации HTML нигде не прописано. Потому что для экономии трафика вообще нежелательно, чтобы в передаваемом body были лишние символы, не несущие никакой функциональности. Лишние пробелы между тегами вообще не учитываются браузером.

    Исходя из этого можно заключить, что любые style guides, которых придерживаются программисты, - это просто соглашение, действующее в рамках какой-то одной организации либо сообщества. Вы устраиваетесь на работу и там вам дадут документ либо конфигурационный файл, в котором будут перечислены все правила, которых придерживаются в данной организации: 2, 4, 8 пробелов, символ табуляции, полное отсутствие пробелов между тегами. И вот этих правил надо придерживаться.

    Таким образом, в вашей ситуации случилось одно из двух:
    • преподаватель изначально дал вам список всех правил, но вы просто забыли об этом либо пропустили это занятие. Тогда преподаватель прав, и вам надо уточнить у него весь этот список правил и сказать, что больше так не будете.
    • преподаватель не дал вам этот список, поэтому, если у вас во всём проекте одинаковое количество пробелов в отступах в HTML, то правы вы, и вы можете потребовать от преподавателя предоставить вам список правил, которые он требует, и вежливо пояснить ему, что он не прав, критикуя вас за выбор количества пробелов без предварительного предоставления подробных style guides.
    Ответ написан
  • Что чаще всего пишут на Go?

    На Go мало фреймворков, потому что у Go просто невероятная стандартная библиотека. Например, с недавним обновлением библиотеки http я тупо не вижу смысла в сторонних роутерах. Не знаю почему, какая у языка магия, но мне почти всегда хочется написать своё решение, подходящее именно для этой конкретной задачи, чем лепить монстра из внешних зависимостей.

    Основной домен языка - это Web. Это и полноценные REST (и не только) API, это и отдельные узлы систем. А я, например, стал писать на Go и фронтенд, познакомившись с замечательной JavaScript библиотекой HTMX.

    Многие люди пишут на Go консольные приложения. Я часто всякие утилитки пишу вместо того, чтобы мучиться с корявым синтаксисом bash, от которого меня тошнит.

    Кстати, Докер и Кубернетес написаны на Go, но это, скорей исключение.

    Есть даже пакеты, позволяющие писать десктопные приложения.

    На Go отлично писать всяких ботов.
    Ответ написан
    2 комментария
  • Почему не запускается PhpStorm?

    Самый очевидный способ:
    - удалите PhpStorm
    - удалите все версии Java
    - установите PhpStorm
    Ответ написан
    3 комментария
  • Как из строки с путём получить элемент массива?

    <?php
    function getArrayValueByPath($array, $path, $separator = "/")
    {
        // Разбиваем путь на ключи
        $keys = explode($separator, $path);
        // Текущий уровень массива - начинаем с корня
        $current = $array;
    
        foreach ($keys as $key) {
            // Если ключа нет в массиве, то выбрасываем исключение
            if (!isset($current[$key])) {
                throw new \Exception(
                    "Ключ $key не найден в массиве по адресу '$path'"
                );
            }
            // Переходим к следующему уровню вложенности массива
            $current = $current[$key];
        }
    
        // Возвращаем значение по заданному пути
        return $current;
    }
    
    // Использование функции:
    
    $arr = [
        "k1" => [
            "k2" => [
                "k3" => [
                    "k4" => "v",
                ],
            ],
        ],
    ];
    
    $result = getArrayValueByPath($arr, "k1/k2/k3");
    
    var_dump($result);
    
    /** Результат выполнения:
    
    array(1) {
      ["k4"]=>
      string(1) "v"
    }
    
    */
    Ответ написан
    Комментировать
  • Как научиться декомпозиции в ООП?

    Понятие "декомпозиция" бывает слишком абстрактным для понимания начинающими.
    Поэтому, я порекомендовал бы изучить принципы SOLID. Вся их сущность как раз и направлена на понимание декомпозиции.

    Есть куча книжек, роликов на ютубчике и т.д.
    Но можно начать как раз с ChatGPT.
    Задайте ему вот такую задачку:

    Объясни принципы SOLID. Используй примеры на PHP. Объясняй как десятилетнему ребёнку


    Не стесняйтесь упоминания ребенка в сложных вопросах. Он тогда очень красочно и очень понятно описывает. Такое лучше входит в мозг.
    Ответ написан
    Комментировать
  • Как реализовать вертикальные линии между блоками при адаптивной вёрстке?

    Очень часто люди зацикливаются на флексах и гридах, и забывают о такой великолепной штуке как CSS columns. Они очень мощные и позволяют как раз стилизовать разделители.

    Но... Есть нюанс... Columns - это колонки. Т.е. статьи будут заполняться колонками, а не строками, как в дефолтных grid или flex

    Ответ написан
    2 комментария
  • Почему ошибка в SendMessageParams?

    А почему бы вам не установить курсор на "SendMessageParams" и не нажать правой кнопкой мыши на этом слове, да и не перейти к объявлению типа, чтобы просто посмотреть, а какие же там поля требуются в этой структуре?
    И, странное дело, нет такого поля ReplyToMessageID у типа SendMessageParams, о чём вам прямо и говорит компилятор.

    Документация и исходный код - вот источник правды, а не устаревшие туториалы школьников на ютубчике.

    // SendMessageParams - Represents parameters of sendMessage method.
    type SendMessageParams struct {
    	// BusinessConnectionID - Optional. Unique identifier of the business connection on behalf of which the
    	// message will be sent
    	BusinessConnectionID string `json:"business_connection_id,omitempty"`
    
    	// ChatID - Unique identifier for the target chat or username of the target channel (in the format
    	// @channel_username)
    	ChatID ChatID `json:"chat_id"`
    
    	// MessageThreadID - Optional. Unique identifier for the target message thread (topic) of the forum; for
    	// forum supergroups only
    	MessageThreadID int `json:"message_thread_id,omitempty"`
    
    	// Text - Text of the message to be sent, 1-4096 characters after entities parsing
    	Text string `json:"text"`
    
    	// ParseMode - Optional. Mode for parsing entities in the message text. See formatting options
    	// (https://core.telegram.org/bots/api#formatting-options) for more details.
    	ParseMode string `json:"parse_mode,omitempty"`
    
    	// Entities - Optional. A JSON-serialized list of special entities that appear in message text, which can be
    	// specified instead of parse_mode
    	Entities []MessageEntity `json:"entities,omitempty"`
    
    	// LinkPreviewOptions - Optional. Link preview generation options for the message
    	LinkPreviewOptions *LinkPreviewOptions `json:"link_preview_options,omitempty"`
    
    	// DisableNotification - Optional. Sends the message silently
    	// (https://telegram.org/blog/channels-2-0#silent-messages). Users will receive a notification with no sound.
    	DisableNotification bool `json:"disable_notification,omitempty"`
    
    	// ProtectContent - Optional. Protects the contents of the sent message from forwarding and saving
    	ProtectContent bool `json:"protect_content,omitempty"`
    
    	// MessageEffectID - Optional. Unique identifier of the message effect to be added to the message; for
    	// private chats only
    	MessageEffectID string `json:"message_effect_id,omitempty"`
    
    	// ReplyParameters - Optional. Description of the message to reply to
    	ReplyParameters *ReplyParameters `json:"reply_parameters,omitempty"`
    
    	// ReplyMarkup - Optional. Additional interface options. A JSON-serialized object for an inline keyboard
    	// (https://core.telegram.org/bots/features#inline-keyboards), custom reply keyboard
    	// (https://core.telegram.org/bots/features#keyboards), instructions to remove a reply keyboard or to force a
    	// reply from the user
    	ReplyMarkup ReplyMarkup `json:"reply_markup,omitempty"`
    }


    А если точно так же перейти к определению типа поля ReplyParameters, то можно увидеть как раз то самое искомое вами поле MessageID

    // ReplyParameters - Describes reply parameters for the message that is being sent.
    type ReplyParameters struct {
    	// MessageID - Identifier of the message that will be replied to in the current chat, or in the chat chat_id
    	// if it is specified
    	MessageID int `json:"message_id"`
    
    	// ChatID - Optional. If the message to be replied to is from a different chat, unique identifier for the
    	// chat or username of the channel (in the format @channel_username). Not supported for messages sent on behalf
    	// of a business account.
    	ChatID ChatID `json:"chat_id,omitempty"`
    
    	// AllowSendingWithoutReply - Optional. Pass True if the message should be sent even if the specified
    	// message to be replied to is not found. Always False for replies in another chat or forum topic. Always True
    	// for messages sent on behalf of a business account.
    	AllowSendingWithoutReply bool `json:"allow_sending_without_reply,omitempty"`
    
    	// Quote - Optional. Quoted part of the message to be replied to; 0-1024 characters after entities parsing.
    	// The quote must be an exact substring of the message to be replied to, including bold, italic, underline,
    	// strikethrough, spoiler, and custom_emoji entities. The message will fail to send if the quote isn't found in
    	// the original message.
    	Quote string `json:"quote,omitempty"`
    
    	// QuoteParseMode - Optional. Mode for parsing entities in the quote. See formatting options
    	// (https://core.telegram.org/bots/api#formatting-options) for more details.
    	QuoteParseMode string `json:"quote_parse_mode,omitempty"`
    
    	// QuoteEntities - Optional. A JSON-serialized list of special entities that appear in the quote. It can be
    	// specified instead of quote_parse_mode.
    	QuoteEntities []MessageEntity `json:"quote_entities,omitempty"`
    
    	// QuotePosition - Optional. Position of the quote in the original message in UTF-16 code units
    	QuotePosition int `json:"quote_position,omitempty"`
    }


    Итого, в вашем случае будет как-то так:

    id, ticket, reply_message := db.GetTicketAndMessage(message.ReplyToMessage.MessageID, user.ID)
    	if ticket == nil {
    		_, _ = bot.SendMessage(&telego.SendMessageParams{
    			ChatID:           telego.ChatID{ID: message.Chat.ID},
    			Text:             "This ticket or message does not exist.",
    			ReplyParameters:  &telego.ReplyParameters{
                                    MessageID: message.MessageID
                            },
    			ParseMode:        "HTML",
    		})
    		return
    	}
    Ответ написан
    4 комментария
  • Как на MacOS (браузер Chrome) проинспектировать поповер, который исчезает если убрать мышку?

    Находите элемент, на котором срабатывает :hover, и потом просто устанавливаете ему насильно псевдокласс :hover.
    Таким образом он и без мышки будет находиться в этом состоянии.
    Соответственно, при этом появится и сам попап, и вы сможете спокойно его проинспектировать.

    677d33dac2b98296274838.png

    В качестве альтернативы можно использовать следующий подход:

    1. Открываете инструменты разработчика не прикреплёнными к браузеру, а в отдельном окне. Заранее открываете там консоль.

    2. Переходите в основное окно браузера и наводите мышь на нужный элемент. Выскакивает попап.

    3. Не двигая указатель мыши, переключаетесь с помощью клавиатуры на окно с инструментами разработчика, где заранее открыта консоль. Вводите там команду "debugger". Основное окно браузера фризится вместе с видимым попапом.

    4. Спокойно инспектируете попап.
    Ответ написан
    7 комментариев