@instructure/quiz-core 22.17.0 → 22.18.0

package/src/reporting/components/resources/NewQuizAndItemAnalysis/withAnalysisState.js

@@ -0,0 +1,73 @@
+import {withAnalysisStatePresenter} from './withAnalysisStatePresenter'
+
+import {
+  getQuizAnalysis,
+  getItemAnalyses,
+  getFetchInProgress,
+  getGenerationInProgress,
+  getAnalysisError,
+  getStatusPollingInProgress,
+} from '../../../../common/selectors/analyses'
+import {
+  setQuizAnalysis,
+  setItemAnalyses,
+  setFetchInProgress,
+  setGenerationInProgress,
+  setAnalysisError,
+  setStatusPollingInProgress,
+} from '../../../../common/actions/analyses'
+import {getQuizAnalysis as _fetchQuizAnalysis} from '../../../api/getQuizAnalysis'
+import {getItemAnalyses as _fetchItemAnalyses} from '../../../api/getItemAnalyses'
+import {getAnalysesStatus as _fetchAnalysesStatus} from '../../../api/getAnalysesStatus'
+import {getAnalysesExport as _getAnalysesExport} from '../../../api/getAnalysesExport'
+import {connect} from '../../../../common/react-redux'
+import {Fetcher} from '../../../../common/util/Fetcher'
+import {bindActionCreators, compose} from 'redux'
+import {getActiveQuizId} from '../../../../common/selectors/quizzes'
+import {addError} from '../../../../common/actions/alerts'
+import {Set} from 'immutable'
+
+const DEFAULT_POLLING_INTERVAL = 3000
+
+const mapStateToProps = (state, ownProps) => {
+  const apiEndpoint = state?.config?.get?.('apiEndpoint') || ''
+  const userToken = state?.config?.get?.('userToken')
+  const fetcher = new Fetcher({apiEndpoint, userToken})
+
+  return {
+    quizAnalysis: getQuizAnalysis(state),
+    itemAnalyses: getItemAnalyses(state),
+    fetchInProgress: getFetchInProgress(state),
+    generationInProgress: getGenerationInProgress(state),
+    statusPollingInProgress: getStatusPollingInProgress(state),
+    analysisError: getAnalysisError(state),
+    activeQuizId: ownProps.activeQuizId || getActiveQuizId(state),
+    fetchQuizAnalysis: (quizId, filter) => _fetchQuizAnalysis(quizId, filter, fetcher),
+    fetchItemAnalyses: (quizId, filter) => _fetchItemAnalyses(quizId, filter, fetcher),
+    fetchAnalysesStatus: (quizId, filter, type) =>
+      _fetchAnalysesStatus(quizId, filter, type, fetcher),
+    getAnalysesExport: (quizId, format, filter, type, isAnon) =>
+      _getAnalysesExport(quizId, format, filter, type, isAnon, {apiEndpoint, userToken}),
+    pollingInterval: ownProps.pollingInterval || DEFAULT_POLLING_INTERVAL,
+    exportEnabled: (state.features ?? Set()).includes('item_analysis_csv'),
+  }
+}
+
+const mapDispatchToProps = (dispatch, ownProps) => {
+  return {
+    setQuizAnalysis: bindActionCreators(setQuizAnalysis, dispatch),
+    setItemAnalyses: bindActionCreators(setItemAnalyses, dispatch),
+    setFetchInProgress: bindActionCreators(setFetchInProgress, dispatch),
+    setGenerationInProgress: bindActionCreators(setGenerationInProgress, dispatch),
+    setAnalysisError: bindActionCreators(setAnalysisError, dispatch),
+    addError: ownProps.addError || bindActionCreators(addError, dispatch),
+    setStatusPollingInProgress: bindActionCreators(setStatusPollingInProgress, dispatch),
+  }
+}
+
+export const withAnalysisState = compose(
+  connect(mapStateToProps, mapDispatchToProps),
+  withAnalysisStatePresenter,
+)
+
+export default withAnalysisState

package/src/reporting/components/resources/NewQuizAndItemAnalysis/withAnalysisStatePresenter.js

