:lipstick add reports generation scripts
Hadrien Froger hadrien@octree.ch
Wed, 01 Jul 2020 22:36:35 +0100
3 files changed,
137 insertions(+),
1 deletions(-)
M
e2e/reports/.gitignore
→
e2e/reports/.gitignore
@@ -1,2 +1,4 @@
* -!/.gitignore +!index.html +!screenshots.js +!/.gitignore
A
e2e/reports/index.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html> +<head> + <title>Caroster page</title> + <link rel="stylesheet" href="https://cdn.rawgit.com/Chalarangelo/mini.css/v3.0.1/dist/mini-default.min.css"> +</head> +<body style="background: #e6e6e6"> + <header> + <div class="logo">Caroster</div> + </header> + <div style="max-width: 65rem; margin: 64px auto; background: white; padding: 64px 32px;"> + <h1>Usefull links</h1> + <nav> + <a href="https://git.octree.ch/o/caroster/-/wikis/Project-tools-&-team-links">Wiki</a> + <span>Tests E2E</span> + <a href="/screenshots" class="sublink-1">Screenshots</a> + <a href="/allure-report" class="sublink-1">End 2 End reports</a> + </nav> + </div> +</body>
A
e2e/reports/screenshots.js
@@ -0,0 +1,115 @@
+var pug = require('pug'); +var fs = require('fs'); +// compile +var fn = pug.compile( + ` +doctype html +html(lang="en") + head + title= pageTitle + style + | body { background: #313131; color: white; } + | .container { max-width: 90rem; margin: 0 auto; } + | .go_back {display: block; font-size: 16px; color: white; margin: 32px 8px 16px 16px; text-decoration: none;} + | .go_back:hover {opacity: 0.6;} + | ul {list-style: none; padding: 0; display: flex;flex-wrap: wrap;} + | .image__item {text-align: center; font-family: Courier; font-size: 12px; margin-bottom: 32px;color: white;} + | .image__item--sm {flex: 1;min-width: 25%} + | .image__item--md {flex: 1; min-width: 25%} + | .image__item--lg {flex: 3; min-width: 100%;} + | .image__item video {display: block; width: 100%; max-height:80vh;} + | .image__item a {text-decoration: none; color: white;} + | .image__item a:hover {text-decoration: none; color: white;background: black;} + | .image__item img {max-width: 95%;max-height:80vh; display: block; margin: 0 auto;} + | .image__item strong {font-size: 14px;line-height: 1.8;diplay: block; padding: 14px 8px;} + body + div(class='container') + a(href='/', class='go_back') Go Back + h1 Screenshots + em= pageTitle + each image in images + h2= image.title + ul + each file in image.files + li(class="image__item image__item--" + file.modifier) + if(file.type == 'png') + a(href=file.path, target="_blank") + img(src=file.path) + else + video(controls="controls") + source(src=file.path, type="video/mp4") + object(data=file.path) + a(href=file.path, target="_blank") + strong= file.title +`, + {} +); +var now = new Date(); +var _f = function (num) { + num = parseInt(num, 10); + if (num < 10) { + return `0${num}`; + } + return `${num}`; +}; +function getExtension(filename) { + var ext = filename.split('.'); + return ext[ext.length - 1]; +} + +var walkVideo = function (dir) { + var results = []; + dir = dir.replace('screenshots', 'videos'); + var list = fs.readdirSync(dir); + console.log('videos', {list}); + list.forEach(function (file) { + var fileItem = { + path: (dir + '/' + file).replace('./reports', ''), + title: file, + type: 'mp4', + modifier: 'lg', + files: [], + }; + results.push(fileItem); + }); + return results; +}; + +var walk = function (dir) { + var results = []; + var list = fs.readdirSync(dir); + list.forEach(function (file) { + var fileItem = { + path: (dir + '/' + file).replace('./reports', ''), + title: file, + type: 'png', + modifier: file.indexOf('--') > -1 ? 'sm' : 'md', + files: [], + }; + var filePath = dir + '/' + file; + var stat = fs.statSync(filePath); + if (stat && stat.isFile() && getExtension(file) !== 'png') { + return results; + } + if (stat && stat.isDirectory()) { + fileItem.type = 'dir'; + /* Recurse into a subdirectory */ + fileItem.files = fileItem.files.concat( + walk(filePath).concat(walkVideo(filePath)) + ); + } + /* Is a file */ + results.push(fileItem); + }); + return results; +}; +const images = walk('./reports/screenshots'); +var html = fn({ + pageTitle: `Captures of ${_f(now.getDay())}/${_f( + now.getMonth() + )}/${now.getFullYear()} @ ${_f(now.getHours())}:${_f(now.getMinutes())}`, + images, +}); + +fs.writeFileSync('./reports/screenshots/index.html', html); +console.log(images);