galenframework.com Open in urlscan Pro
2606:4700:3032::ac43:8c73  Public Scan

Submitted URL: http://galenframework.com/
Effective URL: https://galenframework.com/
Submission: On April 11 via manual from US — Scanned from DE

Form analysis 1 forms found in the DOM

<form id="search-panel" class="navbar-form navbar-right" role="search">
  <div class="form-group">
    <input type="text" class="form-control" placeholder="Search">
  </div>
</form>

Text Content

Toggle navigation Galen Framework
 * News
 * Download
 * Docs
 * GitHub
 * About
 * Devs
 * Contact




GALEN FRAMEWORK


AUTOMATED TESTING OF LOOK AND FEEL FOR YOUR RESPONSIVE WEBSITES

Download 2.4.4

Stay in touch




THE IDEA...

Layout testing seemed always a complex task. Galen Framework offers a simple
solution: test location of objects relatively to each other on page. Using a
special syntax and comprehensive rules you can describe any layout you can
imagine





RUNS IN SELENIUM GRID

Galen Framework runs well in Selenium Grid. You can set up your tests to run in
a cloud like HeadSpin, LambdaTest, Sauce Labs, or BrowserStack so that you can
even test your responsive websites on different mobile devices. Galen can run
multiple tests in parallel which is also a nice time saver.






RESPONSIVE DESIGN

Galen Framework is designed with responsiveness in mind. It is easy to set up a
test for different browser sizes. Galen just opens a browser, resizes it to a
defined size and then tests the page according to specifications




HUMAN READABLE AND ADVANCED SYNTAX


BASIC SYNTAX


@objects
    comments            #comments
    article-content     div.article

= Main section =
    @on mobile, tablet 
        comments:
            width 300px 
            inside screen 10 to 30px top right 
            near article-content > 10px right 

    @on desktop
        comments:
            width ~ 100% of screen/width 
            below article-content > 20px 



See more

Using Galen Specs Language you are able to describe any complex layout including
different screen sizes or browsers. It's not only easy to write, it is also easy
to read it if you are unfamiliar with the language. You can write a proper page
spec file and use it later as a requirements document for your Front-end


ADVANCED


@objects
    menu-item-*   css  #menu li
    header-logo   id   logo
    button-login  xpath //button[@id='login']  

= Menu =
    @forEach [ menu-item-* ] as itemName, next as nextItem
        ${itemName}:
            left-of ${nextItem} 10px 

    header-logo:
        image file imgs/header-logo.png, error 4% 

    button-login:
        color-scheme 5% #ffefd0, 87 to 90% #ae32ef 



See more

There a lot of techniques that can help you optimize your specs. Together with
that Galen Framework provides you with rich functionality for visual testing
like image comparison and color scheme verification


TEST LIKE A PRO


= Login box =
    login_box:
        | at the top inside content with ${content_vertical_margin} margin
        centered horizontally inside content 1px 

    | every &login_box_element is more or less readable
    | every &login_box_textfield has height ${form_textfield_height}
    | every &login_box_button is tapable

    @on desktop, tablet
        | &login_box_form_elements are aligned vertically above each other with ${login_box_elements_vertical_margin} margin
        | first &login_box_form_element is inside login_box ${login_box_elements_side_margin} top
        | last &login_box_form_element is above login_button ${login_box_elements_vertical_margin}
        | &login_box_buttons are aligned horizontally next to each other with 0 to 5px margin
    @on mobile
        | &login_box_elements are aligned vertically above each other with ${login_box_elements_vertical_margin} margin
        | &login_box_elements sides are vertically inside login_box with ${login_box_elements_side_margin} margin



Galen Extras

In Galen Framework you can build your own expressions to test multiple elements
in a single line. Also this way you can write clear specs and highly
maintainable and reliable test code.


DETAILED HTML REPORTS


ERROR REPORTING

Example

Galen Framework generates Html reports where you can see all your test objects
on the page


SCREENSHOTS

Example

It automatically highlights the misaligned elements so it is really easy to see
what is wrong on the page


IMAGE COMPARISON

Example

Galen Framework gives you the ability to perform visual check and shows you the
mismatching area


EXECUTE TESTS IN VARIOUS LANGUAGES


BASIC SYNTAX


@@ Table devices
    | deviceName  | size     | tags     |
    | mobile      | 450x700  | mobile   |
    | tablet      | 600x800  | tablet   |
    | desktop     | 1024x768 | desktop  |

@@ Parameterized using devices
Home page on ${deviceName}
    http://example.com ${size}
        inject custom-cookies.js
        check homepage.spec --include ${tags}

@@ Parameterized using devices
User profile page on ${deviceName}
    http://example.com ${size}
        run loginAsTestUser.js
        wait 1m until visible "css: #login-button"
        check userProfile.spec --include ${tags}



See more

Standard suites are easy for a quick start but still give you a lot of power.
You can select different browser like Firefox, Chrome, Internet Explorer or
switch your tests to Selenium Grid. In case the page is not easy accessible you
can either inject custom JavaScript on the client-side or run a JavaScript
action on a test side so that you can prepare your page for a layout check


JAVASCRIPT TESTS


function Device(deviceName, size, tags) {
    this.deviceName = deviceName;
    this.size = size;
    this.tags = tags;
}
var devices = {
    mobile:  new Device("mobile", "450x700", ["mobile"]),
    tablet:  new Device("tablet", "600x800", ["tablet"]),
    desktop: new Device("dekstop", "1024x768", ["desktop"])
};

forAll(devices, function () {
    test("Home page on ${deviceName}", function (device){
        var driver = createDriver("http://example.com", 
            device.size);
        checkLayout(driver, "homepage.spec", device.tags);
        driver.quit();
    });
});


See more

With JavaScript tests you are free to invent your own test framework and perform
a lot of complex stuff. Out of the box Galen provides the following features for
JavaScript tests:

 * Handling before and after test events
 * Filtering or reordering the test sequence
 * Managing custom data providers
 * Parameterizing tests by arrays or maps




JAVA API


public class WelcomePageTest extends GalenTestNgTestBase {

    @Override
    public WebDriver createDriver(Object[] args) {
        return new FirefoxDriver();
    }

    @Test
    public void welcomePage_shouldLookGood_onDesktopDevice() {
        load("http://example.com", 1024, 768);
        checkLayout("/specs/welcomePage.spec", asList("mobile"));
    }

}


See example

As Galen Framework is implemented in Java its API is also available for Java
tests. Galen is released to Sonatype Central Repository so you can add it as a
dependency in your Maven project.


GALEN IS OPEN-SOURCED!

Galen Framework is distributed under Apache License 2 and the sources are
available on GitHub.

Even this website is open-sourced and is posted on GitHub so that anyone can
help improve the documentation.





LET'S START!

Checkout the "First Project" 2 minute tutorial

First Project Learn More


GALEN FRAMEWORK


SITE MAP

 * News
 * Download
 * Docs


PROJECT

 * About
 * License
 * Contact


GETTING STARTED

 * First project
 * Specs Language
 * Galen Tutorials

© 2013 - 2017,
Powered by Blogix