Skip to content

Commit

Permalink
Read external resources locally when generating html report
Browse files Browse the repository at this point in the history
Locally add all JS, CSS and fonts locally to the gradle plugin
  • Loading branch information
eyedol committed Jun 11, 2024
1 parent c3faf4f commit 525393d
Show file tree
Hide file tree
Showing 8 changed files with 170 additions and 112 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -43,114 +43,4 @@ object RoborazziReportConst {
}
}
}

const val reportHtml = """
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Roborazzi report</title>
<!-- Compiled and minified CSS -->
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/@materializecss/materialize/dist/css/materialize.min.css"
/>
<link
href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet"
/>
<style>
.container {
width: 90%;
}
h3 {
color: orange;
}
a, .menu {
color: white;
}
th a, td a {
display: block;
color: black;
}
.material-icons {
color: #29b6f6;
}
.us {
color: #ffcc80;
}
#imageBottomSheet {
max-height: 100%;
top: 15%;
}
#modalImage {
max-width: 100%;
}
</style>
</head>
<body>
<nav role="navigation" class="light-blue lighten-1">
<div class="nav-wrapper container">
<a href="#" class="brand-logo">Roborazzi report</a>
<a href="#" data-target="nav-mobile" class="sidenav-trigger"
><i class="material-icons menu">menu</i></a
>
</div>
</nav>
<div class="section">
<div class="container">
<br><br>
REPORT_TEMPLATE_BODY
<br><br>
</div>
</div>
<div id="imageBottomSheet" class="modal bottom-sheet max-height">
<div class="modal-content center-align">
<img id="modalImage" src="" alt="">
</div>
</div>
<footer class="page-footer orange">
<div class="container">
<a class="us" href="https://github.com/takahirom/roborazzi" target="_blank"
rel="noopener noreferrer">Roborazzi</a>
<br>
<br>
</div>
</footer>
<!-- Compiled and minified JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/@materializecss/materialize/dist/js/materialize.min.js"></script>
<script>
M.AutoInit();
document.addEventListener('DOMContentLoaded', function() {
M.Tabs.getInstance(document.getElementsByClassName("tabs")[0]).select('results');
var modalInstance = M.Modal.init(document.getElementById('imageBottomSheet'), {});
var modal = document.getElementById('imageBottomSheet');
var modalImage = document.getElementById('modalImage');
var modalTriggers = document.querySelectorAll('.modal-trigger');
modalTriggers.forEach(function(trigger) {
trigger.addEventListener('click', function() {
var src = this.getAttribute('src');
var alt = this.getAttribute('data-alt');
modalImage.setAttribute('src', src);
modalImage.setAttribute('alt', alt);
var instance = M.Modal.getInstance(modal);
instance.open();
});
});
});
</script>
</body>
</html>
"""
}
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ import org.jetbrains.kotlin.gradle.plugin.mpp.KotlinNativeTargetWithTests
import org.jetbrains.kotlin.gradle.targets.jvm.KotlinJvmTarget
import org.jetbrains.kotlin.gradle.targets.native.KotlinNativeBinaryTestRun
import org.jetbrains.kotlin.gradle.targets.native.tasks.KotlinNativeTest
import java.io.File
import java.util.Locale
import javax.inject.Inject
import kotlin.reflect.KClass
Expand Down Expand Up @@ -255,12 +256,15 @@ abstract class RoborazziPlugin : Plugin<Project> {
resultsSummaryFile.parentFile.mkdirs()
resultsSummaryFile.writeText(jsonResult)
val reportFile = reportFileProperty.get().asFile

reportFile.parentFile.mkdirs()
writeAssetsToRoborazziReportsDir(reportFile.parentFile)
val reportHtml = readIndexHtmlFile()
reportFile.writeText(
RoborazziReportConst.reportHtml.replace(
reportHtml?.replace(
oldValue = "REPORT_TEMPLATE_BODY",
newValue = roborazziResults.toHtml(reportFile.parentFile.absolutePath)
)
) ?: ""
)
}
}
Expand Down Expand Up @@ -464,6 +468,34 @@ abstract class RoborazziPlugin : Plugin<Project> {
}
}

