Skip to content

Commit

Permalink
Support profile, article, and book open graph type properties (#22)
Browse files Browse the repository at this point in the history
  • Loading branch information
@econdie @garmeeh
econdie authored and garmeeh committed Dec 22, 2018
1 parent 2549cb2 commit a52e6c6
Show file tree
Hide file tree
Showing 11 changed files with 5,442 additions and 4,237 deletions.
15 changes: 15 additions & 0 deletions e2e/components/links.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,21 @@ const Links = () => (
<a>Default SEO</a>
</Link>
</li>
<li>
<Link href="/article">
<a>Article SEO</a>
</Link>
</li>
<li>
<Link href="/book">
<a>Book SEO</a>
</Link>
</li>
<li>
<Link href="/profile">
<a>Profile SEO</a>
</Link>
</li>
<li>
<Link href="/overridden">
<a>Overridden Seo</a>
Expand Down
357 changes: 357 additions & 0 deletions e2e/cypress/e2e/seo.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -334,4 +334,361 @@ describe('SEO Meta', () => {
'summary_large_image',
);
});

it('Profile SEO loads correctly', () => {
cy.visit('http://localhost:3000/profile');
cy.get('h1').should('contain', 'Profile Page SEO');
cy.get('head title').should('contain', 'Profile Page Title | Next SEO');
cy.get('head meta[name="description"]').should(
'have.attr',
'content',
'Description of profile page',
);
cy.get('head meta[property="og:type"]').should(
'have.attr',
'content',
'profile',
);
cy.get('head meta[property="profile:first_name"]').should(
'have.attr',
'content',
'First',
);
cy.get('head meta[property="profile:last_name"]').should(
'have.attr',
'content',
'Last',
);
cy.get('head meta[property="profile:username"]').should(
'have.attr',
'content',
'firstlast123',
);
cy.get('head meta[property="profile:gender"]').should(
'have.attr',
'content',
'male',
);
cy.get('head meta[property="og:url"]').should(
'have.attr',
'content',
'https://www.example.com/@firstlast123',
);
cy.get('head meta[property="og:title"]').should(
'have.attr',
'content',
'Open Graph Profile Title',
);
cy.get('head meta[property="og:description"]').should(
'have.attr',
'content',
'Description of open graph profile',
);
cy.get('head meta[property="og:image"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal(
'https://www.test.ie/og-image-firstlast123-01.jpg',
);
expect(tags[1].content).to.equal(
'https://www.test.ie/og-image-firstlast123-02.jpg',
);
expect(tags[2].content).to.equal(
'https://www.test.ie/og-image-firstlast123-03.jpg',
);
expect(tags[3].content).to.equal(
'https://www.test.ie/og-image-firstlast123-04.jpg',
);
});
cy.get('head meta[property="og:image:alt"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal('Og Image Alt firstlast123 A');
expect(tags[1].content).to.equal('Og Image Alt firstlast123 B');
expect(tags[2].content).to.equal('Og Image Alt firstlast123 C');
expect(tags[3].content).to.equal('Og Image Alt firstlast123 D');
});
cy.get('head meta[property="og:image:width"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal('850');
expect(tags[1].content).to.equal('950');
expect(tags[2].content).to.equal('600');
expect(tags[3].content).to.equal('400');
});
cy.get('head meta[property="og:image:height"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal('650');
expect(tags[1].content).to.equal('850');
expect(tags[2].content).to.equal('400');
expect(tags[3].content).to.equal('400');
});
cy.get('head meta[property="og:site_name"]').should(
'have.attr',
'content',
'SiteName',
);
cy.get('head meta[name="twitter:site"]').should(
'have.attr',
'content',
'@site',
);
cy.get('head meta[name="twitter:creator"]').should(
'have.attr',
'content',
'@handle',
);
cy.get('head meta[name="twitter:card"]').should(
'have.attr',
'content',
'summary_large_image',
);
});

