diff --git a/apps/docs-e2e/src/docs.spec.ts b/apps/docs-e2e/src/docs.spec.ts
index 4198cc8a..7af56550 100644
--- a/apps/docs-e2e/src/docs.spec.ts
+++ b/apps/docs-e2e/src/docs.spec.ts
@@ -22,6 +22,7 @@ const CUHACKING_2025_PLATFORM_GITHUB_INDEX_PAGE_URL = `${GITHUB_BASE_URL}/2025/b
const CUHACKING_2025_LANDING_PAGE_GITHUB_REPOSITORY_URL = `${GITHUB_BASE_URL}/landing-page`
const CUHACKING_2025_LANDING_PAGE_URL = 'https://cuhacking.ca/'
+const CUHACKING_2025_LINKTREE_URL = 'https://linktr.ee/cuhacking_'
/* ---------------- MOBILE + DESKTOP + TABLET ---------------- */
test.describe(`Common MOBILE, TABLET and DESKTOP Layout Elements`, {
@@ -153,6 +154,16 @@ test.describe(`Common MOBILE and TABLET Menu Elements`, {
await clickAndGoToPage(docsLayoutPage, docsLayoutPage.mobileHackerPortalProjectBoardLink, CUHACKING_2025_PLATFORM_GITHUB_PROJECT_BOARD_URL)
})
+ test(`should have linktree button visible from linktree dropdown for mobile/tablet`, async ({ docsLayoutPage }) => {
+ await docsLayoutPage.linktreeDropdownButton.click()
+ await expect(docsLayoutPage.mobileLinktreeLink).toBeVisible()
+ })
+
+ test(`should take user to linktree when linktree button is clicked mobile/tablet`, async ({ docsLayoutPage }) => {
+ await docsLayoutPage.linktreeDropdownButton.click()
+ await clickAndGoToPage(docsLayoutPage, docsLayoutPage.mobileLinktreeLink, CUHACKING_2025_LINKTREE_URL)
+ })
+
test(`should have github button visible from mobile/tablet menu`, async ({ docsLayoutPage }) => {
await expect(docsLayoutPage.mobileGithubIcon).toBeVisible()
})
@@ -255,6 +266,16 @@ test.describe('Unique DESKTOP Header Elements', {
await clickAndGoToPage(docsLayoutPage, docsLayoutPage.hackerPortalProjectBoardLink, CUHACKING_2025_PLATFORM_GITHUB_PROJECT_BOARD_URL)
})
+ test('should contain Linktree link inside Linktree Dropdown', async ({ docsLayoutPage }) => {
+ await docsLayoutPage.linktreeDropdownButton.click()
+ await expect(docsLayoutPage.linktreeLink).toBeVisible()
+ })
+
+ test('should take user to Linktree when Linktree link inside Linktree Dropdown is clicked', async ({ docsLayoutPage }) => {
+ await docsLayoutPage.linktreeDropdownButton.click()
+ await clickAndGoToPage(docsLayoutPage, docsLayoutPage.linktreeLink, CUHACKING_2025_LINKTREE_URL)
+ })
+
test('should contain theme toggle in desktop header', async ({ docsLayoutPage }) => {
await expect(docsLayoutPage.themeToggle).toBeVisible()
})
diff --git a/apps/docs-e2e/src/pom.ts b/apps/docs-e2e/src/pom.ts
index 6cbc90c9..137461ac 100644
--- a/apps/docs-e2e/src/pom.ts
+++ b/apps/docs-e2e/src/pom.ts
@@ -14,6 +14,8 @@ export class DocsLayout {
readonly hackerPortalLink: Locator
readonly hackerPortalSourceLink: Locator
readonly hackerPortalProjectBoardLink: Locator
+ readonly linktreeDropdownButton: Locator
+ readonly linktreeLink: Locator
readonly searchBar: Locator
readonly themeToggle: Locator
// TODO: add test for language toggle once it's implemented
@@ -34,6 +36,7 @@ export class DocsLayout {
readonly mobileWebsiteSourceLink: Locator
readonly mobileGithubIcon: Locator
readonly mobileHackerPortalProjectBoardLink: Locator
+ readonly mobileLinktreeLink: Locator
// Desktop Sidebar
readonly sideBarToggle: Locator
@@ -63,6 +66,9 @@ export class DocsLayout {
this.hackerPortalLink = page.getByRole('dialog').getByRole('link', { name: 'App' })
this.hackerPortalSourceLink = page.getByRole('dialog').getByRole('link', { name: 'Source' })
this.hackerPortalProjectBoardLink = page.getByRole('dialog').getByRole('link', { name: 'Project Board' })
+ this.linktreeDropdownButton = page.getByRole('button', { name: 'Linktree' })
+ this.linktreeLink = page.getByRole('dialog').getByRole('link', { name: 'Linktree' })
+
this.searchBar = page.getByRole('button', { name: 'Search ⌘ K' })
this.themeToggle = page.getByRole('button', { name: 'Toggle Theme' })
@@ -84,6 +90,7 @@ export class DocsLayout {
this.mobileWebsiteSourceLink = page.getByRole('link', { name: 'Source (legacy)' })
this.mobileGithubIcon = page.getByRole('link', { name: 'Github', exact: true })
this.mobileHackerPortalProjectBoardLink = page.getByRole('link', { name: 'Project Board' })
+ this.mobileLinktreeLink = page.getByRole('link', { name: 'Linktree' })
// Desktop Sidebar
this.sideBarToggle = page.getByLabel('Collapse Sidebar')
diff --git a/apps/docs/src/app/(docs)/layout.config.tsx b/apps/docs/src/app/(docs)/layout.config.tsx
index 1b26995d..f5808507 100644
--- a/apps/docs/src/app/(docs)/layout.config.tsx
+++ b/apps/docs/src/app/(docs)/layout.config.tsx
@@ -4,6 +4,7 @@ import {
Github,
Laptop as HackerPortalIcon,
Bird as LandingPageIcon,
+ Trees as LinktreeIcon,
} from 'lucide-react'
import Image from 'next/image'
import type { HomeLayoutProps } from 'fumadocs-ui/home-layout'
@@ -66,6 +67,15 @@ export const baseOptions: HomeLayoutProps = {
},
],
},
+ {
+ type: 'menu',
+ text: 'Linktree',
+ icon: ,
+ items: [
+ { text: 'Linktree', icon: , url: 'https://linktr.ee/cuhacking_',
+ },
+ ],
+ },
],
}