Skip to content

Commit

Permalink
CT report enhancements, see #88
Browse files Browse the repository at this point in the history
  • Loading branch information
@jonathanolson
jonathanolson committed Apr 16, 2020
1 parent 787515f commit 3c79fb1
Show file tree
Hide file tree
Showing 3 changed files with 236 additions and 27 deletions.
58 changes: 58 additions & 0 deletions html/local-built-report.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,71 @@
</head>

<body>
<!--
'../sherpa/lib/mdn-array-from-polyfill.js',
'../sherpa/lib/es6-promise-1e68dc.auto.min.js',
'../joist/js/splash.js',
'../sherpa/lib/jquery-2.1.0.js',
'../sherpa/lib/lodash-4.17.4.js',
'../sherpa/lib/FileSaver-b8054a2.js',
'../sherpa/lib/himalaya-0.2.7.js',
'../sherpa/lib/he-1.1.1.js',
'../assert/js/assert.js',
'../query-string-machine/js/QueryStringMachine.js',
'../chipper/js/initialize-globals.js',
'../phet-core/js/copyWithSortedKeys.js',
'../sherpa/lib/seedrandom-2.4.2.js',
'../sherpa/lib/game-up-camera-1.0.0.js',
'../sherpa/lib/base64-js-1.2.0.js',
'../sherpa/lib/TextEncoderLite-3c9f6f0.js',
'../tandem/js/PhetioIDUtils.js',
'../chipper/js/SimVersion.js',
'../sherpa/lib/poly-decomp-0.3.0.js',
'../sherpa/lib/matter-0.14.2.js',
'../sherpa/lib/p2-0.7.1.js',
'../sherpa/lib/planck-0.3.0-rc.2.js',
'../sherpa/lib/three-r104.js'
-->
<script src="../../assert/js/assert.js"></script>
<script src="../../tandem/js/PhetioIDUtils.js"></script>
<script src="../../sherpa/lib/jquery-2.1.0.js"></script>
<script src="../../sherpa/lib/lodash-4.17.4.min.js"></script>
<script src="../../sherpa/lib/himalaya-0.2.7.js"></script>
<script src="../../sherpa/lib/he-1.1.1.js"></script>
<script src="../../query-string-machine/js/QueryStringMachine.js"></script>
<script type="text/javascript">

window.phet = window.phet || {};
window.phet.chipper = window.phet.chipper || {};
window.phet.chipper.packageObject =
{
"name": "aqua",
"version": "1.0.0-dev.0",
"phet": {
"buildStandalone": true
}
};
window.phet.chipper.stringRepos = [
{
"repo": "joist",
"requirejsNamespace": "JOIST"
},
{
"repo": "scenery-phet",
"requirejsNamespace": "SCENERY_PHET"
},
{
"repo": "sun",
"requirejsNamespace": "SUN"
},
{
"repo": "tambo",
"requirejsNamespace": "TAMBO"
}
];

</script>
<script src="../../chipper/js/initialize-globals.js"></script>

<script src="../build/aqua.min.js"></script>
</body>
Expand Down
58 changes: 58 additions & 0 deletions html/local-report.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,71 @@
</head>

<body>
<!--
'../sherpa/lib/mdn-array-from-polyfill.js',
'../sherpa/lib/es6-promise-1e68dc.auto.min.js',
'../joist/js/splash.js',
'../sherpa/lib/jquery-2.1.0.js',
'../sherpa/lib/lodash-4.17.4.js',
'../sherpa/lib/FileSaver-b8054a2.js',
'../sherpa/lib/himalaya-0.2.7.js',
'../sherpa/lib/he-1.1.1.js',
'../assert/js/assert.js',
'../query-string-machine/js/QueryStringMachine.js',
'../chipper/js/initialize-globals.js',
'../phet-core/js/copyWithSortedKeys.js',
'../sherpa/lib/seedrandom-2.4.2.js',
'../sherpa/lib/game-up-camera-1.0.0.js',
'../sherpa/lib/base64-js-1.2.0.js',
'../sherpa/lib/TextEncoderLite-3c9f6f0.js',
'../tandem/js/PhetioIDUtils.js',
'../chipper/js/SimVersion.js',
'../sherpa/lib/poly-decomp-0.3.0.js',
'../sherpa/lib/matter-0.14.2.js',
'../sherpa/lib/p2-0.7.1.js',
'../sherpa/lib/planck-0.3.0-rc.2.js',
'../sherpa/lib/three-r104.js'
-->
<script src="../../assert/js/assert.js"></script>
<script src="../../tandem/js/PhetioIDUtils.js"></script>
<script src="../../sherpa/lib/jquery-2.1.0.js"></script>
<script src="../../sherpa/lib/lodash-4.17.4.min.js"></script>
<script src="../../sherpa/lib/himalaya-0.2.7.js"></script>
<script src="../../sherpa/lib/he-1.1.1.js"></script>
<script src="../../query-string-machine/js/QueryStringMachine.js"></script>
<script type="text/javascript">

window.phet = window.phet || {};
window.phet.chipper = window.phet.chipper || {};
window.phet.chipper.packageObject =
{
"name": "aqua",
"version": "1.0.0-dev.0",
"phet": {
"buildStandalone": true
}
};
window.phet.chipper.stringRepos = [
{
"repo": "joist",
"requirejsNamespace": "JOIST"
},
{
"repo": "scenery-phet",
"requirejsNamespace": "SCENERY_PHET"
},
{
"repo": "sun",
"requirejsNamespace": "SUN"
},
{
"repo": "tambo",
"requirejsNamespace": "TAMBO"
}
];

</script>
<script src="../../chipper/js/initialize-globals.js"></script>

<script type="module" src="../js/aqua-main.js"></script>
</body>
Expand Down
147 changes: 120 additions & 27 deletions js/report/report.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,16 @@
*/

import Property from '../../../axon/js/Property.js';
import PhetFont from '../../../scenery-phet/js/PhetFont.js';
import Display from '../../../scenery/js/display/Display.js';
import FireListener from '../../../scenery/js/listeners/FireListener.js';
import HBox from '../../../scenery/js/nodes/HBox.js';
import Node from '../../../scenery/js/nodes/Node.js';
import Rectangle from '../../../scenery/js/nodes/Rectangle.js';
import Text from '../../../scenery/js/nodes/Text.js';
import VBox from '../../../scenery/js/nodes/VBox.js';
import Color from '../../../scenery/js/util/Color.js';
import TextPushButton from '../../../sun/js/buttons/TextPushButton.js';

window.assertions.enableAssert();

Expand All @@ -26,13 +30,13 @@ const options = QueryStringMachine.getAll( {
} );

const passColor = new Color( 60, 255, 60 );
const passColorPartial = new Color( 170, 255, 170 );
const failColor = new Color( 255, 90, 90 );
const mixedColor = new Color( 255,210,80 );
const unincludedColor = new Color( 128, 128, 128 );
const failColorPartial = new Color( 255, 190, 190 );
const untestedColor = new Color( 240, 240, 240 );

// Property.<string>
const snapshotStatusProperty = new Property( 'unknown status' );
// {Property.<string>}
const snapshotStatusProperty = new Property( 'loading...' );

snapshotStatusProperty.lazyLink( status => console.log( `Status: ${status}` ) );

Expand All @@ -50,7 +54,7 @@ snapshotStatusProperty.lazyLink( status => console.log( `Status: ${status}` ) );
req.send();
})();

