Handle missing test keys

components/measurement/MeasurementContainer.js

@@ -39,7 +39,12 @@ const MeasurementContainer = ({ measurement, ...props }) => {
  }
 
  const TestDetails = mapTestDetails[measurement.test_name] || DefaultTestDetails
- return <TestDetails measurement={measurement} {...props} />
+
+ return (
+ <React.Fragment>
+ <TestDetails measurement={measurement} {...props} />
+ </React.Fragment>
+ )
 }
 
 export default MeasurementContainer

components/measurement/PerformanceDetails.js

@@ -13,40 +13,37 @@ const PerformanceDetails = ({
  timeouts
 }) => {
  const intl = useIntl()
- let items = [
- {
- label: intl.formatMessage({ id: 'Measurement.Details.Performance.Label.AvgPing' }),
- value: averagePing.toString() + ' ms'
- },
- {
- label: intl.formatMessage({ id: 'Measurement.Details.Performance.Label.MaxPing' }),
- value: `${isNdt7 ? '~' : ''}${maxPing.toString()} ms`
- },
- {
- label: intl.formatMessage({ id: 'Measurement.Details.Performance.Label.MSS' }),
- value: mss.toString()
- },
- {
- label: isNdt7 ? intl.formatMessage({
- id: 'Measurement.Details.Performance.Label.RetransmitRate',
- defaultMessage: 'Retransmit Rate'
- }): intl.formatMessage({ id: 'Measurement.Details.Performance.Label.PktLoss' }),
- value: packetLoss.toString() + '%'
- },
- ]
+ let items = []
+ averagePing && items.push({
+ label: intl.formatMessage({ id: 'Measurement.Details.Performance.Label.AvgPing' }),
+ value: `${averagePing} ms`
+ })
+ maxPing && items.push({
+ label: intl.formatMessage({ id: 'Measurement.Details.Performance.Label.MaxPing' }),
+ value: `${isNdt7 ? '~' : ''}${maxPing} ms`
+ })
+ mss && items.push({
+ label: intl.formatMessage({ id: 'Measurement.Details.Performance.Label.MSS' }),
+ value: `${mss}`
+ })
+
+ packetLoss != undefined && items.push({
+ label: isNdt7 ? intl.formatMessage({
+ id: 'Measurement.Details.Performance.Label.RetransmitRate'
+ }): intl.formatMessage({ id: 'Measurement.Details.Performance.Label.PktLoss' }),
+ value: `${packetLoss}%`
+ })
 
  //Only add outOfOrder and timeouts if NDT4/5 measurement
- if(!isNdt7){
- items = items.concat([
- {
- label: intl.formatMessage({ id: 'Measurement.Details.Performance.Label.OutOfOrder' }),
- value: outOfOrder.toString() + '%'
- },
- {
- label: intl.formatMessage({ id: 'Measurement.Details.Performance.Label.Timeouts' }),
- value: timeouts.toString()
- }
- ])
+ if(!isNdt7) {
+ outOfOrder != undefined && items.push({
+ label: intl.formatMessage({ id: 'Measurement.Details.Performance.Label.OutOfOrder' }),
+ value: outOfOrder.toString() + '%'
+ })
+ timeouts != undefined && items.push({
+ label: intl.formatMessage({ id: 'Measurement.Details.Performance.Label.Timeouts' }),
+ value: timeouts.toString()
+ })
  }
 
  return (

components/measurement/nettests/Dash.js

@@ -1,24 +1,8 @@
-
 import React from 'react'
 import PropTypes from 'prop-types'
-import {
- Heading,
- Flex,
- Box,
- theme
-} from 'ooni-components'
-
+import { Flex, Box } from 'ooni-components'
 import { Text } from 'rebass'
 import { useIntl } from 'react-intl'
-
-import {
- VictoryChart,
- VictoryLine,
- VictoryTooltip,
- VictoryVoronoiContainer,
- VictoryAxis
-} from 'victory'
-
 import MdFlashOn from 'react-icons/lib/md/flash-on'
 
 const InfoBoxItem = ({
@@ -92,10 +76,9 @@ const getOptimalQualityForBitrate = (testKeys) => {
 const DashDetails = ({ measurement, render }) => {
  const intl = useIntl()
  const testKeys = measurement.test_keys
- // const isFailed = testKeys.failure !== null
- // const failure = testKeys.failure
+ const failure = testKeys.failure
 
- if (typeof testKeys.simple === 'undefined' || typeof testKeys.receiver_data === 'undefined') {
+ if (failure === true || typeof testKeys.simple === 'undefined' || typeof testKeys.receiver_data === 'undefined') {
  return render({
  status: 'error'
  })
@@ -105,13 +88,6 @@ const DashDetails = ({ measurement, render }) => {
  const medianBitrate = (testKeys.simple.median_bitrate / 1000).toFixed(2)
  const playoutDelay = (testKeys.simple.min_playout_delay).toFixed(2)
 
- // construct data for graph
- const clientData = testKeys.receiver_data
- const data = clientData.map(iteration => ({
- x: iteration.iteration,
- y: iteration.rate / 1000,
- }))
-
  return (
  render({
  statusIcon: <MdFlashOn />,
@@ -134,55 +110,7 @@ const DashDetails = ({ measurement, render }) => {
  </Flex>
  </Box>
  ),
- details: (
- <Flex>
- {/*<Box p={3} width={1}>
- <Heading h={4}> Video Quality by time </Heading>
- <Box>
- <VictoryChart
- height={200}
- width={600}
- containerComponent={
- <VictoryVoronoiContainer voronoiDimension="x"
- labels={(d) => `${d.y} Mb/s`}
- labelComponent={<VictoryTooltip
- cornerRadius={0}
- flyoutStyle={{fill: 'WHITE'}}
- />}
- />
- }
- >
- <VictoryAxis
- tickValues={data.map((i => i.x + 's'))}
- style={{
- tickLabels: { fontSize: 10, padding: 5}
- }}
- />
- <VictoryAxis
- dependentAxis
- style={{
- axisLabel: { fontSize: 10, padding: 0 },
- ticks: { stroke: "grey", size: 5 },
- tickLabels: { fontSize: 10, padding: 5 }
- }}
- />
- <VictoryLine
- style={{
- data: { stroke: theme.colors.base }
- }}
- data={data}
- animate={{
- duration: 2000,
- onLoad: { duration: 1000 }
- }}
-
-
- />
- </VictoryChart>
- </Box>
- </Box>*/}
- </Flex>
- )
+ details: null
  })
  )
 }

components/measurement/nettests/HTTPHeaderFieldManipulation.js

@@ -9,7 +9,7 @@ export const HttpHeaderFieldManipulationDetails = ({ measurement, render }) => {
  const testKeys = measurement.test_keys
  let isAnomaly = false
  let isFailed = true
- const tampering = testKeys.tampering
+ const tampering = testKeys?.tampering || {}
  Object.keys(tampering).forEach((key) => {
  if (tampering[key] === true) {
  isAnomaly = true
@@ -18,7 +18,6 @@ export const HttpHeaderFieldManipulationDetails = ({ measurement, render }) => {
  isFailed = false
  }
  })
- const headerDiff = testKeys.tampering.header_name_diff
 
  return (
  render({
@@ -29,13 +28,6 @@ export const HttpHeaderFieldManipulationDetails = ({ measurement, render }) => {
  summaryText: isAnomaly
  ? 'Measurement.HTTPHeaderManipulation.MiddleBoxesDetected.SummaryText'
  : 'Measurement.HTTPHeaderManipulation.NoMiddleBoxes.SummaryText',
- details: (
- <div>
- {/*<Text>isAnomaly: {isAnomaly.toString()}</Text>
- <Text>isFailed: {isFailed.toString()}</Text>
- <Text>headerDiff: {headerDiff.toString()}</Text>*/}
- </div>
- )
  })
  )
 }

components/measurement/nettests/Ndt.js

@@ -26,7 +26,7 @@ const InfoBoxItem = ({
  </Box>
 )
 
-const ServerLocation = ({ serverAddress, isNdt7 }) => {
+const ServerLocation = ({ serverAddress = '', isNdt7 }) => {
  const server = mlabServerDetails(serverAddress, isNdt7)
 
  return (
@@ -41,6 +41,7 @@ const ServerLocation = ({ serverAddress, isNdt7 }) => {
 const NdtDetails = ({ measurement, render }) => {
  const intl = useIntl()
  const testKeys = measurement.test_keys
+
  const isFailed = testKeys.failure !== null
  const failure = testKeys.failure
  const isNdt7 = testKeys.protocol === 7
@@ -55,27 +56,44 @@ const NdtDetails = ({ measurement, render }) => {
  const uploadMbit = simple.upload && (simple.upload / 1000).toFixed(2)
  const ping = simple.ping && (simple.ping).toFixed(1)
 
- if (isNdt7) {
- const summary = testKeys.summary || {}
-
- // Summary
- packetLoss = summary.retransmit_rate && (summary.retransmit_rate * 100).toFixed(3)
- minRTT = summary.min_rtt && (summary.min_rtt).toFixed(0)
- maxRTT = summary.max_rtt && (summary.max_rtt).toFixed(0)
- mss = summary.mss
- outOfOrder = null
- timeouts = null
- }
- else {
- const advanced = testKeys.advanced || {}
-
- // Advanced
- packetLoss = advanced.packet_loss && (advanced.packet_loss * 100).toFixed(3)
- outOfOrder = advanced.out_of_order && (advanced.out_of_order * 100).toFixed(1)
- minRTT = advanced.min_rtt && (advanced.min_rtt).toFixed(0)
- maxRTT = advanced.max_rtt && (advanced.max_rtt).toFixed(0)
- mss = advanced.mss
- timeouts = advanced.timeouts
+ let performanceDetails = null
+ try {
+ if (isNdt7) {
+ const summary = testKeys.summary || {}
+ // Summary
+ packetLoss = summary.retransmit_rate && (summary.retransmit_rate * 100).toFixed(3)
+ minRTT = summary.min_rtt && (summary.min_rtt).toFixed(0)
+ maxRTT = summary.max_rtt && (summary.max_rtt).toFixed(0)
+ mss = summary.mss
+ outOfOrder = null
+ timeouts = null
+ }
+ else {
+ const advanced = testKeys.advanced || null
+ // Advanced
+ delete advanced['out_of_order']
+ packetLoss = advanced.packet_loss && (advanced.packet_loss * 100).toFixed(3)
+ outOfOrder = advanced.out_of_order && (advanced.out_of_order * 100).toFixed(1)
+ minRTT = advanced.min_rtt && (advanced.min_rtt).toFixed(0)
+ maxRTT = advanced.max_rtt && (advanced.max_rtt).toFixed(0)
+ mss = advanced?.mss
+ timeouts = advanced?.timeouts
+ }
+ performanceDetails = (
+ <PerformanceDetails
+ isNdt7={isNdt7}
+ averagePing={ping}
+ maxPing={maxRTT}
+ mss={mss}
+ packetLoss={packetLoss}
+ outOfOrder={outOfOrder}
+ timeouts={timeouts}
+ />
+ )
+ } catch (e) {
+ console.error(`Error in parsing test_keys for ${measurement.test_name}`)
+ console.error(e)
+ // Leaves performanceDetails `null` and thus isn't rendered
  }
 
  // FIXME we need to style the failed test case properly
@@ -85,38 +103,30 @@ const NdtDetails = ({ measurement, render }) => {
  statusLabel: intl.formatMessage({id: 'Measurement.Hero.Status.NDT.Title'}),
  statusInfo: (
  <Box width={1}>
- {isFailed ?
+ {isFailed ? (
  <Flex justifyContent='space-around'>
  <h4>Failed Test</h4>
  </Flex>
-  :
+ ) : (
  <Flex justifyContent='space-around'>
  <InfoBoxItem label={intl.formatMessage({ id: 'Measurement.Status.Info.Label.Download' })} content={downloadMbit} unit='Mbps' />
  <InfoBoxItem label={intl.formatMessage({ id: 'Measurement.Status.Info.Label.Upload' })} content={uploadMbit} unit='Mbps' />
  <InfoBoxItem label={intl.formatMessage({ id: 'Measurement.Status.Info.Label.Ping' })} content={ping} unit='ms' />
  <InfoBoxItem
  label={intl.formatMessage({ id: 'Measurement.Status.Info.Label.Server' })}
- content={<ServerLocation
- serverAddress={isNdt7 ? testKeys.server.hostname : testKeys.server_address}
- isNdt7={isNdt7}
- />}
+ content={
+ <ServerLocation
+ serverAddress={isNdt7 ? testKeys.server.hostname : testKeys.server_address}
+ isNdt7={isNdt7}
+ />
+ }
  />
  </Flex>
- }
+ )}
  </Box>
  ),
  details: (
- <div> {!isFailed &&
- <PerformanceDetails
- isNdt7={isNdt7}
- averagePing={ping}
- maxPing={maxRTT}
- mss={mss}
- packetLoss={packetLoss}
- outOfOrder={outOfOrder}
- timeouts={timeouts}
- />}
- </div>
+ <div>{!isFailed && performanceDetails}</div>
  )
  })
  )

components/measurement/nettests/WebConnectivity.js

@@ -150,6 +150,9 @@ const RequestResponseContainer = ({request}) => {
 }
 
 const FailureString = ({failure}) => {
+ if (typeof failure === 'undefined') {
+ return (<FormattedMessage id='Measurement.Details.Endpoint.Status.Unknown' />)
+ }
  if (!failure) {
  return (
  <div>