I have been hired for a project.
This project is a react app wrapped in an electron.
The electron browser windows setting is set to alwaysOnTop.
I need to be able to toggle this on run, from the react code.
I tried to get the app or window by importing from the electron lib. as shown here, and descripted here
import { app, BrowserWindow } from 'electron'
The browserwindow doesn’t exist when doing this, and breaks the app.
The app is there. but I can't figure out where to go from there, since it contains a lot. but doesn’t look like there is anything relation to the browser window. (Inspect it by logging the app out when running the app)
If anyone out there know anything about how to get this working, I would be a happy panda.
Anyway, Thanks for your time
----- UPDATE BY REQUEST ----
I am trying to get access to the window that the application is running in so I can change the alwaysOnTop properties for the main application, by something like an event, fired in the application.
If I Import the BrowserWindow, the system will run. but whenever I try to read anything from this. this system breaks. I know that BrowserWindow is not an object. But I can't seem to see if BrowserWindow should contain a way to get the current open window.
I'm not trying to read the BrowserWindow before it is created. since I am trying to read it for the main window. and not a new BrowserWindow.
The Electron app have json setting. In this there is browserWindow setting, with the alwaysOnTop value. as shown below. If I change it to false, the main App is not running as always on top. But from default I want it to run as always on top. and the from an event like a button click, in the react part of the system. set it to false.
{
"browserWindow": {
"alwaysOnTop": true,
}
}
Hope this helps explain my problem. if not. let me know.
thanks for your time
Related
I am very new in React. As part of a dashboard development I am trying to use COREUI react template.
https://coreui.io/
Installed everything and when trying to execute I have got the dashboard opened without much trouble.
But it looks like it automatically refreshes every 2-3 seconds without any change in page. And in terminal I can see below message.
What I did wrong or do I need to do something from my end to fix this behavior?
I published an app in the app store, the app was made in react native.
Everything in the app works fine except for a page, when i click to a button to navigate to other page using react navigation i can see the page for 0.5 seconds then i get a blank page.
The app is published in the app store and this happens when i use the real app download from the store, when i use the local app with expo this doesn’t happen and i have no error
enter image description here
This is a screen of the blank page
Apologies if my english is bad hope someone can solve this, happy to answer to questions.
In this case -
the First check is all dynamic value set states are correct.
check the paths of all import libraries and components.
Check library one by one is supported or not
Check UI by commenting one by one.
Check all the functions where the value is setting state properly or not
i'm working on a react app (using create react app) but my live server is not working. When ever i start it i.e run the command of npm start it open a browser tab and keep on loading... Anyone knows whats the issue.
Actually, there was an infinite loop in my program. I was calling a component inside it. Which was causing the issue.
I am working on an electron application used for display management. The app is used in malls/restaurants/airports for digital display ads. The electron app internally loads a react web-app and then displays it. The react web-app comes from our vendor who has a platform for displaying ads from different vendors. The react web-app is crashing in some instances (it is not able to find the correct ad etc). I am unable to debug this crash because the console.log messages from react web-app are not shown anywhere.
Is there a way to redirect the console.logs from the react application to some file?
Architecture:
- Electron App is a full-screen container for playing any content.
- Vendor provides a web-app, which plays different ads. This web-app is a react application.
- Vendor web-app crashes, but not able to see those logs anywhere.
According to the documentation, if you are trying to debug a renderer process you can open dev tools for this by calling the openDevToos() method on instances of webContents.
This is an example:
const { BrowserWindow } = require('electron')
let win = new BrowserWindow()
win.webContents.openDevTools()
If you are trying to debug the main process, you should be able to leverage Google Chrome developer tools. If you open chrome and go to: chrome://inspect, you should be able to see your electron instance and click "inspect".
There are a few more options, which you can find here but I am of the opinion that these are the two simplest approaches.
I would also suggest leveraging debugger statements, as it will halt the execution of the code where you declare a debugger statement, and you could pin point more easily where the crash is happening.
I started exploring react-native. One thing which I want is should able to debug my app from chrome. I am having prior experience to cordova. Cordova renders app in chrome web view. I understand that with react-native it is not possible because react-native doesn't render app on web view.
There is an option react-native "debug in chrome". When I click this option, attached screenshot is getting opened. I enabled "pause on exception."
But nothing is happening. I am unable to see my app code at all.
I like to do step by step debugging. Is it possible? If so can some one tell how to do this?
You can definitely examine the source code, set breakpoints, etc in Chrome.
In the Sources menu, select debuggerWorker.js and then you should be able to see your project tree.
Any console.log in your code will print to the browser too. But I find the breakpoint inspection most helpful.
this is simple as you were doing in cordova.
try to put debugger; statement in your code while in debug mode.
It will set the breakpoint and you can then debug your application. No need to find out your files in debuggerWorker.js