it('Article SEO loads correctly', () => {
cy.visit('http://localhost:3000/article');
cy.get('h1').should('contain', 'Article Page SEO');
cy.get('head title').should('contain', 'Article Page Title | Next SEO');
cy.get('head meta[name="description"]').should(
'have.attr',
'content',
'Description of article page',
);
cy.get('head meta[property="og:type"]').should(
'have.attr',
'content',
'article',
);
cy.get('head meta[property="article:published_time"]').should(
'have.attr',
'content',
'2017-06-21T23:04:13Z',
);
cy.get('head meta[property="article:modified_time"]').should(
'have.attr',
'content',
'2018-01-21T18:04:43Z',
);
cy.get('head meta[property="article:expiration_time"]').should(
'have.attr',
'content',
'2022-12-21T22:04:11Z',
);
cy.get('head meta[property="article:author"]')
.should('have.length', 2)
.then(tags => {
expect(tags[0].content).to.equal(
'https://www.example.com/authors/@firstnameA-lastnameA',
);
expect(tags[1].content).to.equal(
'https://www.example.com/authors/@firstnameB-lastnameB',
);
});
cy.get('head meta[property="article:section"]').should(
'have.attr',
'content',
'Section II',
);
cy.get('head meta[property="article:tag"]')
.should('have.length', 3)
.then(tags => {
expect(tags[0].content).to.equal('Tag A');
expect(tags[1].content).to.equal('Tag B');
expect(tags[2].content).to.equal('Tag C');
});
cy.get('head meta[property="og:url"]').should(
'have.attr',
'content',
'https://www.example.com/articles/article-title',
);
cy.get('head meta[property="og:title"]').should(
'have.attr',
'content',
'Open Graph Article Title',
);
cy.get('head meta[property="og:description"]').should(
'have.attr',
'content',
'Description of open graph article',
);
cy.get('head meta[property="og:image"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal(
'https://www.test.ie/og-image-article-title-01.jpg',
);
expect(tags[1].content).to.equal(
'https://www.test.ie/og-image-article-title-02.jpg',
);
expect(tags[2].content).to.equal(
'https://www.test.ie/og-image-article-title-03.jpg',
);
expect(tags[3].content).to.equal(
'https://www.test.ie/og-image-article-title-04.jpg',
);
});
cy.get('head meta[property="og:image:alt"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal('Og Image Alt Article Title A');
expect(tags[1].content).to.equal('Og Image Alt Article Title B');
expect(tags[2].content).to.equal('Og Image Alt Article Title C');
expect(tags[3].content).to.equal('Og Image Alt Article Title D');
});
cy.get('head meta[property="og:image:width"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal('850');
expect(tags[1].content).to.equal('950');
expect(tags[2].content).to.equal('600');
expect(tags[3].content).to.equal('400');
});
cy.get('head meta[property="og:image:height"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal('650');
expect(tags[1].content).to.equal('850');
expect(tags[2].content).to.equal('400');
expect(tags[3].content).to.equal('400');
});
cy.get('head meta[property="og:site_name"]').should(
'have.attr',
'content',
'SiteName',
);
cy.get('head meta[name="twitter:site"]').should(
'have.attr',
'content',
'@site',
);
cy.get('head meta[name="twitter:creator"]').should(
'have.attr',
'content',
'@handle',
);
cy.get('head meta[name="twitter:card"]').should(
'have.attr',
'content',
'summary_large_image',
);
});

it('Book SEO loads correctly', () => {
cy.visit('http://localhost:3000/book');
cy.get('h1').should('contain', 'Book Page SEO');
cy.get('head title').should('contain', 'Book Page Title | Next SEO');
cy.get('head meta[name="description"]').should(
'have.attr',
'content',
'Description of book page',
);
cy.get('head meta[property="og:type"]').should(
'have.attr',
'content',
'book',
);
cy.get('head meta[property="book:release_date"]').should(
'have.attr',
'content',
'2018-09-17T11:08:13Z',
);
cy.get('head meta[property="book:author"]')
.should('have.length', 2)
.then(tags => {
expect(tags[0].content).to.equal(
'https://www.example.com/authors/@firstnameA-lastnameA',
);
expect(tags[1].content).to.equal(
'https://www.example.com/authors/@firstnameB-lastnameB',
);
});
cy.get('head meta[property="book:isbn"]').should(
'have.attr',
'content',
'978-3-16-148410-0',
);
cy.get('head meta[property="book:tag"]')
.should('have.length', 3)
.then(tags => {
expect(tags[0].content).to.equal('Tag A');
expect(tags[1].content).to.equal('Tag B');
expect(tags[2].content).to.equal('Tag C');
});
cy.get('head meta[property="og:url"]').should(
'have.attr',
'content',
'https://www.example.com/books/book-title',
);
cy.get('head meta[property="og:title"]').should(
'have.attr',
'content',
'Open Graph Book Title',
);
cy.get('head meta[property="og:description"]').should(
'have.attr',
'content',
'Description of open graph book',
);
cy.get('head meta[property="og:image"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal(
'https://www.test.ie/og-image-book-title-01.jpg',
);
expect(tags[1].content).to.equal(
'https://www.test.ie/og-image-book-title-02.jpg',
);
expect(tags[2].content).to.equal(
'https://www.test.ie/og-image-book-title-03.jpg',
);
expect(tags[3].content).to.equal(
'https://www.test.ie/og-image-book-title-04.jpg',
);
});
cy.get('head meta[property="og:image:alt"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal('Og Image Alt Book Title A');
expect(tags[1].content).to.equal('Og Image Alt Book Title B');
expect(tags[2].content).to.equal('Og Image Alt Book Title C');
expect(tags[3].content).to.equal('Og Image Alt Book Title D');
});
cy.get('head meta[property="og:image:width"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal('850');
expect(tags[1].content).to.equal('950');
expect(tags[2].content).to.equal('600');
expect(tags[3].content).to.equal('400');
});
cy.get('head meta[property="og:image:height"]')
.should('have.length', 4)
.then(tags => {
expect(tags[0].content).to.equal('650');
expect(tags[1].content).to.equal('850');
expect(tags[2].content).to.equal('400');
expect(tags[3].content).to.equal('400');
});
cy.get('head meta[property="og:site_name"]').should(
'have.attr',
'content',
'SiteName',
);
cy.get('head meta[name="twitter:site"]').should(
'have.attr',
'content',
'@site',
);
cy.get('head meta[name="twitter:creator"]').should(
'have.attr',
'content',
'@handle',
);
cy.get('head meta[name="twitter:card"]').should(
'have.attr',
'content',
'summary_large_image',
);
});
});
Loading

0 comments on commit a52e6c6

Please sign in to comment.