-
Notifications
You must be signed in to change notification settings - Fork 3
/
check.ts
139 lines (118 loc) · 4.88 KB
/
check.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
import { LocationReturn, SizeReturn } from "@wdio/sync";
import sanitize from "sanitize-filename";
import { existsSync, readJSONSync, writeJSONSync } from "fs-extra";
import { rdiffResult, getDiff } from "recursive-diff";
interface ElementDetail {
visibility: boolean;
location: LocationReturn;
size: SizeReturn;
css: { [key: string]: string };
text?: string;
value?: string;
image?: string;
}
interface LocatorResult {
[locator: string]: ElementDetail[];
}
interface CheckFilePaths {
actual: string;
expected: string;
diff: string;
}
export interface CheckLocatorResult {
expectedResult: LocatorResult;
actualResult: LocatorResult;
diffResult: { [locator: string]: rdiffResult[] };
}
function initCheck(tag: string): CheckFilePaths {
const windowSize = browser.getWindowSize();
const fileName = `${sanitize(tag)}_${browser.capabilities.browserName}_${windowSize.width}x${
windowSize.height
}.json`;
const expectedFilePath = `./elements/expected/${fileName}`;
const actualFilePath = `./elements/actual/${fileName}`;
const diffFilePath = `./elements/diff/${fileName}`;
return { actual: actualFilePath, expected: expectedFilePath, diff: diffFilePath };
}
function finishCheck(filePaths: CheckFilePaths, checkLocatorResults: CheckLocatorResult[]): void {
writeJSONSync(
filePaths.expected,
checkLocatorResults.map(checkLocatorResult => checkLocatorResult.expectedResult),
{ spaces: 2 }
);
writeJSONSync(
filePaths.actual,
checkLocatorResults.map(checkLocatorResult => checkLocatorResult.actualResult),
{ spaces: 2 }
);
const diffResults = checkLocatorResults
.map(checkLocatorResults => checkLocatorResults.diffResult)
.filter(diffResult => Object.keys(diffResult).filter(key => diffResult[key].length).length);
if (diffResults.length > 0) {
writeJSONSync(filePaths.diff, diffResults, { spaces: 2 });
}
}
export function getElementDetails(locator: string): ElementDetail[] {
const details = $$(locator);
if (details.length === 0) {
throw new Error(`No results found for locator '${locator}', are you sure it's correct?`);
}
return details.map(element => {
const css = {};
// Currently checking the following CSS properties. Adding more is ofc always possible.
["display", "backgroundColor", "backgroundImage", "textDecoration", "color", "font"].forEach(key => {
const value = browser.execute(
(browserElement, browserKey) => window.getComputedStyle(browserElement)[browserKey],
element,
key
);
css[key] = value;
});
// Set of element details that are used for comparisons
const details: ElementDetail = {
visibility: element.isDisplayed(),
location: element.getLocation(),
size: element.getSize(),
css,
text:
browser.execute(browserElement => {
if (browserElement.childNodes[0] && browserElement.childNodes[0].nodeValue) {
return browserElement.childNodes[0].nodeValue.trim();
}
}, element) || undefined,
value: browser.execute(browserElement => browserElement.value, element) || undefined,
image: element.getAttribute("src") || undefined
};
return details;
});
}
export function checkLocators(locators: string[], tag: string): CheckLocatorResult[] {
const filePaths = initCheck(tag);
let expectedResults: LocatorResult[] = [];
if (existsSync(filePaths.expected)) {
expectedResults = readJSONSync(filePaths.expected);
}
const checkLocatorResults = locators.map(locator => {
const actualResult: LocatorResult = {};
actualResult[locator] = getElementDetails(locator);
let expectedResult = expectedResults.find(expectedResult => expectedResult[locator]);
if (!expectedResult) {
console.log(`No expected result found for ${locator}. Saving actual...`);
expectedResult = actualResult;
}
// Transformation in expected results here since Y coordinate
// in V2 was increased by 1 for all non 0,0 location values.
const tranformedResult = JSON.parse(JSON.stringify(expectedResult));
if (process.env.APP_VERSION === "V2") {
tranformedResult[locator].forEach(element => {
if (element.location.x > 0 || element.location.y) {
element.location.y = element.location.y + 1;
}
});
}
const diff = getDiff(tranformedResult[locator], actualResult[locator], true);
return { expectedResult, actualResult, diffResult: { [locator]: diff } };
});
finishCheck(filePaths, checkLocatorResults);
return checkLocatorResults;
}