diff --git a/src/assets/icons/instagram.svg b/src/assets/icons/instagram.svg new file mode 100644 index 0000000..ea5062a --- /dev/null +++ b/src/assets/icons/instagram.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/footer/footer.js b/src/components/footer/footer.js index f706f5d..24a7811 100644 --- a/src/components/footer/footer.js +++ b/src/components/footer/footer.js @@ -7,6 +7,9 @@ export default class Footer extends HTMLElement { }, { name: 'Facebook', url: 'https://www.facebook.com/Tuesdays-Tunes-111968014950570' + }, { + name: 'Instagram', + url: 'https://www.instagram.com/tuesdaystunestvri/' }, { name: 'Spotify', url: 'https://open.spotify.com/playlist/1jOFrovuxCGulkGdUhR5f7' diff --git a/src/components/footer/footer.spec.js b/src/components/footer/footer.spec.js index f39b38f..fd9eb06 100644 --- a/src/components/footer/footer.spec.js +++ b/src/components/footer/footer.spec.js @@ -29,8 +29,8 @@ describe('Components/Footer', () => { }); it('should have the expected social links and logos in the footer', () => { - expect(links.length).to.equal(3); - expect(logos.length).to.equal(3); + expect(links.length).to.equal(4); + expect(logos.length).to.equal(4); }); it('should have the expected Facebook link and logo in the footer', () => { @@ -57,6 +57,18 @@ describe('Components/Footer', () => { expect(youtubeLogo[0].getAttribute('alt')).to.equal(`${name} Logo`); }); + it('should have the expected Instagram link and logo in the footer', () => { + const name = 'Instagram'; + const instagramLink = Array.from(links).filter(link => link.getAttribute('href').indexOf(`${name.toLowerCase()}.com`) >= 0); + const youtubeLogo = Array.from(logos).filter(logo => logo.getAttribute('src').indexOf(`${name.toLowerCase()}.svg`) >= 0); + + expect(instagramLink.length).to.equal(1); + expect(instagramLink[0].getAttribute('title')).to.equal(`Visit our ${name} page`); + + expect(youtubeLogo.length).to.equal(1); + expect(youtubeLogo[0].getAttribute('alt')).to.equal(`${name} Logo`); + }); + it('should have the expected Spotify link and logo in the footer', () => { const name = 'Spotify'; const spotifyLink = Array.from(links).filter(link => link.getAttribute('href').indexOf(`${name.toLowerCase()}.com`) >= 0);