Problem z logowaniem przy użyciu kontrolki Chrome

Mam problem z logowaniem na stronę
https://fleets.bolt.eu/v2/login

Delphi 10.4 community

Osadziłem Chrome na formie poprzez CEF4Delphi
działa, pokazuje się strona
następnie chcę się zalogować na powyższą stronę, ale to nie działa.

W przykładzie DOMVisitor dodaję własny przycisk i uzupełniam kod

procedure TDOMVisitorFrm.Button1Click(Sender: TObject);
begin
  Chromium1.Browser.MainFrame.ExecuteJavaScript('document.getElementById("email").value= "XXXX";', '', 0);
  Chromium1.Browser.MainFrame.ExecuteJavaScript('document.getElementById("current-password").value= "XXXX";', '', 0);
  Chromium1.Browser.MainFrame.ExecuteJavaScript('document.getElementsByTagName("form")[0].submit();', '', 0);
end;

Widzę jak dane są uzupełniane ale dostaję komunikat

403 ERROR
The request could not be satisfied.
This distribution is not configured to allow the HTTP request method that was used for this request. The distribution supports only cachable requests. We can't connect to the server for this app or website at this time. There might be too much traffic or a configuration error. Try again later, or contact the app or website owner.
If you provide content to customers through CloudFront, you can find steps to troubleshoot and help prevent this error by reviewing the CloudFront documentation.
Generated by cloudfront (CloudFront)
Request ID: Gibb7DRILMn9_uyKFACON7aoTIxXXpg4xHloYcikMlsZf0n2r9rVuQ==

I oczywiście niegatywne logowanie.

Jeżeli w oknie wkleję dane (Ctrl+V) i nacisnę przycisk logowania to logowanie jest prawidłowe.

Może ktoś doradzić co zrobić?

To samo się dzieje w przeglądarce jak się wywoła ten kod. Po prostu założyli listenera na kliknięcie przycisku.

Nie submituj forma tylko znajdź przycisk i na nim click wywołaj

Czyli:

const e = new Event("click");
		
XXX.dispatchEvent(e);

Tylko jak znaleźć przycisk który nie ma id ani name, po "Caption"?

document.getElementsByTagName('button') iterujesz po liście, jak jest jeden to robisz na nim .click() jak nie to szukasz, który ma text lub class po którym możesz go zidentyfikować.

karol75 napisał(a):

Czyli:

const e = new Event("click");
		
XXX.dispatchEvent(e);

Tylko jak znaleźć przycisk który nie ma id ani name, po "Caption"?

document.querySelector('form button[type="submit"]')

I kicha
Podzieliłem na dwa przyciski aby być pewnym że to działa .

var
  skrypt: String;

begin
  skrypt :=
  { } 'document.getElementById("email").value= "XXX";' +
  { } 'document.getElementById("current-password").value= "XXX";' +
  { } '';
  FMXChromium1.browser.MainFrame.ExecuteJavaScript(skrypt, '', 0);

end;

Po wykonaniu widzę tekst w odpowiednich polach

Drugi przycisk

var
  skrypt: String;

begin
  skrypt :=
  { } 'var buttons = document.getElementsByTagName("button");' +
  { } 'for(let button of buttons){' +
  { } 'if (button.innerText=="Log in"){' +
  { } '  button.click();' +
  { } '  console.log(button.innerText);' +
  { } '  }' +
  { } '};' +
  { } '';
  FMXChromium1.browser.MainFrame.ExecuteJavaScript(skrypt, '', 0);

end;

Akcja się wykonuje ale tak jakby usuwało dane z pól przed wysłaniem danych.

Przetestowałem podejście i:
Poprzez Ctrl+V wklejam usera i hasło następnie wykonuję drugi przycisk i loguje się poprawnie.

Może też symulować przyciskanie klawiatury do wpisywania?

Czy ta funkcja może w tym grzebać?

function m(e, t, n) {
                                return void 0 === n && (n = !1),
                                function() {
                                    var r = [].slice.call(arguments);
                                    try {
                                        var o = t(r)
                                          , a = o.get();
                                        if (n && e.apply(this, r),
                                        "function" !== typeof a)
                                            return e.apply(this, r);
                                        if (a.__trace__)
                                            o.replace(a.__trace__);
                                        else {
                                            var i = f();
                                            a.__trace__ = function() {
                                                d(i),
                                                h((function() {
                                                    d(null)
                                                }
                                                ), 0);
                                                var e = a.apply(this, arguments);
                                                return d(null),
                                                e
                                            }
                                            ,
                                            a.__trace__.__trace__ = a.__trace__,
                                            o.replace(a.__trace__)
                                        }
                                    } catch (s) {}
                                    if (e.apply)
                                        return e.apply(this, r);
                                    switch (r.length) {
                                    case 1:
                                        return e(r[0]);
                                    case 2:
                                        return e(r[0], r[1]);
                                    default:
                                        return e()
                                    }
                                }
                            }
                        },

Strona jest zbudowana na react jest metoda onchange podpięta można zasymulować jej wywołanie.

Spróbuj czegoś takiego :>
document.getElementById("email")[Object.entries(document.getElementById("email")).filter((e) => e[0].startsWith("__reactProps"))[0][0]].onChange({"target": {"value": "twoj email"}})

Wydaje mi się, że to pomoże :P
Albo słaby ze mnie haxior, ale można też to zrobić na niższym poziomie czyli po prostu http requesty wysyłać bezpośrednio, a nie przez webview.

Jesteś Hasior :-D, działa, dzięki.

Kompletny kod do logowania

var
  skrypt: String;
begin
  skrypt :=
  { } 'document.getElementById("email").value= "XXXXXXXXXX";' +
  { } 'document.getElementById("email")[Object.entries(document.getElementById("email")).filter((e) => e[0].startsWith("__reactProps"))[0][0]].onChange({"target": {"value": "XXXXXXXXXXX"}});'+
  { } 'document.getElementById("current-password").value= "XXXXXXXX";' +
  { } 'document.getElementById("current-password")[Object.entries(document.getElementById("current-password")).filter((e) => e[0].startsWith("__reactProps"))[0][0]].onChange({"target": {"value": "XXXXXXXXXX"}});'+
  { } 'var buttons = document.getElementsByTagName("button");' +
  { } 'for(let button of buttons){' +
  { } 'if (button.innerText=="Log in"){' +
  { } '  button.click();' +
  { } '  }' +
  { } '};' +
  { } '';
  Chromium1.browser.MainFrame.ExecuteJavaScript(skrypt, '', 0);
end;