How can I call an action from my vue store when my electron app comes into focus...?
const {BrowserWindow} = require('electron')
let win = new BrowserWindow()
win.on('focus', () => {
//dispatch action call loadSettings()
})
Related
I am using Vitest along with Testing Library - Vue for unit testing my frontend code. I have been following this pattern:
describe("LoadingSpinner", () => {
const defaultWidth = "4rem";
const defaultHeight = "4rem";
it("should have a default height of 4rem when no props are passed", async () => {
const wrapper = render(LoadingSpinner);
const component = await screen.findByRole("status");
expect(component.style.height).toBe(defaultHeight);
wrapper.unmount();
});
//etc...
}
I am wondering if there is a better way to automatically unmount the wrapper, rather than manually calling wrapper.unmount()? If I don't unmount the wrapper, each test creates a new LoadingSpinner and thus screen.findByRole() fails.
I am using vue-cli-electron-builder. So how I can quit the application from a button in vue. Thanks.
In your script tag you may create a button on your page and give it an event listener like:
window.close()
or
app.exit(0)
Try that
// In your renderer process
const {ipcRenderer} = require('electron');
const closeApp = document.getElementById('closeApp');
closeApp.addEventListener('click', () => {
ipcRenderer.send('close-me')
});
// In your app main process
const {ipcMain} = require('electron')
ipcMain.on('close-me', (evt, arg) => {
app.quit()
})
Hi guys I'm building an app with multiple windows,
My App is developed in Vue + Electron
The main feature I'm trying to accomplish is when the user for example wants to do some action in electron open popup for example, and next I want to send action to Vuex store to display message to user
So How can I call Vuex action from electron?
Code Sample:
Vue component:
import { remote, ipcRenderer } from 'electron';
ipcRenderer.send('openPopup', id);
Electron Code:
import { ipcMain, app } from 'electron';
ipcMain.on('openPopup', (event, args) => {
console.log('do some action');
// now how can I call vuex action from here
});
I tried calling it with:
this.$store
but its undefined
You could simply return the desired data back to the renderer process in the ipcMain.on event.
I would also recommend using ipcRenderer.invoke / ipcMain.handle (Electron Doc - ipcMain)
// Main process
ipcMain.handle('openPopup', async (event, ...args) => {
const result = await somePromise(...args)
return result
})
// Renderer process
async () => {
const result = await ipcRenderer.invoke('open-popup', id)
// this.$store.dispatch(....) etc etc
}
I tried adding push notification with the expo, I am able to push notification from the server but even though the app is in foreground notification handler is not triggered,
I have replicated the documentation example from expo-notifications
export default function App(props) {
const [expoPushToken, setExpoPushToken] = useState('');
const [notification, setNotification] = useState(false);
const notificationListener = useRef();
const responseListener = useRef();
useEffect(() => {
registerForPushNotificationsAsync().then(token => setExpoPushToken(token));
notificationListener.current = Notifications.addNotificationReceivedListener(notification => {
setNotification(notification);
});
responseListener.current = Notifications.addNotificationResponseReceivedListener(response => {
console.log(respone)
});
}, []);
registerForPushNotificationsAsync() should be an async function that would be in your App Component here. In the example from expo it is added bellow the component as convention.
Further more the 'response' would only be logged after you press the push notification.
The other listener notificationListener is setting a state in your example here, so is not being logged maybe.
If you are using a bare workflow also add useNextNotificationsApi: true to app.json in your android object.
new to React Native here.
I have a simple component/screen with this code:
useEffect(() => {
console.log("OPENING LOGIN");
AppState.addEventListener("change", testFunction);
return (() => {
console.log("Removing HELLO LISTENER");
AppState.removeEventListener("change", testFunction);
});
}, []);
const testFunction = () => {
console.log("APPSTATE CHANGE FUNCTION RUNNING");
};
const changeScreen = () => {
return props.navigation.navigate("MainView", {});
};
This starts a eventListener when the component is mounted. When the component is unmounted, I log something else out, and would like to remove the same listener.
However, when the changeScreen function is fired, which navigates the user to a whole new component/screen, I do not receive the "Removing HELLO LISTENER" log, and the listener still fires.
My question is:
Why is this component not unmounted when naivagting to a new Screen?
Thank you for your time!