web-dev-qa-db-fra.com

Rapporteur: faites défiler vers le bas

J'ai un bouton sur ma page qui est visible lorsque l'utilisateur fait défiler vers le bas. Pour cette raison, les tests du rapporteur me donnent une erreur:

UnknownError: erreur inconnue: l'élément n'est pas cliquable au point (94, 188).

J'ai essayé d'utiliser:

browser.executeScript('window.scrollTo(0,document.body.scrollHeight)');

ce qui a fonctionné lorsque je l'ai testé dans les rapporteurs elementexplorer.js mais dans mes tests réguliers, il ne fait rien. Une autre façon de contourner cela?

javascriptseleniumtestingscrollprotractor
29
xv47

vous devez attendre que la promesse soit tenue. l'exemple suivant provient d'un problème ouvert

browser.executeScript('window.scrollTo(0,0);').then(function () {
    page.saveButton.click();
})

Mise à jour : C'est une vieille question (mai 2014), mais elle reçoit quand même quelques visiteurs. Pour clarifier: window.scrollTo(0, 0) défile vers le coin supérieur gauche de la page actuelle.

Si vous souhaitez faire défiler jusqu'au bas de votre page, vous pouvez appeler

window.scrollTo(0, document.body.scrollHeight)

comme mentionné par @jsuser dans cette réponse

Une approche plus moderne consisterait à utiliser

browser.actions().mouseMove(element).perform();

Upvotes à @MartinBlaustein dans cette réponse

53
nilsK

J'ai trouvé un moyen plus simple. Si vous souhaitez faire défiler jusqu'à un élément, vous pouvez utiliser

    browser.actions().mouseMove(element).perform();

Après cela, le navigateur concentrera l'élément.

30
Martin Blaustein

Je voudrais ajouter à la réponse précédente et, espérons-le, fournir un peu plus d'explications.

Ce code, dans l'appel à 'executeScript':

'window.scrollTo(0,0);'
  • Fait défiler la fenêtre vers le HAUT, jusqu'aux coordonnées de la fenêtre 0,0 ... essentiellement vers le haut
  • Si vous connaissez la zone spécifique dans laquelle vous devez vous rendre, changez simplement les coordonnées.

Si vous savez que vous voulez être tout en bas de la fenêtre, c'était mon objectif. Vous pouvez mettre un très grand nombre dans la coordonnée "y", comme je l'ai fait ici:

browser.executeScript('window.scrollTo(0,10000);').then(function () {
    expect(<some control>.<some state>).toBe(<some outcome>);
})
13
Joe Famme

Au cas où quelqu'un d'autre aurait des problèmes comme moi:

J'essayais de faire défiler vers le bas de la page pour charger mon prochain ensemble de données dans un scénario de défilement infini. J'ai essayé différentes variantes de window.scrollTo ainsi que des arguments [0] .click () sans succès.

Finalement, j'ai réalisé que pour faire défiler la page, je devais mettre l'accent sur la "fenêtre" en cliquant sur n'importe quel élément de la fenêtre. Ensuite, window.scrollTo (0, document.body.scrollHeight) a fonctionné comme un charme!

exemple de code:

element(by.className('<any element on page>')).click();
browser.executeScript('window.scrollTo(0,document.body.scrollHeight)').then(function(){
//whatever you need to check for here
});
9
jsuser

J'ai trouvé que la création d'une aide utilitaire et son utilisation dans des objets de page (ou les fichiers de test eux-mêmes) ont aidé. Cela semble bien fonctionner pour moi:

utils.js

module.exports = {
  scrollIntoView: function(el) {
    browser.executeScript(function(el) {
      el.scrollIntoView();
    }, el.getWebElement());
  }
}

objet de la page intérieure quelque part ...

var scrollIntoView = require('../utils').scrollIntoView;

module.exports = {
  clickBackBtn: function() {
    var el = element(by.buttonText('Go back'));
    scrollIntoView(el);
    el.click();
    return;
  }
}

dans le test lui-même ...

it('should allow the user to go back to the profile page', function() {
  PageObject.clickBackBtn();
  expect(browser.getCurrentUrl()).toContain('/user/profile');
});
8
Eamonn Gahan

La réponse à cette question a été marquée comme correcte en haut de la réponse.Mais après la mise à niveau du plus récent chrome v54.Le code suivant est peut-être la meilleure solution.

browser.actions().mouseMove(element).perform();
3
Kimxinfo

Si vous cherchez simplement à naviguer vers le haut ou le bas d'une longue page, vous pouvez simplement utiliser la touche "ACCUEIL" pour aller trop haut, ou la touche "FIN" pour aller vers le bas.

par exemple:

browser.actions().sendKeys(protractor.Key.HOME).perform();

ou

browser.actions().sendKeys(protractor.Key.END).perform();
1
Kevin Burton

Sinon, vous pouvez essayer ceci:

this.setScrollPage = function (element) {

    function execScroll() {
        return browser.executeScript('arguments[0].scrollIntoView()',
            element.getWebElement())
    }

    browser.wait(execScroll, 5000);

};
0
Tayguara Dias Reis