From 0e8b7a1164c721f92e9f651b5839ecc452416557 Mon Sep 17 00:00:00 2001 From: "yu.otsubo" Date: Mon, 2 Jan 2023 23:50:41 +0900 Subject: [PATCH 1/3] add test --- src/components/SEO/index.spec.tsx | 169 ++++++++++++++++++ src/components/Sidebar/Archive/index.spec.tsx | 22 +++ 2 files changed, 191 insertions(+) create mode 100644 src/components/SEO/index.spec.tsx diff --git a/src/components/SEO/index.spec.tsx b/src/components/SEO/index.spec.tsx new file mode 100644 index 0000000000..6fb3180ff8 --- /dev/null +++ b/src/components/SEO/index.spec.tsx @@ -0,0 +1,169 @@ +import React from "react"; +import { render } from "@testing-library/react"; +import Helmet from "react-helmet"; +import SEO from "./index"; + +describe("SEO", () => { + it("should render metadata", () => { + render( + + ); + const helmet = Helmet.peek(); + expect(helmet.title).toBe("testTitle"); + let description = ""; + let image = ""; + let ogUrl = ""; + let ogType = ""; + let ogTitle = ""; + let ogDescription = ""; + let ogImage = ""; + let fbAppId = ""; + let twitterCard = ""; + let twitterCreator = ""; + let twitterTitle = ""; + let twitterDescription = ""; + let twitterImage = ""; + for (const content of helmet.metaTags) { + if (content.name === "description") { + description = content.content; + } + if (content.name === "image") { + image = content.content; + } + if ((content as any).property === "og:url") { + ogUrl = content.content; + } + if ((content as any).property === "og:type") { + ogType = content.content; + } + if ((content as any).property === "og:title") { + ogTitle = content.content; + } + if ((content as any).property === "og:description") { + ogDescription = content.content; + } + if ((content as any).property === "og:image") { + ogImage = content.content; + } + if ((content as any).property === "fb:app_id") { + fbAppId = content.content; + } + if (content.name === "twitter:card") { + twitterCard = content.content; + } + if (content.name === "twitter:creator") { + twitterCreator = content.content; + } + if (content.name === "twitter:title") { + twitterTitle = content.content; + } + if (content.name === "twitter:description") { + twitterDescription = content.content; + } + if (content.name === "twitter:image") { + twitterImage = content.content; + } + } + expect(description).toBe("testDescription"); + expect(image).toBe("https://example.com/test.png"); + expect(ogUrl).toBe("https://example.com"); + expect(ogType).toBe("article"); + expect(ogTitle).toBe("testTitle"); + expect(ogDescription).toBe("testDescription"); + expect(ogImage).toBe("https://example.com/test.png"); + expect(fbAppId).toBe("280941406476272"); + expect(twitterCard).toBe("summary_large_image"); + expect(twitterTitle).toBe("testTitle"); + expect(twitterDescription).toBe("testDescription"); + expect(twitterImage).toBe("https://example.com/test.png"); + }); + it("should render metadata (not article)", () => { + render( + + ); + const helmet = Helmet.peek(); + expect(helmet.title).toBe("testTitle"); + let description = ""; + let image = ""; + let ogUrl = ""; + let ogType = ""; + let ogTitle = ""; + let ogDescription = ""; + let ogImage = ""; + let fbAppId = ""; + let twitterCard = ""; + let twitterCreator = ""; + let twitterTitle = ""; + let twitterDescription = ""; + let twitterImage = ""; + for (const content of helmet.metaTags) { + if (content.name === "description") { + description = content.content; + } + if (content.name === "image") { + image = content.content; + } + if ((content as any).property === "og:url") { + ogUrl = content.content; + } + if ((content as any).property === "og:type") { + ogType = content.content; + } + if ((content as any).property === "og:title") { + ogTitle = content.content; + } + if ((content as any).property === "og:description") { + ogDescription = content.content; + } + if ((content as any).property === "og:image") { + ogImage = content.content; + } + if ((content as any).property === "fb:app_id") { + fbAppId = content.content; + } + if (content.name === "twitter:card") { + twitterCard = content.content; + } + if (content.name === "twitter:creator") { + twitterCreator = content.content; + } + if (content.name === "twitter:title") { + twitterTitle = content.content; + } + if (content.name === "twitter:description") { + twitterDescription = content.content; + } + if (content.name === "twitter:image") { + twitterImage = content.content; + } + } + expect(description).toBe("testDescription"); + expect(image).toBe("https://example.com/test.png"); + expect(ogUrl).toBe("https://example.com"); + expect(ogType).toBe("website"); + expect(ogTitle).toBe("testTitle"); + expect(ogDescription).toBe("testDescription"); + expect(ogImage).toBe("https://example.com/test.png"); + expect(fbAppId).toBe("280941406476272"); + expect(twitterCard).toBe("summary_large_image"); + expect(twitterTitle).toBe("testTitle"); + expect(twitterDescription).toBe("testDescription"); + expect(twitterImage).toBe("https://example.com/test.png"); + }); +}); diff --git a/src/components/Sidebar/Archive/index.spec.tsx b/src/components/Sidebar/Archive/index.spec.tsx index 9c6d194576..5b934fdb80 100644 --- a/src/components/Sidebar/Archive/index.spec.tsx +++ b/src/components/Sidebar/Archive/index.spec.tsx @@ -3,6 +3,8 @@ import { render, screen } from "@testing-library/react"; import Archive from "./index"; import { AllPost } from "../entity"; import { axe } from "jest-axe"; +import ReactGA from "react-ga4"; +import userEvent from "@testing-library/user-event"; describe("Archive", () => { it("has 1 post", async () => { @@ -42,6 +44,26 @@ describe("Archive", () => { expect(screen.getByTestId("Archive")).toHaveTextContent("2022"); expect(screen.getByTestId("Archive")).toHaveTextContent("2021"); }); + it("click event ga", async () => { + const allPosts: AllPost[] = [ + { + node: { + frontmatter: { + date: new Date("2022-01-01").toString(), + tags: ["test1", "test2"], + }, + }, + }, + ]; + render(); + const mockReactGA = jest.spyOn(ReactGA, "event"); + await userEvent.click(screen.getByRole("link")); + expect(mockReactGA.mock.calls[0][0]).toStrictEqual({ + category: "Archive", + action: "push Archive 2022", + }); + mockReactGA.mockRestore(); + }); it("should not have basic accessibility issues", async () => { const allPosts: AllPost[] = [ { From c6fd9abf4b449ee6bb1190887b6b1e1550ece17d Mon Sep 17 00:00:00 2001 From: "yu.otsubo" Date: Mon, 2 Jan 2023 23:58:38 +0900 Subject: [PATCH 2/3] add test --- src/components/SEO/index.spec.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/SEO/index.spec.tsx b/src/components/SEO/index.spec.tsx index 6fb3180ff8..b528a0d13f 100644 --- a/src/components/SEO/index.spec.tsx +++ b/src/components/SEO/index.spec.tsx @@ -81,6 +81,7 @@ describe("SEO", () => { expect(ogImage).toBe("https://example.com/test.png"); expect(fbAppId).toBe("280941406476272"); expect(twitterCard).toBe("summary_large_image"); + expect(twitterCreator).toBe("@meitante1conan"); expect(twitterTitle).toBe("testTitle"); expect(twitterDescription).toBe("testDescription"); expect(twitterImage).toBe("https://example.com/test.png"); From d87178373a26ec0bc4d61c8605f0421bd9af3a9d Mon Sep 17 00:00:00 2001 From: "yu.otsubo" Date: Tue, 3 Jan 2023 00:06:59 +0900 Subject: [PATCH 3/3] [skip netlify]add test --- src/components/SEO/index.spec.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/SEO/index.spec.tsx b/src/components/SEO/index.spec.tsx index b528a0d13f..0e7f2feb7a 100644 --- a/src/components/SEO/index.spec.tsx +++ b/src/components/SEO/index.spec.tsx @@ -164,6 +164,7 @@ describe("SEO", () => { expect(fbAppId).toBe("280941406476272"); expect(twitterCard).toBe("summary_large_image"); expect(twitterTitle).toBe("testTitle"); + expect(twitterCreator).toBe("@meitante1conan"); expect(twitterDescription).toBe("testDescription"); expect(twitterImage).toBe("https://example.com/test.png"); });