public void TestPageLayout() { var button = App.ElementCreateService.CreateByIdContaining <Button>("button"); var secondButton = App.ElementCreateService.CreateByIdContaining <Button>("button_disabled"); var checkBox = App.ElementCreateService.CreateByIdContaining <CheckBox>("check1"); var secondCheckBox = App.ElementCreateService.CreateByIdContaining <CheckBox>("check2"); var mainElement = App.ElementCreateService.CreateById <Element>("android:id/content"); // 2. Depending on what you want to check, BELLATRIX gives lots of options. You can test px perfect or just that some element is below another. // Check that the button is above the checkbox. button.AssertAboveOf(checkBox); // 3. Assert with the exact distance between them. button.AssertAboveOf(checkBox, 105); // All layout assertion methods throw LayoutAssertFailedException if the check is not successful with beautified troubleshooting message: // ######################################## // // control (ID = button) should be 41 px above of control (ID = check1) but was 105 px. // // ######################################## // 4. For each available method you have variations of it such as, >, >=, <, <=, between and approximate to some expected value by specified %. button.AssertAboveOfGreaterThan(checkBox, 100); button.AssertAboveOfGreaterThanOrEqual(checkBox, 105); button.AssertAboveOfLessThan(checkBox, 110); button.AssertAboveOfLessThanOrEqual(checkBox, 105); // 5. All assertions have alternative names containing the word 'Near'. We added them to make your tests more readable depending on your preference. button.AssertNearTopOfGreaterThan(checkBox, 100); button.AssertNearTopOfGreaterThanOrEqual(checkBox, 105); button.AssertNearTopOfLessThan(checkBox, 106); button.AssertNearTopOfLessThanOrEqual(checkBox, 105); // The expected distance is ~40px with 10% tolerance button.AssertAboveOfApproximate(checkBox, 104, percent: 10); // The expected px distance is between 30 and 50 px button.AssertAboveOfBetween(checkBox, 100, 120); // 6. You can assert the position of elements again each other in all directions- above, below, right, left, top right, top left, below left, below right // Assert that the checkbox is positioned near the top right of the button. ////checkBox.AssertNearBottomRightOf(button); ////button.AssertNearTopLeftOf(checkBox); // 7. You can tests whether different Android elements are aligned correctly. LayoutAssert.AssertAlignedHorizontallyAll(button, secondButton); // 8. You can pass as many elements as you like. LayoutAssert.AssertAlignedHorizontallyTop(button, secondButton); LayoutAssert.AssertAlignedHorizontallyCentered(button, secondButton, secondButton); LayoutAssert.AssertAlignedHorizontallyBottom(button, secondButton, secondButton); // 9. You can check vertical alignment as well. LayoutAssert.AssertAlignedVerticallyAll(secondCheckBox, checkBox); // Assert that the elements are aligned vertically only from the left side. LayoutAssert.AssertAlignedVerticallyLeft(secondCheckBox, checkBox); LayoutAssert.AssertAlignedVerticallyCentered(secondCheckBox, checkBox); LayoutAssert.AssertAlignedVerticallyRight(secondCheckBox, checkBox); // 10. You can check that some element is inside in another. // Assert that the button is present in the main view element. button.AssertInsideOf(mainElement); // 11. Verify the height and width of elements. button.AssertHeightLessThan(100); button.AssertWidthBetween(50, 80); // 13. All layout assertion methods have full BDD logging support. Below you can find the generated BDD log. // Of course if you use BELLATRIX page objects the log looks even better as mentioned in previous chapters. // Start Test // Class = LayoutTestingTests Name = TestPageLayout // Assert control(ID = button) is above of control(ID = check1). // Assert control(ID = button) is 105 px above of control(ID = check1). // Assert control(ID = button) is > 100 px above of control(ID = check1). // Assert control(ID = button) is >= 105 px above of control(ID = check1). // Assert control(ID = button) is < 110 px above of control(ID = check1). // Assert control(ID = button) is <= 105 px above of control(ID = check1). // Assert control(ID = button) is > 100 px near top of control(ID = check1). // Assert control(ID = button) is >= 105 px near top of control(ID = check1). // Assert control(ID = button) is < 106 px near top of control(ID = check1). // Assert control(ID = button) is <= 105 px near top of control(ID = check1). // Assert control(ID = button) is 104 px above of control(ID = check1). (10 % tolerance) // Assert control(ID = button) is 100 - 120 px above of control(ID = check1). // Assert control(ID = button) is left inside of control(ID = android:id / content). // Assert control(ID = button) is right inside of control(ID = android:id / content). // Assert control(ID = button) is top inside of control(ID = android:id / content). // Assert control(ID = button) is bottom inside of control(ID = android:id / content). // Assert control(ID = button) height is < 100 px. // Assert control(ID = button) width is 50 - 80 px. }
public void AlignedVerticallyCentered_WhenDesktopWindowsSize_414_736_Chrome() => LayoutAssert.AssertAlignedVerticallyCentered(_free, _pro, _enterprise);
public void TestPageLayout() { App.NavigationService.Navigate("http://demos.bellatrix.solutions/"); Select sortDropDown = App.ElementCreateService.CreateByNameEndingWith <Select>("orderby"); Anchor protonRocketAnchor = App.ElementCreateService.CreateByAttributesContaining <Anchor>("href", "/proton-rocket/"); Anchor protonMAnchor = App.ElementCreateService.CreateByAttributesContaining <Anchor>("href", "/proton-m/"); Anchor saturnVAnchor = App.ElementCreateService.CreateByAttributesContaining <Anchor>("href", "/saturn-v/"); Anchor falconHeavyAnchor = App.ElementCreateService.CreateByAttributesContaining <Anchor>("href", "/falcon-heavy/"); Anchor falcon9Anchor = App.ElementCreateService.CreateByAttributesContaining <Anchor>("href", "/falcon-9/"); Div saturnVRating = saturnVAnchor.CreateByClassContaining <Div>("star-rating"); // 2. Depending on what you want to check, BELLATRIX gives lots of options. You can test px perfect or just that some element is below another. // Check that the popularity sort dropdown is above the proton rocket image. sortDropDown.AssertAboveOf(protonRocketAnchor); // 3. Assert with the exact distance between them. sortDropDown.AssertAboveOf(protonRocketAnchor, 41); // All layout assertion methods throw LayoutAssertFailedException if the check is not successful with beatified troubleshooting message: // ######################################## // // control (Name ending with orderby) should be 41 px above of control (href = /proton-rocket/) but was 42 px. // // ######################################## // 4. For each available method you have variations of it such as, >, >=, <, <=, between and approximate to some expected value by specified %. sortDropDown.AssertAboveOfGreaterThan(protonRocketAnchor, 40); sortDropDown.AssertAboveOfGreaterThanOrEqual(protonRocketAnchor, 41); sortDropDown.AssertAboveOfLessThan(protonRocketAnchor, 50); sortDropDown.AssertAboveOfLessThanOrEqual(protonRocketAnchor, 43); // 5. All assertions have alternative names containing the word 'Near'. We added them to make your tests more readable depending on your preference. sortDropDown.AssertNearTopOfGreaterThan(protonRocketAnchor, 40); sortDropDown.AssertNearTopOfGreaterThanOrEqual(protonRocketAnchor, 41); sortDropDown.AssertNearTopOfLessThan(protonRocketAnchor, 50); sortDropDown.AssertNearTopOfLessThanOrEqual(protonRocketAnchor, 43); // The expected distance is ~40px with 10% tolerance sortDropDown.AssertAboveOfApproximate(protonRocketAnchor, 40, percent: 10); // The expected px distance is between 30 and 50 px sortDropDown.AssertAboveOfBetween(protonRocketAnchor, 30, 50); // 6. You can assert the position of elements again each other in all directions- above, below, right, left, top right, top left, below left, below right // Assert that the sort dropdown is positioned near the top right of the Saturn B link. saturnVAnchor.AssertNearBottomRightOf(sortDropDown); sortDropDown.AssertNearTopLeftOf(saturnVAnchor); // 7. You can tests whether different web elements are aligned correctly. ////LayoutAssert.AssertAlignedHorizontallyAll(protonRocketAnchor, protonMAnchor); // 8. You can pass as many elements as you like. LayoutAssert.AssertAlignedHorizontallyTop(protonRocketAnchor, protonMAnchor, saturnVAnchor); ////LayoutAssert.AssertAlignedHorizontallyCentered(protonRocketAnchor, protonMAnchor, saturnVAnchor); ////LayoutAssert.AssertAlignedHorizontallyBottom(protonRocketAnchor, protonMAnchor, saturnVAnchor); // 9. You can check vertical alignment as well. LayoutAssert.AssertAlignedVerticallyAll(falcon9Anchor, falconHeavyAnchor); // Assert that the elements are aligned vertically only from the left side. LayoutAssert.AssertAlignedVerticallyLeft(falcon9Anchor, falconHeavyAnchor); LayoutAssert.AssertAlignedVerticallyCentered(falcon9Anchor, falconHeavyAnchor); LayoutAssert.AssertAlignedVerticallyRight(falcon9Anchor, falconHeavyAnchor); // 10. You can check that some element is inside in another. // Assert that the rating div is present in the Saturn V anchor. saturnVRating.AssertInsideOf(saturnVAnchor); // 11. Verify the height and width of elements. saturnVRating.AssertHeightLessThan(100); saturnVRating.AssertWidthBetween(50, 70); // 12. You can use for all layout assertions the special web elements- Viewport and Screen. // Screen - represents the whole page area inside browser even that which is not visible. // Viewport - it takes the browsers client window. // It is useful if you want to check some fixed element on the screen which sticks to viewport even when you scroll. ////saturnVRating.ScrollToVisible(); ////saturnVRating.AssertInsideOf(SpecialElements.Viewport); ////saturnVRating.AssertInsideOf(SpecialElements.Screen); // 13. All layout assertion methods have full BDD logging support. Below you can find the generated BDD log. // Of course if you use BELLATRIX page objects the log looks even better as mentioned in previous chapters. // Start Test // Class = LayoutTestingTests Name = TestPageLayout // Assert control (Name ending with orderby) is above of control (href = /proton-rocket/). // Assert control (Name ending with orderby) is 42 px above of control (href = /proton-rocket/). // Assert control (Name ending with orderby) is >40 px above of control (href = /proton-rocket/). // Assert control (Name ending with orderby) is >=41 px above of control (href = /proton-rocket/). // Assert control (Name ending with orderby) is <50 px above of control (href = /proton-rocket/). // Assert control (Name ending with orderby) is <=43 px above of control (href = /proton-rocket/). // Assert control (Name ending with orderby) is >40 px near top of control (href = /proton-rocket/). // Assert control (Name ending with orderby) is >=41 px near top of control (href = /proton-rocket/). // Assert control (Name ending with orderby) is <50 px near top of control (href = /proton-rocket/). // Assert control (Name ending with orderby) is <=43 px near top of control (href = /proton-rocket/). // Assert control (Name ending with orderby) is 40 px above of control (href = /proton-rocket/). (10% tolerance) // Assert control (Name ending with orderby) is 30-50 px above of control (href = /proton-rocket/). // Assert control (href = /saturn-v/) is near bottom of control (Name ending with orderby). // Assert control (Name ending with orderby) is near right of control (href = /saturn-v/). // Assert control (Name ending with orderby) is near top of control (href = /saturn-v/). // Assert control (href = /saturn-v/) is near left of control (Name ending with orderby). // Assert control (Class = star-rating) is left inside of control (href = /saturn-v/). // Assert control (Class = star-rating) is right inside of control (href = /saturn-v/). // Assert control (Class = star-rating) is top inside of control (href = /saturn-v/). // Assert control (Class = star-rating) is bottom inside of control (href = /saturn-v/). // Assert control (Class = star-rating) height is <100 px. // Assert control (Class = star-rating) width is 50-70 px. }