Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor speakers grid #54

Open
wants to merge 10 commits into
base: main
Choose a base branch
from
Prev Previous commit
Next Next commit
add test cases to speaker-section
  • Loading branch information
yodra committed Nov 1, 2021
commit 190fe9d8f5cb9c750929b3764cd5e339c4d02923
122 changes: 113 additions & 9 deletions components/speaker-section/__tests__/speaker-section.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import SpeakerSection from '@components/speaker-section/speaker-section';
const defaultSpeaker: Speaker = {
name: 'SpeakerName',
image: {
url: 'url'
url: 'http://url.com'
},
title: 'Speaker Job Title',
company: 'Speaker company',
Expand All @@ -16,25 +16,129 @@ const renderSpeakerSection = (speaker = defaultSpeaker) => {
render(<SpeakerSection speaker={speaker} />);

return {
backToSpeakers: screen.getByText('Back to speakers'),
image: screen.getByAltText('SpeakerName'),
name: screen.getByText('SpeakerName'),
twitterIcon: screen.queryByLabelText('Twitter')
role: screen.getByText('Speaker Job Title @'),
company: screen.getByText('Speaker company'),
bioTitle: screen.getByText('Bio'),
bio: screen.getByText('Speaker bio'),
socialMediaTitle: screen.getByText('Social Media'),
twitterIcon: screen.queryByLabelText('Twitter'),
githubIcon: screen.queryByLabelText('GitHub'),
talkTitle: screen.queryByText('Talk title'),
talkDescription: screen.queryByText('Talk description')
};
};

describe('SpeakerSection', () => {
it('should have a name', () => {
const { name } = renderSpeakerSection();
it('should have a link to speakers page', () => {
const { backToSpeakers } = renderSpeakerSection();

expect(name).toBeInTheDocument();
expect(backToSpeakers).toBeInTheDocument();
});

it('should have a twitter icon', () => {
it('should have an image', () => {
const { image } = renderSpeakerSection();

expect(image).toBeInTheDocument();
});
describe('should have a speaker details section', () => {
it('with name', () => {
const { name } = renderSpeakerSection();

expect(name).toBeInTheDocument();
});

it('with job role', () => {
const { role } = renderSpeakerSection();

expect(role).toBeInTheDocument();
});

it('with company', () => {
const { company } = renderSpeakerSection();

expect(company).toBeInTheDocument();
});

it('with bio title', () => {
const { bioTitle } = renderSpeakerSection();

expect(bioTitle).toBeInTheDocument();
});

it('with bio description', () => {
const { bio } = renderSpeakerSection();

expect(bio).toBeInTheDocument();
});

describe('with a social media section', () => {
it('with social media title', () => {
const { socialMediaTitle } = renderSpeakerSection();

expect(socialMediaTitle).toBeInTheDocument();
});

it('with twitter when the speaker has it', () => {
const speaker: Speaker = {
...defaultSpeaker,
twitter: '@speaker'
} as any;
const { twitterIcon } = renderSpeakerSection(speaker);

expect(twitterIcon).toBeInTheDocument();
});

it('with github when the speaker has it', () => {
const speaker: Speaker = {
...defaultSpeaker,
github: 'speaker'
} as any;
const { githubIcon } = renderSpeakerSection(speaker);

expect(githubIcon).toBeInTheDocument();
});
});
});

describe('should have a talk', () => {
const speaker: Speaker = {
...defaultSpeaker,
twitter: '@speaker'
talk: {
title: 'Talk title',
description: 'Talk description'
}
} as any;
const { twitterIcon } = renderSpeakerSection(speaker);

expect(twitterIcon).toBeInTheDocument();
it('title when the speaker has a talk', () => {
const { talkTitle } = renderSpeakerSection(speaker);

expect(talkTitle).toBeInTheDocument();
});

it('description when the speaker has a talk', () => {
const { talkDescription } = renderSpeakerSection(speaker);

expect(talkDescription).toBeInTheDocument();
});

});

describe('should not have a talk', () => {
it('title when the speaker does not have a talk', () => {
const { talkTitle } = renderSpeakerSection();

expect(talkTitle).not.toBeInTheDocument();
});

it('description when the speaker does not have a talk', () => {
const { talkDescription } = renderSpeakerSection();

expect(talkDescription).not.toBeInTheDocument();
});

});

});