Initial commit with tests and deployment pipeline
Test and Deploy Website / test-and-deploy (push) Successful in 1m12s

This commit is contained in:
2026-06-15 14:00:18 +02:00
commit f0b4f42cb1
11 changed files with 613 additions and 0 deletions
+58
View File
@@ -0,0 +1,58 @@
name: Test and Deploy Website
on:
push:
branches:
- '**'
jobs:
test-and-deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout Code
uses: actions/checkout@v4
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: 20
- name: Install Dependencies
run: npm ci
- name: Run Unit Tests
run: npm run test:unit
- name: Run Integration Tests
run: npm run test:integration
- name: Install Playwright Browsers and Deps
run: npx playwright install --with-deps chromium
- name: Run E2E Tests
run: npm run test:e2e
- name: Deploy to Production
if: github.ref == 'refs/heads/main'
run: |
echo "Deploying to Production website..."
# Make sure target directory exists (it is mounted from host)
mkdir -p /root/docker/website-prod/html
# Clean old files
rm -rf /root/docker/website-prod/html/*
# Copy new files
cp -r public/* /root/docker/website-prod/html/
echo "Production deployment completed!"
- name: Deploy to Staging
if: github.ref != 'refs/heads/main'
run: |
echo "Deploying to Staging website..."
# Make sure target directory exists (it is mounted from host)
mkdir -p /root/docker/website-stage/html
# Clean old files
rm -rf /root/docker/website-stage/html/*
# Copy new files
cp -r public/* /root/docker/website-stage/html/
echo "Staging deployment completed!"
+4
View File
@@ -0,0 +1,4 @@
node_modules/
test-results/
playwright-report/
.env
+78
View File
@@ -0,0 +1,78 @@
{
"name": "robert-mueller-homepage",
"version": "1.0.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "robert-mueller-homepage",
"version": "1.0.0",
"devDependencies": {
"@playwright/test": "^1.44.0"
}
},
"node_modules/@playwright/test": {
"version": "1.61.0",
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.61.0.tgz",
"integrity": "sha512-cKA5B6lpFEMyMGjxF54QihfYpB4FkEGH+qZhtArDEG+wezQAJY8Pq6C7T1SjWz+FFzt3TbyoXBQYk/0292TdJA==",
"dev": true,
"license": "Apache-2.0",
"dependencies": {
"playwright": "1.61.0"
},
"bin": {
"playwright": "cli.js"
},
"engines": {
"node": ">=18"
}
},
"node_modules/fsevents": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
"dev": true,
"hasInstallScript": true,
"license": "MIT",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
}
},
"node_modules/playwright": {
"version": "1.61.0",
"resolved": "https://registry.npmjs.org/playwright/-/playwright-1.61.0.tgz",
"integrity": "sha512-Z+7BeeqQPRRzklHsVFP4KTGIyMxKUmfeRA4WisM6G3/XW6nwGeX6fX9qYaDa+CiUqpOkb2f6X3nar05R3kSuJQ==",
"dev": true,
"license": "Apache-2.0",
"dependencies": {
"playwright-core": "1.61.0"
},
"bin": {
"playwright": "cli.js"
},
"engines": {
"node": ">=18"
},
"optionalDependencies": {
"fsevents": "2.3.2"
}
},
"node_modules/playwright-core": {
"version": "1.61.0",
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.61.0.tgz",
"integrity": "sha512-caX7TrY3Ml6egyDX0WUcTHDxodl/b51y5wJOdCEA36QviK/s2g081hvmGs8eaE3DWb6NYZQ6BjO/QkNRPenoPA==",
"dev": true,
"license": "Apache-2.0",
"bin": {
"playwright-core": "cli.js"
},
"engines": {
"node": ">=18"
}
}
}
}
+14
View File
@@ -0,0 +1,14 @@
{
"name": "robert-mueller-homepage",
"version": "1.0.0",
"description": "Personal Homepage for Robert Müller",
"main": "index.js",
"scripts": {
"test:unit": "node --test tests/unit.test.js",
"test:integration": "node --test tests/integration.test.js",
"test:e2e": "playwright test --workers=1"
},
"devDependencies": {
"@playwright/test": "^1.44.0"
}
}
+27
View File
@@ -0,0 +1,27 @@
const { defineConfig, devices } = require('@playwright/test');
module.exports = defineConfig({
testDir: './tests',
fullyParallel: false,
forbiddenOnly: !!process.env.CI,
retries: process.env.CI ? 2 : 0,
workers: 1, // Restrict to 1 worker to conserve RAM on 2GB VPS
reporter: 'list',
use: {
baseURL: 'http://localhost:8080',
trace: 'on-first-retry',
headless: true,
},
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
],
webServer: {
command: 'node server.js',
url: 'http://localhost:8080',
reuseExistingServer: !process.env.CI,
timeout: 10000,
},
});
+293
View File
@@ -0,0 +1,293 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Robert Müller — Software Engineer & Architect</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&display=swap" rel="stylesheet">
<style>
:root {
--bg-dark: #090d16;
--panel-bg: rgba(255, 255, 255, 0.03);
--panel-hover: rgba(255, 255, 255, 0.06);
--border-color: rgba(255, 255, 255, 0.08);
--accent-color: #6366f1;
--accent-glow: rgba(99, 102, 241, 0.3);
--accent-secondary: #06b6d4;
--text-main: #f8fafc;
--text-muted: #94a3b8;
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: 'Outfit', sans-serif;
background-color: var(--bg-dark);
color: var(--text-main);
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: relative;
overflow-x: hidden;
padding: 2rem 1rem;
}
/* Animated Ambient Lights */
.ambient-glow {
position: absolute;
width: 60vw;
height: 60vw;
border-radius: 50%;
background: radial-gradient(circle, rgba(99, 102, 241, 0.15) 0%, rgba(6, 182, 212, 0.05) 50%, rgba(0,0,0,0) 70%);
filter: blur(120px);
z-index: 0;
top: -10vw;
left: -10vw;
animation: drift 25s infinite alternate ease-in-out;
}
.ambient-glow-2 {
position: absolute;
width: 50vw;
height: 50vw;
border-radius: 50%;
background: radial-gradient(circle, rgba(6, 182, 212, 0.15) 0%, rgba(99, 102, 241, 0.05) 50%, rgba(0,0,0,0) 70%);
filter: blur(120px);
z-index: 0;
bottom: -10vw;
right: -10vw;
animation: drift 20s infinite alternate-reverse ease-in-out;
}
@keyframes drift {
0% { transform: translate(0, 0) scale(1); }
100% { transform: translate(5vw, 5vw) scale(1.1); }
}
/* Container Card */
.container {
background: var(--panel-bg);
backdrop-filter: blur(24px);
-webkit-backdrop-filter: blur(24px);
border: 1px solid var(--border-color);
border-radius: 24px;
padding: 4rem 3rem;
width: 100%;
max-width: 650px;
text-align: center;
z-index: 10;
box-shadow: 0 30px 60px -15px rgba(0,0,0,0.6);
transition: border-color 0.5s ease;
}
.container:hover {
border-color: rgba(99, 102, 241, 0.25);
}
/* Badge */
.badge {
display: inline-block;
background: rgba(99, 102, 241, 0.08);
border: 1px solid rgba(99, 102, 241, 0.3);
color: #a5b4fc;
padding: 0.4rem 1rem;
border-radius: 99px;
font-size: 0.8rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.1em;
margin-bottom: 2rem;
}
/* Header */
h1 {
font-size: 3rem;
font-weight: 800;
margin-bottom: 0.5rem;
background: linear-gradient(135deg, #ffffff 40%, #a5b4fc 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
letter-spacing: -0.02em;
}
.subtitle {
font-size: 1.25rem;
color: var(--accent-secondary);
font-weight: 600;
margin-bottom: 1.5rem;
letter-spacing: 0.05em;
text-transform: uppercase;
}
/* Dynamic greeting */
.greeting {
font-size: 1.05rem;
color: var(--text-muted);
margin-bottom: 2rem;
min-height: 24px;
font-style: italic;
}
p.description {
color: var(--text-muted);
font-size: 1.15rem;
line-height: 1.75;
margin-bottom: 2.5rem;
font-weight: 300;
}
/* Skills Grid */
.skills-title {
font-size: 0.9rem;
text-transform: uppercase;
color: var(--text-muted);
letter-spacing: 0.15em;
margin-bottom: 1.2rem;
font-weight: 600;
}
.skills-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
margin-bottom: 3rem;
}
.skill-card {
background: rgba(255, 255, 255, 0.015);
border: 1px solid var(--border-color);
border-radius: 12px;
padding: 1rem;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.skill-card:hover {
background: var(--panel-hover);
border-color: rgba(6, 182, 212, 0.3);
transform: translateY(-4px);
}
.skill-card h3 {
font-size: 0.95rem;
font-weight: 600;
margin-bottom: 0.25rem;
}
.skill-card p {
font-size: 0.8rem;
color: var(--text-muted);
}
/* Actions / Button */
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, var(--accent-color) 0%, #4f46e5 100%);
color: white;
text-decoration: none;
padding: 1rem 2.25rem;
border-radius: 99px;
font-size: 1rem;
font-weight: 600;
box-shadow: 0 10px 25px -5px var(--accent-glow);
transition: all 0.3s ease;
border: none;
cursor: pointer;
}
.btn:hover {
transform: translateY(-2px);
box-shadow: 0 15px 30px -5px var(--accent-glow);
filter: brightness(1.1);
}
.btn:active {
transform: translateY(0);
}
/* Footer */
footer {
margin-top: 3rem;
font-size: 0.8rem;
color: rgba(255,255,255,0.2);
z-index: 10;
}
@media (max-width: 500px) {
.container {
padding: 3rem 1.5rem;
}
h1 { font-size: 2.25rem; }
.skills-grid {
grid-template-columns: 1fr;
}
}
</style>
</head>
<body>
<div class="ambient-glow"></div>
<div class="ambient-glow-2"></div>
<div class="container">
<span class="badge">Online</span>
<h1>Robert Müller</h1>
<div class="subtitle">Software Engineer & Architect</div>
<div class="greeting" id="greeting-box">...</div>
<p class="description">
Specializing in building robust, high-performance distributed systems, container orchestration, and security-hardened self-hosted platforms. Committed to craftsmanship, optimization, and clean architectures.
</p>
<div class="skills-title">Core Competencies</div>
<div class="skills-grid">
<div class="skill-card">
<h3>DevOps</h3>
<p>Docker & Compose</p>
</div>
<div class="skill-card">
<h3>Backend</h3>
<p>PostgreSQL & Node.js</p>
</div>
<div class="skill-card">
<h3>SysOps</h3>
<p>Nginx & Linux OS</p>
</div>
</div>
<a href="mailto:mail@robert-mueller.net" class="btn" id="contact-button">Get In Touch</a>
</div>
<footer>
&copy; 2026 Robert Müller. All rights reserved.
</footer>
<script src="js/utils.js"></script>
<script>
document.addEventListener('DOMContentLoaded', () => {
// Dynamic Greeting based on time
const hour = new Date().getHours();
let timeOfDay = 'day';
if (hour < 12) timeOfDay = 'morning';
else if (hour < 18) timeOfDay = 'afternoon';
else timeOfDay = 'evening';
const greetingBox = document.getElementById('greeting-box');
if (typeof formatGreeting === 'function') {
greetingBox.textContent = formatGreeting(timeOfDay, 'Robert Müller');
} else {
greetingBox.textContent = `Welcome to Robert Müller's portfolio!`;
}
});
</script>
</body>
</html>
+12
View File
@@ -0,0 +1,12 @@
function validateEmail(email) {
const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return re.test(email);
}
function formatGreeting(timeOfDay, name) {
return `Good ${timeOfDay}, welcome to ${name}'s portfolio!`;
}
if (typeof module !== 'undefined' && module.exports) {
module.exports = { validateEmail, formatGreeting };
}
+52
View File
@@ -0,0 +1,52 @@
const http = require('http');
const fs = require('fs');
const path = require('path');
const PORT = 8080;
const PUBLIC_DIR = path.join(__dirname, 'public');
const MIME_TYPES = {
'.html': 'text/html',
'.css': 'text/css',
'.js': 'text/javascript',
'.json': 'application/json',
'.png': 'image/png',
'.jpg': 'image/jpeg',
'.svg': 'image/svg+xml',
};
const server = http.createServer((req, res) => {
let filePath = path.join(PUBLIC_DIR, req.url === '/' ? 'index.html' : req.url);
// Prevent directory traversal
if (!filePath.startsWith(PUBLIC_DIR)) {
res.statusCode = 403;
res.end('Forbidden');
return;
}
const ext = path.extname(filePath);
const contentType = MIME_TYPES[ext] || 'application/octet-stream';
fs.readFile(filePath, (err, data) => {
if (err) {
if (err.code === 'ENOENT') {
res.statusCode = 404;
res.setHeader('Content-Type', 'text/plain');
res.end('Not Found');
} else {
res.statusCode = 500;
res.setHeader('Content-Type', 'text/plain');
res.end('Internal Server Error');
}
return;
}
res.statusCode = 200;
res.setHeader('Content-Type', contentType);
res.end(data);
});
});
server.listen(PORT, () => {
console.log(`Server running at http://localhost:${PORT}/`);
});
+24
View File
@@ -0,0 +1,24 @@
const { test, expect } = require('@playwright/test');
test.describe('E2E Tests: Portfolio Homepage', () => {
test('should load page and display correct title and header', async ({ page }) => {
await page.goto('/');
// Check title
await expect(page).toHaveTitle(/Robert Müller/i);
// Check header heading
const heading = page.locator('h1');
await expect(heading).toBeVisible();
await expect(heading).toContainText('Robert Müller');
});
test('should contain interactive email link', async ({ page }) => {
await page.goto('/');
// Check if mail link exists and has correct href
const mailLink = page.locator('a[href^="mailto:"]');
await expect(mailLink).toBeVisible();
await expect(mailLink).toHaveAttribute('href', 'mailto:mail@robert-mueller.net');
});
});
+35
View File
@@ -0,0 +1,35 @@
const test = require('node:test');
const assert = require('node:assert');
const http = require('http');
const { spawn } = require('child_process');
test('Integration Tests: Local Static Server', async (t) => {
// Start server as a child process
const serverProcess = spawn('node', ['server.js']);
// Wait for server to start
await new Promise((resolve) => setTimeout(resolve, 1500));
await t.test('Server returns 200 OK for index.html', () => {
return new Promise((resolve, reject) => {
http.get('http://localhost:8080/', (res) => {
assert.strictEqual(res.statusCode, 200);
assert.match(res.headers['content-type'], /text\/html/);
resolve();
}).on('error', reject);
});
});
await t.test('Server returns 404 for non-existent routes', () => {
return new Promise((resolve, reject) => {
http.get('http://localhost:8080/non-existent-page.html', (res) => {
assert.strictEqual(res.statusCode, 404);
resolve();
}).on('error', reject);
});
});
// Stop server
serverProcess.kill();
await new Promise((resolve) => setTimeout(resolve, 500));
});
+16
View File
@@ -0,0 +1,16 @@
const test = require('node:test');
const assert = require('node:assert');
const { validateEmail, formatGreeting } = require('../public/js/utils.js');
test('Unit Tests: validateEmail', (t) => {
assert.strictEqual(validateEmail('mail@robert-mueller.net'), true);
assert.strictEqual(validateEmail('invalid-email'), false);
assert.strictEqual(validateEmail('@domain.com'), false);
});
test('Unit Tests: formatGreeting', (t) => {
assert.strictEqual(
formatGreeting('evening', 'Robert Müller'),
"Good evening, welcome to Robert Müller's portfolio!"
);
});