Non pas de message d'erreur mais le focus ne fonctionne pas.
Code:
1
2
3
4
5
6 for (let el of document.querySelectorAll('input')) { if ("123456" === el.value) { el.focus(); } } undefined
Version imprimable
Non pas de message d'erreur mais le focus ne fonctionne pas.
Code:
1
2
3
4
5
6 for (let el of document.querySelectorAll('input')) { if ("123456" === el.value) { el.focus(); } } undefined
C’est pas toujours facile d’observer un focus quand saisit des commandes dans la console. Essaye en différant l’exécution :
Tu fais entrée, puis tu cliques rapidement dans la page et tu vois ce qui se passe.Code:
1
2
3
4
5
6
7
8
9 setTimeout(() => { for (let el of document.querySelectorAll('input')) { if ("123456" === el.value) { el.select(); console.log("dans le if"); } } console.log("fin de la boucle"); }, 1000);
Comme tu peux le voir j’ai ajouté des console.log(), et j’ai aussi remplacé focus() par select(). Si le but final est de permettre aux gens de sélectionner le texte, ce sera plus confortable.
Merci beaucoup pour ton aide cependant cela ne fonctionne toujours pas rien ne sa passe sur la page.
J'ai remarqué que même en marquant n'importe quoi le code ne renvoie pas d'erreur.
Exemple:
ne retourne aucune erreurCode:
1
2
3
4
5
6
7
8
9 setTimeout(() => { for (let el of document.querySelectorAll('input')) { if ("blablabla" === el.value) { el.select(); console.log("dans le if"); } } console.log("fin de la boucle"); }, 1000);
Il doit avoir quelque chose qui fait que ça ne marche pas dans la page mais j'ai beau tourner le problème dans tous les sens cela reste un mystère pour moi.
Si tu le souhaites je peux t'envoyer le code complet de la page en privé afin que peut-être tu puisses identifier le problème.
On n'a malheureusement pas de détail sur ce point, soulevé précédemment !Citation:
Envoyé par Moi
même pas les messages « dans le if » et « fin de la boucle » ?Citation:
Envoyé par Toi
Non pas d'erreur je comprends pas pourquoi d'ailleurs
Non, je ne fais pas d’aide en privé.
Ok, c’est ma faute, j’ai oublié ce qui avait été dit en début de conversation.
De toute évidence les éléments recherchés ne se trouvent pas dans le document. Mais tout dépend de quel document on parle… Ce qui nous amène aux remarques de psychadelic et de NoSmoking :
Si c’est le cas il faudra utiliser contentDocument ou contentWindow comme expliqué dans la page MDN de <iframe>.
Mais avant, on va utiliser la console pour vérifier s’il s’agit bien d’un problème d’<iframe>.
:arrow: Sous Firefox, la console a un bouton vers la droite, qui ressemble vaguement à une fenêtre, et dont l’infobulle dit « sélectionner une iframe en tant que document cible ». En cliquant dessus, ça ouvre un menu déroulant avec toutes les iframes trouvées. Voir cette page.
:arrow: Sous Chrome, c’est un menu déroulant, plutôt du côté gauche, qui au départ affiche « top ». Voir cette page, paragraphe “Selecting execution context”.
En changeant de contexte et en essayant la commande document.querySelector("input") ou document.querySelectorAll("input") tu devrais réussir à trouver quelle iframe est la bonne :)
Je viens de faire un grand pas en avant :) merci beaucoup j'ignorais totalement l'existence des iframes.
J'ai réussi à identifier la frame et quand je le sélectionne dans la console le code suivant fonctionne parfaitement.
Il me reste seulement à trouver comment faire sans passer par la sélection manuelle dans la console.Code:document.querySelector("[value='123456']").focus()
EDIT: après plusieurs tentatives je n'y arrive pas la seule chose que j'arrive à faire est d'obtenir le focus de la iframe
tu ne nous montrais pas par hasard le code que tu as testé on ne sait jamais cela pourrait aider à comprendre !?!Citation:
EDIT: après plusieurs tentatives je n'y arrive pas la seule chose que j'arrive à faire est d'obtenir le focus de la iframe
J'en est utilisé tellement c'est bien sa le problème :)
Ce qui me semble les plus prometteurs:
Code:
1
2 var myIframe = document.getElementById('mon_iframe'); myIframe.querySelector("[value='123456']").focus();
Code:document.getElementById('mon_iframe').querySelector("[value='123456']").focus();
Code:document.getElementById('mon_iframe').contentWindow.document.querySelectorAll("[value='123456']").focus();
Pas de message d’erreur avec celle-là ?
Il y a deux endroits où ça peut coincer :Code:document.getElementById('mon_iframe').contentWindow.document.querySelectorAll("[value='4007087924935']").focus();
- .contentWindow.document si les deux documents n’ont pas la même origine, voir same-origin policy ;
- querySelectorAll( ).focus(), parce que querySelectorAll() renvoie une collection d’éléments et qu’il faut faire une boucle pour appeler focus() sur chacun d’entre eux.
J'ai le message d'erreur suivant avec cette ligne de code:
SecurityError: Permission denied to access property "document" on cross-origin object
Ok donc c’est un problème de same origin. Peux-tu modifier le code de l’iframe ? Il faudrait déplacer ton script, ou utiliser les messages.
Je ne peux pas modifier le code car le site ne m’appartiens pas j'utilise le script uniquement pour automatiser des actions sur le site. Comment faire pour déplacer le script ?
Je suis totalement perdu là ça me dépasse franchement.
Il n’y a pas de solution simple. La contrainte de même origine est faite pour protéger les internautes. Si tu veux la contourner, il faut utiliser du code privilégié, autrement dit une extension.
Ce qui conviendrait bien dans ton cas, je pense, c’est un userscript. Les userscripts sont de sortes de mini-extensions gérées par un userscript manager, par exemple Greasemonkey ou Tampermonkey. Le manager te simplifie le travail car tu n’as qu’un fichier JavaScript à écrire. Voici un exemple simple :
Assure-toi que la métadonnée @match correspond à l’URL (dans l’attribut src) de l’iframe. La syntaxe est celle des match patterns.Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14 // ==UserScript== // @name Automatisation Focus // @namespace jas789 // @description Donne automatiquement le focus à un input dans la page // @match *://domaine-de-l-iframe/* // @grant none // @run-at document-end // ==/UserScript== "use strict"; let oInput = document.querySelector("[value='4007087924935']"); console.log(oInput); oInput.focus();
Je n'ai pas trouvé l'attribut Src dans le code mais je suppose que c'est celui que sélectionne dans la console pour que le code marche.
J'ai donc essayer dans grease monkey:
Ainsi qu'une variable du code:Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14 // ==UserScript== // @name Automatisation Focus // @namespace jas789 // @description Donne automatiquement le focus à un input dans la page // @match *://edit.monsite.fr/* // @grant none // @run-at document-end // ==/UserScript== "use strict"; let oInput = document.querySelector("[value='123456']"); console.log(oInput); oInput.focus();
Aucun des deux codes ne fonctionne rien ne se passe sur la page en question.Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15 // ==UserScript== // @name Automatisation Focus // @namespace jas789 // @description Donne automatiquement le focus à un input dans la page // @match *://edit.monsite.fr/* // @include https://urlpageprincipale.monsite.fr/* // @grant none // @run-at document-end // ==/UserScript== "use strict"; let oInput = document.querySelector("[value='123456']"); console.log(oInput); oInput.focus();
Par contre si je sélectionne dans la console la iframe https://edit.monsite.fr/edit et que j'envoie le code suivant cela fonctionne:
Code:
1
2
3
4
5 "use strict"; let oInput = document.querySelector("[value='123456']"); console.log(oInput); oInput.focus();
C’est peut-être une histoire de création dynamique. Je veux dire par là que l’<input> que tu cherches n’existe pas au moment où le userscript est exécuté (à l’évènement DOMContentLoaded), il est créé plus tard par un script de la page.
On peut essayer de voir si l’input existe lors de l’évènement load, qui a lieu plus tard.
Voir @run-at.Code:// @run-at document-idle
Ou si ça ne marche pas :
Si ça ne marche pas, il y a d’autres solutions mais elles sont plus complexes, donc j’espère qu’on n’aura pas besoin d’aller jusque-là.Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16 // ==UserScript== // @name Automatisation Focus // @namespace jas789 // @description Donne automatiquement le focus à un input dans la page // @match *://edit.monsite.fr/* // @grant none // @run-at document-end // ==/UserScript== "use strict"; window.addEventListener("load", function () { let oInput = document.querySelector("[value='123456']"); console.log(oInput); oInput.focus(); });
Greasemonkey n’est pas parfait et, à l’heure où nous parlons, je crois qu’il ne sait toujours pas faire remonter les erreurs dans la console. Il faut ouvrir « l’autre » console, celle où vont les messages des extensions et de la mécanique interne du navigateur. Sous Firefox il faut faire Ctrl+maj+J. Dans cette console c’est le bordel, il y a des centaines de messages, alors il faut filtrer, par exemple avec la chaîne « userscript » ou « user script ». Mais souvent on n’a pas le vrai message d’erreur et ce n’est pas très utile.
N’hésite pas à mettre un gros bloc try autour du script entier :
Ça te permet de « rediriger » le message d’erreur vers la console F12 normale.Code:
1
2
3
4
5
6
7
8 try { ... } catch (err) { console.error(err); }
Et pour me simplifier la vie, j’ai un petit truc. Pour voir d’entrée de jeu si mon usescript est bien exécuté, et s’il est exécuté jusqu’au bout, j’ai pris l’habitude de rajouter ceci dans mes fichiers :
Ces messages vont également dans la console normale.Code:
1
2
3
4
5
6
7
8
9
10
11 // ==UserScript== // ... // ==/UserScript== "use strict"; console.log("%cscript start", "color: cyan"); ... console.log("%cscript end", "color: cyan");
Pour moi la iframe ainsi que l'input existe seulement après le clic sur le bouton modifié.
Ne marche pas
// @run-at document-idle
Le nouveau code non plus rien ne sa passe a chaque fois.
Dans la console ctrl + Maj + j je ne trouve pas d'erreur.
Plus on avance et plus tout cela devient du chinois pour moi ça commence réellement à dépasser mes compétences de petit débutant.
Oh… J’avais oublié ça. Je viens de relire ton premier message.
Quel est ce module Firefox dont tu parles ?
Mais revenons au sujet. Cette histoire de bouton rend les choses plus simples. Il suffit de rajouter ton code après l’appel à .click.
Code:
1
2
3
4
5 document.getElementById("boutonmodifier").click(); let oInput = document.querySelector("[value='123456']"); console.log(oInput); oInput.focus();
J'utilise Greasemonkey comme extension.Code:
1
2
3
4
5 document.getElementById("boutonmodifier").click(); let oInput = document.querySelector("[value='123456']"); console.log(oInput); oInput.focus();
Le code que tu me donnes clic bien sûr le bouton modifié mais rien ne sa passe. (avec greasemonkey)
Peut-être faudrait-il ajouter un délai pour le chargement de la page ?
EDIT:
Ne fonctionne pas non plus
Code:
1
2
3
4
5
6
7
8
9
10
11 document.getElementById("boutonmodifier").click(); setTimeout(() => { for (let el of document.querySelectorAll('input')) { if ("123456" === el.value) { el.select(); console.log("dans le if"); } } console.log("fin de la boucle"); }, 1000);
Donc tu utilisais Greasemonkey avant que je t’en parle ?
S’il n’y a rien dans la console, c’est que le script a une erreur quelque part. Sinon tu devrais au moins voir le message « fin de boucle ». As-tu essayé le bloc try comme je t’ai montré ?