Skip to content

Commit

Permalink
Revert "MWPW-148253 Quiz Entry Coverage (#2305)"
Browse files Browse the repository at this point in the history 
This reverts commit ed79630.
  • Loading branch information
@mokimo
mokimo committed May 15, 2024
1 parent e14572a commit 798fa24
Show file tree
Hide file tree
Showing 6 changed files with 12 additions and 306 deletions.
8 changes: 1 addition & 7 deletions libs/blocks/quiz-entry/quiz-entry.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,12 +4,6 @@ import { mlField, getMLResults } from './mlField.js';
import { GetQuizOption } from './quizoption.js';
import { quizPopover, getSuggestions } from './quizPopover.js';

export const locationWrapper = {
redirect: (url) => {
window.location = url;
},
};

const App = ({
quizPath,
maxQuestions,
Expand Down Expand Up @@ -228,7 +222,7 @@ const App = ({
if (questionCount.current === maxQuestions || currentQuizState.userFlow.length === 1) {
if (!debug) {
setSelectedQuestion(null);
locationWrapper.redirect(quizPath);
window.location = quizPath;
}
} else {
setSelectedCards({});
Expand Down
7 changes: 7 additions & 0 deletions libs/blocks/quiz-entry/quizoption.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,13 @@ export const GetQuizOption = ({
}
};

useEffect(() => {
const entry = document.querySelector('.quiz-entry');
if (entry && entry.querySelector('.no-carousel')) {
entry.removeChild(entry.querySelector('.no-carousel'));
}
}, []);

return html`
<div class="quiz-options-container" role="group" aria-labelledby="question" tabindex="0" onkeydown=${handleKey}>
${index > 0 && html`<button onClick=${prev} class="carousel-arrow arrow-prev ${isRTL ? 'rtl' : ''}"></button>`}
Expand Down
5 changes: 1 addition & 4 deletions libs/blocks/quiz-entry/utils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,10 +78,7 @@ export const handleSelections = (prevSelections, selectedQuestion, selections) =
// de-dup any existing data if they use the ml field and cards.
if (prevSelections.length > 0) {
prevSelections.forEach((selection) => {
const jsonSelectionSelectedQustion = JSON.stringify(selection.selectedQuestion);
const jsonSelectedQuesion = JSON.stringify(selectedQuestion[0].selectedQuestion);
const isSameQuestion = jsonSelectionSelectedQustion === jsonSelectedQuesion;
if (isSameQuestion) {
if (selection.selectedQuestion === selectedQuestion) {
selection.selectedCards = selections;
isNewQuestion = false;
}
Expand Down
4 changes: 2 additions & 2 deletions test/blocks/quiz-entry/mocks/mock-data.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ const resultsMock = {
options: 'photo',
title: 'Photography',
text: 'Edit or organize my photos',
icon: 'https://milo.adobe.com/drafts/quiz/quiz-ai/search.svg',
icon: '',
image: 'https://main--milo--adobecom.hlx.page/drafts/colloyd/quiz-entry/images/photography.png',
},
{
Expand Down Expand Up @@ -664,7 +664,7 @@ const resultsMock = {
},
{
options: 'video',
next: 'RESET',
next: 'q-rather,q-video',
type: 'card',
endpoint: '',
'api-key': '',
Expand Down
145 changes: 1 addition & 144 deletions test/blocks/quiz-entry/quiz-entry.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { readFile } from '@web/test-runner-commands';
import { expect } from '@esm-bundle/chai';
import sinon from 'sinon';
import init from '../../../libs/blocks/quiz-entry/quiz-entry.js';
import { getSuggestions } from '../../../libs/blocks/quiz-entry/quizPopover.js';
import { getSuggestions } from '../../../libs/blocks/quiz-entry/quizPopover.js'; // Correct the path as needed

let fetchStub;
let quizEntryElement;
Expand Down Expand Up @@ -156,147 +156,4 @@ describe('Quiz Entry Component', () => {
await new Promise((resolve) => setTimeout(resolve, 100));
expect(continueButton.classList.contains('disabled')).to.be.false;
});
it('should navigate the carousel using keyboard commands', async () => {
const options = document.querySelectorAll('.quiz-option');
const option = document.querySelector('.quiz-option');
option.click();
await new Promise((resolve) => setTimeout(resolve, 100));
const carousel = document.querySelector('.quiz-options-container');
const rightArrowEvent = new KeyboardEvent('keydown', { key: 'ArrowRight' });
const leftArrowEvent = new KeyboardEvent('keydown', { key: 'ArrowLeft' });
carousel.dispatchEvent(rightArrowEvent);
await new Promise((resolve) => setTimeout(resolve, 100));
carousel.dispatchEvent(leftArrowEvent);
await new Promise((resolve) => setTimeout(resolve, 100));
const leftArrow = document.querySelector('.carousel-arrow.arrow-prev');
expect(leftArrow).to.not.exist;

const tabKeyEvent = new KeyboardEvent('keydown', { key: 'Tab' });
option.dispatchEvent(tabKeyEvent);
await new Promise((resolve) => setTimeout(resolve, 100));
expect(option.classList.contains('selected')).to.be.true;

const spaceKeyEvent = new KeyboardEvent('keydown', { key: ' ', keyCode: 32 });
carousel.dispatchEvent(spaceKeyEvent);
await new Promise((resolve) => setTimeout(resolve, 100));

const enterKeyEvent = new KeyboardEvent('keydown', {
key: 'Enter',
code: 'Enter',
keyCode: 13,
});
carousel.dispatchEvent(enterKeyEvent);
await new Promise((resolve) => setTimeout(resolve, 100));
expect(options[1].classList.contains('selected')).to.be.false;
});
});

describe('RTL Quiz Entry', () => {
beforeEach(async () => {
window.lana = { log: sinon.stub() };
fetchStub = sinon.stub(window, 'fetch');
fetchStub.resolves({
ok: true,
json: () => Promise.resolve({ suggested_completions: ['designer desk', 'design logos'] }),
});
document.body.innerHTML = await readFile({ path: './mocks/index.html' });
document.documentElement.setAttribute('dir', 'rtl');
quizEntryElement = document.querySelector('.quiz-entry');
await init(quizEntryElement, quizConfig);
await new Promise((resolve) => setTimeout(resolve, 100));
});

afterEach(() => {
sinon.restore();
});

it('should navigate the carousel using keyboard commands', async () => {
const options = document.querySelectorAll('.quiz-option');
const option = document.querySelector('.quiz-option');
option.click();
await new Promise((resolve) => setTimeout(resolve, 100));
const carousel = document.querySelector('.quiz-options-container');
const rightArrowEvent = new KeyboardEvent('keydown', { key: 'ArrowRight' });
const leftArrowEvent = new KeyboardEvent('keydown', { key: 'ArrowLeft' });
carousel.dispatchEvent(rightArrowEvent);
await new Promise((resolve) => setTimeout(resolve, 100));
carousel.dispatchEvent(leftArrowEvent);
await new Promise((resolve) => setTimeout(resolve, 100));
const leftArrow = document.querySelector('.carousel-arrow.arrow-prev');
expect(leftArrow).to.exist;

const tabKeyEvent = new KeyboardEvent('keydown', { key: 'Tab' });
option.dispatchEvent(tabKeyEvent);
await new Promise((resolve) => setTimeout(resolve, 100));
expect(option.classList.contains('selected')).to.be.false;

const spaceKeyEvent = new KeyboardEvent('keydown', { key: ' ', keyCode: 32 });
carousel.dispatchEvent(spaceKeyEvent);
await new Promise((resolve) => setTimeout(resolve, 100));

const enterKeyEvent = new KeyboardEvent('keydown', {
key: 'Enter',
code: 'Enter',
keyCode: 13,
});
carousel.dispatchEvent(enterKeyEvent);
await new Promise((resolve) => setTimeout(resolve, 100));
expect(options[1].classList.contains('selected')).to.be.false;
});
});

describe('ML Result Trigger', () => {
beforeEach(async () => {
window.lana = { log: sinon.stub() };
fetchStub = sinon.stub(window, 'fetch');
const mockApiResponse = {
statusCode: 200,
data: {
data: [
{
ficode: 'illustrator_cc',
prob: '0.33',
},
{
ficode: 'indesign_cc',
prob: '0.27',
},
{
ficode: 'free_spark',
prob: '0.22',
},
],
jobName: '',
},
};
fetchStub.resolves({
ok: true,
json: () => Promise.resolve(mockApiResponse.data),
});
document.body.innerHTML = await readFile({ path: './mocks/index.html' });
quizEntryElement = document.querySelector('.quiz-entry');
await init(quizEntryElement, quizConfig);
await new Promise((resolve) => setTimeout(resolve, 100));
});

afterEach(() => {
sinon.restore();
});

it('Should trigger results fetching scenario', async () => {
const mlInputField = document.querySelector('#quiz-input');
const testInput = 'design';
const inputEvent = new Event('input', { bubbles: true });
mlInputField.value = testInput;
mlInputField.dispatchEvent(inputEvent);
await new Promise((resolve) => setTimeout(resolve, 100));

const enterKeyEvent = new KeyboardEvent('keypress', {
key: 'Enter',
code: 'Enter',
keyCode: 13,
});
mlInputField.dispatchEvent(enterKeyEvent);
expect(mlInputField.value).to.equal('design');
});
});
149 changes: 0 additions & 149 deletions test/blocks/quiz-entry/utils.test.js
View file

This file was deleted.

0 comments on commit 798fa24

Please sign in to comment.