add cypress and workflows

Author: Xetera

.github/workflows/test.yaml

@@ -0,0 +1,60 @@
+# yaml-language-server: $schema=https://raw.githubusercontent.com/SchemaStore/schemastore/refs/heads/master/src/schemas/json/github-workflow.json
+name: Test with Postgres 16
+
+on:
+  workflow_dispatch:
+  pull_request:
+    types: [opened, synchronize]
+  push:
+
+jobs:
+  test-run:
+    runs-on: ubuntu-24.04
+    steps:
+      - uses: actions/checkout@v4
+      - name: Run Postgres
+        run: |
+          sudo tee -a /etc/postgresql/16/main/postgresql.conf <<EOF
+            shared_preload_libraries = 'auto_explain'
+            auto_explain.log_min_duration = 0
+            auto_explain.log_analyze = true
+            auto_explain.log_verbose = true
+            auto_explain.log_buffers = true
+            auto_explain.log_format = 'json'
+            logging_collector = on
+            log_directory = '/var/log/postgresql'
+            log_filename = 'postgres.log'
+          EOF
+          sudo tee /etc/postgresql/16/main/pg_hba.conf > /dev/null <<EOF
+            host all all 127.0.0.1/32 trust
+            host all all ::1/128 trust
+            local all all peer
+          EOF
+          sudo systemctl start postgresql.service
+          sudo -u postgres createuser -s -d -r -w query_doctor
+          sudo -u postgres createdb leaderboard
+          sudo chmod 666 /var/log/postgresql/postgres.log
+
+      - name: Run migrations
+        run: |
+          psql -h localhost -U query_doctor -d leaderboard -f db/init.sql
+
+      - name: Compile TypeScript
+        run: |
+          npm run build
+
+      - name: Run backend
+        run: node ./dist/app.js &
+        env:
+          PORT: 3123
+          DATABASE_URL: postgres://query_doctor@localhost:5432/leaderboard
+
+      - name: Cypress run
+        uses: cypress-io/github-action@v6
+
+      - name: Run local GitHub Action
+        uses: query-doctor/analyzer@v0
+        env:
+          GITHUB_TOKEN: ${{ github.token }}
+          POSTGRES_URL: http://query_doctor@localhost:5432/leaderboard
+          LOG_PATH: /var/log/postgresql/postgres.log

.gitignore

@@ -1,2 +1,3 @@
 node_modules
 .env
+dist

cypress.config.ts

@@ -0,0 +1,9 @@
+import { defineConfig } from "cypress";
+
+export default defineConfig({
+  e2e: {
+    setupNodeEvents(on, config) {
+      // implement node event listeners here
+    },
+  },
+});

cypress/e2e/spec.cy.ts

@@ -0,0 +1,11 @@
+describe("template spec", () => {
+  it("passes", () => {
+    cy.visit("http://localhost:3123");
+    cy.get(".player-link").first().click();
+    // goback one page
+    cy.go("back");
+    cy.get("[name=name]").type("John Doe");
+    cy.get(".play-game").click();
+    cy.get(".submit-score").click();
+  });
+});

cypress/fixtures/example.json

@@ -0,0 +1,5 @@
+{
+  "name": "Using fixtures to represent data",
+  "email": "hello@cypress.io",
+  "body": "Fixtures are a great way to mock data for responses to routes"
+}

cypress/support/commands.ts

@@ -0,0 +1,37 @@
+/// <reference types="cypress" />
+// ***********************************************
+// This example commands.ts shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+//
+//
+// -- This is a parent command --
+// Cypress.Commands.add('login', (email, password) => { ... })
+//
+//
+// -- This is a child command --
+// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
+//
+//
+// -- This is a dual command --
+// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
+//
+//
+// -- This will overwrite an existing command --
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
+//
+// declare global {
+//   namespace Cypress {
+//     interface Chainable {
+//       login(email: string, password: string): Chainable<void>
+//       drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
+//       dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
+//       visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
+//     }
+//   }
+// }

cypress/support/e2e.ts

@@ -0,0 +1,17 @@
+// ***********************************************************
+// This example support/e2e.ts is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands'

dist/app.js

@@ -0,0 +1,93 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const express_1 = __importDefault(require("express"));
+const pg_1 = require("pg");
+const dotenv_1 = __importDefault(require("dotenv"));
+const path_1 = __importDefault(require("path"));
+dotenv_1.default.config();
+const app = (0, express_1.default)();
+const pool = new pg_1.Pool({ connectionString: process.env.DATABASE_URL });
+app.set("view engine", "ejs");
+app.set("views", path_1.default.join(__dirname, "../views"));
+app.use(express_1.default.static(path_1.default.join(__dirname, "../public")));
+app.use(express_1.default.json());
+app.get("/", async (_req, res) => {
+    const result = await pool.query(`
+    SELECT u.name, s.score, to_char(s.timestamp, 'HH24:MI:SS') AS time
+    FROM scores s
+    JOIN users u ON u.id = s.user_id
+    ORDER BY s.score DESC
+    LIMIT 10
+ `);
+    res.render("index", { scores: result.rows });
+});
+app.get("/player/:name", async (req, res) => {
+    const name = req.params.name;
+    const stats = await pool.query(`
+        SELECT
+            COUNT(*) AS games_played,
+            MAX(score) AS high_score,
+            ROUND(AVG(score))::int AS avg_score,
+            MAX(timestamp) AS last_played
+        FROM scores s
+        JOIN users u ON u.id = s.user_id
+        WHERE u.name = $1
+    `, [name]);
+    const recent = await pool.query(`
+        SELECT score, to_char(s.timestamp, 'YYYY-MM-DD HH24:MI') as time
+        FROM scores s
+        JOIN users u ON u.id = s.user_id
+        WHERE u.name = $1
+        ORDER BY s.timestamp DESC
+        LIMIT 10
+    `, [name]);
+    const leaderboardContext = await pool.query(`
+        WITH ranked AS (
+            SELECT
+            u.name,
+            s.score,
+            RANK() OVER (ORDER BY s.score DESC) AS rank
+            FROM scores s
+            JOIN users u ON u.id = s.user_id
+        ),
+        target AS (
+            SELECT rank FROM ranked WHERE name = $1 ORDER BY score DESC LIMIT 1
+        )
+        SELECT * FROM ranked
+        WHERE rank BETWEEN (SELECT rank FROM target) - 2 AND (SELECT rank FROM target) + 2
+        ORDER BY rank;
+    `, [name]);
+    res.render("player", {
+        name,
+        stats: stats.rows[0],
+        recent: recent.rows,
+        leaderboardContext: leaderboardContext.rows,
+    });
+});
+app.post("/submit", async (req, res) => {
+    const { name, score } = req.body;
+    const parsedScore = parseInt(score, 10);
+    if (!name || isNaN(parsedScore))
+        return res.status(400).send("Invalid input");
+    const userId = await findOrCreateUser(name);
+    await pool.query(`INSERT INTO scores (user_id, score) VALUES ($1, $2)`, [
+        userId,
+        parsedScore,
+    ]);
+    res.redirect(`/player/${encodeURIComponent(name)}`);
+});
+// Helpers
+async function findOrCreateUser(name) {
+    const existing = await pool.query(`SELECT id FROM users WHERE name = $1`, [
+        name,
+    ]);
+    if (existing.rows.length > 0)
+        return existing.rows[0].id;
+    const created = await pool.query(`INSERT INTO users (name) VALUES ($1) RETURNING id`, [name]);
+    return created.rows[0].id;
+}
+const PORT = process.env.PORT || 3123;
+app.listen(PORT, () => console.log(`Server running on http://localhost:${PORT}`));