I am trying to create a bookmarklet to open a web page, populate credentials, and click login in one shot. Here is the needed bookmarklets:
For opening a webpage:
javascript:location.href='http://www.unt.edu'
For Credentials & login:
javascript:(function(){var d=document;s=d.querySelector;s.call(d,'input[name*=email]').value='YOUREMAIL@company.com'; s.call(d,'input[name*=pass]').value='SECRETPASSWORDHERE';s.call(d,'button[id*=login],input[type=button][id*=login],.btn-login').click(); }())
Is it possible to combine both of them considering the asynchronous behavior of opening the web page?
You can combine this in one bookmarklet, but you'll have to click it twice. The first click will open a website, and the next one will do the login.
javascript: (() => {
const url = 'https://stackoverflow.com/users/login';
if (location.href !== url) return (location.href = url);
document.querySelector('input#email').value = 'EMAIL';
document.querySelector('input#password').value = 'PASSWORD';
document.querySelector('button#submit-button').click();
})();
Consider using a userscript instead, which will run automatically on pageload. Set the userscript's @includes to run on http://www.unt.edu, then set the userscript's JS to the content of your current bookmarklet:
var d=document;s=d.querySelector;s.call(d,'input[name*=email]').value='YOUREMAIL@company.com'; s.call(d,'input[name*=pass]').value='SECRETPASSWORDHERE';s.call(d,'button[id*=login],input[type=button][id*=login],.btn-login').click(); }()
(though I'd recommend separating it out onto separate lines for readability and maintainability)
And then use a plain bookmark (not a bookmarklet) to http://www.unt.edu. This way, whenever you click on the bookmark, the page will load, and when the page loads, the userscript that logs you in will automatically run.