Skip to content

Commit

Permalink
Merge pull request #193 from sejori/sejori-patch-1
Browse files Browse the repository at this point in the history
feat: test ci runners
  • Loading branch information
sejori authored Mar 9, 2024
2 parents bb8d595 + aba1aa9 commit 6686497
Show file tree
Hide file tree
Showing 49 changed files with 1,749 additions and 1,753 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/CD.yml
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ permissions:
contents: read

jobs:
deploy-cloudflare-worker:
deploy-cfw:
runs-on: ubuntu-latest

steps:
Expand Down
61 changes: 46 additions & 15 deletions .github/workflows/CI.yml
Original file line number Diff line number Diff line change
Expand Up @@ -18,45 +18,76 @@ permissions:
contents: read

jobs:
test-deno:
profile-deno:
runs-on: ubuntu-latest

steps:
- name: Setup repo
- name: setup repo
uses: actions/checkout@v3

- name: Setup Deno
- name: setup Deno
uses: denoland/setup-deno@v1
with:
deno-version: v1.x

- name: Run profile
run: deno task profile

unit-test-deno:
runs-on: ubuntu-latest

steps:
- name: setup repo
uses: actions/checkout@v3

- name: setup Deno
uses: denoland/setup-deno@v1
with:
deno-version: v1.x

# Uncomment this step to verify the use of 'deno fmt' on each commit.
# - name: Verify formatting
# run: deno fmt --check

- name: Run linter
- name: run linter
run: deno lint

- name: Run tests
- name: run tests
run: deno task test

# - name: Run profile
# run: deno task profile

test-bun:
test-run-bun:
runs-on: ubuntu-latest

steps:
- name: Setup repo
- name: setup repo
uses: actions/checkout@v3

- name: Setup Bun.sh
- name: setup Bun.sh
uses: oven-sh/setup-bun@v1
with:
bun-version: latest

- name: Bun intall
- name: bun intall
run: bun install

- name: Bun run
run: bun run scripts/bun.ts
- name: bun run
run: npm run test:bun
after_script:
- pkill bun

test-run-wrangler:
runs-on: ubuntu-latest

steps:
- name: setup repo
uses: actions/checkout@v3

- name: npm intall
run: npm install

- name: setup Wrangler
run: npm install -g wrangler

- name: wrangler dev
run: npm run test:cfw
after_script:
- pkill node
4 changes: 2 additions & 2 deletions examples/auth/app.ts → example/auth/app.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import * as Peko from "../../index"; // "https://deno.land/x/peko/mod.ts"
import * as Peko from "../../index.ts"; // "https://deno.land/x/peko/mod.ts"

const html = String;
const router = new Peko.Router();
Expand Down Expand Up @@ -148,4 +148,4 @@ router.get(
)
);

Deno.serve((req) => router.handle(req));
export default router;
File renamed without changes
File renamed without changes
File renamed without changes.
File renamed without changes
File renamed without changes
28 changes: 21 additions & 7 deletions examples/preact/document.ts → example/preactSSR/document.ts
Original file line number Diff line number Diff line change
@@ -1,15 +1,23 @@
export default (tags: Record<string, string>) => `<!DOCTYPE html>
export default (input: {
title: string;
entrypoint: string;
ssrHTML: string;
serverState?: Record<string, unknown>;
}) => `<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="/assets/twemoji_chick.svg">
${tags && tags.title}
<meta name="description" content="The Featherweight Deno SSR Library">
<title>${input.title}</title>
<meta name="description" content="Featherweight apps on the edge">
<meta name="keywords" content="deno, edge, serverless, preact, peko, cloudflare, bun, typescript, server">
${tags && tags.modulepreload}
<script modulepreload="true" type="module" src="${
input.entrypoint
}"></script>
<style>
html, body, #root {
Expand Down Expand Up @@ -45,9 +53,15 @@ export default (tags: Record<string, string>) => `<!DOCTYPE html>
</head>
<body>
<div id="root">
${tags.appHTML}
${input.ssrHTML}
</div>
${tags && tags.hydrationScript}
<script type="module">
import { hydrate } from "https://npm.reversehttp.com/preact,preact/hooks,htm/preact,preact-render-to-string";
import About from "${input.entrypoint}";
hydrate(About(${JSON.stringify(
input.serverState
)}), document.getElementById("root"))
</script
</body>
</html>`
</html>`;
162 changes: 162 additions & 0 deletions example/preactSSR/router.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,162 @@
import {
Router,
RequestContext,
logger,
sse,
cacher,
ssr,
file,
} from "../../index.ts"; //"https://deno.land/x/peko/mod.ts"
import { renderToString } from "preact-render-to-string";

// Preact page components and HTML template for ssrHandler render logic
import Home from "./src/pages/Home.ts";
import About from "./src/pages/About.ts";
import htmlTemplate from "./document.ts";

// esbuild bundling for app TS files
import * as esbuild from "esbuild";

const env: Record<string, string> =
(typeof Deno !== "undefined" && Deno.env.toObject()) ||
(typeof process !== "undefined" && process.env) ||
(typeof env !== "undefined" && env) ||
{};

const router = new Router();
router.use(logger(console.log));

// FRONTEND PAGES
router.get("/", {
// use cacher to serve responses from cache in prod env
middleware: env.ENVIRONMENT === "production" ? cacher() : [],
handler: ssr(
() => {
const ssrHTML = renderToString(Home(), null);
return htmlTemplate({
title: "Peko",
ssrHTML,
entrypoint: "/src/pages/Home.ts",
});
},
{
headers: new Headers({
// instruct browser to cache page in prod env
"Cache-Control":
env.ENVIRONMENT === "production"
? "max-age=86400, stale-while-revalidate=86400"
: "no-store",
}),
}
),
});

router.get(
"/about",
(ctx) => {
ctx.state = {
request_time: `${Date.now()}`,
...env,
};
},
ssr((ctx) => {
const ssrHTML = renderToString(About(ctx.state), null);
return htmlTemplate({
title: "Peko | About",
ssrHTML,
entrypoint: "/src/pages/About.ts",
});
})
);

// STATIC FILES
// dynamic URL param for filename, always cache
router.get("/assets/:filename", cacher(), async (ctx) =>
(
await file(
new URL(
`https://raw.githubusercontent.com/sejori/peko/main/example/preact/assets/${ctx.params.filename}`
),
{
headers: new Headers({
// instruct browser to cache file in prod env
"Cache-Control":
env.ENVIRONMENT === "production"
? "max-age=86400, stale-while-revalidate=86400"
: "no-store",
}),
}
)
)(ctx)
);

