diff --git a/.woodpecker/playwright.yaml b/.woodpecker/playwright.yaml
index e67e4de..b741f11 100644
--- a/.woodpecker/playwright.yaml
+++ b/.woodpecker/playwright.yaml
@@ -15,7 +15,8 @@ steps:
- name: playwright
image: mcr.microsoft.com/playwright:v1.50.0
commands:
- - cd playwright;
+ - cd playwright
+ - cp playwright.config.js.ci playwright.config.js
- npm install
- npx playwright install
- npx playwright test
diff --git a/main.go b/main.go
index 1785f9e..962d9ea 100644
--- a/main.go
+++ b/main.go
@@ -1,17 +1,32 @@
package main
import (
+ "embed"
+ "html/template"
+
"git.keks.cloud/kekskurse/miniauth/pkg/web"
"github.com/gin-gonic/gin"
)
+//go:embed templates/*
+var templatesFS embed.FS
+
func main() {
router := setupRouter()
router.Run(":8080")
}
+func loadTemplates() *template.Template {
+ tmpl, err := template.ParseFS(templatesFS, "templates/*.html")
+ if err != nil {
+ panic(err) // Handle error entsprechend
+ }
+ return tmpl
+}
+
func setupRouter() *gin.Engine {
router := gin.Default()
+ router.SetHTMLTemplate(loadTemplates())
routesWeb := router.Group("/web")
webServer := web.NewWeb()
diff --git a/pkg/web/web.go b/pkg/web/web.go
index 680c9f4..9958149 100644
--- a/pkg/web/web.go
+++ b/pkg/web/web.go
@@ -1,6 +1,10 @@
package web
-import "github.com/gin-gonic/gin"
+import (
+ "net/http"
+
+ "github.com/gin-gonic/gin"
+)
type Web struct{}
@@ -10,5 +14,10 @@ func NewWeb() Web {
}
func (w Web) RegisterRoutes(routing *gin.RouterGroup) error {
+ routing.GET("/register", w.GetRegisterPage)
return nil
}
+
+func (w Web) GetRegisterPage(c *gin.Context) {
+ c.HTML(http.StatusOK, "register.html", nil)
+}
diff --git a/playwright/playwright.config.js b/playwright/playwright.config.js
index 96a2a36..acda745 100644
--- a/playwright/playwright.config.js
+++ b/playwright/playwright.config.js
@@ -27,7 +27,7 @@ export default defineConfig({
/* 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',
+ baseURL: 'http://127.0.0.1:8080',
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: 'on-first-retry',
diff --git a/playwright/playwright.config.js.ci b/playwright/playwright.config.js.ci
new file mode 100644
index 0000000..acda745
--- /dev/null
+++ b/playwright/playwright.config.js.ci
@@ -0,0 +1,81 @@
+// @ts-check
+import { defineConfig, devices } from '@playwright/test';
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// import dotenv from 'dotenv';
+// import path from 'path';
+// dotenv.config({ path: path.resolve(__dirname, '.env') });
+
+/**
+ * @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:8080',
+
+ /* 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'] },
+ },
+
+ /*{
+ name: 'webkit',
+ use: { ...devices['Desktop Safari'] },
+ },*/
+
+ /* 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: 'npm run start',
+ // url: 'http://127.0.0.1:3000',
+ // reuseExistingServer: !process.env.CI,
+ // },
+});
+
diff --git a/playwright/tests/example.spec.js b/playwright/tests/example.spec.js
index 0c14412..a2d6183 100644
--- a/playwright/tests/example.spec.js
+++ b/playwright/tests/example.spec.js
@@ -3,10 +3,15 @@ import { test, expect } from '@playwright/test';
test('check ping route', async ({ page }) => {
- await page.goto('http://miniauth:8080/ping');
-
- await page.screenshot({ path: 'screenshot.png' });
+ await page.goto('/ping');
// Expects page to have a heading with the name of Installation.
await expect(page.getByText('pong')).toBeVisible();
});
+
+test('see register page', async ({page}) => {
+ await page.goto('/web/register');
+
+ await expect(page.getByRole('heading', { name: 'Registrieren'})).toBeVisible();
+ await expect(page.getByRole('button', { name: 'Registrieren' })).toBeVisible();
+})
diff --git a/templates/register.html b/templates/register.html
new file mode 100644
index 0000000..66a53a6
--- /dev/null
+++ b/templates/register.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Registrierung</title>
+ <script src="https://cdn.tailwindcss.com"></script>
+</head>
+<body class="bg-gray-100 flex items-center justify-center min-h-screen">
+ <div class="bg-white p-8 shadow-xl w-full max-w-md">
+ <h2 class="text-2xl font-semibold text-gray-900 text-center mb-6">Registrieren</h2>
+ <form action="#" method="POST" class="space-y-4">
+ <div>
+ <label for="username" class="block text-sm font-medium text-gray-700">Benutzername</label>
+ <input type="text" id="username" name="username" required
+ class="mt-1 p-3 w-full border border-gray-300 focus:ring-2 focus:ring-blue-500 focus:outline-none">
+ </div>
+ <div>
+ <label for="email" class="block text-sm font-medium text-gray-700">E-Mail-Adresse</label>
+ <input type="email" id="email" name="email" required
+ class="mt-1 p-3 w-full border border-gray-300 focus:ring-2 focus:ring-blue-500 focus:outline-none">
+ </div>
+ <div>
+ <label for="password" class="block text-sm font-medium text-gray-700">Passwort</label>
+ <input type="password" id="password" name="password" required
+ class="mt-1 p-3 w-full border border-gray-300 focus:ring-2 focus:ring-blue-500 focus:outline-none">
+ </div>
+ <div>
+ <label for="confirm_password" class="block text-sm font-medium text-gray-700">Passwort wiederholen</label>
+ <input type="password" id="confirm_password" name="confirm_password" required
+ class="mt-1 p-3 w-full border border-gray-300 focus:ring-2 focus:ring-blue-500 focus:outline-none">
+ </div>
+ <button type="submit"
+ class="w-full bg-blue-600 text-white py-3 text-lg font-medium hover:bg-blue-700 focus:ring-4 focus:ring-blue-300">
+ Registrieren
+ </button>
+ </form>
+
+ <!--
+ <div class="mt-6 border-t border-gray-300 pt-6 space-y-3">
+ <button class="w-full flex items-center justify-center gap-2 bg-gray-900 text-white py-3 text-lg font-medium hover:bg-gray-800 focus:ring-4 focus:ring-gray-500">
+ <svg class="w-5 h-5" viewBox="0 0 24 24" fill="white" xmlns="http://www.w3.org/2000/svg">
+ <path d="M12 .296c-6.63 0-12 5.373-12 12 0 5.292 3.438 9.793 8.206 11.385.6.11.82-.261.82-.58 0-.287-.01-1.05-.015-2.06-3.338.724-4.042-1.607-4.042-1.607-.546-1.387-1.333-1.756-1.333-1.756-1.089-.744.083-.729.083-.729 1.205.085 1.84 1.238 1.84 1.238 1.07 1.835 2.805 1.305 3.49.998.108-.775.42-1.305.763-1.604-2.665-.3-5.467-1.33-5.467-5.93 0-1.308.465-2.38 1.235-3.22-.125-.302-.535-1.522.116-3.17 0 0 1.007-.322 3.3 1.23a11.54 11.54 0 0 1 3-.404c1.017.005 2.043.137 3 .404 2.292-1.552 3.296-1.23 3.296-1.23.654 1.648.244 2.868.12 3.17.77.84 1.23 1.912 1.23 3.22 0 4.61-2.807 5.625-5.478 5.92.43.37.814 1.102.814 2.22 0 1.606-.015 2.896-.015 3.293 0 .322.216.696.825.578 4.765-1.594 8.2-6.095 8.2-11.387 0-6.627-5.373-12-12-12Z"/>
+ </svg>
+ Mit GitHub anmelden
+ </button>
+ <button class="w-full flex items-center justify-center gap-2 bg-red-600 text-white py-3 text-lg font-medium hover:bg-red-700 focus:ring-4 focus:ring-red-300">
+ <svg class="w-5 h-5" viewBox="0 0 24 24" fill="white" xmlns="http://www.w3.org/2000/svg">
+ <path d="M23.994 12.263c0-.81-.072-1.585-.18-2.32H12v4.59h6.785c-.31 1.576-1.237 2.916-2.64 3.829v3.19h4.28c2.51-2.325 3.97-5.744 3.97-9.29z"/>
+ <path d="M12 24c3.24 0 5.953-1.08 7.94-2.91l-3.97-3.19c-1.09.74-2.48 1.18-3.97 1.18-3.05 0-5.64-2.05-6.57-4.81H.33v3.25C2.32 20.445 6.83 24 12 24z"/>
+ <path d="M5.43 14.23A7.97 7.97 0 0 1 4 12c0-.77.127-1.52.33-2.23V6.52H.33A11.998 11.998 0 0 0 0 12c0 1.94.467 3.77 1.28 5.48l4.15-3.25z"/>
+ </svg>
+ Mit Google anmelden
+ </button>
+ </div>
+ !-->
+
+ <p class="text-sm text-gray-600 text-center mt-4">Bereits ein Konto? <a href="#" class="text-blue-500 hover:underline">Anmelden</a></p>
+ </div>
+</body>
+</html>
+