@@ -0,0 +1,156 @@
+import React, {useEffect, useState} from 'react'
+import PropTypes from 'prop-types'
+import {itemAnalysisPropType, quizAnalysisPropType} from '../common/propTypes'
+import {fetchReports} from './fetchReports'
+import {fetchReportsStatus} from './fetchReportsStatus'
+import {getErrorMessageForCode} from '../common/errorCodes'
+import {generateReports as triggerReportGeneration} from '../common/generateReports'
+import {exportReports as triggerExportReports} from '../common/exportReports'
+import {saveFile} from '../common/utils'
+
+export const withAnalysisStatePresenter = OriginalComponent => {
+  function WithAnalysisStatePresenter({
+    quizAnalysis,
+    itemAnalyses,
+    fetchInProgress,
+    generationInProgress,
+    analysisError,
+    setQuizAnalysis,
+    addError,
+    setItemAnalyses,
+    setFetchInProgress,
+    setGenerationInProgress,
+    setAnalysisError,
+    activeQuizId,
+    generateAnalysis,
+    fetchQuizAnalysis,
+    fetchItemAnalyses,
+    getAnalysesExport,
+    fetchAnalysesStatus,
+    statusPollingInProgress,
+    setStatusPollingInProgress,
+    pollingInterval,
+    disableReportsCache,
+    ...passThroughProps
+  }) {
+    WithAnalysisStatePresenter.displayName = `WithAnalysisStatePresenter(${OriginalComponent.displayName || OriginalComponent.name})`
+
+    const [analysisFetchError, setAnalysisFetchError] = useState(false)
+
+    const instrumentedFetchReports = () =>
+      fetchReports({
+        activeQuizId,
+        addError,
+        fetchQuizAnalysis,
+        fetchItemAnalyses,
+        setAnalysisError,
+        setStatusPollingInProgress,
+        setItemAnalyses,
+        setGenerationInProgress,
+        setFetchInProgress,
+        setQuizAnalysis,
+        getErrorMessageForCode,
+        setAnalysisFetchError,
+      })
+    const instrumentedStatusFetching = () =>
+      fetchReportsStatus({
+        activeQuizId,
+        addError,
+        setGenerationInProgress,
+        setStatusPollingInProgress,
+        fetchAnalysesStatus,
+        instrumentedFetchReports,
+      })
+
+    async function generateReports(filter = 'last_attempt') {
+      const generationConfig = {
+        filter,
+        generateAnalysis,
+        setGenerationInProgress,
+        setStatusPollingInProgress,
+        addError,
+      }
+      await triggerReportGeneration(generationConfig)
+    }
+
+    async function exportReports(format, filter = 'last_attempt') {
+      const exportConfig = {
+        getAnalysesExport,
+        format,
+        filter,
+        activeQuizId,
+        addError,
+        saveFile,
+      }
+
+      await triggerExportReports(exportConfig)
+    }
+
+    useEffect(() => {
+      const fetchIfNeeded = async () => {
+        const hasStoredAnalyses = quizAnalysis && itemAnalyses
+        if (!hasStoredAnalyses || disableReportsCache) {
+          await instrumentedFetchReports()
+        }
+      }
+
+      fetchIfNeeded()
+    }, [])
+
+    const recursiveInstrumentedStatusFetching = async () => {
+      const isReportGenerationReady = await instrumentedStatusFetching()
+      !isReportGenerationReady && setTimeout(recursiveInstrumentedStatusFetching, pollingInterval)
+    }
+
+    useEffect(() => {
+      statusPollingInProgress && recursiveInstrumentedStatusFetching()
+    }, [statusPollingInProgress])
+
+    return (
+      <OriginalComponent
+        quizAnalysis={quizAnalysis}
+        itemAnalyses={itemAnalyses}
+        fetchInProgress={fetchInProgress}
+        generationInProgress={generationInProgress}
+        analysisError={analysisError}
+        generateReports={generateReports}
+        exportReports={exportReports}
+        analysisFetchError={analysisFetchError}
+        {...passThroughProps}
+      />
+    )
+  }
+
+  WithAnalysisStatePresenter.propTypes = {
+    quizAnalysis: quizAnalysisPropType,
+    itemAnalyses: PropTypes.arrayOf(itemAnalysisPropType),
+    fetchInProgress: PropTypes.bool.isRequired,
+    generationInProgress: PropTypes.bool.isRequired,
+    statusPollingInProgress: PropTypes.bool.isRequired,
+    analysisError: PropTypes.string,
+    setQuizAnalysis: PropTypes.func.isRequired,
+    setItemAnalyses: PropTypes.func.isRequired,
+    setFetchInProgress: PropTypes.func.isRequired,
+    setGenerationInProgress: PropTypes.func.isRequired,
+    setAnalysisError: PropTypes.func.isRequired,
+    setStatusPollingInProgress: PropTypes.func.isRequired,
+    activeQuizId: PropTypes.string.isRequired,
+    fetchQuizAnalysis: PropTypes.func.isRequired,
+    fetchItemAnalyses: PropTypes.func.isRequired,
+    fetchAnalysesStatus: PropTypes.func.isRequired,
+    getAnalysesExport: PropTypes.func.isRequired,
+    addError: PropTypes.func.isRequired,
+    pollingInterval: PropTypes.number.isRequired,
+    generateAnalysis: PropTypes.func.isRequired, // from LTI, f(filter: string, onError?: func(error))
+    disableReportsCache: PropTypes.bool,
+  }
+
+  WithAnalysisStatePresenter.defaultProps = {
+    quizAnalysis: void 0,
+    itemAnalyses: void 0,
+    analysisError: '',
+    disableReportsCache: false,
+  }
+
+  return WithAnalysisStatePresenter
+}

