LOADING...

Preview

Pen ID
Unlock Campus Themeforest adv

 

CSS
body {
  font-family: 'Open Sans', sans-serif;
}

header h1 {
  display: inline-block;
  vertical-align: middle;
  margin: 0 10px;
}

.metric {
  border-radius: 50%;
  border: 1px solid #000;
  width: 2em;
  height: 2em;
  line-height: 2em;
  text-align: center;
  display: inline-block;
  margin-right: 2px;
  float: right;
}
.metric.failed {
  background-color: LavenderBlush;
  border-color: red;
  color: red;
}
.metric.passed {
  background-color: MintCream;
  border-color: green;
  color: green;
}

.Result {
  border: 1px solid #000;
  margin: 5px;
  padding: 5px;
}
.Result h2 {
  margin: 0;
  margin-bottom: 0.5em;
}
.Result.passed {
  border-color: green;
  background: MintCream;
}
.Result.failed {
  border-color: red;
  background: LavenderBlush;
}

.assertion {
  margin-left: 1em;
}
.assertion.passed {
  color: green;
}
.assertion.failed {
  color: red;
}
JS
const basename = path => path.split('/').pop()

const StatusIcon = ({status}) => {status === 'passed' ? '✔' : '✘'}

const Result = ({result}) => (
  

{basename(result.name)}

{result.summary}

{result.assertionResults.map(assertion => (
{assertion.title} { assertion.failureMessages && assertion.failureMessages.map(msg => (
{msg}
)) }
))}
) const Header = ({results}) => (

Jest Test Output

{results.numFailedTestSuites &&
{results.numFailedTestSuites}
} {results.numPassedTestSuites &&
{results.numPassedTestSuites}
}
) const App = ({results}) => (
{results.testResults.map((result, i) => ( ))}
) // get test output from gist and render fetch('https://gist.githubusercontent.com/konsumer/6f2a42da1a239b4e474bdd6a3688c4e5/raw/507b17a6cbd57329e12573114e36f5111f364cab/tests.json') .then(r => r.json()) .then(results => ReactDOM.render(, document.body))
Term
Sat, 04/14/2018 - 20:45

Related Codes

Pen ID
Pen ID
Pen ID
Square Adv