Merge pull request #70 from leung018/refactoring

Minor updates

.nvmrc

@@ -0,0 +1 @@
+v18.18.0

cypress/e2e/spec.cy.js

@@ -48,9 +48,7 @@ describe('End to end tests', () => {
 
     cy.findByText('Answer 1').then(($el1) => {
       cy.findByText('Answer 2').then(($el2) => {
-        expect($el2[0].compareDocumentPosition($el1[0])).to.eq(
-          Node.DOCUMENT_POSITION_FOLLOWING,
-        )
+        assertIsBefore($el2[0], $el1[0])
       })
     })
   })
@@ -103,6 +101,13 @@ function assertIsInHomePage(cy) {
   cy.contains('Add New Question Set')
 }
 
+// TODO: Copy from the main codebase, can't figure out how to import it here yet
+function assertIsBefore(aHtmlElement, bHtmlElement) {
+  expect(aHtmlElement.compareDocumentPosition(bHtmlElement)).to.eq(
+    Node.DOCUMENT_POSITION_FOLLOWING,
+  )
+}
+
 /**
  * TODO: Currently not support more than 2 choices or more than 1 question. But no need for e2e testing currently
  */

src/app/components/home.test.tsx

@@ -6,6 +6,7 @@ import { render } from '@testing-library/react'
 import '@testing-library/jest-dom'
 import { HomePageUIService } from './home'
 import { LocalStorageQuestionSetRepo } from '../../repo/question_set'
+import { assertIsBefore } from '../../test_utils/assert/is_before'
 
 describe('HomePage', () => {
   // Detail of testing of the navigation of this page should be in larger scope tests like e2e tests
@@ -34,15 +35,9 @@ describe('HomePage', () => {
     const durian = getByText('durian')
     const orange = getByText('Orange')
 
-    expect(apple.compareDocumentPosition(banana)).toBe(
-      Node.DOCUMENT_POSITION_FOLLOWING,
-    )
-    expect(banana.compareDocumentPosition(durian)).toBe(
-      Node.DOCUMENT_POSITION_FOLLOWING,
-    )
-    expect(durian.compareDocumentPosition(orange)).toBe(
-      Node.DOCUMENT_POSITION_FOLLOWING,
-    )
+    assertIsBefore(apple, banana)
+    assertIsBefore(banana, durian)
+    assertIsBefore(durian, orange)
   })
 })
 

src/app/components/quiz.test.tsx

@@ -7,6 +7,7 @@ import {
   QuestionSet,
 } from '../../model/question_set'
 import { LocalStorageQuestionSetRepo } from '../../repo/question_set'
+import { assertIsBefore } from '../../test_utils/assert/is_before'
 
 describe('MultipleChoiceQuiz', () => {
   const presetCorrectChoiceMcBuilder = () => {
@@ -237,7 +238,7 @@ describe('MultipleChoiceQuiz', () => {
     )
   })
 
-  it('should display getCurrentPlayQuestions of questionSet if they are different from its original questions', async () => {
+  it('should display swapped questionSet', async () => {
     const questionSet = new QuestionSetBuilderForTest()
       .appendQuestion({
         mc: new MultipleChoiceBuilder()
@@ -251,15 +252,13 @@ describe('MultipleChoiceQuiz', () => {
     const {
       renderResult: { getByLabelText },
     } = renderMultipleChoicePage({
-      questionSet: questionSet.newSwappedChoicesQuestionSet(),
+      questionSet: questionSet.newSwappedChoicesQuestionSet(), // The swapped choices question set has different getCurrentPlayQuestions from the original one
     })
 
     // Choices are swapped in the page
     const choice1 = getByLabelText('Question 1 Choice 1 (Correct)')
     const choice2 = getByLabelText('Question 1 Choice 2')
-    expect(choice2.compareDocumentPosition(choice1)).toBe(
-      Node.DOCUMENT_POSITION_FOLLOWING,
-    )
+    assertIsBefore(choice2, choice1)
   })
 })
 

src/test_utils/assert/is_before.ts

@@ -0,0 +1,3 @@
+export function assertIsBefore(a: HTMLElement, b: HTMLElement) {
+  expect(a.compareDocumentPosition(b)).toBe(Node.DOCUMENT_POSITION_FOLLOWING)
+}