web-dev-qa-db-fra.com

Est-il possible d'interagir avec des éléments cachés avec capybara?

J'ai un champ de fichier qui a opacity: 0 et chevauche un faux bouton. Css est une technique commune qui simule une sorte de "bouton de téléchargement" qui s'affiche de manière cohérente sur différents navigateurs.

Capybara ne me permet pas d’appeler attach_file sur cette entrée. L'erreur est Selenium::WebDriver::Error::ElementNotVisibleError: Element is not currently visible and so may not be interacted with.

Tout le monde sait comment forcer capybara à interagir avec des éléments invisibles?

La réponse est toujours sans réponse, mais j'ai trouvé un moyen de contourner le problème. Rien d'intelligent, il suffit de rendre visible l'élément avec un script simple

  page.execute_script %Q{
    $('#photos').css({opacity: 1, transform: 'none'});
  }

Je le poste pour le compte rendu.

capybaraattachment
40
miguel.camba

Vous pouvez interagir avec des éléments masqués à l'aide de la propriété visible: false de Capybara.

Si vous voulez cliquer sur un élément caché, utilisez:

find("#photos", visible: false).click

N'utilisez pas click_button('#photo') directement 

71
Vijay Chouhan

L'auteur de Capybara recommande de définir Capybara.ignore_hidden_elements immédiatement avant de voir l'élément invisible, puis de le réinitialiser:

Capybara.ignore_hidden_elements = false
click_button 'my invisible button'
Capybara.ignore_hidden_elements = true
19
user664833

En général, il n’est pas possible d’interagir avec des éléments non visibles lors de l’utilisation de Capybara (vous pouvez les trouver à l’aide de l’option visible: false/hidden dans la plupart des outils de recherche, mais ne leur faites rien du tout). Cependant, l’entrée de fichier est un cas particulier en raison de la fréquence avec laquelle il est utilisé de masquer l’élément et, en raison de restrictions de sécurité, de l’autre moyen d’ajouter un fichier en interagissant avec les éléments visibles de la page. En raison de cela, attach_file a une option make_visible qui peut être utilisée pour que Capybara rend l'élément visible, attache le fichier, puis réinitialise le code CSS au paramètre d'origine.

attach_file('photos', file_path, make_visible: true)
4
Thomas Walpole

J'ai fini par résoudre un itinéraire différent.

execute_script() me donnait du fil à retordre (cela gèlerait l'exécution du test sur FireFox), alors voici ce que j'ai fait:

J'ai déjà eu un fichier javascript approprié. J'ai ajouté ce qui suit

<% if ENV["Rails_ENV"] == "test" %>
  $('#photos').show()
<% end %>

J'ai également dû ajouter .erb à mon fichier javascript pour gérer correctement les ressources Rails.

Et dans mon fichier de test, je mettais déjà ENV["Rails_ENV"] = "test"

De cette façon, je pouvais simplement tester l'interface utilisateur tout en conservant l'aspect et la convivialité de la production.

0
Jay

Miquel, merci pour le travail. 

J'ai un problème similaire pour interagir avec l'entrée de fichier caché sur la liaison C # pour Selenium Webdriver 2.35 et Firefox 24. Pour que la sélection de fichier fonctionne correctement, le même truc:

((IJavaScriptExecutor)webdriver).ExecuteScript("$('#fileUploadInput').css({opacity: 1, transform: 'none'});");

IWebElement e = webdriver.FindElement(By.CssSelector("input#fileUploadInput")));

e.SendKeys("c:\\temp\\inputfile.txt");
0
Alexander Kobets

Si l'élément masqué est imbriqué dans un élément parent visible (par exemple, une entrée masquée dans une étiquette visible), vous pouvez cliquer sur le parent à la place. Si vous souhaitez toujours rechercher l'entrée par ID, vous pouvez accéder au parent de la manière suivante:

find('#hidden_input').find(:xpath, '..').click
0
Kevin Qi

Je l'ai fait de cette façon avec des éléments qui ont le style CSS display:none; défini:

page.execute_script("$('.all-hidden-elements').show();");
all('.all-hidden-elements').first.click
0
karlingen