Merge pull request #671 from ccnmtl/hidepvalue

Hide pvalue

Author: ndittren

cypress/e2e/2.Sim1/sim1.cy.js

@@ -69,6 +69,7 @@ describe('P-Value and Critical Value', () => {
         cy.get('#pValue').type('0.05');
         cy.get('#pvalueInputButton').contains('Continue').click();
         cy.get('.answer-incorrect-container').should('exist');
+        cy.get('[data-cy="pvalueReveal"]').click();
         cy.get('[data-cy="pvalueanswer"]').invoke('text').then((text) => {
             cy.get('#pValue').clear();
             cy.get('#pValue').type(text);

media/js/src/simulations/simulation1/pvalueComponent.jsx

@@ -15,6 +15,7 @@ export const PvalueComponent = ({
     const [isPvalCompareCorrect, setIsPvalCompareCorrect] = useState(null);
     const [pvalueComparison, setPvalueComparison] = useState(null);
     const [nullHypothesisChoice1, setNullHypothesisChoice1] = useState(null);
+    const [showAnswer, setShowAnswer] = useState(false);
 
 
 
@@ -199,15 +200,30 @@ export const PvalueComponent = ({
                     <div className="answer-incorrect flex-shrink-0
                         align-self-start">!</div>
                     <div>
-                        The value is incorrect; it&rsquo;s
-                        <span data-cy="pvalueanswer"> {pvalue}.</span>
-                        {hypothesisTest === 'value_two_sided' && (
-                            <span>
-                            &nbsp;Note that this is a two-sided test and the
-                            table value must be multiplied by two.&nbsp;
-                            </span>
+                        The value is incorrect;
+                        Please try again. {' '}
+                        {!showAnswer ? (
+                            <button
+                                type="button"
+                                className="btn btn-link p-0"
+                                onClick={() => setShowAnswer(true)}
+                                data-cy="pvalueReveal">
+                                Reveal answer
+                            </button>
+                        ) : (
+
+                            <>
+                                It&apos;s {' '}
+                                <span data-cy="pvalueanswer">{ pvalue}</span>.
+                                {hypothesisTest === 'value_two_sided' && (
+                                    <span>
+                                        &nbsp;Note that this is a two-sided
+                                        test and the table value must be
+                                        multiplied by two.&nbsp;
+                                    </span>
+                                )}
+                            </>
                         )}
-                        Please try again.
                     </div>
                 </div>
             )}