retest / recheck-web-js

recheck for web apps – change comparison tool with Golden Masters and Git-like ignore syntax.

recheck-web-js

This is the JavaScript behind recheck-web and the corresponding Chrome extension. What it does is collect all attributes of all elements of the rendered DOM. This can then be collected by recheck-web or sent to retest.de.

Installation

npm i recheck-web-js

Usage

TypeScript / es6

import { mapElement } from "recheck-web-js";

var htmlNode = document.getElementsByTagName("html")[0];
var html = transform(htmlNode);
var allElements = mapElement(htmlNode, "//html[1]", {
    "//html[1]" : html
});
console.log(allElements);

Test

npm run test

Release

The release of npm module and webjar is performed on travis. To trigger a build update the version in npm files and create a tag with:

npm version patch && git push --tags

If you want to release a minor version use:

npm version minor && git push --tags

recheck-web-js's Issues

Add basic image comparison functionality

Problem

Based on this discussion, I believe it would be helpful to have a very basic image comparison functionality. Many GUIs such as websites have e.g. icons or image banners. Currently, we aren't notified when such content changes—which is not ideal for a lib that is said to support visual testing.

Solution

As suggested by @roesslerj, a very basic implementation could try to extract hashes for images and then these hashes can be compared.

Also, the question arises if we can remove the legacy stuff from de.retest.recheck.image.

Consider using visible text for text

Text (key text) is currently extracted via nodeValue (see getText), i.e., the node's actual text value. The problem is that the text might be displayed differently, for example, if a certain text-transform is applied. So when a node's text is "foo", this could be displayed as "Foo", "FOO", …

The WebDriver link text locator retrieves the rendered text via the Get Element Text command:

Let rendered text be the result of performing implementation-specific steps whose result is exactly the same as the result of a Call(bot.dom.getVisibleText, null, element).

We might want to consider to do this is as well, but:

1. Is dom.js available in the browser? If yes, in any browser? If no, do we have to bundle the script since we don't want to reimplement the functionality?
2. What do we do with redundant information such as text-transform, which is then reflected in the rendered text?
3. How can this be properly tested?

Add `hasAutofocus(node)`

Copy and transform the code from retest/recheck-web#581

Travis CI build

• Build on travis
• Badge to readme
• Automatic release as webjars on tags

Automatic release as webjars on tags

We want to release for each npm release also a webjar, so that we can use it in our java projects.