Working on stuff
This commit is contained in:
parent
90dbd18b26
commit
2e4f86979b
45
index.js
45
index.js
|
@ -82,6 +82,9 @@ function help() {
|
||||||
|
|
||||||
const flattenLong = "\x1b[32m--flatten\x1b[0m";
|
const flattenLong = "\x1b[32m--flatten\x1b[0m";
|
||||||
|
|
||||||
|
const allMasksShort = "\x1b[32m-a\x1b[0m";
|
||||||
|
const allMasksLong = "\x1b[32m--all-masks\x1b[0m";
|
||||||
|
|
||||||
println(`${name} ${version}
|
println(`${name} ${version}
|
||||||
${description}
|
${description}
|
||||||
|
|
||||||
|
@ -95,7 +98,9 @@ ${args}
|
||||||
${thresholdShort}, ${thresholdLong} <VALUE> Threshold for RGB mask computation (between 0 and 1)
|
${thresholdShort}, ${thresholdLong} <VALUE> Threshold for RGB mask computation (between 0 and 1)
|
||||||
${shrinkShort}, ${shrinkLong} Shrink horizontally leaves' bounding boxes
|
${shrinkShort}, ${shrinkLong} Shrink horizontally leaves' bounding boxes
|
||||||
${flattenLong} Flattens the tree into a list before serializing in JSON
|
${flattenLong} Flattens the tree into a list before serializing in JSON
|
||||||
${forceShort}, ${forceLong} Delete the output directory before generating masks it again`);
|
${forceShort}, ${forceLong} Delete the output directory before generating masks it again
|
||||||
|
${allMasksShort}, ${allMasksLong} Compute and save all masks`
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
async function main() {
|
async function main() {
|
||||||
|
@ -106,6 +111,7 @@ async function main() {
|
||||||
let forceMode = false;
|
let forceMode = false;
|
||||||
let shrinkBoxes = true;
|
let shrinkBoxes = true;
|
||||||
let flatten = false;
|
let flatten = false;
|
||||||
|
let allMasks = false;
|
||||||
|
|
||||||
let argIndex = 2;
|
let argIndex = 2;
|
||||||
|
|
||||||
|
@ -152,6 +158,12 @@ async function main() {
|
||||||
help();
|
help();
|
||||||
process.exit(0);
|
process.exit(0);
|
||||||
|
|
||||||
|
case "-a":
|
||||||
|
case "--all-masks":
|
||||||
|
allMasks = true;
|
||||||
|
argIndex++;
|
||||||
|
break;
|
||||||
|
|
||||||
default:
|
default:
|
||||||
error("unknown option " + process.argv[argIndex]);
|
error("unknown option " + process.argv[argIndex]);
|
||||||
help();
|
help();
|
||||||
|
@ -167,6 +179,11 @@ async function main() {
|
||||||
process.exit(1);
|
process.exit(1);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (allMasks && outputDir === null) {
|
||||||
|
error("in order to compute all masks, you need to specify an output directory");
|
||||||
|
process.exit(1);
|
||||||
|
}
|
||||||
|
|
||||||
if (threshold !== undefined && isNaN(threshold)) {
|
if (threshold !== undefined && isNaN(threshold)) {
|
||||||
error(tmp + " is not a valid threshold value");
|
error(tmp + " is not a valid threshold value");
|
||||||
process.exit(1);
|
process.exit(1);
|
||||||
|
@ -257,8 +274,10 @@ async function main() {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
if (outputDir !== null) {
|
||||||
// Take a first screenshot
|
// Take a first screenshot
|
||||||
await page.screenshot({path: (outputDir === null ? __dirname : outputDir) + '/' + 'screenshot1.png'});
|
await page.screenshot({path: outputDir + '/' + 'screenshot1.png'});
|
||||||
|
}
|
||||||
|
|
||||||
// Edit the page to shrink elements in order to get better bounding boxes
|
// Edit the page to shrink elements in order to get better bounding boxes
|
||||||
if (shrinkBoxes) {
|
if (shrinkBoxes) {
|
||||||
|
@ -268,20 +287,18 @@ async function main() {
|
||||||
eprintln();
|
eprintln();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (outputDir !== null) {
|
||||||
// Take another screenshot and check the modification we made didn't change the layout of the page
|
// Take another screenshot and check the modification we made didn't change the layout of the page
|
||||||
await page.screenshot({path: (outputDir === null ? __dirname : outputDir) + '/' + 'screenshot2.png'});
|
await page.screenshot({path: outputDir + '/' + 'screenshot2.png'});
|
||||||
|
|
||||||
// Compare both screenshots
|
// Compare both screenshots
|
||||||
let file1 = await fs.readFile((outputDir === null ? __dirname : outputDir) + '/' + 'screenshot1.png');
|
let file1 = await fs.readFile(outputDir + '/' + 'screenshot1.png');
|
||||||
let file2 = await fs.readFile((outputDir === null ? __dirname : outputDir) + '/' + 'screenshot2.png');
|
let file2 = await fs.readFile(outputDir + '/' + 'screenshot2.png');
|
||||||
let filesAreSame = file1.map((x, i) => x === file2[i]).reduce((a, b) => a && b, true);
|
let filesAreSame = file1.map((x, i) => x === file2[i]).reduce((a, b) => a && b, true);
|
||||||
|
|
||||||
if (!filesAreSame) {
|
if (!filesAreSame) {
|
||||||
// Check psnr
|
// Check psnr
|
||||||
let psnr = await image.psnr(
|
let psnr = await image.psnr(outputDir + '/' + 'screenshot1.png', outputDir + '/' + 'screenshot2.png');
|
||||||
(outputDir === null ? __dirname : outputDir) + '/' + 'screenshot1.png',
|
|
||||||
(outputDir === null ? __dirname : outputDir) + '/' + 'screenshot2.png'
|
|
||||||
);
|
|
||||||
|
|
||||||
// Crash if they're different
|
// Crash if they're different
|
||||||
if (psnr > 0) {
|
if (psnr > 0) {
|
||||||
|
@ -291,7 +308,7 @@ async function main() {
|
||||||
process.exit(1);
|
process.exit(1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
if (outputDir !== null) {
|
if (outputDir !== null) {
|
||||||
|
@ -324,7 +341,7 @@ async function main() {
|
||||||
|
|
||||||
// Analyse the root and output the result
|
// Analyse the root and output the result
|
||||||
info("performing analysis");
|
info("performing analysis");
|
||||||
let analyse = await analyseElement(root, page, outputDir, threshold);
|
let analyse = await analyseElement(root, page, outputDir, allMasks, threshold);
|
||||||
info("analysis done");
|
info("analysis done");
|
||||||
|
|
||||||
// Append the current slide to the output
|
// Append the current slide to the output
|
||||||
|
@ -393,7 +410,7 @@ async function addSpan(element) {
|
||||||
|
|
||||||
// Recursive function to analyse an HTML element.
|
// Recursive function to analyse an HTML element.
|
||||||
// The output is written in hierarchy.
|
// The output is written in hierarchy.
|
||||||
async function analyseElement(element, page, outputDir = null, threshold = undefined) {
|
async function analyseElement(element, page, outputDir = null, allMasks = false, threshold = undefined) {
|
||||||
// Get some information on the element
|
// Get some information on the element
|
||||||
let tagAttr = await element.getProperty('tagName');
|
let tagAttr = await element.getProperty('tagName');
|
||||||
let tagName = await tagAttr.jsonValue();
|
let tagName = await tagAttr.jsonValue();
|
||||||
|
@ -424,7 +441,7 @@ async function analyseElement(element, page, outputDir = null, threshold = undef
|
||||||
|
|
||||||
analyse.children = [];
|
analyse.children = [];
|
||||||
|
|
||||||
if (outputDir !== null) {
|
if (outputDir !== null && allMasks) {
|
||||||
|
|
||||||
info("computing screenshots \x1b[34m" + analyse.uuid + "\x1b[0m");
|
info("computing screenshots \x1b[34m" + analyse.uuid + "\x1b[0m");
|
||||||
|
|
||||||
|
@ -462,7 +479,7 @@ async function analyseElement(element, page, outputDir = null, threshold = undef
|
||||||
|
|
||||||
for (let child of children) {
|
for (let child of children) {
|
||||||
// Recursively analyse the children
|
// Recursively analyse the children
|
||||||
analyse.children.push(await analyseElement(child, page, outputDir, threshold));
|
analyse.children.push(await analyseElement(child, page, outputDir, allMasks, threshold));
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue