Skip to content

Commit

Permalink
Merge pull request #21 from Developer-DAO/e2e
Browse files Browse the repository at this point in the history
added a basic test coverage
  • Loading branch information
vorcigernix authored Feb 7, 2024
2 parents eda5589 + 0d460c6 commit 2504f11
Show file tree
Hide file tree
Showing 12 changed files with 598 additions and 10 deletions.
27 changes: 27 additions & 0 deletions .github/workflows/playwright.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
name: Playwright Tests
on:
push:
branches: [ main, master ]
pull_request:
branches: [ main, master ]
jobs:
test:
timeout-minutes: 60
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v3
with:
node-version: 18
- name: Install dependencies
run: npm install -g yarn && yarn
- name: Install Playwright Browsers
run: yarn playwright install --with-deps
- name: Run Playwright tests
run: yarn playwright test
- uses: actions/upload-artifact@v3
if: always()
with:
name: playwright-report
path: playwright-report/
retention-days: 30
4 changes: 4 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -34,3 +34,7 @@ yarn-error.log*
# typescript
*.tsbuildinfo
next-env.d.ts
/test-results/
/playwright-report/
/blob-report/
/playwright/.cache/
2 changes: 1 addition & 1 deletion app/about/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import React from "react";

export default function HomePage() {
return (
<div className="relative flex min-h-screen flex-col bg-background">
<div className="relative flex min-h-screen flex-col bg-background" data-testid="aboutpage">
<Navigation />
<main className="flex-1">

Expand Down
6 changes: 3 additions & 3 deletions app/authentication/login/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,12 +14,12 @@ export const metadata: Metadata = {
export default function AuthenticationPage() {
return (
<>
<div className="container relative hidden h-[800px] flex-col items-center justify-center md:grid lg:max-w-none lg:grid-cols-2 lg:px-0">
<div className="container relative hidden h-[800px] flex-col items-center justify-center md:grid lg:max-w-none lg:grid-cols-2 lg:px-0" data-testid="loginpage">
<Link
href="/authentication/login"
href="/authentication"
className="absolute right-4 top-4 md:right-8 md:top-8 flex items-center justify-center gap-1 rounded-full border-2 transition-all h-12 px-6 text-lg text-black border-white bg-white font-paragraph font-semibold tracking-wider hover:drop-shadow-[10px_0_20px_rgba(254,254,254,0.472)]"
>
Login
Register
</Link>
<div className="relative hidden h-screen flex-col bg-muted p-10 text-white lg:flex dark:border-r">
<div className="absolute inset-0" style={{ backgroundImage: "url(https://academy.developerdao.com/_next/image?url=%2Fschoolofcode.png&w=640&q=75)", backgroundPosition: "center", backgroundRepeat: "no-repeat", backgroundSize: "50%" }} />
Expand Down
2 changes: 1 addition & 1 deletion app/contact/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import React from "react";

export default function HomePage() {
return (
<div className="relative flex min-h-screen flex-col bg-background">
<div className="relative flex min-h-screen flex-col bg-background" data-testid="contactpage">
<Navigation />
<main className="flex-1">

Expand Down
4 changes: 2 additions & 2 deletions app/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,9 +23,9 @@ export default function HomePage() {
</div>
</div>
</div>
<div className="flex flex-col items-start mt-12 mb-16 text-left lg:flex-grow lg:w-1/2 lg:pl-6 xl:pl-24 md:mb-0 xl:mt-0">
<div className="flex flex-col items-start mt-12 mb-16 text-left lg:flex-grow lg:w-1/2 lg:pl-6 xl:pl-24 md:mb-0 xl:mt-0" data-testid="mainhero">
<span className="mb-8 text-xs font-bold tracking-widest text-neutral-600 uppercase"> remote procedure call gateway by D_D </span>
<h1 className="mb-8 text-4xl font-bold leading-none tracking-tighter text-neutral-100 md:text-7xl lg:text-5xl">Your gateway to the decentrlaized world.</h1>
<h1 className="mb-8 text-4xl font-bold leading-none tracking-tighter text-neutral-100 md:text-7xl lg:text-5xl">Your gateway to the decentralized world.</h1>
<p className="mb-8 text-base leading-relaxed text-left text-neutral-500">Some other claim why we are building this, other claim why we are building this. Perfecto! </p>
<p className="mb-2 text-base leading-relaxed text-left text-neutral-500">Don't miss the opportunity, register now!</p>
<div className="flex-col mt-0 lg:mt-6 max-w-7xl sm:flex">
Expand Down
6 changes: 4 additions & 2 deletions components/navigation.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export function Navigation() {
<header className="sticky top-0 z-50 w-full bg-zinc-900/95 backdrop-blur supports-[backdrop-filter]:bg-zinc-900/60">
<div className="container flex py-4 max-w-screen-2xl items-center">
<div className="mr-4 hidden md:flex">
<Link href="/" className="mr-6 flex items-center space-x-2">
<Link href="/" className="mr-6 flex items-center space-x-2" data-testid="nav-home">
<Icons.logo className="h-12 w-12" />
<span className="hidden font-bold sm:inline-block">
RPC
Expand All @@ -19,13 +19,15 @@ export function Navigation() {
href="/about"
className=
" tracking-wide text-neutral-500 p-0 hover:text-white transition-colors"
data-testid="nav-about"
>
About
</Link>
<Link
href="/contact"
className=
" tracking-wide text-neutral-500 p-0 hover:text-white transition-colors"
data-testid="nav-contact"
>
Contact
</Link>
Expand All @@ -34,7 +36,7 @@ export function Navigation() {
<div className="flex flex-1 items-center justify-between space-x-2 md:justify-end">
<nav className="flex items-center">

<Link href="/dashboard" className="flex w-fit items-center justify-center gap-1 rounded-full border-2 transition-all h-12 px-6 text-lg text-black border-white bg-white font-paragraph font-semibold tracking-wider hover:drop-shadow-[10px_0_20px_rgba(254,254,254,0.472)]" > Application</Link>
<Link href="/authentication/login" className="flex w-fit items-center justify-center gap-1 rounded-full border-2 transition-all h-12 px-6 text-lg text-black border-white bg-white font-paragraph font-semibold tracking-wider hover:drop-shadow-[10px_0_20px_rgba(254,254,254,0.472)]" data-testid="nav-login"> Application</Link>

</nav>
</div>
Expand Down
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"start": "next build && next start",
"lint": "next lint"
},
"dependencies": {
Expand All @@ -31,6 +31,7 @@
"zustand": "^4.5.0"
},
"devDependencies": {
"@playwright/test": "^1.41.2",
"@types/node": "^20",
"@types/react": "^18",
"@types/react-dom": "^18",
Expand Down
72 changes: 72 additions & 0 deletions playwright.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
import { defineConfig, devices } from '@playwright/test';

/**
* Read environment variables from file.
* https://github.com/motdotla/dotenv
*/
// require('dotenv').config();

/**
* See https://playwright.dev/docs/test-configuration.
*/
export default defineConfig({
testDir: './tests',
/* Run tests in files in parallel */
fullyParallel: true,
/* Fail the build on CI if you accidentally left test.only in the source code. */
forbidOnly: !!process.env.CI,
/* Retry on CI only */
retries: process.env.CI ? 2 : 0,
/* Opt out of parallel tests on CI. */
workers: process.env.CI ? 1 : undefined,
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
reporter: 'html',
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL: 'http://127.0.0.1:3000',

/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: 'on-first-retry',
},

/* Configure projects for major browsers */
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},

{
name: 'firefox',
use: { ...devices['Desktop Firefox'] },
},

/* Test against mobile viewports. */
// {
// name: 'Mobile Chrome',
// use: { ...devices['Pixel 5'] },
// },
// {
// name: 'Mobile Safari',
// use: { ...devices['iPhone 12'] },
// },

/* Test against branded browsers. */
// {
// name: 'Microsoft Edge',
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
// },
// {
// name: 'Google Chrome',
// use: { ...devices['Desktop Chrome'], channel: 'chrome' },
// },
],

/* Run your local dev server before starting the tests */
webServer: {
command: 'yarn start',
url: 'http://127.0.0.1:3000',
reuseExistingServer: !process.env.CI,
},
});
Loading

0 comments on commit 2504f11

Please sign in to comment.