greatbody
/
freeCodeCamp
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: show-cert... Cypress tests (#44911) 

* fix: scroll to certification section

* test: refactor and update show-cert

Pulls out the flaky code from the before hook (where a single failure
kills the suite) into the test.  Also, the visit to settings to view the
certification only needed to happen once.
pull/44916/head
Oliver Eyton-Williams 2022-01-25 21:23:01 +01:00 committed by GitHub
parent d0d8d6f6a6
commit f63a650c01
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 49 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
client/src/components/settings/Certification.js
View File

@ -11,6 +11,7 @@ import React, { Component } from 'react';
import { withTranslation } from 'react-i18next';
import { createSelector } from 'reselect';
import ScrollableAnchor, { configureAnchors } from 'react-scrollable-anchor';
import {
projectMap,
legacyProjectMap
@ -25,6 +26,8 @@ import SectionHeader from './section-header';
import './certification.css';
configureAnchors({ offset: -40, scrollDuration: 0 });
const propTypes = {
completedChallenges: PropTypes.arrayOf(
PropTypes.shape({
@ -309,6 +312,7 @@ export class CertificationSettings extends Component {
block={true}
bsStyle='primary'
href={certLocation}
data-cy={`btn-for-${certSlug}`}
onClick={createClickHandler(certSlug)}
>
{isCert ? t('buttons.show-cert') : t('buttons.claim-cert')}
@ -424,27 +428,31 @@ export class CertificationSettings extends Component {
const { t } = this.props;
return (
<section id='certification-settings'>
<SectionHeader>{t('settings.headings.certs')}</SectionHeader>
{certifications.map(certName =>
this.renderCertifications(certName, projectMap)
)}
<SectionHeader>{t('settings.headings.legacy-certs')}</SectionHeader>
{this.renderLegacyFullStack()}
{legacyCertifications.map(certName =>
this.renderCertifications(certName, legacyProjectMap)
)}
{isOpen ? (
<ProjectModal
challengeFiles={challengeFiles}
handleSolutionModalHide={this.handleSolutionModalHide}
isOpen={isOpen}
projectTitle={projectTitle}
solution={solution}
t={t}
/>
) : null}
</section>
<ScrollableAnchor id='certification-settings'>
{/* it's weird that we repeat the id, but the ScrollableAnchor does not
add any elements to the DOM and cannot be used for styling */}
<section id='certification-settings'>
<SectionHeader>{t('settings.headings.certs')}</SectionHeader>
{certifications.map(certName =>
this.renderCertifications(certName, projectMap)
)}
<SectionHeader>{t('settings.headings.legacy-certs')}</SectionHeader>
{this.renderLegacyFullStack()}
{legacyCertifications.map(certName =>
this.renderCertifications(certName, legacyProjectMap)
)}
{isOpen ? (
<ProjectModal
challengeFiles={challengeFiles}
handleSolutionModalHide={this.handleSolutionModalHide}
isOpen={isOpen}
projectTitle={projectTitle}
solution={solution}
t={t}
/>
) : null}
</section>
</ScrollableAnchor>
);
}
}

37
cypress/integration/learn/responsive-web-design/show-cert-from-superblock.js
View File

@ -44,6 +44,25 @@ describe('Responsive Web Design Superblock', () => {
cy.exec('npm run seed');
cy.login();
cy.toggleAll();
});
it('should be possible to view certifications from the settings page', () => {
submitFrontEndSolutions();
cy.visit(`/learn/${projects.superBlock}/`);
cy.contains('Go to settings to claim your certification').click();
cy.location().should(loc => {
expect(loc.pathname).to.eq(`/settings`);
});
cy.get('[data-cy=btn-for-responsive-web-design]').click();
cy.contains('Show Certification').click();
cy.location().should(loc => {
expect(loc.pathname).to.eq(
`/certification/developmentuser/${projects.superBlock}`
);
});
});
function submitFrontEndSolutions() {
const { superBlock, block, challenges } = projects;
challenges.forEach(({ slug, solution }) => {
const url = `/learn/${superBlock}/${block}/${slug}`;
@ -64,23 +83,7 @@ describe('Responsive Web Design Superblock', () => {
cy.location().should(loc => {
expect(loc.pathname).to.not.eq(url);
});
cy.visit('/settings');
cy.get(
`[href="/certification/developmentuser/${projects.superBlock}"]`
).click();
cy.visit(`/learn/${projects.superBlock}/`);
});
});
it('should be possible to view certifications from the superBlock page', () => {
cy.location().should(loc => {
expect(loc.pathname).to.eq(`/learn/${projects.superBlock}/`);
});
cy.contains('Show Certification').click();
cy.location().should(loc => {
expect(loc.pathname).to.eq(
`/certification/developmentuser/${projects.superBlock}`
);
});
});
}
});
});