Сделать приложение «Реактивный электрон» перетаскиваемым с прозрачной рамкой

Question

Я пытаюсь реализовать это в приложении React Electron. Я пытался использовать свойства CSS, как указано выше, но он пока не работает. Другое решение с окном браузера не совсем работает, так как мое приложение находится в React с приложением, обернутым в Context.Provider. Вот код, который у меня есть:

В app.tsx

<ApplicationContext.Provider value={{
    ...this.state,

  }}
>
<div id="app" className={appTheme}>
  <header className="title-bar">
    {/* more code */}
  </header>
</div>

И это в App.s css

.title-bar {
  -webkit-user-select: none;
  -webkit-app-region: drag;
}

Кто-нибудь знает, есть ли лучшая стратегия для решения этой проблемы в приложении React Electron?

Answer 1

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

Я использовал Electron 5, я обновил до последней версии v7 на проекте, и глобально на моей машине. Кроме того, окно Electron запускается с окном инструментов Chrome dev, закрепленным справа от приложения. Когда я закрыл это, я смог перетащить окно. Я смог отсоединить инструменты разработчика, и это также позволило перетаскивать окно.