p-sam / electron-prompt Goto Github PK
View Code? Open in Web Editor NEWElectron helper to prompt for a string value
License: MIT License
Electron helper to prompt for a string value
License: MIT License
The options for the prompt are not specified in written documentation for example.
Most packages nowadays include d.ts
files to support typescript type, so could you please add it here too? thanks
Hi! ๐
Firstly, thanks for your work on this project! ๐
The latest version of Electron, 14 has deprecated the {remote}
import from the electron
package and they created another package for it, @electron/remote
. using electron.remote
will cause an error saying it's undefined. So, please update it to avoid errors.
Here is the diff that solved my problem:
diff --git a/node_modules/electron-prompt/lib/index.js b/node_modules/electron-prompt/lib/index.js
index 871b75f..c5caf23 100644
--- a/node_modules/electron-prompt/lib/index.js
+++ b/node_modules/electron-prompt/lib/index.js
@@ -1,7 +1,7 @@
const electron = require('electron');
-
-const BrowserWindow = electron.BrowserWindow || electron.remote.BrowserWindow;
-const ipcMain = electron.ipcMain || electron.remote.ipcMain;
+const remote = require("@electron/remote");
+const BrowserWindow = electron.BrowserWindow || remote.BrowserWindow;
+const ipcMain = electron.ipcMain || remote.ipcMain;
const url = require('url');
const path = require('path');
This issue body was partially generated by patch-package.
Hello, the prompt can't get the input, it returns an empty string.
VS Code says: "Could not find a declaration file for module 'electron-prompt' "
I am using 1.4.0 for a dialog in my project where the user can define/input a password.
It would be great to have an object/key for min-length.
Example:
HTML5 reference:
<input type=text minlength=10>
Could someone please add a snapshot in the readme such that someone can easily preview what electron-prompt will look like? Thanks
Some of our users on Linux Mint experience issues ... pascalopitz/unoffical-sonos-controller-for-linux#119
The library is invoked here: https://github.com/pascalopitz/unoffical-sonos-controller-for-linux/blob/master/src/menu.js#L292-L303
Any ideas what causes this or how to remedy?
Hello :-)
Idea :
Have multiple input forms but it seems it's not possible with electron-prompt.
About existing solution :
There is electron-multi-prompt that is an extension to this electron-prompt.
But it doesn't work... Just a white prompt with non clickable cancel and ok buttons.
Also electron-multi-prompt repository is down...
Here the wayback machine archived version of it.
It is possible to modify the sourcecode after installing multi-prompt but I don't know where to begin to solve the issue.
Solution ?
It would be awesome to get multi inputs/selects functionality with electron-prompt
Something is wrong with the ParentWindow
electron-prompt/lib/index.js:21
Uncaught (in promise) TypeError: Right-hand side of 'instanceof' is not an object
code that caused it:
prompt({
title: 'Why is this item being added?',
label: 'Reason',
value: 'Customer Wanted to calibrate it',
inputAttrs: {
type: 'text',
width: '200px',
height: '250px'
}
})
There must be something wrong with your example code:
const prompt = require('electron-prompt');
prompt({
title: 'Prompt example',
label: 'URL:',
value: 'http://example.org',
inputAttrs: {
type: 'url'
},
type: 'select'
})
.then((r) => {
if(r === null) {
console.log('user cancelled');
} else {
console.log('result', r);
}
})
.catch(console.error);
type:select
rejects in line 28 of your module:
if (opts.type === 'select' && (opts.selectOptions === null || typeof opts.selectOptions !== 'object')) {
return reject(new Error('"selectOptions" must be an object'));
}
type: input
works
It would be great if the input field would support the placeholder tag?
Example
<input` type="text" name="fname" placeholder="First name">
Which image formats are supported?
I seem unable to use the icon feature as i always see the default icon. So far i am unsure what the problem is ....either wrong format or size or just not finding the referenced image.
Is there a way to debug the icon option?
To hide the "-" button on the title bar.
When i try opening electron prompt with even the simplest of parameters i'm getting strange error in console.
This is the sample code
prompt({
title: 'test',
label: 'test',
value: 'test',
type: 'input'
});
This is the error
(node:90465) UnhandledPromiseRejectionWarning: Error: Image could not be created from
at /private/var/www/activecollab-desktop/node_modules/electron-prompt/lib/index.js:41:22
at new Promise (<anonymous>)
at electronPrompt (/private/var/www/activecollab-desktop/node_modules/electron-prompt/lib/index.js:12:9)
at click (/private/var/www/activecollab-desktop/utils/menu.js:338:5)
at MenuItem.click (electron/js2c/browser_init.js:1481:9)
at Function.executeCommand (electron/js2c/browser_init.js:1742:13)
(node:90465) UnhandledPromiseRejectionWarning: Error: Image could not be created from
at /private/var/www/activecollab-desktop/node_modules/electron-prompt/lib/index.js:41:22
at new Promise (<anonymous>)
at electronPrompt (/private/var/www/activecollab-desktop/node_modules/electron-prompt/lib/index.js:12:9)
at click (/private/var/www/activecollab-desktop/utils/menu.js:338:5)
at MenuItem.click (electron/js2c/browser_init.js:1481:9)
at Function.executeCommand (electron/js2c/browser_init.js:1742:13)
(node:90465) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 2)
(node:90465) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 2)
Hello, is possible to use a single js file to do all the stuff? thanks in advice.
Adding an option to hide the window menu bar like you can do when you create a new window yourself ( with setMenuBarVisibility(false) ) would be nice.
The available prompt although allows keeping on top, can be hidden with workspace shift and allows interacting on other apps below it. I need to create an inescapable prompt. Some prompts need to be handled right away, which are important and need the user to get it done right away. A basic requirement could be time tracking through logging.
x-kill
on Ubuntu, for example, opens the following prompt which does not allow changing workspace or clicking elsewhere:
Not sure if it's allowed by OS, but if it could be done it would be very helpful for productivity.
It would be cool if there could be support for the touchbar for the MacBook. Electron supports this, but maybe there's a native solution available?
Thank you for your excellent code, It very fit my requirement except a little trick. I don't know how to change the 'OK' button or 'Cancel' button's text, can anyone help me, thank you in advance!
Hi friend, when I used Electron 12 and electron-prompt 1.6.1, it didn't work after setting label and input. What could be the problem?
Function used
prompt({
title: 'Prompt example',
label: 'URL:',
value: 'https://example.org',
inputAttrs: {
type: 'url'
},
type: 'input'
})
.then((r) => {
if(r === null) {
console.log('user cancelled');
} else {
console.log('result', r);
}
})
.catch(console.error);
In this case your check parentWindow instanceof BrowserWindow
always fail, because require('electron').remote.getCurrentWindow() !== require('electron').remote.BrowserWindow
. As far as I understand, getCurrentWindow
returns the wrapper over BrowserWindow
.
Here's the code to reproduce the bug:
{
"name": "ep-test",
"version": "1.0.0",
"main": "main.js",
"scripts": {
"start": "electron ."
},
"devDependencies": {
"electron": "^2.0.8"
},
"dependencies": {
"electron-prompt": "^1.1.0-1"
}
}
const {app, BrowserWindow} = require('electron')
const path = require('path')
let window
app.on('ready', () => {
const preload = path.join(__dirname, 'preload.js')
const options = {webPreferences: {nodeIntegration: false, preload}}
window = new BrowserWindow(options)
window.loadURL('https://electronjs.org/')
window.on('closed', () => window = null)
window.webContents.openDevTools()
})
const {getCurrentWindow, BrowserWindow} = require('electron').remote
const prompt = require('electron-prompt')
document.addEventListener('DOMContentLoaded', () => {
const parent = getCurrentWindow()
console.log('getCurrentWindow() === BrowserWindow:', parent === BrowserWindow)
prompt({value: 'test'}, parent)
.then(result => {
console.log(...result !== null ? ['result:', result] : ['user canceled'])
})
.catch(console.error)
})
Possible solutions:
diff --git a/lib/index.js b/lib/index.js
index 207be2c..ba76d74 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -33,11 +33,11 @@ function electronPrompt(options, parentWindow) {
width: opts.width,
height: opts.height,
resizable: opts.resizable,
- parent: parentWindow instanceof BrowserWindow ? parentWindow : null,
+ parent: parentWindow,
skipTaskbar: true,
alwaysOnTop: opts.alwaysOnTop,
useContentSize: true,
- modal: Boolean(parentWindow instanceof BrowserWindow),
+ modal: Boolean(parentWindow),
title: opts.title,
icon: opts.icon
});
diff --git a/lib/index.js b/lib/index.js
index 207be2c..41fce34 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -33,11 +33,11 @@ function electronPrompt(options, parentWindow) {
width: opts.width,
height: opts.height,
resizable: opts.resizable,
- parent: parentWindow instanceof BrowserWindow ? parentWindow : null,
+ parent: opts.forceParent || parentWindow instanceof BrowserWindow ? parentWindow : null,
skipTaskbar: true,
alwaysOnTop: opts.alwaysOnTop,
useContentSize: true,
- modal: Boolean(parentWindow instanceof BrowserWindow),
+ modal: Boolean(opts.forceParent || parentWindow instanceof BrowserWindow),
title: opts.title,
icon: opts.icon
});
Then the code prompt({forceParent: true}, getCurrentWindow())
will be work successfully.
I'm ready to make a pull request for any solution that you choose.
If you click on the main window, it will hide the prompt and you might lose it. You cant find it by alt+tab either.
Only way to get back to it is to minimize the window
I am using your example for prompting a user for a URL. However most users will copy those to the clipboard and then paste it to the text field. Is there a way to enable that?
It's default behavior of dialog windows in many platforms and frameworks. Electron dialog
module support it too.
If you don't want to do this by default, you can add an option for this.
And I'm ready to make a pull request of course.
is it possible to get the input from a text into a select option?
It would be super cool if you could add an open-source license to your project. Without it, everybody is at legal risk when using your lib.
I just tried this lib out on OSX, following the instructions in the readme exactly, and the dialog appears but it's just a titlebar with a completely white pane underneath. Tried both from renderer and main process.
Any idea what I'm doing wrong?
What is the purpose of required
? I set it to true, pressed "Okay" and the input went away triggering the result.
I am looking for a way to require a value to be input if they press "okay", if not, it will remain there until they enter one or hit cancel.
When using this, when closing the electron window of the app to terminate the app, it will not terminate completely
Hello, I am using Electron 5.0.1.
In Electron 5, the devs made it so Node integration is disabled by default.
I was having trouble finding out why prompt didn't have require(), and I discovered there was no arg that set Node integration to enabled.
So please, where the prompt is created, add webPreferences:{nodeIntegration:true}, else there is no require() function to get the needed modules. Thank you!
I am using version 1.1.0 and testing on a macbook with 2 extra monitors.
When my application window is on one of the extra monitors and I trigger the prompt, it always appears on the main screen.
I think it should appear where the triggering window is currently in.
I have run into similar issues for my project and know that you can use the API electron.screen for this.
If you add the pattern attribute to the input, it is nos being validated when you submit the form pressing "Enter" key.
It's default behavior of the prompt
function in JavaScript. Thanks to this, you can immediately start typing a text as soon as the window is open. Default text will be erased automatically.
If you don't want to do this by default, you can add an option for this.
And I'm ready to make a pull request of course.
In the "electron": "^9.0.0-beta.15" a error occurs:
{
constructor: 'Error',
stack: 'Error: Image could not be created from \n' +
' at electron/js2c/browser_init.js:6983:49\n' +
' at IpcMainImpl.<anonymous> (electron/js2c/browser_init.js:6880:27)\n' +
' at IpcMainImpl.emit (events.js:223:5)\n' +
' at WebContents.<anonymous> (electron/js2c/browser_init.js:4070:23)\n' +
' at WebContents.emit (events.js:223:5)'
}
It works well if:
let promptWindow = new BrowserWindow({
width: opts.width,
height: opts.height,
minWidth: opts.minWidth,
minHeight: opts.minHeight,
resizable: opts.resizable,
parent: parentWindow,
skipTaskbar: true,
alwaysOnTop: opts.alwaysOnTop,
useContentSize: opts.resizable,
modal: Boolean(parentWindow),
title: opts.title,
// icon: opts.icon, <- comment this line
webPreferences: {
nodeIntegration: true
}
});
When the app has no main windows, e.g. apps with tray menu only, clicking either Cancel
or OK
of the prompt dialog will causes the app exits.
I am using macOS.
Am trying to use electron-prompt to make a dialog with a numeric input.
Am getting this result.
After clicking either the button the only change appears to be that the background changes to white:
node --version:
v12.14.1
electron --version:
v8.0.0
electron-forge --version:
โ Checking your system
6.0.0-beta.49
Code;
const promptOptions = {
title: 'Run Bubble Sort example',
label: 'ms delay:',
// buttons: ['Cancel', 'Yes'],
value: 10,
inputAttrs: {
type: 'number',
// min: "1",
// max: "1000"
},
type: 'input'
};
examples.promptRun = () => {
const bw = BrowserWindow.getFocusedWindow();
prompt(promptOptions, bw)
.then((response) => {
if (response === null) {
// Cancel: button 0 clicked
} else {
examples.bubblesort();
}
})
.catch(console.error);
};
I also noticed a strange problem where webpack gave an error when I tried to debug into the prompt code.
Attempting to step into:
I get this error:
Could not load content for webpack:///./node_modules/electron-prompt/lib/index.js : HTTP status code: 404
The only difference I noticed with other npm modules I could debug into is that index.js
is in the lib dir. Others I could debug into index.js
was one level higher.
I cloned electron-forge locally and moved index.js up one level (and the code in the page folder up one leve also) and change the code so index.js
loads dependent resources form the lib directory.
With these changes I coulod step into prompt -- but all I got then was just a white window.
Thought I'd report the issues before I looked further.
I noticed that a regression was introduced, from v1.4.0 to v1.5.0: when the input is focused and the end-user presses the "Enter" key, the prompt dialog is dismissed as if the user had pressed the "Cancel" button, instead of the "OK" button.
Uncaught (in promise) Error: ERR_FILE_NOT_FOUND (-6) loading 'file:///xxxx/electron/xxxxxxx/node_modules/[email protected]@electron/dist/Electron.app/Contents/Resources/electron.asar/renderer/page/prompt.html#1618613897887-0.13384548012489894'
at rejectAndCleanup (electron/js2c/browser_init.js:205)
at Object.failListener (electron/js2c/browser_init.js:205)
at Object.emit (events.js:315)
"vue-cli-plugin-electron-builder": "^2.0.0-rc.6",
"electron": "^11.0.0",
"vue": "^2.6.11",
"electron-prompt": "^1.6.2",
hi! I have trouble in mac os version 10.13.6. I wanted to paste some string on the input, but failed. Need you help. Thanks
Using electron-prompt 1..7.0
Also:
node --version:
v14.18.1
electron --version:
v13.2.3
electron-forge:
...
โโโฌ @electron-forge/[email protected]
โโโ [email protected]
Am calling prompt() in response to a menu action:
'''
{
label: "CfA Key",
enabled: true,
click() {
cfa.prompt();
}
}
'''
Which calls this function in the main process:
let cfa_prompt = () => {
prompt({
title: 'Prompt example',
label: 'URL:',
value: 'http://example.org',
inputAttrs: {
type: 'url'
},
type: 'input'
})
.then((r) => {
if (r === null) {
console.log('user cancelled');
} else {
console.log('result', r);
}
})
.catch(console.error);
};
Which displays:
Seems related to #55 -- which is closed ... but I I didn't see a resolution in the comments for that issue???
sorry! I found how to do it.
I'm considering implementing this into my project. Let me know if this is of any interest to be added here any i'll make a pull request from my fork once it's finished and tested.
You have to install this into the app directory's package.json, not the root directory's as usual. Otherwise it fails to load the prompt with an ERR_FILE_NOT_FOUND.
See https://electron-react-boilerplate.js.org/docs/adding-dependencies for more info. Though, I'm not sure if this counts as a "native dependency."
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.