From 94fe6b5c878cf719b1effbe7734a3e28a80d751f Mon Sep 17 00:00:00 2001
From: Aaron Yarborough <aaron@alienjungle.digital>
Date: Thu, 22 Aug 2024 19:35:33 +0100
Subject: [PATCH] chore: add tests for writing seo

---
 .vscode/settings.json            |  4 ++
 src/pages/writing/index.test.jsx | 69 ++++++++++++++++++++++++++++++++
 2 files changed, 73 insertions(+)
 create mode 100644 src/pages/writing/index.test.jsx

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 2004655..25e9c1a 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -13,6 +13,7 @@
     "Hetzner",
     "Integra",
     "Levantine",
+    "opengraph",
     "Orangebus",
     "pipdig",
     "pubdate",
@@ -30,5 +31,8 @@
   "editor.defaultFormatter": "standard.vscode-standard",
   "[javascript]": {
     "editor.defaultFormatter": "rvest.vs-code-prettier-eslint"
+  },
+  "[javascriptreact]": {
+    "editor.defaultFormatter": "rvest.vs-code-prettier-eslint"
   }
 }
\ No newline at end of file
diff --git a/src/pages/writing/index.test.jsx b/src/pages/writing/index.test.jsx
new file mode 100644
index 0000000..9b252d7
--- /dev/null
+++ b/src/pages/writing/index.test.jsx
@@ -0,0 +1,69 @@
+/* eslint-env jest */
+import { render } from '@testing-library/react'
+import '@testing-library/jest-dom'
+import Writing from '.'
+
+jest.mock('next/head', () => {
+  return {
+    __esModule: true,
+    default: ({ children }) => {
+      return <>{children}</>
+    }
+  }
+})
+
+describe('Writing', () => {
+  it('renders without crashing', () => {
+    render(
+      getStubWritingComponent())
+  })
+
+  it('renders meta title', async () => {
+    const { container } = render(getStubWritingComponent())
+    expect(container.querySelector('title')).toHaveTextContent('Writing')
+  })
+
+  it('renders opengraph title', () => {
+    const { container } = render(getStubWritingComponent())
+    expect(container.querySelector('meta[property="og:title"]'))
+      .toHaveAttribute('content', 'Writing')
+  })
+
+  it('renders meta description', () => {
+    const { container } = render(getStubWritingComponent())
+    expect(container.querySelector('meta[name="description"]'))
+      .toHaveAttribute('content', 'Come get ya thoughts, ramblings, technical writing and other long-from text content here!')
+  })
+
+  it('renders opengraph description', () => {
+    const { container } = render(getStubWritingComponent())
+
+    expect(container.querySelector('meta[property="og:description"]'))
+      .toHaveAttribute('content', 'Come get ya thoughts, ramblings, technical writing and other long-from text content here!')
+  })
+})
+
+function getStubWritingComponent () {
+  const entries = [
+    {
+      attributes: {
+        title: 'My title one',
+        pubdate: 'Mon, 18 Mar 2024 16:47:32 GMT',
+        desc: 'This is my description.'
+      },
+      html: '<p>This is some content</p>',
+      slug: 'my-title-one'
+    },
+    {
+      attributes: {
+        title: 'My title Two',
+        pubdate: 'Mon, 19 Mar 2024 16:47:32 GMT',
+        desc: 'This is my description.'
+      },
+      html: '<p>This is some content</p>',
+      slug: 'my-title-two'
+    }
+  ]
+
+  return <Writing entries={entries} urlPrefix='/' />
+}