add github workflows for test, deploy, and pr previews.

Squashed commit of the following:

commit 02a28a076c28ea436d24ba1ebd52bd3683946be3
Author: Jacob Phillips <[email protected]>
Date:   Mon Nov 18 12:11:42 2024 -0500

    skip draft PRs

commit c8b32d2
Author: Jacob Phillips <[email protected]>
Date:   Mon Nov 18 12:06:28 2024 -0500

    workflow fixes

commit 6210589
Author: Jacob Phillips <[email protected]>
Date:   Mon Nov 18 12:01:27 2024 -0500

    add empty header and footer to test PR previews

deploy test: more logs, no obfuscation (#2)

* deploy test: more logs, no obfuscation

* Adjust base url for svelte when running from github pages.
only run unit tests

* let pr preview make comments on prs

* temp remove obfuscation

disable github pages from using jekyll

obfuscate and remove .nojekyll (was repo setting on github)

set prod log level to info (#4)

* set prod log level to info

* try removing obfuscate from preview PR

* and remove obfuscate from deploy/main

include base in init message if it is not empty. (#5)

do a clean gh-pages build

fix log this context

try to figure out why log levels are ignored on gh-pages

.github/workflows/deploy.yml

@@ -0,0 +1,35 @@
+# Deploy to GitHub Pages.
+#
+# Based on https://github.com/JamesIves/github-pages-deploy-action
+# and https://github.com/marketplace/actions/deploy-pr-preview#ensure-your-main-deployment-is-compatible
+
+name: Deploy
+on:
+  push:
+    branches:
+      - main
+permissions:
+  contents: write
+jobs:
+  build-and-deploy:
+    concurrency: ci-${{ github.ref }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout 🛎️
+        uses: actions/checkout@v4
+
+      - name: Set BASE_PATH
+        run: echo "BASE_PATH=/${{ github.event.repository.name }}" >> $GITHUB_ENV
+
+      - name: Install and Build 🔧
+        run: |
+          npm ci
+          npm run build
+          npm run obfuscate
+
+      - name: Deploy 🚀
+        uses: JamesIves/github-pages-deploy-action@v4
+        with:
+          folder: build
+          clean-exclude: pr-preview/
+          force: false

.github/workflows/preview.yml

@@ -0,0 +1,47 @@
+# Preview PRs by deploying to a pemanent subdirectory in GitHub Pages.
+#
+# Based on https://github.com/marketplace/actions/deploy-pr-preview#usage.
+
+name: Deploy PR previews
+on:
+  pull_request:
+    draft: false
+    branches:
+      - main
+    types:
+      - opened
+      - synchronize
+    paths:
+      - '**.js'
+      - '**.ts'
+      - '**.json'
+      - 'src/**'
+      - 'static/**'
+      - '.env'
+      - '.env.*'
+permissions:
+  contents: write
+  pull-requests: write
+concurrency: preview-${{ github.ref }}
+
+jobs:
+  deploy-preview:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Set BASE_PATH
+        run: echo "BASE_PATH=/${{ github.event.repository.name }}/pr-preview/pr-${{ github.event.number }}" >> $GITHUB_ENV
+
+      - name: Install and Build
+        run: |
+          npm ci
+          npm run build
+          npm run obfuscate
+
+      - name: Deploy preview
+        uses: rossjrw/pr-preview-action@v1
+        with:
+          source-dir: ./build/
+          action: deploy

.github/workflows/test.yml

@@ -0,0 +1,23 @@
+# Run unit and integration tests.
+#
+# Based on https://playwright.dev/docs/next/ci#github-actions.
+name: Test
+on:
+  push:
+    branches: main
+  pull_request:
+    draft: false
+    branches: main
+jobs:
+  test:
+    timeout-minutes: 5
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: lts/*
+      - name: Install dependencies
+        run: npm ci
+      - name: Run unit tests
+        run: npx vitest --run

src/lib/advertising/service_mock.ts

@@ -5,7 +5,7 @@ export class AdvertisingServiceMock extends AdvertisingService {
 		element.classList.add('block', 'bg-neutral-500', 'rounded-lg', 'overflow-hidden');
 		element.innerHTML = `
       <div class="flex items-center justify-center h-full">
-        <span>Ad Placeholder ${element.clientWidth}x${element.clientHeight}</span>
+        <span>Ad Placeholder ${element.offsetWidth}x${element.offsetHeight}</span>
       </div>
     `;
 		return Promise.resolve();

src/lib/index.ts

@@ -1,5 +1,7 @@
 // place files you want to import through the `$lib` alias in this folder.
 
+import { base } from '$app/paths';
+
 import { AdvertisingServiceGoogleAdsense } from './advertising/service_google_adsense';
 import { AdvertisingServiceMock } from './advertising/service_mock';
 import { App } from './app';
@@ -38,4 +40,4 @@ export const app = new App(
 		: new TelemetryServiceMock()
 );
 
-log.debug(performance.now(), 'Initialized.');
+log.info(performance.now(), base ? `Initialized at ${base}.` : 'Initialized.');

src/routes/+layout.svelte

@@ -8,6 +8,8 @@
 	});
 </script>
 
+<header></header>
 <main>
 	<slot />
 </main>
+<footer></footer>

svelte.config.js

@@ -11,7 +11,10 @@ const config = {
 		// adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.
 		// If your environment is not supported, or you settled on a specific environment, switch out the adapter.
 		// See https://svelte.dev/docs/kit/adapters for more information about adapters.
-		adapter: adapter()
+		adapter: adapter(),
+		paths: {
+			base: process.env.BASE_PATH || ''
+		}
 	}
 };