Korrekter Weg, um eine Anzahl von passenden Elementen in Nightwatch zu erhalten?

Question

Ich versuche zu testen, ob eine Todo App die richtige Anzahl von Elementen hat.

Die Dokumente scheinen sich fast ausschließlich mit einzelnen Elementen zu befassen, daher musste ich die Selenium-Protokollfunktionen verwenden. Wäre das der richtige Weg, die Anzahl der passenden Selektoren zu testen (in diesem Fall nach 2 li-Elementen zu suchen)?

Dies funktioniert in meinem Test, aber ich war mir nicht sicher, ob es gab Fehler um einen Callback dafür zu verwenden. Auch nicht sicher, warum Nightwatch keine Hilfsfunktionen hat, die mit mehr als einem Element zu tun haben.

Answer 1

nur Ihnen zu versichern, ich habe eine ähnliche Sache, wenn sie versuchen, alle passenden Elemente zu greifen, ex:

browser.elements("xpath","//ul[@name='timesList']/h6", function(result){ 
     els = result.value; 
     var i = 0; 
     els.forEach(function(el, j, elz){ 
      browser.elementIdText(el.ELEMENT, function(text) { 
       dates[i] = text.value; 
       i++; 
      }); 
     }); 
    }); 

Answer 2

Alternativ, wenn Sie sicher sein wollen, dass n Anzahl der Elemente vorhanden sind, können Sie eine Kombination verwenden von :nth-of-type/:nth-child Selektoren und Nachtwächter expect.

Zum Beispiel, wenn Sie wollen testen, ob #foo neun direkte Kinder hat:

function(browser) { 
    browser 
    .url('http://example.com') 
    .expect.element('#foo > *:nth-child(9)').to.be.present; 
    browser.end(); 
} 

Oder wenn #bar hat drei direkte article Kinder:

function(browser) { 
    browser 
    .url('http://example.com') 
    .expect.element('#bar > article:nth-of-type(3)').to.be.present; 
    browser.end(); 
} 

Answer 3

ich die folgende sehr elegante Lösung gefunden innerhalb eine VueJS-Vorlage. Es zeigt, wie in Nightwatch ein hinzugefügt wird, das die Anzahl der von einem Selektor zurückgegebenen Elemente zählt. Details zum Schreiben benutzerdefinierter Assertionen in Nightwatch finden Sie unter http://nightwatchjs.org/guide#writing-custom-assertions.

Nach der Installation, Verwendung ist so einfach wie:

browser.assert.elementCount('#todo-list li', 2) 

Das Plugin:

// A custom Nightwatch assertion. 
// the name of the method is the filename. 
// can be used in tests like this: 
// 
// browser.assert.elementCount(selector, count) 
// 
// for how to write custom assertions see 
// http://nightwatchjs.org/guide#writing-custom-assertions 
exports.assertion = function (selector, count) { 
    this.message = 'Testing if element <' + selector + '> has count: ' + count; 
    this.expected = count; 
    this.pass = function (val) { 
    return val === this.expected; 
    } 
    this.value = function (res) { 
    return res.value; 
    } 
    this.command = function (cb) { 
    var self = this; 
    return this.api.execute(function (selector) { 
     return document.querySelectorAll(selector).length; 
    }, [selector], function (res) { 
     cb.call(self, res); 
    }); 
    } 
} 

Dieser Code zu vuejs-templates by yyx990803 in 2016. So voll Kredit wurde zu yyx990803 geht.

Answer 4

I angepasst Chris K's answer XPath-Ausdrücke zu unterstützen, indem die integrierte Methode mit this.api.elements:

exports.assertion = function elementCount(selector, count) { 
    this.message = 'Testing if element <' + selector + '> has count: ' + count 

    this.expected = count 

    this.pass = function pass(val) { 
    return val === this.expected 
    } 

    this.value = function value(res) { 
    return res.value.length 
    } 

    this.command = function command(callback) { 
    return this.api.elements(this.client.locateStrategy, selector, callback) 
    } 
} 

Für Gebrauchsanweisungen und Gutschriften siehe his answer