feat: fetch original author data from live site (#936)

cypress/e2e/english/landing/original-author-translator.cy.js

@@ -0,0 +1,152 @@
+const selectors = {
+  postCard: "[data-test-label='post-card']",
+  translatedArticleTitle:
+    'Denny Perez: From Accountant to Coder, Creating Communities and Inspiring Women | S2 Ep. 13',
+  authorList: "[data-test-label='author-list']",
+  authorListItem: "[data-test-label='author-list-item']",
+  translatorListItem: "[data-test-label='translator-list-item']",
+  profileImage: "[data-test-label='profile-image']",
+  profileLink: "[data-test-label='profile-link']",
+  postPublishedTime: "[data-test-label='post-published-time']",
+  authorName: 'Rafael D. Hernandez',
+  translatorName: 'Kristofer Koishigawa'
+};
+
+describe('Original author / translator feature', () => {
+  beforeEach(() => {
+    cy.visit('/');
+  });
+
+  it('the author list should contain an author list item and a translator list item', () => {
+    cy.get(selectors.postCard)
+      .contains(selectors.translatedArticleTitle)
+      .parentsUntil('article')
+      .find(selectors.authorList)
+      .then($el => {
+        cy.wrap($el).find(selectors.authorListItem);
+        cy.wrap($el).find(selectors.translatorListItem);
+      });
+  });
+
+  it('the author list item should have profile image, profile link, and post published time elements', () => {
+    cy.get(selectors.postCard)
+      .contains(selectors.translatedArticleTitle)
+      .parentsUntil('article')
+      .find(selectors.authorListItem)
+      .then($el => {
+        cy.wrap($el).find(selectors.profileImage);
+        cy.wrap($el).find(selectors.profileLink);
+        cy.wrap($el).find(selectors.postPublishedTime);
+      });
+  });
+
+  it("the author list item's profile image should be wrapped in an anchor that points to the author's page", () => {
+    cy.get(selectors.postCard)
+      .contains(selectors.translatedArticleTitle)
+      .parentsUntil('article')
+      .find(selectors.authorListItem)
+      .find(selectors.profileImage)
+      .parent()
+      .then($el => {
+        expect($el.attr('href')).to.deep.equal(
+          'https://www.freecodecamp.org/espanol/news/author/rafael/'
+        );
+      });
+  });
+
+  it("the author list item's profile link should contain the author's name and the locale of the original article", () => {
+    cy.get(selectors.postCard)
+      .contains(selectors.translatedArticleTitle)
+      .parentsUntil('article')
+      .find(selectors.authorListItem)
+      .find(selectors.profileLink)
+      .contains(`${selectors.authorName}`);
+  });
+
+  it("the author list item's profile link should be a full URL that points to the original author's page", () => {
+    cy.get(selectors.postCard)
+      .contains(selectors.translatedArticleTitle)
+      .parentsUntil('article')
+      .find(selectors.authorListItem)
+      .find(selectors.profileLink)
+      .then($el => {
+        expect($el.attr('href')).to.deep.equal(
+          'https://www.freecodecamp.org/espanol/news/author/rafael/'
+        );
+      });
+  });
+
+  it("the author list item's post published time should convert to the expected UTC string", () => {
+    cy.get(selectors.postCard)
+      .contains(selectors.translatedArticleTitle)
+      .parentsUntil('article')
+      .find(selectors.authorListItem)
+      .find(selectors.postPublishedTime)
+      .then($el => {
+        const publishedTimeUTC = new Date($el.attr('datetime')).toUTCString();
+
+        expect(publishedTimeUTC).to.deep.equal('Thu, 06 Jun 2024 21:04:00 GMT');
+      });
+  });
+
+  it('the translator list item should have profile image, profile link, and post published time elements', () => {
+    cy.get(selectors.postCard)
+      .contains(selectors.translatedArticleTitle)
+      .parentsUntil('article')
+      .find(selectors.translatorListItem)
+      .then($el => {
+        cy.wrap($el).find(selectors.profileImage);
+        cy.wrap($el).find(selectors.profileLink);
+        cy.wrap($el).find(selectors.postPublishedTime);
+      });
+  });
+
+  it("the translator list item's profile image should be wrapped in an anchor that points to a relative URL of the translator's page on the current news instance", () => {
+    cy.get(selectors.postCard)
+      .contains(selectors.translatedArticleTitle)
+      .parentsUntil('article')
+      .find(selectors.translatorListItem)
+      .find(selectors.profileImage)
+      .parent()
+      .then($el => {
+        expect($el.attr('href')).to.deep.equal(
+          '/news/author/scissorsneedfoodtoo/'
+        );
+      });
+  });
+
+  it("the translator list item's profile link should contain the author's name and the locale of the original article", () => {
+    cy.get(selectors.postCard)
+      .contains(selectors.translatedArticleTitle)
+      .parentsUntil('article')
+      .find(selectors.translatorListItem)
+      .find(selectors.profileLink)
+      .contains(selectors.translatorName);
+  });
+
+  it("the translator list item's profile link should be a relative URL of the translator's page on the current News instance", () => {
+    cy.get(selectors.postCard)
+      .contains(selectors.translatedArticleTitle)
+      .parentsUntil('article')
+      .find(selectors.translatorListItem)
+      .find(selectors.profileLink)
+      .then($el => {
+        expect($el.attr('href')).to.deep.equal(
+          '/news/author/scissorsneedfoodtoo/'
+        );
+      });
+  });
+
+  it("the translator list item's post published time should convert to the expected UTC string", () => {
+    cy.get(selectors.postCard)
+      .contains(selectors.translatedArticleTitle)
+      .parentsUntil('article')
+      .find(selectors.translatorListItem)
+      .find(selectors.postPublishedTime)
+      .then($el => {
+        const publishedTimeUTC = new Date($el.attr('datetime')).toUTCString();
+
+        expect(publishedTimeUTC).to.deep.equal('Wed, 31 Jul 2024 06:56:31 GMT');
+      });
+  });
+});

cypress/e2e/english/post/original-author-translator.cy.js

@@ -0,0 +1,182 @@
+const selectors = {
+  authorHeaderNoBio: "[data-test-label='author-header-no-bio']",
+  authorHeaderWithBio: "[data-test-label='author-header-with-bio']",
+  authorCard: "[data-test-label='author-card']",
+  translatorCard: "[data-test-label='translator-card']",
+  profileImage: "[data-test-label='profile-image']",
+  profileLink: "[data-test-label='profile-link']",
+  authorBio: "[data-test-label='author-bio']",
+  translatorBio: "[data-test-label='translator-bio']",
+  translationIntro: "[data-test-label='translation-intro']",
+  originalArticleLink: "[data-test-label='original-article-link']",
+  authorName: 'Rafael D. Hernandez',
+  translatorName: 'Kristofer Koishigawa'
+};
+
+describe('Original author / translator feature', () => {
+  beforeEach(() => {
+    cy.visit(
+      '/denny-perez-from-accountant-to-coder-creating-communities-and-inspiring-women-s2-ep-13/'
+    );
+  });
+
+  context(
+    'Hashnode sourced translation (English) <> Ghost sourced original post (Español)',
+    () => {
+      context('Author header without bios', () => {
+        it('should contain an author card and a translator card', () => {
+          cy.get(selectors.authorHeaderNoBio).then($el => {
+            cy.wrap($el).find(selectors.authorCard);
+            cy.wrap($el).find(selectors.translatorCard);
+          });
+        });
+
+        it('the author card should contain a profile image and a profile link', () => {
+          cy.get(selectors.authorHeaderNoBio)
+            .find(selectors.authorCard)
+            .then($el => {
+              cy.wrap($el).find(selectors.profileImage);
+              cy.wrap($el).find(selectors.profileLink);
+            });
+        });
+
+        it("the author card's profile link should contain the author's name and the locale of the original article", () => {
+          cy.get(selectors.authorHeaderNoBio)
+            .find(selectors.authorCard)
+            .contains(`${selectors.authorName}`);
+        });
+
+        it("the author card's profile link should be a full URL that points to the original author's page", () => {
+          cy.get(selectors.authorHeaderNoBio)
+            .find(selectors.authorCard)
+            .find(selectors.profileLink)
+            .then($el => {
+              expect($el.attr('href')).to.deep.equal(
+                'https://www.freecodecamp.org/espanol/news/author/rafael/'
+              );
+            });
+        });
+
+        it('the translator card should contain a profile image and a profile link', () => {
+          cy.get(selectors.authorHeaderNoBio)
+            .find(selectors.translatorCard)
+            .then($el => {
+              cy.wrap($el).find(selectors.profileImage);
+              cy.wrap($el).find(selectors.profileLink);
+            });
+        });
+
+        it("the translator card's profile link should contain the translator's name", () => {
+          cy.get(selectors.authorHeaderNoBio)
+            .find(selectors.translatorCard)
+            .contains(selectors.translatorName);
+        });
+
+        it("the translator card's profile link should be a relative URL that points to the translator's page on the current instance of News", () => {
+          cy.get(selectors.authorHeaderNoBio)
+            .find(selectors.translatorCard)
+            .find(selectors.profileLink)
+            .then($el => {
+              expect($el.attr('href')).to.deep.equal(
+                '/news/author/scissorsneedfoodtoo/'
+              );
+            });
+        });
+      });
+
+      context('Author header with bios', () => {
+        it('should contain an author card and a translator card', () => {
+          cy.get(selectors.authorHeaderWithBio).then($el => {
+            cy.wrap($el).find(selectors.authorCard);
+            cy.wrap($el).find(selectors.translatorCard);
+          });
+        });
+
+        it('the author card should contain a profile image, a profile link, and a bio', () => {
+          cy.get(selectors.authorHeaderWithBio)
+            .find(selectors.authorCard)
+            .then($el => {
+              cy.wrap($el).find(selectors.profileImage);
+              cy.wrap($el).find(selectors.profileLink);
+              cy.wrap($el).find(selectors.authorBio);
+            });
+        });
+
+        it("the author card should contain the author's name and the locale of the original article", () => {
+          cy.get(selectors.authorHeaderWithBio)
+            .find(selectors.authorCard)
+            .contains(`${selectors.authorName} (Spanish)`);
+        });
+
+        it("the author card's profile link should be a full URL that points to the original author's page", () => {
+          cy.get(selectors.authorHeaderWithBio)
+            .find(selectors.authorCard)
+            .find(selectors.profileLink)
+            .then($el => {
+              expect($el.attr('href')).to.deep.equal(
+                'https://www.freecodecamp.org/espanol/news/author/rafael/'
+              );
+            });
+        });
+
+        it("the author card's bio should contain the expected text", () => {
+          cy.get(selectors.authorHeaderWithBio)
+            .find(selectors.authorCard)
+            .find(selectors.authorBio)
+            .contains(
+              'Cristiano / Desarrollador web / Líder de traducciones al español / Host de @freeCodeCamp Podcast en español'
+            );
+        });
+
+        it('the translator card should contain a profile image and profile link', () => {
+          cy.get(selectors.authorHeaderWithBio)
+            .find(selectors.translatorCard)
+            .then($el => {
+              cy.wrap($el).find(selectors.profileImage);
+              cy.wrap($el).find(selectors.profileLink);
+            });
+        });
+
+        it("the translator card should contain the translator's name", () => {
+          cy.get(selectors.authorHeaderWithBio)
+            .find(selectors.translatorCard)
+            .contains(selectors.translatorName);
+        });
+
+        it("the translator card's profile link should be a relative URL that points to the translator's page on the current instance of News", () => {
+          cy.get(selectors.authorHeaderWithBio)
+            .find(selectors.translatorCard)
+            .find(selectors.profileLink)
+            .then($el => {
+              expect($el.attr('href')).to.deep.equal(
+                '/news/author/scissorsneedfoodtoo/'
+              );
+            });
+        });
+
+        // To do: write tests for cases where the author and / or translator don't have bios
+      });
+
+      context('Translated article intro', () => {
+        it('the author intro should contain links to the original article', () => {
+          cy.get(selectors.translationIntro).then($el => {
+            cy.wrap($el).find(selectors.originalArticleLink);
+          });
+        });
+
+        it('the link to the original article should contain the expected text and `href` attribute', () => {
+          cy.get(selectors.translationIntro)
+            .find(selectors.originalArticleLink)
+            .then($el => {
+              cy.wrap($el).contains(
+                'Denny Pérez: De contadora a coder, creando Comunidades e inspirando mujeres | S2 Ep. 13'
+              );
+              expect($el.attr('href')).to.deep.equal(
+                'https://www.freecodecamp.org/espanol/news/denny-perez-de-contadora-a-coder-creando-comunidades-e-inspirando-mujeres-s2-ep-13/'
+              );
+            });
+        });
+      });
+    }
+  );
+});