Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 2c0868c

Browse files
mdjermanovicmdjermanovic
authored
Chore: merge all html formatter files into html.js (#14612)
1 parent 9e9b5e0 commit 2c0868c

File tree

4 files changed

+175
-167
lines changed

4 files changed

+175
-167
lines changed

‎lib/cli-engine/formatters/html-template-message.js‎

Lines changed: 0 additions & 25 deletions
This file was deleted.

‎lib/cli-engine/formatters/html-template-page.js‎

Lines changed: 0 additions & 123 deletions
This file was deleted.

‎lib/cli-engine/formatters/html-template-result.js‎

Lines changed: 0 additions & 14 deletions
This file was deleted.

‎lib/cli-engine/formatters/html.js‎

Lines changed: 175 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,9 +25,132 @@ const encodeHTML = (function() {
2525
};
2626
}());
2727

28-
const pageTemplate = require("./html-template-page.js");
29-
const messageTemplate = require("./html-template-message.js");
30-
const resultTemplate = require("./html-template-result.js");
28+
/**
29+
* Get the final HTML document.
30+
* @param {Object} it data for the document.
31+
* @returns {string} HTML document.
32+
*/
33+
function pageTemplate(it) {
34+
const { reportColor, reportSummary, date, results } = it;
35+
36+
return `
37+
<!DOCTYPE html>
38+
<html>
39+
<head>
40+
<meta charset="UTF-8">
41+
<title>ESLint Report</title>
42+
<style>
43+
body {
44+
font-family:Arial, "Helvetica Neue", Helvetica, sans-serif;
45+
font-size:16px;
46+
font-weight:normal;
47+
margin:0;
48+
padding:0;
49+
color:#333
50+
}
51+
#overview {
52+
padding:20px 30px
53+
}
54+
td, th {
55+
padding:5px 10px
56+
}
57+
h1 {
58+
margin:0
59+
}
60+
table {
61+
margin:30px;
62+
width:calc(100% - 60px);
63+
max-width:1000px;
64+
border-radius:5px;
65+
border:1px solid #ddd;
66+
border-spacing:0px;
67+
}
68+
th {
69+
font-weight:400;
70+
font-size:medium;
71+
text-align:left;
72+
cursor:pointer
73+
}
74+
td.clr-1, td.clr-2, th span {
75+
font-weight:700
76+
}
77+
th span {
78+
float:right;
79+
margin-left:20px
80+
}
81+
th span:after {
82+
content:"";
83+
clear:both;
84+
display:block
85+
}
86+
tr:last-child td {
87+
border-bottom:none
88+
}
89+
tr td:first-child, tr td:last-child {
90+
color:#9da0a4
91+
}
92+
#overview.bg-0, tr.bg-0 th {
93+
color:#468847;
94+
background:#dff0d8;
95+
border-bottom:1px solid #d6e9c6
96+
}
97+
#overview.bg-1, tr.bg-1 th {
98+
color:#f0ad4e;
99+
background:#fcf8e3;
100+
border-bottom:1px solid #fbeed5
101+
}
102+
#overview.bg-2, tr.bg-2 th {
103+
color:#b94a48;
104+
background:#f2dede;
105+
border-bottom:1px solid #eed3d7
106+
}
107+
td {
108+
border-bottom:1px solid #ddd
109+
}
110+
td.clr-1 {
111+
color:#f0ad4e
112+
}
113+
td.clr-2 {
114+
color:#b94a48
115+
}
116+
td a {
117+
color:#3a33d1;
118+
text-decoration:none
119+
}
120+
td a:hover {
121+
color:#272296;
122+
text-decoration:underline
123+
}
124+
</style>
125+
</head>
126+
<body>
127+
<div id="overview" class="bg-${reportColor}">
128+
<h1>ESLint Report</h1>
129+
<div>
130+
<span>${reportSummary}</span> - Generated on ${date}
131+
</div>
132+
</div>
133+
<table>
134+
<tbody>
135+
${results}
136+
</tbody>
137+
</table>
138+
<script type="text/javascript">
139+
var groups = document.querySelectorAll("tr[data-group]");
140+
for (i = 0; i < groups.length; i++) {
141+
groups[i].addEventListener("click", function() {
142+
var inGroup = document.getElementsByClassName(this.getAttribute("data-group"));
143+
this.innerHTML = (this.innerHTML.indexOf("+") > -1) ? this.innerHTML.replace("+", "-") : this.innerHTML.replace("-", "+");
144+
for (var j = 0; j < inGroup.length; j++) {
145+
inGroup[j].style.display = (inGroup[j].style.display !== "none") ? "none" : "table-row";
146+
}
147+
});
148+
}
149+
</script>
150+
</body>
151+
</html>
152+
`.trimLeft();
153+
}
31154

32155
/**
33156
* Given a word and a count, append an s if count is not one.
@@ -71,6 +194,35 @@ function renderColor(totalErrors, totalWarnings) {
71194
return 0;
72195
}
73196

197+
/**
198+
* Get HTML (table row) describing a single message.
199+
* @param {Object} it data for the message.
200+
* @returns {string} HTML (table row) describing the message.
201+
*/
202+
function messageTemplate(it) {
203+
const {
204+
parentIndex,
205+
lineNumber,
206+
columnNumber,
207+
severityNumber,
208+
severityName,
209+
message,
210+
ruleUrl,
211+
ruleId
212+
} = it;
213+
214+
return `
215+
<tr style="display:none" class="f-${parentIndex}">
216+
<td>${lineNumber}:${columnNumber}</td>
217+
<td class="clr-${severityNumber}">${severityName}</td>
218+
<td>${encodeHTML(message)}</td>
219+
<td>
220+
<a href="${ruleUrl ? ruleUrl : ""}" target="_blank" rel="noopener noreferrer">${ruleId ? ruleId : ""}</a>
221+
</td>
222+
</tr>
223+
`.trimLeft();
224+
}
225+
74226
/**
75227
* Get HTML (table rows) describing the messages.
76228
* @param {Array} messages Messages.
@@ -107,10 +259,28 @@ function renderMessages(messages, parentIndex, rulesMeta) {
107259
message: message.message,
108260
ruleId: message.ruleId,
109261
ruleUrl
110-
}, encodeHTML);
262+
});
111263
}).join("\n");
112264
}
113265

266+
/**
267+
* Get HTML (table row) describing the result for a single file.
268+
* @param {Object} it data for the file.
269+
* @returns {string} HTML (table row) describing the result for the file.
270+
*/
271+
function resultTemplate(it) {
272+
const { color, index, filePath, summary } = it;
273+
274+
return `
275+
<tr class="bg-${color}" data-group="f-${index}">
276+
<th colspan="4">
277+
[+] ${encodeHTML(filePath)}
278+
<span>${encodeHTML(summary)}</span>
279+
</th>
280+
</tr>
281+
`.trimLeft();
282+
}
283+
114284
// eslint-disable-next-line jsdoc/require-description
115285
/**
116286
* @param {Array} results Test results.
@@ -123,7 +293,7 @@ function renderResults(results, rulesMeta) {
123293
color: renderColor(result.errorCount, result.warningCount),
124294
filePath: result.filePath,
125295
summary: renderSummary(result.errorCount, result.warningCount)
126-
}, encodeHTML) + renderMessages(result.messages, index, rulesMeta)).join("\n");
296+
}) + renderMessages(result.messages, index, rulesMeta)).join("\n");
127297
}
128298

129299
//------------------------------------------------------------------------------

0 commit comments

Comments
 (0)