// BUNDLED TS FILES
// dynamic URL param for filename, always cache
router.get("/src/:filename", cacher(), async (ctx) =>
(
await file(
new URL(
`https://raw.githubusercontent.com/sejori/peko/main/example/preact/src/${ctx.params.filename}`
),
{
transform: async (contents) => {
const reader = contents.getReader();
let result = "";
let { done, value } = await reader.read();
while (!done) {
result += new TextDecoder().decode(value);
({ done, value } = await reader.read());
}
const esbuildResult = await esbuild.build({
bundle: true,
write: false,
stdin: {
contents: result,
},
format: "esm",
target: "es2022",
loader: {
".ts": "ts",
},
});

const bundle = esbuildResult.outputFiles[0].text;
console.log(bundle);
return bundle;
},
headers: new Headers({
"Content-Type": "application/javascript",
// instruct browser to cache file in prod env
"Cache-Control":
env.ENVIRONMENT === "production"
? "max-age=86400, stale-while-revalidate=86400"
: "no-store",
}),
}
)
)(ctx)
);

// API FUNCTIONALITY
const demoEventTarget = new EventTarget();
// shorthand route adding
router.get("/sse", (ctx: RequestContext) => {
setInterval(() => {
demoEventTarget.dispatchEvent(
new CustomEvent("send", { detail: Math.random() })
);
}, 2500);

return sse(demoEventTarget)(ctx);
});
// full route object adding
router.addRoute({
path: "/api/parrot",
method: "POST",
handler: async (ctx: RequestContext) => {
const body = await ctx.request.text();
return new Response(`Parrot sqwarks: ${body}`);
},
});

export default router;
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { useState, useEffect } from "preact/hooks";
import { html } from "htm/preact";
import List from "./List.js";
import { useLocalState } from "../hooks/localstate.js";
import List from "./List.ts";
import { useLocalState } from "../hooks/localstate.ts";

const App = () => {
const [dataArray, setDataArray] = useLocalState("dataArray");
Expand Down Expand Up @@ -31,7 +31,7 @@ const App = () => {
<button
style=${btnLgStyle}
onClick=${() =>
setDataArray((dataArray) => [
setDataArray((dataArray: string[]) => [
...dataArray,
`Item ${dataArray.length}`,
])}
Expand All @@ -41,7 +41,9 @@ const App = () => {
<button
style=${btnLgStyle}
onClick=${() =>
setDataArray((dataArray) => dataArray.slice(0, dataArray.length - 1))}
setDataArray((dataArray: string[]) =>
dataArray.slice(0, dataArray.length - 1)
)}
>
remove item
</button>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,14 @@
import { html } from "htm/preact";

const Layout = ({ navColor, navLink, children }) => {
const Layout = ({
navColor,
navLink,
children,
}: {
navColor: string;
navLink: string;
children: unknown;
}) => {
return html`
<nav style=${navStyle(navColor)}>
<div class="container align-center">
Expand All @@ -12,12 +20,9 @@ const Layout = ({ navColor, navLink, children }) => {
alt="peko-logo"
/>
<h1 style="text-align: center;">
Featherweight HTTP routing and utilities
Featherweight <a href="/${navLink}" style=${navLinkStyle}>apps</a>
</h1>
<h2 style="text-align: center;">
for <a href="/${navLink}" style=${navLinkStyle}>apps</a> on the
stateless edge 🐣⚡
</h2>
<h2 style="text-align: center;">on the edge 🐣⚡</h2>
</div>
</nav>
<main style="padding: 1rem;" class="container">${children}</main>
Expand Down Expand Up @@ -57,7 +62,7 @@ const Layout = ({ navColor, navLink, children }) => {
`;
};

const navStyle = (navColor) => `
const navStyle = (navColor: string) => `
width: 100%;
display: flex;
flex-direction: column;
Expand Down
Loading

0 comments on commit 6686497

Please sign in to comment.