Почему не корректно отображается контент, в зависимости от состояния чекбокса?

Question

[Роман]

Всем привет. Пишу хром расширение. И у меня есть чекбокс состояния расширения. Функционал включения/отключения работает корректно. Но если чекбокс выключен исчезает весь контент. Но стоит закрыть и открыть popup окно, то контент показывается, хотя состояние чекбокса выключено. В чем моя ошибка?

<div class="toggle-container">
            <label class="switch">
                <input type="checkbox" id="toggleExtension">
                <span class="slider round"></span>
            </label>
            <span id="toggleStatus" style="display: block; font-size: 16px;">Выключено</span>
        </div>

document.addEventListener('DOMContentLoaded', function () {
    const toggleCheckbox = document.getElementById('toggleExtension');
    const toggleStatus = document.getElementById('toggleStatus');

    function showLoading() {
        document.getElementById('loadingSpinner').style.display = 'flex';
    }

    function hideLoading() {
        document.getElementById('loadingSpinner').style.display = 'none';
    }

    // Загружаем состояние чекбокса из хранилища
    chrome.storage.local.get(['extensionEnabled'], (result) => {
        const isEnabled = result.extensionEnabled !== undefined ? result.extensionEnabled : true;
        toggleCheckbox.checked = isEnabled;
        updateToggleStatus(isEnabled);
        toggleForms(isEnabled); 
    });

    // Обработчик изменения состояния чекбокса
    toggleCheckbox.addEventListener('change', (event) => {
        const isEnabled = event.target.checked;
        chrome.storage.local.set({ extensionEnabled: isEnabled }, () => {
            updateToggleStatus(isEnabled);
            toggleForms(isEnabled);

            // Отправляем сообщение в контент-скрипт
            chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
                if (tabs.length > 0) {
                    chrome.tabs.sendMessage(tabs[0].id, { type: "EXTENSION_TOGGLE", enabled: isEnabled });
                }
            });
        });
    });

    // Функция для обновления текста статуса
    function updateToggleStatus(isEnabled) {
        toggleStatus.textContent = isEnabled ? 'Включено' : 'Выключено';
    }

    // Функция для скрытия/показа форм
    function toggleForms(isEnabled) {
        const forms = document.querySelectorAll('#register_form, #login_form, #reset_password_form, #main');
        forms.forEach(form => {
            form.style.display = isEnabled ? 'block' : 'none';
        });

        if (!isEnabled) {
            // Если расширение выключено, показываем только статус
            document.querySelector('.toggle-container').style.display = 'block';
        } else {
            checkAuth();
        }
    }
async function checkAuth() {
        const loadingSpinner = document.getElementById('loadingSpinner');
        const mainContent = document.getElementById('main');
        const loginForm = document.getElementById('login_form');

        showLoading();
        try {
            const storageData = await chrome.storage.local.get(['token', 'sessionToken', 'role']);
            const token = storageData.token;
            const sessionToken = storageData.sessionToken;
            const role = storageData.role;

            if (!token || !sessionToken) {
                console.warn('Токен отсутствует. Показываем форму входа.');
                showForm('login_form');
                return;
            }

            const response = await fetch('https://..............ru/check-user-status', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'Authorization': token,
                    'session-token': sessionToken
                }
            });

            const data = await response.json();

            if (data.success && data.data.authorized) {
                showForm('main');
                if (data.data.role === 'admin') {
                    document.getElementById('adminPanel').style.display = 'block';
                } else {
                    document.getElementById('adminPanel').style.display = 'none';
                }

                if (!data.data.subscriptionActive && !data.data.trialActive) {
                    blockUI();
                } else {
                    unblockUI();
                }
            } else {
                showForm('login_form');
            }
        } catch (error) {
            console.error('Ошибка при проверке авторизации:', error);
            showForm('login_form');
        } finally {
            // Скрываем спиннер, показываем контент
            hideLoading()
        }
    }
}