chore(cypress): test public evaluation links with hmac in live quiz test workflow

apps/frontend-control/src/components/liveQuizzes/EmbeddingModal.tsx

@@ -16,7 +16,15 @@ interface EmbeddingModalProps {
   quizId: string
 }
 
-function LazyHMACLink({ quizId, params }: { quizId: string; params: string }) {
+function LazyHMACLink({
+  quizId,
+  params,
+  identifier,
+}: {
+  quizId: string
+  params: string
+  identifier: string
+}) {
   const quizHMAC = useQuery(GetLiveQuizHmacDocument, {
     variables: {
       id: quizId,
@@ -41,7 +49,7 @@ function LazyHMACLink({ quizId, params }: { quizId: string; params: string }) {
         onClick={() => navigator?.clipboard?.writeText(link)}
       />
       <Link href={link} target="_blank" legacyBehavior passHref>
-        <a data-cy={`open-embedding-link-quiz-${quizId}`}>{link}</a>
+        <a data-cy={`open-embedding-link-${identifier}`}>{link}</a>
       </Link>
     </div>
   )
@@ -91,15 +99,23 @@ function EmbeddingModal({ open, setOpen, quizId }: EmbeddingModalProps) {
                 element.elementData.name
               }`}</div>
               <div className="bg-uzh-grey-40 mr-2 flex flex-row items-center gap-3 rounded border border-solid px-1.5 py-0.5">
-                <LazyHMACLink quizId={quizId} params={`questionIx=${ix}`} />
+                <LazyHMACLink
+                  quizId={quizId}
+                  params={`questionIx=${ix}`}
+                  identifier={`question-${ix}`}
+                />
               </div>
             </div>
           )
         })}
       </div>
       <div className="mt-3">
         <div className="w-30 font-bold">{t('shared.generic.leaderboard')}:</div>
-        <LazyHMACLink quizId={quizId} params={`leaderboard=true`} />
+        <LazyHMACLink
+          quizId={quizId}
+          params={`leaderboard=true`}
+          identifier="leaderboard"
+        />
       </div>
     </Modal>
   )

apps/frontend-manage/src/components/liveQuiz/EmbeddingModal.tsx

@@ -10,7 +10,15 @@ import { useTranslations } from 'next-intl'
 import Link from 'next/link'
 import { useState } from 'react'
 
-function LazyHMACLink({ quizId, params }: { quizId: string; params: string }) {
+function LazyHMACLink({
+  quizId,
+  params,
+  identifier,
+}: {
+  quizId: string
+  params: string
+  identifier: string
+}) {
   const quizHMAC = useQuery(GetLiveQuizHmacDocument, {
     variables: {
       id: quizId,
@@ -37,7 +45,7 @@ function LazyHMACLink({ quizId, params }: { quizId: string; params: string }) {
         passHref
       >
         <a
-          data-cy={`open-embedding-link-live-quiz-${quizId}`}
+          data-cy={`open-embedding-link-${identifier}`}
           className="max-w-[calc(100%-3.5rem)] break-words text-sm"
         >
           {link}
@@ -94,7 +102,11 @@ function EmbeddingModal({
       </div>
       <div className="mb-4">
         <div className="w-30 font-bold">{t('shared.generic.evaluation')}</div>
-        <LazyHMACLink quizId={quizId} params={``} />
+        <LazyHMACLink
+          quizId={quizId}
+          params={``}
+          identifier="generic-evaluation"
+        />
       </div>
       <div className="flex flex-col gap-2">
         {elements?.map((element, ix) => {
@@ -109,6 +121,7 @@ function EmbeddingModal({
               <LazyHMACLink
                 quizId={quizId}
                 params={`questionIx=${ix}&hideControls=true&showSolution=${showSolution}`}
+                identifier={`question-${ix}`}
               />
             </div>
           )
@@ -120,6 +133,7 @@ function EmbeddingModal({
           <LazyHMACLink
             quizId={quizId}
             params={`leaderboard=true&hideControls=true`}
+            identifier={`leaderboard`}
           />
         </div>
       </div>

cypress/cypress/e2e/F-live-quiz-workflow.cy.ts

@@ -912,6 +912,68 @@ describe('Different live-quiz workflows', () => {
     cy.wait(500)
   })
 
+  it('Check out the public evaluation links accessible through the embedding modal', () => {
+    cy.loginLecturer()
+    cy.get('[data-cy="live-quizzes"]').click()
+    cy.get(`[data-cy="live-quiz-cockpit-${quizName2}"]`).click()
+    cy.wait(1000)
+
+    // read required public evaluation links
+    cy.get('[data-cy="embed-evaluation-cockpit"]').click()
+    cy.get('[data-cy="open-embedding-link-generic-evaluation"]')
+      .invoke('text')
+      .then((text) => {
+        cy.wrap(text).as('publicLinkEvaluation')
+      })
+    cy.get('[data-cy="open-embedding-link-question-0"]')
+      .invoke('text')
+      .then((text) => {
+        cy.wrap(text).as('publicLinkQuestion0')
+      })
+    cy.get('[data-cy="open-embedding-link-question-7"]')
+      .invoke('text')
+      .then((text) => {
+        cy.wrap(text).as('publicLinkQuestion7')
+      })
+    cy.get('[data-cy="open-embedding-link-leaderboard"]')
+      .invoke('text')
+      .then((text) => {
+        cy.wrap(text).as('publicLinkLeaderboard')
+      })
+
+    // log out as a lecturer
+    cy.clearAllCookies()
+    cy.clearAllLocalStorage()
+    cy.wait(500)
+    cy.reload()
+    cy.get('button[data-cy="tos-checkbox"]').should('exist')
+
+    // check out generic evaluation
+    cy.get('@publicLinkEvaluation').then((link) => {
+      cy.visit(String(link))
+    })
+    cy.findByText(SCQuestion1Content).should('exist')
+    cy.get('[data-cy="evaluate-next-question"]').click()
+    cy.findByText(MCQuestion1Content).should('exist')
+    cy.get('[data-cy="evaluate-previous-question"]').click()
+    cy.findByText(SCQuestion1Content).should('exist')
+
+    // check out specific question evaluation
+    cy.get('@publicLinkQuestion0').then((link) => {
+      cy.visit(String(link))
+    })
+    cy.findByText(SCQuestion1Content).should('exist')
+    cy.get('@publicLinkQuestion7').then((link) => {
+      cy.visit(String(link))
+    })
+    cy.findByText(KPRIMQuestion2Content).should('exist')
+
+    // check out leaderboard
+    cy.get('@publicLinkLeaderboard').then((link) => {
+      cy.visit(String(link))
+    })
+  })
+
   it('Check out evaluation view of live quiz and its content', () => {
     cy.loginLecturer()