diff --git a/src/node/utils/Minify.js b/src/node/utils/Minify.js
index ed107af7e..58dba2097 100644
--- a/src/node/utils/Minify.js
+++ b/src/node/utils/Minify.js
@@ -41,6 +41,7 @@ const LIBRARY_WHITELIST = [
'async',
'js-cookie',
'security',
+ 'split-grid',
'tinycon',
'underscore',
'unorm',
diff --git a/src/package-lock.json b/src/package-lock.json
index 2e5bce2ce..e5c722fe6 100644
--- a/src/package-lock.json
+++ b/src/package-lock.json
@@ -7933,6 +7933,11 @@
"memory-pager": "^1.0.2"
}
},
+ "split-grid": {
+ "version": "1.0.11",
+ "resolved": "https://registry.npmjs.org/split-grid/-/split-grid-1.0.11.tgz",
+ "integrity": "sha512-ELtFtxc3r5we5GZfe6Fi0BFFxIi2M6BY1YEntBscKRDD3zx4JVHqx2VnTRSQu1BixCYSTH3MTjKd4esI2R7EgQ=="
+ },
"split2": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/split2/-/split2-3.2.2.tgz",
diff --git a/src/package.json b/src/package.json
index 7d70e776b..de84b7ee0 100644
--- a/src/package.json
+++ b/src/package.json
@@ -65,6 +65,7 @@
"security": "1.0.0",
"semver": "5.7.1",
"socket.io": "^2.4.1",
+ "split-grid": "^1.0.11",
"terser": "^4.7.0",
"threads": "^1.4.0",
"tiny-worker": "^2.3.0",
diff --git a/src/tests/frontend/index.html b/src/tests/frontend/index.html
index bd8e76606..2b70ca667 100644
--- a/src/tests/frontend/index.html
+++ b/src/tests/frontend/index.html
@@ -8,8 +8,11 @@
-
-
+
diff --git a/src/tests/frontend/runner.css b/src/tests/frontend/runner.css
index 8af5440ff..b751d414a 100644
--- a/src/tests/frontend/runner.css
+++ b/src/tests/frontend/runner.css
@@ -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%;
}
diff --git a/src/tests/frontend/runner.js b/src/tests/frontend/runner.js
index 3100b13df..621f1d2e2 100644
--- a/src/tests/frontend/runner.js
+++ b/src/tests/frontend/runner.js
@@ -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