tests: Make the Mocha results area resizable

This commit is contained in:
Richard Hansen 2021-06-05 03:34:55 -04:00
parent c4239b6059
commit 45ca82fd9f
6 changed files with 34 additions and 8 deletions

View file

@ -8,8 +8,11 @@
</head>
<body>
<div id="console"></div>
<div id="mocha"></div>
<div id="iframe-container"></div>
<div id="split-view">
<div id="mocha"></div>
<div id="separator"></div>
<div id="iframe-container"></div>
</div>
<script src="../../static/js/require-kernel.js"></script>
<script src="../../static/js/vendors/jquery.js"></script>

View file

@ -6,8 +6,6 @@ body {
padding: 0px;
margin: 0px;
height: 100%;
display: flex;
flex-direction: row;
overflow: hidden;
}
@ -15,8 +13,21 @@ body {
display: none;
}
#split-view {
width: 100%;
height: 100%;
display: grid;
grid-template-columns: 20% 10px 1fr;
}
#separator {
grid-column: 2;
grid-row: 1/-1;
cursor: col-resize;
background-color: #999;
}
#iframe-container {
width: 80%;
height: 100%;
overflow: auto hidden;
}
@ -30,11 +41,8 @@ body {
#mocha {
font: 20px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
border-right: 2px solid #999;
flex: 1 auto;
height: 100%;
overflow: auto;
width:20%;
font-size:80%;
}

View file

@ -143,6 +143,14 @@ $(() => (async () => {
require.setLibraryURI(absUrl('../../javascripts/lib'));
require.setGlobalKeyPath('require');
const Split = require('split-grid/dist/split-grid.min');
new Split({
columnGutters: [{
track: 1,
element: document.getElementById('separator'),
}],
});
// This loads the test specs serially. While it is technically possible to load them in parallel,
// the code would be very complex (it involves wrapping require.define(), configuring
// require-kernel to use the wrapped .define() via require.setGlobalKeyPath(), and using the