1

私は私たちのウェブサイトのjavascript部分に検証テストを実装するように頼まれました。私はセレンWebDriverの使用を検討してきました。テストしたいことの1つは、UIです。UIが「見た目」が良いかどうかを確認します(位置合わせする必要があるものは位置合わせされ、ボックスは正しい位置にあります)。

今のところ、私が見つけた唯一のオプションは、Seleniumを使用してスナップショットを作成し、それを事前に手動で作成したテストスナップショットと比較するか、スナップショットを手動で確認することでした。レイアウトを変更すると、すべてのテストスナップショットを再度取得する必要があり、手動チェックには非常に時間がかかるため、スナップショットの比較はあまり維持できません。

誰かがこれを達成するための(Seleniumまたは他の)方法を知っていますか?

4

2 に答える 2

3

うまくはないですが、ある程度はできます。

配置には、WebElement を使用できますgetLocation()(Java ドキュメントですが、すべての Selenium バインディングに同じメソッドが存在します)。ほとんどのブラウザーではレンダリングが若干異なることに注意してください。そのため、古い IE で作業する場合、ピクセル単位で完璧であるとは期待しないでください。また、CSS で定義された最初のフォントが見つからず、別のフォントが使用された場合など、配置が若干異なる場合があります。この方法に大きく依存しないでください。しかし、テストを健全にし、環境を安定させることができれば、うまくいくでしょう。

aligningのために、ある要素が視覚的に別の要素の内側にWebDriverあることをアサートする単純な Java メソッドを作成しました。

偽陰性があってはなりませんが、内側の要素が視覚的に内側にあるが、その (目に見えない) 実際の境界線が「見えている」場合には、偽陽性が発生する可能性があります。ただし、実際の経験では、この問題に遭遇したことはありません。素敵な Web サイトは適切に動作し、そのようなハックは必要ないからです :)。それでも、ちょっとハックであり、Selenium はこの種の作業用に設計されていないため、より複雑なチェックを実装するのは難しいかもしれません。

public static void assertContains(WebElement outerElem, WebElement innerElem) {
    // get borders of outer element
    Point outerLoc = outerElem.getLocation();
    Dimension outerDim = outerElem.getSize();
    int outerLeftX = outerLoc.getX();
    int outerRightX = outerLeftX + outerDim.getWidth();
    int outerTopY = outerLoc.getY();
    int outerBottomY = outerTopY + outerDim.getHeight();

    // get borders of inner element
    Point innerLoc = innerElem.getLocation();
    Dimension innerDim = innerElem.getSize();
    int innerLeftX = innerLoc.getX();
    int innerRightX = innerLeftX + innerDim.getWidth();
    int innerTopY = innerLoc.getY();
    int innerBottomY = innerTopY + innerDim.getHeight();

    // assures the inner borders don't cross the outer borders
    final String errorMsg = "ughh, some error message";
    final boolean contains = (outerLeftX <= innerLeftX)
            && (innerRightX <= outerRightX)
            && (outerTopY <= innerTopY)
            && (innerBottomY <= outerBottomY);
    assertTrue(errorMsg, contains);
}
于 2012-06-27T22:45:11.400 に答える
2

「正しいものを構築したことをテストする」という意味でバリデーションという用語を使用する場合、これを自動化することはほとんど不可能であると言えます。見た目が良いとか使いやすいとか、実際に使ってみてどう判断しますか?

こういう目視チェックも人間の得意分野です。Webサイトを開発しながら少しでも使ってみると、レイアウトなどに怪しいところがあるとすぐに気がつきます。

機能については、自動テストは良い考えです。

于 2012-06-27T16:32:09.917 に答える