Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Fill Out Forms Quickly With Hotkey
/**
* Fill Out Forms Quickly With Hotkey
*
* Usage:
* 1. Modify `contentsByKey`;
* 2. Paste these lines into website's console ( Ctrl/Cmd + Shift + I );
* 3. Focus target element which you what to fill in page,
* then press hot key, content will be fill in.
*
* Author:
* kingcc <eof@null.net>
*/
const contentsByKey = {
1: 'Content to fill when `1` is pressed',
2: 'Content to fill when `2` is pressed',
}
const keys = Object.keys(contentsByKey)
function detectFrameWork(window) {
if (window.React || $('[data-reactroot], [data-reactid]')) {
return 'ReactJS'
}
if (window.angular ||
$('.ng-binding, [ng-app], [data-ng-app], [ng-controller], [data-ng-controller], [ng-repeat], [data-ng-repeat]') ||
$('script[src*="angular.js"], script[src*="angular.min.js"]')
) {
return 'AngularJS'
}
if (window.Backbone) return 'BackboneJS'
if (window.Ember) return 'EmberJS'
if (window.Vue) return 'VueJS'
if (window.Meteor) return 'MeteorJS'
if (window.Zepto) return 'ZeptoJS'
if (window.jQuery) return 'jQueryJS'
}
function changeValue(input, value) {
const frameWork = detectFrameWork(window)
switch (frameWork) {
case 'ReactJS':
case 'VueJS':
case 'AngularJS':
const nativeInputValueSetter = Object.getOwnPropertyDescriptor(
window.HTMLInputElement.prototype,
'value'
).set
nativeInputValueSetter.call(input, value)
break
default:
input.value = value
}
const inputEvent = new Event('input', { bubbles: true })
input.dispatchEvent(inputEvent)
}
document.addEventListener('keyup', (e) => {
if (keys.includes(e.key)) {
changeValue(e.target, contentsByKey[e.key])
}
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment