The site I’m trying to userscript for requires an account to see where the issue is occurring.
https://www.recipal.com/log_in
Then visit https://www.recipal.com/recipes/1698297/edit to see the input box in question. The script successfully inputs a value, the front-end reflects that the box is focused, but the anticipated result does not occur from simulating the keypress.
From comparing the console outputs of a simulated press and a real one, the only thing I can see that varies is the originalEvent attribute, which seemingly cannot be spoofed?
Any insights would be greatly appreciated.
jQuery code used to produce the input:
var press = jQuery.Event("keypress");
press.which = 13;
press.keyCode = 13;
press.charCode = 13;
press.key='Enter';
press.bubbles=true;
$('#search_field').attr('tabindex',1);
$('#search_field').focus().trigger('click').val("chicken");
setTimeout(()=>{
$('#search_field').trigger(press).trigger('keyup');
},1000);
console output:
{
"type": "keypress",
"timeStamp": 1704464067050,
"jQuery34105937047508940263": true,
"which": 13,
"keyCode": 13,
"charCode": 13,
"key": "Enter",
"bubbles": true,
"isTrigger": 3,
"namespace": "",
"rnamespace": null,
"target": {
"jQuery341059370475089402631": {
"events": {
"focus": [
{
"type": "focus",
"origType": "focus",
"guid": 118,
"namespace": false
},
{
"type": "focus",
"origType": "focus",
"guid": 117,
"namespace": ""
}
]
},
"focus": false
}
},
"delegateTarget": {
"location": {
"ancestorOrigins": {},
"href": "https://www.recipal.com/recipes/1230714/edit",
"origin": "https://www.recipal.com",
"protocol": "https:",
"host": "www.recipal.com",
"hostname": "www.recipal.com",
"port": "",
"pathname": "/recipes/1230714/edit",
"search": "",
"hash": ""
},
"jQuery341059370475089402631": {
"events": {
"mouseup": [
{
"type": "mouseup",
"origType": "mouseup",
"guid": 3,
"namespace": ""
}
],
"change": [
{
"type": "change",
"origType": "change",
"guid": 5,
"selector": "#faSizeIngred",
"needsContext": false,
"namespace": ""
}
],
"keypress": [
{
"type": "keypress",
"origType": "keypress",
"guid": 6,
"selector": "#search_field",
"needsContext": false,
"namespace": ""
}
],
"focusin": [
{
"type": "focusin",
"origType": "focus",
"guid": 7,
"selector": "#search_field",
"needsContext": false,
"namespace": ""
}
],
"click": [
{
"type": "click",
"origType": "click",
"guid": 8,
"selector": ".btn-addtorecipe:not(.btn-mini)",
"needsContext": false,
"namespace": ""
},
{
"type": "click",
"origType": "click",
"guid": 10,
"selector": "#pushMacs",
"needsContext": false,
"namespace": ""
},
{
"type": "click",
"origType": "click",
"guid": 30,
"namespace": "menu1"
},
{
"type": "click",
"origType": "click",
"guid": 54,
"namespace": "menu3"
},
{
"type": "click",
"origType": "click",
"guid": 78,
"namespace": "menu5"
},
{
"type": "click",
"origType": "click",
"guid": 102,
"namespace": "menu7"
}
],
"keyup": [
{
"type": "keyup",
"origType": "keyup",
"guid": 9,
"selector": "#faAggredName",
"needsContext": false,
"namespace": ""
}
]
},
"focusin": 1
}
},
"currentTarget": {
"jQuery341059370475089402631": {
"events": {
"focus": [
{
"type": "focus",
"origType": "focus",
"guid": 118,
"namespace": false
},
{
"type": "focus",
"origType": "focus",
"guid": 117,
"namespace": ""
}
]
},
"focus": false
}
},
"handleObj": {
"type": "keypress",
"origType": "keypress",
"guid": 6,
"selector": "#search_field",
"needsContext": false,
"namespace": ""
}
}
Human input event data:
{
"originalEvent": {
"isTrusted": true
},
"type": "keypress",
"target": {
"jQuery341059370475089402631": {
"events": {
"focus": [
{
"type": "focus",
"origType": "focus",
"guid": 118,
"namespace": false
},
{
"type": "focus",
"origType": "focus",
"guid": 117,
"namespace": ""
}
]
},
"focus": false
}
},
"currentTarget": {
"jQuery341059370475089402631": {
"events": {
"focus": [
{
"type": "focus",
"origType": "focus",
"guid": 118,
"namespace": false
},
{
"type": "focus",
"origType": "focus",
"guid": 117,
"namespace": ""
}
]
},
"focus": false
}
},
"timeStamp": 24011519.5,
"jQuery34105937047508940263": true,
"delegateTarget": {
"location": {
"ancestorOrigins": {},
"href": "https://www.recipal.com/recipes/1230714/edit",
"origin": "https://www.recipal.com",
"protocol": "https:",
"host": "www.recipal.com",
"hostname": "www.recipal.com",
"port": "",
"pathname": "/recipes/1230714/edit",
"search": "",
"hash": ""
},
"jQuery341059370475089402631": {
"events": {
"mouseup": [
{
"type": "mouseup",
"origType": "mouseup",
"guid": 3,
"namespace": ""
}
],
"change": [
{
"type": "change",
"origType": "change",
"guid": 5,
"selector": "#faSizeIngred",
"needsContext": false,
"namespace": ""
}
],
"keypress": [
{
"type": "keypress",
"origType": "keypress",
"guid": 6,
"selector": "#search_field",
"needsContext": false,
"namespace": ""
}
],
"focusin": [
{
"type": "focusin",
"origType": "focus",
"guid": 7,
"selector": "#search_field",
"needsContext": false,
"namespace": ""
}
],
"click": [
{
"type": "click",
"origType": "click",
"guid": 8,
"selector": ".btn-addtorecipe:not(.btn-mini)",
"needsContext": false,
"namespace": ""
},
{
"type": "click",
"origType": "click",
"guid": 10,
"selector": "#pushMacs",
"needsContext": false,
"namespace": ""
},
{
"type": "click",
"origType": "click",
"guid": 30,
"namespace": "menu1"
},
{
"type": "click",
"origType": "click",
"guid": 54,
"namespace": "menu3"
},
{
"type": "click",
"origType": "click",
"guid": 78,
"namespace": "menu5"
},
{
"type": "click",
"origType": "click",
"guid": 102,
"namespace": "menu7"
}
],
"keyup": [
{
"type": "keyup",
"origType": "keyup",
"guid": 9,
"selector": "#faAggredName",
"needsContext": false,
"namespace": ""
}
]
},
"focusin": 1
}
},
"handleObj": {
"type": "keypress",
"origType": "keypress",
"guid": 6,
"selector": "#search_field",
"needsContext": false,
"namespace": ""
}
}