0

I have a problem regarding filling out an input field with JavaScript.

The reson i try using javascript for this, is i want my flutter android app to open the website as an webview and fill out the input fields.

For testing i run my javascript code in chrome as a script snippet.

I am trying to fill out the input fields of this Webseite : https://topup.klarna.com/stw_dusseldorf, but if i use document.getElementById("cs-card-number").value = "12345"; the change goes away if i interact with the website;

I tried triggering the input Event, but it did not work either.

I even tried recreating the same input event as it would be triggered if i manuly typ something in

var event = new InputEvent('input');
 event.value = "1";
//event.isTrusted = true
//Object.defineProperty(event, 'isTrusted', {writable: false, value: true});
Object.defineProperty(event, 'bubbles', {writable: false, value: true});
Object.defineProperty(event, 'cancelBubble', {writable: false, value: false});
Object.defineProperty(event, 'cancelable', {writable: false, value: false});
Object.defineProperty(event, 'composed', {writable: false, value: true});
Object.defineProperty(event, 'currentTarget', {writable: false, value: document});
Object.defineProperty(event, 'data', {writable: false, value: "1"});
Object.defineProperty(event, 'dataTransfer', {writable: false, value: null});
Object.defineProperty(event, 'defaultPrevented', {writable: false, value: false});
Object.defineProperty(event, 'detail', {writable: false, value: 0});
Object.defineProperty(event, 'eventPhase', {writable: false, value: 3});
Object.defineProperty(event, 'inputType', {writable: false, value: "insertText"});
Object.defineProperty(event, 'isComposing', {writable: false, value: false});
Object.defineProperty(event, 'path', {writable: false, value: [$("input#cs-card-number-confirm"), $("div#cs-card-number-confirm__text-wrapper"), $("div#cs-card-number-confirm__container"), $("label"), $("div#cs-card-number-confirm__root"), $("div"), $("div.sc-keyyzf.glhkcc"), $("div.sc-fjdhpx.huktqi"), $("div.sc-iwskbi.hwpiky"), $("div.sc-brqgnp.doeca"), $("div.sc-jwbwvp.efkmfx"), $("div#root"), $("body"), $("html"), document, Window]});
Object.defineProperty(event, 'returnValue', {writable: false, value: true});
Object.defineProperty(event, 'sourceCapabilities', {writable: false, value: null});
Object.defineProperty(event, 'srcElement', {writable: false, value: ele});
Object.defineProperty(event, 'target', {writable: false, value: ele});
event.type= "input"

document.dispatchEvent(event);

Also have tried using

document.getElementById("cs-card-number").setAttribute("value", "1234");

I am out of ideas how to do this. If somebody knew how to do this, it would be a great help.

6
  • did you try set attribute? : document.getElementById('test').setAttribute('value', test); Commented Jan 21, 2022 at 17:11
  • yes have tried that too Commented Jan 21, 2022 at 17:24
  • Have you checked the browser console for errors? What exactly does "interact with the website" mean? Commented Jan 21, 2022 at 17:26
  • yea checked the console no errors. With interact i mean hovering with the mouse over the input fields. Commented Jan 21, 2022 at 17:30
  • 1
    Thank you the answer stackoverflow.com/a/66329563/17995477 from you suggestion Question worked. Thank you Commented Jan 21, 2022 at 18:21

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.