private fun writeAssetsToRoborazziReportsDir(reportDir: File) {
val assetsDirectory = File(reportDir, "assets")
listOf(
"materialize.min.css",
"materialize.min.js",
"report-style.css",
"material-icons.css",
"material-icons.woff2",
).forEach { assetName ->
val asset = this::class.java.classLoader
.getResource("META-INF/assets/$assetName")?.readBytes()
if (asset != null) {
val assetFile = outputFile(assetsDirectory, assetName)
assetFile.writeBytes(asset)
}
}
}

private fun outputFile(directory: File, filename: String): File {
return File(directory, filename).apply {
parentFile.apply { if (!exists()) mkdirs() }
}
}

private fun readIndexHtmlFile(): String? {
return this::class.java.classLoader.getResource("META-INF/index.html")?.readText()
}

private fun String.capitalizeUS() =
replaceFirstChar { if (it.isLowerCase()) it.titlecase(Locale.US) else it.toString() }

Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
/* Material Icons */
/* Credits: https://fonts.googleapis.com/icon?family=Material+Icons */
/* fallback */
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url(material-icons.woff2) format('woff2');
}

.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-feature-settings: 'liga';
-webkit-font-smoothing: antialiased;
}
Binary file not shown.

Large diffs are not rendered by default.

Large diffs are not rendered by default.

Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
.container {
width: 90%;
}

h3 {
color: orange;
}

a, .menu {
color: white;
}

th a, td a {
display: block;
color: black;
}

.material-icons {
color: #29b6f6;
}

.us {
color: #ffcc80;
}

#imageBottomSheet {
max-height: 100%;
top: 15%;
}

#modalImage {
max-width: 100%;
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Roborazzi report</title>
<link href="assets/report-style.css" rel="stylesheet"/>
<!-- Compiled and minified CSS -->
<link rel="stylesheet" href="assets/materialize.min.css" />
<link href="assets/material-icons.css" rel="stylesheet" />
</head>
<body>
<nav role="navigation" class="light-blue lighten-1">
<div class="nav-wrapper container">
<a href="#" class="brand-logo">Roborazzi report</a>
<a href="#" data-target="nav-mobile" class="sidenav-trigger"
><i class="material-icons menu">menu</i></a
>
</div>
</nav>
<div class="section">
<div class="container">
<p>REPORT_TEMPLATE_BODY</p>
</div>
</div>

<div id="imageBottomSheet" class="modal bottom-sheet max-height">
<div class="modal-content center-align">
<img id="modalImage" src="" alt="">
</div>
</div>

<footer class="page-footer orange">
<div class="container">
<a class="us" href="https://github.com/takahirom/roborazzi" target="_blank"
rel="noopener noreferrer">Roborazzi</a>
<br>
<br>
</div>
</footer>
<!-- Compiled and minified JavaScript -->
<script src="assets/materialize.min.js"></script>
<script>
M.AutoInit();
document.addEventListener('DOMContentLoaded', function() {
M.Tabs.getInstance(document.getElementsByClassName("tabs")[0]).select('results');
var modalInstance = M.Modal.init(document.getElementById('imageBottomSheet'), {});
var modal = document.getElementById('imageBottomSheet');
var modalImage = document.getElementById('modalImage');
var modalTriggers = document.querySelectorAll('.modal-trigger');
modalTriggers.forEach(function(trigger) {
trigger.addEventListener('click', function() {
var src = this.getAttribute('src');
var alt = this.getAttribute('data-alt');
modalImage.setAttribute('src', src);
modalImage.setAttribute('alt', alt);
var instance = M.Modal.getInstance(modal);
instance.open();
});
});
});
</script>
</body>
</html>

0 comments on commit 525393d

Please sign in to comment.