Можно ли скрыть всплывающее окно до тех пор, пока не будет выполнен какой-либо код?

Question

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

Я заставил его работать, но это не самое элегантное решение, вот как я это делаю

В в нем нет содержания , и он импортирует сценарий.

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

Если сообщение не может быть отправлено, оно пытается внедрить скрипт на страницу, если инъекция работает, то сообщение отправляется снова, если нет, то мы находимся на странице, которая не позволяет инъекцию, в этом В этом случае мы просто отображаем контент в теле всплывающего окна (здесь я использую Svelte)

      browser.tabs.query({active: true, currentWindow: true}).then(tabs => {
  const tab = tabs[0];

  browser.tabs.sendMessage(tab.id, {action: "toggle"}).then(() => {
    window.close();
  }).catch(() => {

    injectScript(tab).then(() => {
      browser.tabs.sendMessage(tab.id, {action: "toggle"}).then(() => {
        window.close();
      });
    }).catch(() => {
      
      document.body.style.width="400px";
      document.documentElement.style.height="580px";

      new App({
        target: document.body,
      });

    });
  });
});

Дело в том, что в большинстве случаев этот процесс в основном мгновенный, вы просто щелкаете значок, и появляется настраиваемое всплывающее окно, но иногда это занимает немного больше времени (может быть, 1 секунду?), И за это время вы можете увидеть "традиционное всплывающее окно" на его минимальном размере (может быть, что-то около 32x32? Это действительно маленький квадрат)

Я бы хотел, чтобы всплывающее окно было скрыто до тех пор, пока мой код не «решит», можно ли вставлять контент на страницу.

Что пробовал и не работает:

• Установка ширины и / или высоты тегов и / или на 0 пикселей
• Отображение настроек: нет и / или видимость: скрыто на и / или тегах

Есть ли способ сделать то, что я ищу?

Answer 1

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