Files
freeCodeCamp/cypress/e2e/default/learn/challenges/multifile.ts
2023-06-22 13:19:17 -07:00

108 lines
3.8 KiB
TypeScript

import translations from '../../../../../client/i18n/locales/english/translations.json';
const location =
'/learn/2022/responsive-web-design/learn-accessibility-by-building-a-quiz/step-2';
const selectors = {
monacoTabs: '.monaco-editor-tabs',
signInButton: '[data-cy=sign-in-button]',
submitLowerJawButton: '[data-cy=submit-lowerJaw-button]',
checkLowerJawButton: '[data-cy=check-lowerJaw-button]',
resetCodeButton: '[data-cy=reset-code-button]',
instructionContainer: '.action-row-container'
};
describe('Challenge with multifile editor', () => {
before(() => {
cy.visit(location);
});
it('renders the file tab buttons', () => {
cy.get(selectors.monacoTabs).contains('index.html');
cy.get(selectors.monacoTabs).contains('styles.css');
});
it('checks for correct text at different widths', () => {
cy.viewport(768, 660);
cy.get(selectors.checkLowerJawButton).contains(
'Check Your Code (Ctrl + Enter)'
);
cy.viewport(767, 660);
cy.get(selectors.checkLowerJawButton)
.should('not.contain.text', '(Ctrl + Enter)')
.contains('Check Your Code');
});
it('resets the lower jaw when prompted', () => {
cy.get('[data-cy=failing-test-feedback]').should('not.exist');
cy.contains('Check Your Code').click();
cy.get('[data-cy=failing-test-feedback]').should('be.visible');
cy.get(selectors.resetCodeButton).click();
cy.get('[data-cy=reset-modal-confirm').click();
cy.get('[data-cy=failing-test-feedback]').should('not.exist');
});
// Page will change after this test. If your test requires page used in previous
// tests make sure it is above this one
it('prompts unauthenticated user to sign in to save progress', () => {
cy.visit(location);
cy.focused()
.click()
.type('{end}{enter}<meta charset="UTF-8" />')
.type('{ctrl}{enter}', { release: false, delay: 100 });
cy.get(selectors.signInButton).contains(translations.learn['sign-in-save']);
cy.contains(translations.learn['congratulations']);
cy.get(selectors.signInButton).click();
cy.go('back');
cy.get(selectors.signInButton).should('not.exist');
});
it(
'focuses on the submit button after tests passed',
{ browser: '!firefox' },
() => {
cy.visit(location);
cy.focused().click().type('{end}{enter}<meta charset="UTF-8" />');
cy.get(selectors.checkLowerJawButton).should('not.be.focused');
cy.get(selectors.checkLowerJawButton).click();
cy.get(selectors.submitLowerJawButton).should('be.focused');
}
);
it(
'brings back the check button after reset',
{ browser: '!firefox' },
() => {
cy.visit(location);
cy.focused().click().type('{end}{enter}<meta charset="UTF-8" />');
cy.get(selectors.checkLowerJawButton).should('not.be.focused');
cy.get(selectors.checkLowerJawButton).click();
// Ready to submit (submit button replaces check button)
cy.get(selectors.submitLowerJawButton).should('be.visible');
cy.get(selectors.checkLowerJawButton).should('not.be.visible');
// Reset
cy.get(selectors.resetCodeButton).click();
cy.get('[data-cy=reset-modal-confirm').click();
// First we need to click on the description or Cypress will not be able
// to scroll to the button
cy.get('.editor-upper-jaw').click();
cy.get(selectors.checkLowerJawButton).should('be.visible');
cy.get(selectors.submitLowerJawButton).should('not.be.visible');
}
);
it(
'checks hotkeys when instruction is focused',
{ browser: '!firefox' },
() => {
cy.reload();
cy.focused().type('{end}{enter}<meta charset="UTF-8" />');
cy.get(selectors.instructionContainer)
.click('topRight')
.trigger('keydown', { ctrlKey: true, keyCode: 13 }); // keyCode : 13 enter key
cy.get(selectors.submitLowerJawButton).should('not.be.focused');
}
);
});