mirror of
https://github.com/freeCodeCamp/freeCodeCamp.git
synced 2026-03-07 09:01:13 -05:00
* fix: update jaw on all ctrl-enter presses * fix: show running tests while hiding feedback Screenreaders still announcing running tests and then the output, and the display now stops showing a flash of the new feedback message * refactor: camelCase * refactor: clean up and reduce renders previousHint isn't really state, insofar as it changing should not trigger a new render - a ref does the trick. * chore: remove log * fix: use ref to track latest attempts prop * fix: allow lower jaw to trigger viewzone updates React.render's callback cannot be relied on. It does not necessarily get called on every update to the rendered element. updateContainer is called on every render, so the editor will be updated. * refactor: attemptsNumber -> attempts * fix: do not render on attempt changes * refactor: more camelCase * fix: try to prevent previous hint rendering Co-authored-by: Manabu Matsumoto <mmatsumoto1026@gmail.com> * test: resetting of lower jaw * fix: reset lower jaw when step is reset * test: check congrats message appears on completion * fix: hide feedback after reset * fix: leave focus in the editor after passing tests This is an attempt to work around a JAWS issue whereby the submit shortcut (ctrl+enter) is ignored after the user passes all tests. * test: submit button receives focus when tests pass * fix: focus submit button when tests pass Co-authored-by: Bruce Blaser <bbsmooth@gmail.com> Co-authored-by: Bruce Blaser <bbsmooth@gmail.com>
62 lines
2.2 KiB
JavaScript
62 lines
2.2 KiB
JavaScript
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 = {
|
|
testButton: '[data-cy=run-tests-button]',
|
|
monacoTabs: '.monaco-editor-tabs',
|
|
signInButton: '#action-buttons-container a[href$="/signin"]',
|
|
submitButton: '[data-cy=submit-button]'
|
|
};
|
|
|
|
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.testButton).contains('Check Your Code (Ctrl + Enter)');
|
|
|
|
cy.viewport(767, 660);
|
|
cy.get(selectors.testButton)
|
|
.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.contains('Restart Step').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().type('{end}{enter}<meta charset="UTF-8" />{ctrl+enter}');
|
|
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 the submit button after testing a valid solution', () => {
|
|
cy.visit(location);
|
|
cy.focused().type('{end}{enter}<meta charset="UTF-8" />');
|
|
cy.get(selectors.submitButton).should('not.be.focused');
|
|
cy.get(selectors.testButton).click();
|
|
cy.get(selectors.submitButton).should('be.focused');
|
|
});
|
|
});
|