[Pregunta]: ¿Como escribir en un input con javascript?

[**Aincrad**]

Como dice el titulo , parece sencillo pero no lo logro.

Intento iniciar sesión en Netflix : https://www.netflix.com/login

Pero al escribir en el campo, por alguna razón es como si no lo hubiera escrito.

Código (javascript) [Seleccionar] Expandir

document.getElementById('id_userLoginId').value = 'UserEmail';

Incluso intente escribir en el atributo directamente, pero no funciona :

Código (javascript) [Seleccionar] Expandir

document.getElementById('id_userLoginId').setAttribute('value', 'UserEmail');

Espero puedan ayudarme , Gracias de antemano.

[MinusFour]

El problema es que debe estar guardando los inputs en algún estado.

Por ejemplo:

Código (javascript) [Seleccionar] Expandir


let myInput = document.querySelector('#myInput');

{
   let state = '';
   myInput.addEventListener('input', (e) => {
       state = e.currentTarget.value;
   });
 
   myInput.addEventListener('focus', (e) => {
       e.currentTarget.value = state;
   });
}

Y si la página envía los valores directos desde este estado pues no tiene ni caso intentar hacer submit si no puedes escribir al estado directamente (y por lo general esto es así).

[**Aincrad**]

vale, entonces no puedo hacerlo ?

otra pregunta, sabes como funcionan los navegadores para llenar el campo user/password guardados en el navegador? , osea google chrome me auto completa el user en netflix perfectamente, pero no se como trabaja.... 

de todos modos, gracias.

[MinusFour]

vale, entonces no puedo hacerlo ?

otra pregunta, sabes como funcionan los navegadores para llenar el campo user/password guardados en el navegador? , osea google chrome me auto completa el user en netflix perfectamente, pero no se como trabaja....  

de todos modos, gracias.

Pues, en teoría debes poder simular un evento que provoque el cambio. Sin embargo, estuve probando bastante formas de enviar esos eventos y simplemente no pude reproducir el evento.

Del auto fill de google chrome no se como trabaja tampoco.

Edit: Vaya pues, es algo de React... Se está ahorrando eventos de una manera que todavía no comprendo muy bien. Aquí una función correcta (sacada de SO).

Código (javascript) [Seleccionar] Expandir

const triggerInputChange = (node, inputValue) => {
     const descriptor = Object.getOwnPropertyDescriptor(node, 'value');

     node.value = `${inputValue}#`;
     if (descriptor && descriptor.configurable) {
       delete node.value;
     }
     node.value = inputValue;

     const e = document.createEvent('HTMLEvents');
     e.initEvent('change', true, false);
     node.dispatchEvent(e);

     if (descriptor) {
       Object.defineProperty(node, 'value', descriptor);
     }
}

Los inputs que crea react tienen setters y getters en value especiales para evitar que se creen varios eventos cuando el input no ha cambiado. Por eso agrega el nuevo texto con un # primero para simular que haya un cambio de texto.

[WHK]

Probablemente no te funcione porque no estás llegando al objeto, primero asegúrate de que document.getElementById('id_userLoginId') resuelva el objeto y que sea un input válido, prueba un console.log(). Por ejemplo, puede ser que tu escript se esté ejecutando antes del renderizado y por ende no esté llegando al input porque el input aun no está escrito, también puede ser que el campo no sea un input sino una división que por debajo rellena un input invisible. Primero verifica que estés llegando al objeto. ¿Estás usando greasymonkey?, si es así debes llamar al document onload como evento para que se ejecute después del renderizado.

Saludos.

[**Aincrad**]

Hola, gracias por las respuestas.

Al final así lo resolví:

Activamos el Foco en el Input :

Código (javascript) [Seleccionar] Expandir

document.getElementById('id_userLoginId').focus();

Convierto el String, en este caso el correo : Example@gmail.com en un array Char lo recorro y lo envio como pulsacion de tecla usando el motor Web, en este caso uno basado en Chromium (EO.WebBrowser) .

Código (vbnet) [Seleccionar] Expandir

  Dim TextArray() As Char = UserString.ToCharArray

            For Each element As Char In TextArray
                 WebView1.SendChar(element)
            Next

Hago lo mismo con el campo Password. y posterior mente hago click el el boton de login. y listo, Funciona!. Asi me logeo en Netflix.

[WHK]

Si quieres hacer login desde una app externa que no sea el navegador web talves podrías pensar en utilizar algo que ya esté diseñado para eso como por ejemplo https://www.selenium.dev/

Recuerda que si tu desarrollo estará hecho en visual basic significará que no será multiplataforma porque solo funcionará en windows y dejarás fuera a todos los que usan mac o linux.

Saludos.

[[u]nsigned]

Que estás intentando hacer??

Como te comentan, el formulario ese esta hecho con React y meneja un estado, acabo de comprobarlo, cuando modificas el campo #id_userLoginId no se modifica el state.

Lo que si podes hacer es usar  Puppeteer. Yo asi logre crear un bot para Whatsapp usando su version web.

El libreria te permite lanzar una instancia de Chomium/Chrome y poder simular las pulsaciones de teclas como lo haría un humano, porque ya no estarías haciendo magias con JS, sino que le decís al propio browser que envié esas señales (pulsación de tecla, click, etc) a la web.

Dicha herramienta en realidad fue creada para automatizar pruebas web E2E, pero uno también puede darle estos usos malignos (?