package/src/reporting/components/resources/OutcomeAnalysis/__tests__/index.test.js

@@ -0,0 +1,23 @@
+import {fromJS} from 'immutable'
+import {mapStateToProps} from '../index'
+import {expect} from 'vitest'
+
+describe('connected OutcomeAnalysis', () => {
+  const fakeState = {
+    ui: fromJS({}),
+    outcomes: fromJS({
+      contextUuid: 'alphabeta',
+      outcomesEndpoint: 'http://outcomes',
+      outcomesToken: 'tokenme',
+    }),
+  }
+
+  describe('mapStateToProps', () => {
+    it('maps outcomes credentials from state', () => {
+      const props = mapStateToProps(fakeState)
+      expect(props.contextUuid).toBe('alphabeta')
+      expect(props.outcomesHost).toBe('http://outcomes')
+      expect(props.outcomesToken).toBe('tokenme')
+    })
+  })
+})

package/src/reporting/components/resources/OutcomeAnalysis/__tests__/presenter.test.js

@@ -0,0 +1,48 @@
+import React from 'react'
+import {render} from '@testing-library/react'
+import {OutcomeAnalysis} from '../presenter'
+import {expect, vi} from 'vitest'
+
+// Mock the OutcomesPerStudentReport since it comes from an external package
+vi.mock('@instructure/outcomes-ui/es/containers/OutcomesPerStudentReport', () => ({
+  default: props => (
+    <div data-testid="outcomes-report">
+      {JSON.stringify({
+        contextUuid: props.contextUuid,
+        host: props.host,
+        jwt: props.jwt,
+        artifactType: props.artifactType,
+        artifactId: props.artifactId,
+        showRollups: props.showRollups,
+      })}
+    </div>
+  ),
+}))
+
+describe('OutcomeAnalysis', () => {
+  const defaultProps = {
+    appContainer: '#app',
+    contextUuid: 'alphabeta',
+    outcomesHost: 'foo.outcomes',
+    outcomesToken: 'bar',
+    quizId: '100',
+    screenreaderNotification: vi.fn(),
+  }
+
+  it('should render OutcomesPerStudentReport with correct props', () => {
+    const {container} = render(<OutcomeAnalysis {...defaultProps} />)
+    const text = container.textContent
+    expect(text).toContain('alphabeta')
+    expect(text).toContain('foo.outcomes')
+    expect(text).toContain('bar')
+    expect(text).toContain('quizzes.quiz')
+    expect(text).toContain('100')
+  })
+
+  it('sets the correct default values for optional props', () => {
+    const {container} = render(<OutcomeAnalysis {...defaultProps} />)
+    const text = container.textContent
+    // showRollups defaults to true
+    expect(text).toContain('"showRollups":true')
+  })
+})

package/src/reporting/components/resources/OutcomeAnalysis/index.js

@@ -0,0 +1,20 @@
+import {connect} from '../../../../common/react-redux'
+import {screenreaderNotification} from '../../../../common/actions/alerts'
+import {OutcomeAnalysis as OutcomeAnalysisPresenter} from './presenter'
+
+export function mapStateToProps(state) {
+  return {
+    appContainer: state.ui.get('appContainer'),
+    contextUuid: state.outcomes.get('contextUuid'),
+    outcomesHost: state.outcomes.get('outcomesEndpoint'),
+    outcomesToken: state.outcomes.get('outcomesToken'),
+  }
+}
+
+const mapDispatchToProps = {screenreaderNotification}
+
+export const OutcomeAnalysis = connect(
+  mapStateToProps,
+  mapDispatchToProps,
+)(OutcomeAnalysisPresenter)
+export default OutcomeAnalysis

