diff --git a/questionservice/question-service.test.js b/questionservice/question-service.test.js index a416657..7c4fee4 100644 --- a/questionservice/question-service.test.js +++ b/questionservice/question-service.test.js @@ -18,8 +18,8 @@ jest.spyOn(global, 'fetch').mockImplementation(() => { let result = { results: {bindings: []} } for(let i=1;i<=100;i++){ //Simulating there is maximum number of repeated itemLabels (between the valid ones) - result.results.bindings.push({itemLabel: {value: "itemName1"} , image:{value: "imageUrl1_"+i}}) - imgsToAssociatesMap.set("imageUrl1_"+i, "itemName1") + result.results.bindings.push({itemLabel: {value: "itemName"+i} , image:{value: "imageUrl1_"+i}}) + imgsToAssociatesMap.set("imageUrl1_"+i, "itemName"+i) } for(let i=101;i<=195;i++){ //Simulating there are invalid itemLabels @@ -113,7 +113,7 @@ describe('Question Service', () => { }); //Test /imgs/answer endpoint (Incorrect answer) - it('should inform the answer is incorrect and what is the element associated to the answer', async () => { + it('should inform the answer is incorrect and what is the correct answer if answering incorrectly', async () => { //First I ask a question const response = await request(app).get('/imgs/foods/question'); regex = new RegExp(`Which of the following images corresponds to (\\w+)\\?`); @@ -135,7 +135,24 @@ describe('Question Service', () => { .set('Content-Type', 'application/json') .send({answer:incorrectImageAnswer, question:question, username:"username", category:"foods"}) expect(responseAnswer.body.correct).toBe("false") - expect(responseAnswer.body.associate).toBe(imgsToAssociatesMap.get(incorrectImageAnswer)) + expect(responseAnswer.body.correctImg).toBe([...imgsToAssociatesMap].find(([key, val]) => val == correctAnswerLabel)[0]) + }); + + //Test /imgs/answer endpoint (Timeout) + it('should inform the answer is incorrect and what is the correct answer if a timeout happens', async () => { + //First I ask a question + const response = await request(app).get('/imgs/foods/question'); + regex = new RegExp(`Which of the following images corresponds to (\\w+)\\?`); + const match = response.body.question.match(regex); + const correctAnswerLabel = match && match[1]; + + question = response.body.question + const responseAnswer = await request(app) + .post("/imgs/answer") + .set('Content-Type', 'application/json') + .send({answer:"TimeOut1234;", question:question, username:"username", category:"foods"}) + expect(responseAnswer.body.correct).toBe("false") + expect(responseAnswer.body.correctImg).toBe([...imgsToAssociatesMap].find(([key, val]) => val == correctAnswerLabel)[0]) }); }); diff --git a/webapp/src/components/Login.test.js b/webapp/src/components/Login.test.js index af02d63..5eba7a5 100644 --- a/webapp/src/components/Login.test.js +++ b/webapp/src/components/Login.test.js @@ -32,7 +32,7 @@ describe('Login component', () => { const usernameInput = screen.getByLabelText(/Username/i); const passwordInput = screen.getByLabelText(/Password/i); - const loginButton = screen.getByRole('button', { name: /Login/i }); + const loginButton = screen.getByRole('button', { name: /Log In/i }); const mock = jest.fn(); jest.mock('react-router-dom', () => ({ useNavigate: () => mock, @@ -73,7 +73,7 @@ describe('Login component', () => { const usernameInput = screen.getByLabelText(/Username/i); const passwordInput = screen.getByLabelText(/Password/i); - const loginButton = screen.getByRole('button', { name: /Login/i }); + const loginButton = screen.getByRole('button', { name: /Log In/i }); // Mock the axios.post request to simulate an error response mockAxios.onPost('http://localhost:8000/login').reply(401, { error: 'Unauthorized' }); diff --git a/webapp/src/components/Question.jsx b/webapp/src/components/Question.jsx index 6d143cb..697b85c 100644 --- a/webapp/src/components/Question.jsx +++ b/webapp/src/components/Question.jsx @@ -49,12 +49,18 @@ const Question = (props) => { const fetchQuestions = async () => { try { setRenderedImages(0) - let auxQuestions = [] + let promises = [] + let questions = [] for (let i = 0; i < questionsPerGame; i++) { - let question = ((await axios.get(`${apiEndpoint}/${props.type}/${props.category}/question`)).data) - auxQuestions.push(question) + let question = axios.get(`${apiEndpoint}/${props.type}/${props.category}/question`) + promises.push(question) } - setQuestions(auxQuestions) + let responses = await Promise.all(promises) + for (let i = 0; i < questionsPerGame; i++) { + let question = responses.pop().data + questions.push(question) + } + setQuestions(questions) setLoading(false) } catch (error) { console.error('Error fetching question:', error); @@ -62,6 +68,9 @@ const Question = (props) => { }; const answerQuestion = async (answer, question) => { + if(counter==0){ + return + } try { setLoading(true); setRenderedImages(0) @@ -124,7 +133,8 @@ const Question = (props) => {

{questions[currentQuestion].question}

+ style={{ width: counter + "%" }} + data-testid="time-bar">
{questions[currentQuestion].images.map(image => ( diff --git a/webapp/src/components/Question.test.js b/webapp/src/components/Question.test.js index 7cd653f..4ce0480 100644 --- a/webapp/src/components/Question.test.js +++ b/webapp/src/components/Question.test.js @@ -95,6 +95,22 @@ describe('Question page', () => { expect(screen.getByText(/Which of the following/i)).toBeInTheDocument(); }); + await act(async () => { + fireEvent.load(screen.getAllByRole("img")[0]) + fireEvent.load(screen.getAllByRole("img")[1]) + fireEvent.load(screen.getAllByRole("img")[2]) + fireEvent.load(screen.getAllByRole("img")[3]) + }); + + // Wait for the component to render + await waitFor(() => { + const time_bar = screen.getByTestId('time-bar'); + expect(time_bar).toBeInTheDocument(); + const widthStyle = time_bar.style.width; + const widthValue = parseFloat(widthStyle); + expect(widthValue).toBeGreaterThan(0); + }); + await act(async () => { fireEvent.click(screen.getAllByRole("img")[0]); }); @@ -119,7 +135,7 @@ describe('Question page', () => { mockAxios.onPost('http://localhost:8000/imgs/answer').reply(200, { correct: "false", - associate: "Poland" + correctImg: "https://commons.wikimedia.org/wiki/File:Flag_of_Spain.svg" }); render();