Дайте BrowserWindow время применить изменения стиля

Question

В моем электронном BrowserWindow у меня есть загрузчик (спиннер), чтобы указать, что приложение работает.

<div class="loader" id="pleasewait" style="display: none;"></div>

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

document.getElementById('pleasewait').style.display = 'block';
longRunningTask();
document.getElementById('pleasewait').style.display = 'none';

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

Примечание: Я также следовал за этим постом и инкапсулировал longRunningTask в electron-remote, но без разницы.

Answer 1

Обычный способ - отложить выполнение остальной части кода сразу после следующего этапа рендеринга, используя функцию setTimeout () со значением задержки 0 (по умолчанию):

document.getElementById('pleasewait').style.display = 'block';
setTimeout
(
    () =>
    {
        longRunningTask();
        document.getElementById('pleasewait').style.display = 'none';
    }
);