package/src/reporting/components/resources/OutcomeAnalysis/presenter.js

@@ -0,0 +1,72 @@
+import React, {Component} from 'react'
+import PropTypes from 'prop-types'
+import OutcomesPerStudentReport from '@instructure/outcomes-ui/es/containers/OutcomesPerStudentReport'
+import {liveRegion} from '@instructure/quiz-common/alertHelpers'
+
+import CustomPropTypes from '../../../../common/util/CustomPropTypes'
+
+export class OutcomeAnalysis extends Component {
+  static propTypes = {
+    appContainer: CustomPropTypes.selectors.isRequired,
+    quizId: PropTypes.string.isRequired,
+    contextUuid: PropTypes.string.isRequired,
+    outcomesHost: PropTypes.string.isRequired,
+    outcomesToken: PropTypes.string.isRequired,
+    loadUsersOverride: PropTypes.func,
+    showRollups: PropTypes.bool,
+    screenreaderNotification: PropTypes.func.isRequired,
+  }
+
+  static defaultProps = {
+    loadUsersOverride: void 0,
+    showRollups: true,
+  }
+
+  render() {
+    const {quizId, contextUuid, outcomesHost, outcomesToken, loadUsersOverride, showRollups} =
+      this.props
+    return (
+      <OutcomesPerStudentReport
+        artifactType="quizzes.quiz"
+        artifactId={quizId}
+        contextUuid={contextUuid}
+        host={outcomesHost}
+        jwt={outcomesToken}
+        loadUsersOverride={loadUsersOverride}
+        showRollups={showRollups}
+        screenreaderNotification={this.props.screenreaderNotification}
+        liveRegion={liveRegion}
+      />
+    )
+  }
+}
+/**
+ ---
+ category: components
+ name: OutcomeAnalysis
+ ---
+ SDK Outcome Analysis Report component
+
+ A component to show outcomes results
+
+ ```jsx_example
+ function Example () {
+    return (
+      <SDKApp
+        apiEndpoint={`http://${config.API_HOST}`}
+        appContainer="#app"
+        userToken={config.TOKEN_QUIZ_BUILD}
+        outcomesEndpoint={`http://${config.OUTCOMES_HOST}`}
+        outcomesToken={config.TOKEN_OUTCOMES_REPORT}
+      >
+        <OutcomeAnalysis quizId='1' />
+      </SDKApp>
+    )
+  }
+
+ <SettingsSwitcher locales={LOCALES}>
+ <Example />
+ </SettingsSwitcher>
+ ```
+ */
+export default OutcomeAnalysis

package/src/reporting/components/resources/QuizAndItemAnalysis/README.md

