Chore: General JS cleanup (#700)

This commit is contained in:
Jim Brännlund 2023-07-26 20:02:37 +02:00 committed by GitHub
parent f740846f06
commit d7301b7e94
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 40 additions and 94 deletions

View File

@ -46,15 +46,18 @@ class BaseReport:
def _generate_report(self, self_contained=False):
generated = datetime.datetime.now()
rendered_report = self._render_html(
generated.strftime("%d-%b-%Y"),
generated.strftime("%H:%M:%S"),
__version__,
self.css,
test_data = cleanup_unserializable(self._report.data)
test_data = json.dumps(test_data)
rendered_report = self._template.render(
title=self._report.title,
date=generated.strftime("%d-%b-%Y"),
time=generated.strftime("%H:%M:%S"),
version=__version__,
styles=self.css,
run_count=self._run_count(),
self_contained=self_contained,
outcomes=self._report.data["outcomes"],
test_data=cleanup_unserializable(self._report.data),
test_data=test_data,
table_head=self._report.data["resultsTableHeader"],
prefix=self._report.data["additionalSummary"]["prefix"],
summary=self._report.data["additionalSummary"]["summary"],
@ -118,36 +121,6 @@ class BaseReport:
return report_extras
def _render_html(
self,
date,
time,
version,
styles,
run_count,
self_contained,
outcomes,
test_data,
table_head,
summary,
prefix,
postfix,
):
return self._template.render(
date=date,
time=time,
version=version,
styles=styles,
run_count=run_count,
self_contained=self_contained,
outcomes=outcomes,
test_data=json.dumps(test_data),
table_head=table_head,
summary=summary,
prefix=prefix,
postfix=postfix,
)
def _write_report(self, rendered_report):
with self._report_path.open("w", encoding="utf-8") as f:
f.write(rendered_report)

View File

@ -29,7 +29,6 @@ class ReportData:
}
self._data = {
"title": "",
"collectedItems": 0,
"totalDuration": 0,
"runningState": "not_started",

View File

@ -2,7 +2,7 @@
<html>
<head>
<meta charset="utf-8"/>
<title id="head-title"></title>
<title id="head-title">{{ title }}</title>
{%- if self_contained %}
<style type="text/css">
{{- styles|safe }}
@ -12,7 +12,7 @@
{%- endif %}
</head>
<body>
<h1 id="title"></h1>
<h1 id="title">{{ title }}</h1>
<p>Report generated on {{ date }} at {{ time }} by <a href="https://pypi.python.org/pypi/pytest-html">pytest-html</a>
v{{ version }}</p>
<div id="environment-header" class="collapser">
@ -66,14 +66,6 @@
<th colspan="4">No results found. Check the filters.</th>
</tr>
</template>
<template id="template_table-colgroup">
<colgroup>
<col span="1" style="width: 25%;">
<col span="1" style="width: 25%;">
<col span="1" style="width: 25%;">
<col span="1" style="width: 25%;">
</colgroup>
</template>
<!-- END TEMPLATES -->
<div class="summary">
<div class="summary__data">

View File

@ -19,17 +19,21 @@ class DataManager {
get allData() {
return { ...this.data }
}
resetRender() {
this.renderData = { ...this.data }
}
setRender(data) {
this.renderData.tests = [...data]
}
toggleCollapsedItem(id) {
this.renderData.tests = this.renderData.tests.map((test) =>
test.id === id ? { ...test, collapsed: !test.collapsed } : test,
)
}
set allCollapsed(collapsed) {
this.renderData = { ...this.renderData, tests: [...this.renderData.tests.map((test) => (
{ ...test, collapsed }
@ -39,24 +43,10 @@ class DataManager {
get testSubset() {
return [...this.renderData.tests]
}
get allTests() {
return [...this.data.tests]
}
get title() {
return this.renderData.title
}
get environment() {
return this.renderData.environment
}
get collectedItems() {
return this.renderData.collectedItems
}
get isFinished() {
return this.data.runningState === 'Finished'
}
get formattedDuration() {
return this.data.totalDuration.formatted
}
}
module.exports = {

View File

@ -1,8 +1,7 @@
const mediaViewer = require('./mediaviewer.js')
const templateEnvRow = document.querySelector('#template_environment_row')
const templateCollGroup = document.querySelector('#template_table-colgroup')
const templateResult = document.querySelector('#template_results-table__tbody')
const listHeaderEmpty = document.querySelector('#template_results-table__head--empty')
const templateEnvRow = document.getElementById('template_environment_row')
const templateResult = document.getElementById('template_results-table__tbody')
const listHeaderEmpty = document.getElementById('template_results-table__head--empty')
function htmlToElements(html) {
const temp = document.createElement('template')
@ -39,7 +38,6 @@ const dom = {
return envRow
},
getListHeaderEmpty: () => listHeaderEmpty.content.cloneNode(true),
getColGroup: () => templateCollGroup.content.cloneNode(true),
getResultTBody: ({ testId, id, log, duration, extras, resultsTableRow, tableHtml, result, collapsed }) => {
const resultLower = result.toLowerCase()
const resultBody = templateResult.content.cloneNode(true)

View File

@ -2,7 +2,7 @@ const { redraw, bindEvents, renderStatic } = require('./main.js')
const { doInitFilter } = require('./filter.js')
const { doInitSort } = require('./sort.js')
const { manager } = require('./datamanager.js')
const data = JSON.parse(document.querySelector('#data-container').dataset.jsonblob)
const data = JSON.parse(document.getElementById('data-container').dataset.jsonblob)
function init() {
manager.setManager(data)

View File

@ -11,19 +11,13 @@ const removeChildren = (node) => {
}
const renderStatic = () => {
const renderTitle = () => {
const title = manager.title
document.querySelector('#title').innerText = title
document.querySelector('#head-title').innerText = title
}
const renderEnvironmentTable = () => {
const environment = manager.environment
const rows = Object.keys(environment).map((key) => dom.getStaticRow(key, environment[key]))
const table = document.querySelector('#environment')
const table = document.getElementById('environment')
removeChildren(table)
rows.forEach((row) => table.appendChild(row))
}
renderTitle()
renderEnvironmentTable()
}
@ -31,7 +25,7 @@ const renderContent = (tests) => {
const sortAttr = getSort(manager.allData.initialSort)
const sortAsc = JSON.parse(getSortDirection())
const rows = tests.map(dom.getResultTBody)
const table = document.querySelector('#results-table')
const table = document.getElementById('results-table')
const tableHeader = document.getElementById('template_results-table__head').content.cloneNode(true)
removeChildren(table)
@ -40,7 +34,6 @@ const renderContent = (tests) => {
if (!rows.length) {
tableHeader.appendChild(dom.getListHeaderEmpty())
}
table.appendChild(dom.getColGroup())
table.appendChild(tableHeader)
rows.forEach((row) => !!row && table.appendChild(row))
@ -66,7 +59,7 @@ const renderContent = (tests) => {
})
}
const renderDerived = (tests, collectedItems, isFinished, formattedDuration) => {
const renderDerived = () => {
const currentFilter = getVisible()
possibleFilters.forEach((result) => {
const input = document.querySelector(`input[data-test-result="${result}"]`)
@ -83,9 +76,9 @@ const bindEvents = () => {
redraw()
}
const header = document.querySelector('#environment-header')
const header = document.getElementById('environment-header')
header.addEventListener('click', () => {
const table = document.querySelector('#environment')
const table = document.getElementById('environment')
table.classList.toggle('hidden')
header.classList.toggle('collapser')
header.classList.toggle('expander')
@ -94,21 +87,21 @@ const bindEvents = () => {
findAll('input[name="filter_checkbox"]').forEach((elem) => {
elem.addEventListener('click', filterColumn)
})
document.querySelector('#show_all_details').addEventListener('click', () => {
document.getElementById('show_all_details').addEventListener('click', () => {
manager.allCollapsed = false
redraw()
})
document.querySelector('#hide_all_details').addEventListener('click', () => {
document.getElementById('hide_all_details').addEventListener('click', () => {
manager.allCollapsed = true
redraw()
})
}
const redraw = () => {
const { testSubset, allTests, collectedItems, isFinished, formattedDuration } = manager
const { testSubset } = manager
renderContent(testSubset)
renderDerived(allTests, collectedItems, isFinished, formattedDuration )
renderDerived()
}
module.exports = {

View File

@ -3,10 +3,12 @@ class MediaViewer {
this.assets = assets
this.index = 0
}
nextActive() {
this.index = this.index === this.assets.length - 1 ? 0 : this.index + 1
return [this.activeFile, this.index]
}
prevActive() {
this.index = this.index === 0 ? this.assets.length - 1 : this.index -1
return [this.activeFile, this.index]
@ -15,6 +17,7 @@ class MediaViewer {
get currentIndex() {
return this.index
}
get activeFile() {
return this.assets[this.index]
}

View File

@ -1,13 +1,12 @@
const possibleResults = [
{ result: 'passed', label: 'Passed' },
{ result: 'skipped', label: 'Skipped' },
{ result: 'failed', label: 'Failed' },
{ result: 'error', label: 'Errors' },
{ result: 'xfailed', label: 'Unexpected failures' },
{ result: 'xpassed', label: 'Unexpected passes' },
{ result: 'rerun', label: 'Reruns' },
const possibleFilters = [
'passed',
'skipped',
'failed',
'error',
'xfailed',
'xpassed',
'rerun',
]
const possibleFilters = possibleResults.map((item) => item.result)
const getVisible = () => {
const url = new URL(window.location.href)
@ -113,5 +112,4 @@ module.exports = {
setSortDirection,
getCollapsedCategory,
possibleFilters,
possibleResults,
}