From 83655506e8c6f6f22770c179cf1a31e9942b7bc5 Mon Sep 17 00:00:00 2001 From: Cameron Dawson Date: Tue, 29 Jan 2019 10:43:39 -0800 Subject: [PATCH] Bug 1521157 - Update dataset for unit tests (#4502) --- ui/helpers/url.js | 7 +++ ui/job-view/pushes/PushActionMenu.jsx | 12 +++++ ui/push-health/Health.jsx | 7 ++- ui/push-health/Metric.jsx | 68 ++++++++++++++++++++------- ui/push-health/Navigation.jsx | 6 +++ ui/push-health/TestFailure.jsx | 54 +++++++++++++++++++++ ui/push-health/helpers.js | 25 ++++++++-- ui/push-health/index.jsx | 1 + ui/push-health/pushhealth.css | 3 ++ 9 files changed, 161 insertions(+), 22 deletions(-) create mode 100644 ui/push-health/TestFailure.jsx create mode 100644 ui/push-health/pushhealth.css diff --git a/ui/helpers/url.js b/ui/helpers/url.js index da4338c275f..396b831cf20 100644 --- a/ui/helpers/url.js +++ b/ui/helpers/url.js @@ -1,5 +1,7 @@ export const uiJobsUrlBase = '/#/jobs'; +export const uiPushHealthBase = '/pushhealth.html'; + export const bzBaseUrl = 'https://bugzilla.mozilla.org/'; export const hgBaseUrl = 'https://hg.mozilla.org/'; @@ -82,6 +84,11 @@ export const getJobsUrl = function getJobsUrl(params) { return `${uiJobsUrlBase}${createQueryParams(params)}`; }; +// This takes a plain object, rather than a URLSearchParams object. +export const getPushHealthUrl = function getJobsUrl(params) { + return `${uiPushHealthBase}${createQueryParams(params)}`; +}; + export const getCompareChooserUrl = function getCompareChooserUrl(params) { return `perf.html#/comparechooser${createQueryParams(params)}`; }; diff --git a/ui/job-view/pushes/PushActionMenu.jsx b/ui/job-view/pushes/PushActionMenu.jsx index 99195ac54ba..3a15b816417 100644 --- a/ui/job-view/pushes/PushActionMenu.jsx +++ b/ui/job-view/pushes/PushActionMenu.jsx @@ -7,6 +7,7 @@ import CustomJobActions from '../CustomJobActions'; import PushModel from '../../models/push'; import { withPushes } from '../context/Pushes'; import { withNotifications } from '../../shared/context/Notifications'; +import { getPushHealthUrl } from '../../helpers/url'; // Trigger missing jobs is dangerous on repos other than these (see bug 1335506) const triggerMissingRepos = ['mozilla-inbound', 'autoland']; @@ -229,6 +230,17 @@ class PushActionMenu extends React.PureComponent { Set as bottom of range +
  • +
  • + + DEMO: Push Health (fake data) + +
    • {customJobActionsShowing && ( {healthData ? (
    -

    +

    -

    + {healthData.metrics.map(metric => ( @@ -77,6 +77,9 @@ export default class Health extends React.Component { result={metric.result} value={metric.value} details={metric.details} + failures={metric.failures} + repo={repo} + revision={revision} /> ))} diff --git a/ui/push-health/Metric.jsx b/ui/push-health/Metric.jsx index dcea7c4164a..44a7023e39b 100644 --- a/ui/push-health/Metric.jsx +++ b/ui/push-health/Metric.jsx @@ -5,8 +5,10 @@ import { faPlusSquare, faMinusSquare, } from '@fortawesome/free-regular-svg-icons'; +import { Badge, Row, Col } from 'reactstrap'; import { resultColorMap } from './helpers'; +import TestFailure from './TestFailure'; export default class Metric extends React.PureComponent { constructor(props) { @@ -25,41 +27,75 @@ export default class Metric extends React.PureComponent { render() { const { detailsShowing } = this.state; - const { result, name, value, details } = this.props; + const { + result, + name, + value, + details, + failures, + repo, + revision, + } = this.props; const resultColor = resultColorMap[result]; const expandIcon = detailsShowing ? faMinusSquare : faPlusSquare; return ( + +
    + + {name} + + + + +
    + + Confidence: + + {value} + - +     {detailsShowing && ( -
    Confidence: {value}/10
    - {details.map(detail => ( -
    - {detail} -
    - ))} + {failures && + failures.map(failure => ( + + ))} + {details && + details.map(detail => ( +
    + {detail} +
    + ))}     )} - - + + ); } } Metric.propTypes = { + repo: PropTypes.string.isRequired, + revision: PropTypes.string.isRequired, result: PropTypes.string.isRequired, name: PropTypes.string.isRequired, value: PropTypes.number.isRequired, details: PropTypes.array.isRequired, + failures: PropTypes.array, +}; + +Metric.defaultProps = { + failures: null, }; diff --git a/ui/push-health/Navigation.jsx b/ui/push-health/Navigation.jsx index 880b46e09a6..cbbdc4a6647 100644 --- a/ui/push-health/Navigation.jsx +++ b/ui/push-health/Navigation.jsx @@ -12,6 +12,12 @@ export default class Navigation extends React.PureComponent { return ( + + [---FAKE-DATA---] + ); diff --git a/ui/push-health/TestFailure.jsx b/ui/push-health/TestFailure.jsx new file mode 100644 index 00000000000..7f0a2f47527 --- /dev/null +++ b/ui/push-health/TestFailure.jsx @@ -0,0 +1,54 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { faStar } from '@fortawesome/free-solid-svg-icons'; +import { Badge, Row, Col } from 'reactstrap'; + +import { getJobsUrl } from '../helpers/url'; + +export default class TestFailure extends React.PureComponent { + render() { + const { failure, repo, revision } = this.props; + const { + testName, + jobName, + jobId, + classification, + failureLine, + confidence, + } = failure; + + return ( + + + {testName} + + Line confidence: + + {confidence} + + + +
    + + {jobName} + + + + {classification} + +
    + {failureLine} + + ); + } +} + +TestFailure.propTypes = { + failure: PropTypes.object.isRequired, + repo: PropTypes.object.isRequired, + revision: PropTypes.object.isRequired, +}; diff --git a/ui/push-health/helpers.js b/ui/push-health/helpers.js index c97bcc300a5..41f5bf7e215 100644 --- a/ui/push-health/helpers.js +++ b/ui/push-health/helpers.js @@ -17,9 +17,26 @@ export const healthData = { name: 'Tests', result: 'fail', value: 2, - details: [ - 'Ran some tests that did not go so well', - 'See [foo.bar.baz/mongo/rational/fee]', + failures: [ + { + testName: 'dom/tests/mochitest/fetch/test_fetch_cors_sw_reroute.html', + jobName: 'test-linux32/opt-mochitest-browser-chrome-e10s-4', + jobId: 223458405, + classification: 'intermittent', + failureLine: + 'REFTEST TEST-UNEXPECTED-FAIL | file:///builds/worker/workspace/build/tests/reftest/tests/layout/reftests/border-dotted/border-dashed-no-radius.html == file:///builds/worker/workspace/build/tests/reftest/tests/layout/reftests/border-dotted/masked.html | image comparison, max difference: 255, number of differing pixels: 54468', + confidence: 3, + }, + { + testName: + 'browser/components/extensions/test/browser/test-oop-extensions/browser_ext_pageAction_context.js', + jobName: 'test-linux64/debug-mochitest-plain-headless-e10s-8', + jobId: 223458405, + classification: 'intermittent', + failureLine: + "raptor-main TEST-UNEXPECTED-FAIL: test 'raptor-tp6-bing-firefox' timed out loading test page: https://www.bing.com/search?q=barack+obama", + confidence: 4, + }, ], }, { @@ -36,7 +53,7 @@ export const healthData = { name: 'Performance', result: 'pass', value: 10, - details: [], + details: ['Ludicrous Speed'], }, ], }; diff --git a/ui/push-health/index.jsx b/ui/push-health/index.jsx index 74a42045c69..90330cae623 100644 --- a/ui/push-health/index.jsx +++ b/ui/push-health/index.jsx @@ -6,6 +6,7 @@ import 'bootstrap/dist/css/bootstrap.min.css'; // Treeherder Styles import '../css/treeherder-navbar.css'; +import './pushhealth.css'; import App from './App'; diff --git a/ui/push-health/pushhealth.css b/ui/push-health/pushhealth.css new file mode 100644 index 00000000000..1047ad6b8d8 --- /dev/null +++ b/ui/push-health/pushhealth.css @@ -0,0 +1,3 @@ +.metric-name { + font-size: 24px; +}
    -
    +
    -
    -

    - {name} - - +