Initial work on in-browser test runner

Run `grunt test` and open up the `build/test/index.html` to run the
tests.
This commit is contained in:
toby 2017-02-23 13:59:58 -05:00
parent 92bd2c921e
commit 500522bdeb
9 changed files with 535 additions and 9 deletions

96
src/html/test.html Executable file
View file

@ -0,0 +1,96 @@
<!-- htmlmin:ignore --><!--
CyberChef - The Cyber Swiss Army Knife
@author tlwr [toby@toby.codes]
@copyright Crown Copyright 2017
@license Apache-2.0
Copyright 2017 Crown Copyright
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<!-- htmlmin:ignore -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CyberChef Test Runner</title>
<link rel="icon" type="image/png" href="images/favicon.ico?__inline" />
<link href="styles.css" rel="stylesheet" />
</head>
<body>
<template id="test-status-icon-template">
<span>{{ getIcon() }}</span>
</template>
<template id="test-stats-template">
<div class="text-center row">
<div class="col-md-2"
v-for="status in ['Waiting', 'Loading', 'Erroring', 'Failing']">
<test-status-icon :status="status.toLowerCase()"></test-status-icon>
<br>
{{ status }}
<br>
{{ countTestsWithStatus(status.toLowerCase()) }}
</div>
<div class="col-md-2">
<test-status-icon status="passing"></test-status-icon>
<br>
Passing
<br>
{{ countTestsWithStatus("passing") }}
/
{{ tests.length }}
</div>
<div class="col-md-2">
<test-status-icon status="passing"></test-status-icon>
<br>
% Passing
<br>
{{ ((100.0 * countTestsWithStatus("passing")) / tests.length).toFixed(1) }}%
</div>
</div>
</template>
<template id="tests-template">
<table class="table table-striped">
<tbody>
<tr v-for="test in tests">
<td class="col-md-1 col-sm-4">
<test-status-icon :status="test.status"></test-status-icon>
</td>
<td class="col-md-4 col-sm-8">
{{ test.name }}
</td>
<td class="col-md-7 col-sm-12">
<pre v-if="test.output"><code>{{ test.output }}</code></pre>
</td>
</tr>
</tbody>
</table>
</template>
<div class="container">
<main>
<h1>CyberChef Test Runner</h1>
<hr>
<test-stats :tests="tests"></test-stats>
<hr>
<tests :tests="tests"></tests>
</main>
</div>
<script type="application/javascript" src="scripts.js"></script>
</body>
</html>