@@ -0,0 +1,26 @@
+---
+category: components
+name: QuizAndItemAnalysis
+---
+SDK Quiz and Item Analysis component
+A component to show quiz statistics and item analysis statistics
+
+```jsx_example
+function Example () {
+  return (
+    <SDKApp
+      apiEndpoint={`http://${config.API_HOST}`}
+      appContainer="#app"
+      userToken={config.TOKEN_QUIZ_ANALYSIS}
+      outcomesEndpoint={`http://${config.OUTCOMES_HOST}`}
+      outcomesToken={config.TOKEN_OUTCOME_REPORTING}
+    >
+      <QuizAndItemAnalysis activeQuizId='1' />
+    </SDKApp>
+  )
+}
+
+<LocaleSwitcher locales={LOCALES}>
+  <Example />
+</LocaleSwitcher>
+```

package/src/reporting/components/resources/QuizAndItemAnalysis/__tests__/index.test.js

@@ -0,0 +1,28 @@
+import {fromJS} from 'immutable'
+import {mapStateToProps} from '../index'
+import Quiz from '../../../../../common/records/Quiz'
+import {expect, afterEach} from 'vitest'
+import {setFakeStore, unsetFakeStore} from '../../../../../../tests/util/fakeStore'
+
+describe('connected QuizAndItemAnalysis', () => {
+  const fakeState = {
+    reporting: fromJS({
+      item_analysis_row_open: {},
+    }),
+    quizzes: fromJS({
+      1: {foo: 'bar'},
+    }),
+    outcomes: fromJS({}),
+    quizSessions: fromJS({}),
+  }
+
+  afterEach(() => unsetFakeStore())
+
+  describe('mapStateToProps', () => {
+    it('maps active quiz id', () => {
+      setFakeStore(fakeState)
+      const props = mapStateToProps(fakeState, {activeQuizId: '1'})
+      expect(props.quiz).toEqual(Quiz.create({foo: 'bar'}))
+    })
+  })
+})

package/src/reporting/components/resources/QuizAndItemAnalysis/__tests__/presenter.test.js

@@ -0,0 +1,239 @@
+import {expect, vi, describe, it, afterEach} from 'vitest'
+import React from 'react'
+import {render} from '@testing-library/react'
+import {fromJS, List} from 'immutable'
+
+import Quiz from '../../../../../common/records/Quiz'
+import QuizAnalysis from '../../../../../common/records/QuizAnalysis'
+import ItemAnalysis from '../../../../../common/records/ItemAnalysis'
+import QuizAndItemAnalysis from '../presenter'
+import withContext from '../../../../../../tests/util/withContext'
+
+describe('QuizAndItemAnalysis', () => {
+  const activeQuizId = '1'
+  const getItemAnalysesStub = vi.fn()
+  const getQuizAnalysisStub = vi.fn()
+  const getExistingQuizStub = vi.fn()
+  const toggleItemAnalysisRowExpandedStub = vi.fn()
+  const quiz = new Quiz({id: activeQuizId, title: 'Test Quiz'})
+
+  const itemAnalysis1 = new ItemAnalysis(
+    fromJS({
+      itemId: '3',
+      itemBody: 'This is the item body',
+      itemAnalysis: {
+        scoreInfo: {
+          resultSum: 3,
+          resultCount: 1,
+          scoreStddevPop: 1.2,
+        },
+        correctAnswerInfo: {
+          resultSum: 50,
+          resultCount: 8,
+          appearedCount: 20,
+        },
+        topCorrectAnswerInfo: {
+          resultCount: 8,
+          appearedCount: 20,
+        },
+        bottomCorrectAnswerInfo: {
+          resultCount: 2,
+          appearedCount: 20,
+        },
+        incorrectAnswerInfo: {
+          resultSum: 5,
+          resultCount: 8,
+        },
+        unansweredInfo: 1,
+        difficultyInfo: {
+          responseCount: 8,
+          correctAnswerCount: 1,
+        },
+        choiceInfo: [
+          {
+            choiceCount: 2,
+            id: 'id',
+            itemBody: '<p>Item&gt;Body</p>',
+            correct: true,
+          },
+          {
+            choiceCount: 3,
+            id: 'not_id',
+            itemBody: 'choice Item Body not correct',
+            correct: false,
+          },
+          {
+            choiceCount: 4,
+            id: 'not_id_again',
+            itemBody: 'choice Item Body not correct still',
+            correct: false,
+          },
+        ],
+        quintile: [1, 2, 3, 4, 5],
+      },
+    }),
+  )
+
+  const itemAnalysis2 = new ItemAnalysis(
+    fromJS({
+      itemId: '5',
+      itemBody: 'This is another item body',
+      itemAnalysis: {
+        scoreInfo: {
+          resultSum: 3,
+          resultCount: 1,
+          scoreStddevPop: 1.2,
+        },
+        correctAnswerInfo: {
+          resultSum: 50,
+          resultCount: 8,
+          appearedCount: 20,
+        },
+        topCorrectAnswerInfo: {
+          resultCount: 8,
+          appearedCount: 20,
+        },
+        bottomCorrectAnswerInfo: {
+          resultCount: 2,
+          appearedCount: 20,
+        },
+        incorrectAnswerInfo: {
+          resultSum: 5,
+          resultCount: 8,
+        },
+        unansweredInfo: 1,
+        difficultyInfo: {
+          responseCount: 8,
+          correctAnswerCount: 1,
+        },
+        choiceInfo: [
+          {
+            choiceCount: 2,
+            id: 'id',
+            itemBody: '<p>Item&gt;Body</p>',
+            correct: true,
+          },
+          {
+            choiceCount: 3,
+            id: 'not_id',
+            itemBody: 'choice Item Body not correct',
+            correct: false,
+          },
+          {
+            choiceCount: 4,
+            id: 'not_id_again',
+            itemBody: 'choice Item Body not correct still',
+            correct: false,
+          },
+        ],
+        quintile: [1, 2, 1, 3, 4],
+      },
+    }),
+  )
+
+  const quizAnalysis = new QuizAnalysis(
+    fromJS({
+      quizId: '1',
+      quizAnalysis: {
+        centile: Array.from({length: 101}, (v, i) => i / 100),
+        decile: Array.from({length: 10}, (v, i) => i),
+        scoreInfo: {
+          resultSum: 5,
+          resultCount: 1,
+          scoreMax: 100,
+          scoreMin: 2,
+          scoreSum: 1000,
+          scoreCount: 40,
+          pointsPossible: 100,
+          scoreStddevPop: 20,
+        },
+        cronbachsAlpha: 5,
+      },
+      batchTimestamp: new Date('Thu Feb 07 2019 15:35:17 GMT-0500 (Eastern Standard Time)'),
+    }),
+  )
+
+  quiz.getItemAnalyses = () => new List([itemAnalysis1, itemAnalysis2])
+  quiz.getQuizAnalysis = () => quizAnalysis
+
+  const QuizAndItemAnalysisWithContext = withContext(QuizAndItemAnalysis)
+
+  const defaultProps = {
+    activeQuizId,
+    getExistingQuiz: getExistingQuizStub,
+    getItemAnalyses: getItemAnalysesStub,
+    getQuizAnalysis: getQuizAnalysisStub,
+    quiz,
+    quizAnalysis,
+    toggleItemAnalysisRowExpanded: toggleItemAnalysisRowExpandedStub,
+  }
+
+  function renderComponent(props = {}) {
+    return render(<QuizAndItemAnalysisWithContext {...defaultProps} {...props} />)
+  }
+
+  afterEach(() => {
+    getItemAnalysesStub.mockClear()
+    getQuizAnalysisStub.mockClear()
+    getExistingQuizStub.mockClear()
+    toggleItemAnalysisRowExpandedStub.mockClear()
+  })
+
+  it('should render the component', () => {
+    const {container} = renderComponent()
+    expect(container.firstChild).toBeTruthy()
+  })
+
+  it('should render spinner if quiz has not loaded', () => {
+    const {container} = renderComponent({quiz: new Quiz()})
+    // Spinner renders with role="img" or a specific class
+    expect(
+      container.querySelector('[class*="spinner"]') || container.querySelector('svg'),
+    ).toBeTruthy()
+  })
+
+  it('should render not found card if quiz analysis is not found', () => {
+    const {container} = renderComponent({quizAnalysisNotFound: true})
+    expect(container.textContent).toContain('This report is no longer in use')
+  })
+
+  it('should trigger reload of data if quizId changes', () => {
+    const {rerender} = render(<QuizAndItemAnalysisWithContext {...defaultProps} />)
+    expect(getExistingQuizStub).toHaveBeenCalledWith('1')
+    rerender(<QuizAndItemAnalysisWithContext {...defaultProps} activeQuizId="2" />)
+    expect(getExistingQuizStub).toHaveBeenCalledWith('2')
+  })
+
+  describe('Quiz and Item analysis metrics', () => {
+    it('renders all metrics with none specified', () => {
+      const {container} = renderComponent()
+      // With no quizMetrics/itemMetrics specified, defaults are empty arrays,
+      // so no metrics are rendered
+      expect(container.firstChild).toBeTruthy()
+    })
+
+    it('only shows requested item metrics, when requested', () => {
+      const {container} = renderComponent({
+        itemMetrics: ['rpb', 'difficultyIndex'],
+      })
+      const output = container.textContent
+      expect(output).toContain('RPB')
+      expect(output).toContain('Difficulty Index')
+      expect(output).not.toContain('Discrimination Index')
+      expect(output).not.toContain('Mean Earned Score')
+    })
+
+    it('only shows requested quiz metrics, when requested', () => {
+      const {container} = renderComponent({
+        quizMetrics: ['highScore', 'lowScore', 'meanScore'],
+      })
+      const output = container.textContent
+      expect(output).toContain('High Score')
+      expect(output).toContain('Low Score')
+      expect(output).toContain('Mean Score')
+      expect(output).not.toContain('Standard Deviation')
+      expect(output).not.toContain('Mean Elapsed Time')
+      expect(output).not.toContain("Cronbach's Alpha")
+    })
+  })
+})