// Property.<Object|null>
// {Property.<Object|null>}
const reportProperty = new Property( {
snapshots: [],
testNames: []
Expand All @@ -72,10 +76,8 @@ const reportProperty = new Property( {
req.send();
})();





// {Property.<Array.<string>>} - Which repos to expand!
const expandedReposProperty = new Property( [] );

const rootNode = new Node();
const display = new Display( rootNode, {
Expand All @@ -84,7 +86,7 @@ const display = new Display( rootNode, {

document.body.appendChild( display.domElement );

const statusNode = new Text( '', { fontSize: 14 } );
const statusNode = new Text( '', { font: new PhetFont( { size: 14 } ) } );
snapshotStatusProperty.link( status => {
statusNode.text = status;
} );
Expand All @@ -94,18 +96,74 @@ const reportNode = new Node();
rootNode.addChild( new VBox( {
spacing: 10,
align: 'left',
children: [ statusNode, reportNode ]
children: [
statusNode,
new HBox( {
spacing: 10,
children: [
new TextPushButton( 'Expand all', {
listener: () => {
expandedReposProperty.value = _.uniq( reportProperty.value.testNames.map( names => names[ 0 ] ) );
}
} ),
new TextPushButton( 'Collapse all', {
listener: () => {
expandedReposProperty.value = [];
}
} )
]
} ),
reportNode
]
} ) );

reportProperty.link( report => {
const testLabels = report.testNames.map( names => new Text( names.join( ' : ' ), { fontSize: 12 } ) );
Property.multilink( [ reportProperty, expandedReposProperty ], ( report, expandedRepos ) => {
const tests = [];

// scan to determine what tests we are showing
report.testNames.forEach( ( names, index ) => {
if ( !expandedRepos.includes( names[ 0 ] ) ) {
const lastTest = tests[ tests.length - 1 ];
if ( lastTest && lastTest.names[ 0 ] === names[ 0 ] ) {
lastTest.indices.push( index );
}
else {
tests.push( {
names: [ names[ 0 ] ],
indices: [ index ]
} );
}
}
else {
tests.push( {
names: names,
indices: [ index ]
} );
}
} );

const testLabels = tests.map( test => {
const label = new Text( test.names.join( ' : ' ), { font: new PhetFont( { size: 12 } ) } );
label.addInputListener( new FireListener( {
fire: () => {
const topLevelName = test.names[ 0 ];
if ( test.names.length > 1 ) {
expandedReposProperty.value = expandedReposProperty.value.filter( name => name !== topLevelName );
}
else {
expandedReposProperty.value = _.uniq( [ ...expandedReposProperty.value, topLevelName ] );
}
}
} ) );
return label;
} );

const padding = 3;

const snapshotLabels = report.snapshots.map( snapshot => new VBox( {
spacing: 2,
children: [
...new Date( snapshot.timestamp ).toLocaleString().replace( ',', '' ).replace( ' AM', 'am' ).replace( ' PM', 'pm' ).split( ' ' ).map( str => new Text( str, { fontSize: 10 } ) )
...new Date( snapshot.timestamp ).toLocaleString().replace( ',', '' ).replace( ' AM', 'am' ).replace( ' PM', 'pm' ).split( ' ' ).map( str => new Text( str, { font: new PhetFont( { size: 10 } ) } ) )
],
cursor: 'pointer'
} ) );
Expand All @@ -116,32 +174,67 @@ reportProperty.link( report => {
const maxSnapshotLabelHeight = _.max( snapshotLabels.map( node => node.height ) );

const snapshotsTestNodes = _.flatten( report.snapshots.map( ( snapshot, i ) => {
return report.testNames.map( ( names, j ) => {
const test = snapshot.tests[ j ];

return tests.map( ( test, j ) => {
const x = maxTestLabelWidth + padding + i * ( maxSnapshotLabelWidth + padding );
const y = maxSnapshotLabelHeight + padding + j * ( maxTestLabelHeight + padding );
const background = new Rectangle( 0, 0, maxSnapshotLabelWidth, maxTestLabelHeight, {
x: maxTestLabelWidth + padding + i * ( maxSnapshotLabelWidth + padding ),
y: maxSnapshotLabelHeight + padding + j * ( maxTestLabelHeight + padding )
x: x,
y: y
} );

if ( typeof test.y === 'number' ) {
if ( test.y > 0 && test.n === 0 ) {
background.fill = passColor;
let totalCount = 0;
let untestedCount = 0;
let passCount = 0;
let failCount = 0;

test.indices.forEach( index => {
totalCount++;

const snapshotTest = snapshot.tests[ index ];

if ( typeof snapshotTest.y === 'number' ) {
passCount += snapshotTest.y;
failCount += snapshotTest.n;
if ( snapshotTest.y + snapshotTest.n === 0 ) {
untestedCount++;
}
}
else {
untestedCount++;
}
else if ( test.y === 0 && test.n > 0 ) {
} );

const completeRatio = totalCount ? ( ( totalCount - untestedCount ) / totalCount ) : 1;

if ( failCount > 0 ) {
if ( untestedCount === 0 ) {
background.fill = failColor;
}
else if ( test.y === 0 && test.n === 0 ) {
background.fill = untestedColor;
else {
background.fill = failColorPartial;
background.addChild( new Rectangle( 0, 0, completeRatio * maxSnapshotLabelWidth, maxTestLabelHeight, {
fill: failColor
} ) );
}
}
else if ( passCount > 0 ) {
if ( untestedCount === 0 ) {
background.fill = passColor;
}
else {
background.fill = mixedColor;
background.fill = passColorPartial;
background.addChild( new Rectangle( 0, 0, completeRatio * maxSnapshotLabelWidth, maxTestLabelHeight, {
fill: passColor
} ) );

}
}
else {
background.fill = unincludedColor;
background.fill = untestedColor;
}

// TODO: display percentage? have something if there is something not meant to test?

return background;
} );
} ) );
Expand Down

0 comments on commit 3c79fb1

Please sign in to comment.