Implement automated PR preview deployment system #5

Copilot · 2025-09-17T22:00:12Z

This PR adds a streamlined GitHub Actions workflow to automatically deploy pull request branches for testing, addressing the need to preview changes before merging to production.

What's New

🚀 Automated PR Preview Workflow (.github/workflows/pr-validation.yml)

Triggers automatically on every PR to the master branch
Creates preview builds with clear PR identification markers
Uploads builds as downloadable GitHub Actions artifacts
Posts helpful bot comments with download links and testing instructions

📚 Complete Documentation

Added comprehensive README.md with usage guide and project structure
Updated CLAUDE.md to reflect current deployment setup and design system
Added .gitignore to prevent build artifacts from being committed

How It Works

When a pull request is created or updated:

Build: A preview version is created with PR indicators injected into the HTML
Artifact: The preview is packaged and uploaded as a downloadable zip file
Notification: An automated comment provides the download link and testing instructions

Contributors can then download the artifact, extract it, and open index.html locally to test changes before they go live.

Benefits

✅ Safe Testing: Preview changes without affecting the live site
✅ No External Dependencies: Uses GitHub's built-in Actions and artifact storage
✅ Streamlined Deployment: Focused purely on deployment functionality without validation overhead
✅ Clear Instructions: Bot comments guide users through the testing process
✅ Clean Repository: Artifacts are temporary and don't clutter the codebase

This solution provides a clean, maintainable way to deploy PR changes for testing using only GitHub's native infrastructure, with no external hosting services or API keys required.

Fixes #4.

💬 Share your feedback on Copilot coding agent for the chance to win a $200 gift card! Click here to start the survey.

Co-authored-by: Quist <1188754+Quist@users.noreply.github.com>

Quist

Dropp testedelen, vi ønsker å rendyrke dette som en deployjobb.

Quist · 2025-09-18T06:08:42Z

.github/workflows/pr-validation.yml

+        with:
+          ref: ${{ github.event.pull_request.head.sha }}
+
+      - name: Validate HTML


Dropp all validering i denne pull request.

All validation removed from the workflow. Now it's a clean deployment-only process that builds and uploads PR previews. Commit: 5ff5c1a

Quist · 2025-09-18T06:48:08Z

Dropp valideringsdelen, @copilot

Co-authored-by: Quist <1188754+Quist@users.noreply.github.com>

Copilot · 2025-09-18T06:50:44Z

Dropp testedelen, vi ønsker å rendyrke dette som en deployjobb.

Removed all validation steps and streamlined the workflow to be a pure deployment job as requested. The workflow now only handles building and deploying PR previews without any testing/validation components. Commit: 5ff5c1a

Copilot · 2025-09-18T06:50:44Z

Dropp valideringsdelen, @copilot

Validation part completely removed. The workflow is now focused solely on deployment functionality. Commit: 5ff5c1a

Copilot

Pull Request Overview

Implementering av automatisert PR forhåndsvisningssystem for porteføljenettstedet. Systemet oppretter nedlastbare forhåndsvisninger av endringer i pull requests uten validering, fokusert på ren deployment-funksjonalitet.

Opprettet GitHub Actions workflow for automatisk PR-deployment
Lagt til omfattende dokumentasjon i README.md
Oppdatert CLAUDE.md med gjeldende deployment-informasjon

Reviewed Changes

Copilot reviewed 3 out of 4 changed files in this pull request and generated 3 comments.

File	Description
README.md	Ny omfattende dokumentasjon for prosjektet med PR forhåndsvisningssystem
CLAUDE.md	Oppdaterte deployment-instruksjoner og designsystem-detaljer
.github/workflows/pr-validation.yml	Ny GitHub Actions workflow for PR forhåndsvisnings-deployment

Copilot · 2025-09-18T06:51:50Z

CLAUDE.md

+**Production:** The site is hosted via GitHub Pages (quist.github.io). Changes pushed to the master branch are automatically deployed.
+
+**PR Previews:** Pull requests automatically trigger a preview build workflow:
+- HTML/CSS validation 


Dokumentasjonen nevner 'HTML/CSS validation' men ifølge PR-beskrivelsen ble alle valideringstrinn fjernet fra workflowen. Denne linjen bør fjernes for å reflektere den faktiske funksjonaliteten.

Suggested change

- HTML/CSS validation

Copilot · 2025-09-18T06:51:50Z

.github/workflows/pr-validation.yml

+          cp styles.css preview-build/
+
+          # Add a preview indicator to the build
+          sed -i '/<title>/a\<!-- PR Preview Build #${{ github.event.pull_request.number }} -->' preview-build/index.html


Sed-kommandoen kan feile hvis <title>-taggen ikke finnes eller har uventet formatering. Dette kan føre til at workflow feiler. Vurder å bruke en mer robust tilnærming eller legg til feilhåndtering.

Suggested change

sed -i '/<title>/a\' preview-build/index.html

if grep -qi '<title>' preview-build/index.html; then

sed -i '/<title>/I a ' preview-build/index.html

else

echo "Warning: <title> tag not found in preview-build/index.html. Skipping preview indicator insertion."

fi

Copilot · 2025-09-18T06:51:50Z

.github/workflows/pr-validation.yml

+            > **How to test this PR:**
+            > 1. Click the artifact link above and download the preview
+            > 2. Extract the ZIP file and open \`index.html\` in your browser
+            > 3. Compare with live site: https://${{ github.repository_owner }}.github.io


URL-en bruker github.repository_owner som kan gi feil adresse. Basert på konteksten bør dette være den spesifikke GitHub Pages URL-en https://quist.github.io for å sikre korrekt sammenligning.

Suggested change

> 3. Compare with live site: https://${{ github.repository_owner }}.github.io

> 3. Compare with live site: https://quist.github.io

Rebase on main, please @copilot

github-actions · 2025-09-21T21:19:14Z

🚀 PR Preview Deployed!

📦 Download Preview: Preview Build Artifact

How to test this PR:

Click the artifact link above and download the preview

Extract the ZIP file and open index.html in your browser

Compare with live site: https://Quist.github.io

🔄 This preview updates automatically with new commits.

Deployed: 2025-09-21T21:19:13.806Z

Initial plan

0929155

Copilot AI assigned Copilot and Quist Sep 17, 2025

Copilot started work on behalf of Quist September 17, 2025 22:00 View session

Copilot AI and others added 2 commits September 17, 2025 22:07

Implement PR branch deployment with GitHub Actions workflow

35c8668

Co-authored-by: Quist <1188754+Quist@users.noreply.github.com>

Add .gitignore and update documentation for PR preview system

dc87a47

Co-authored-by: Quist <1188754+Quist@users.noreply.github.com>

Copilot AI changed the title ~~[WIP] no deployment out branches~~ Implement automated PR preview deployment system Sep 17, 2025

Copilot AI requested a review from Quist September 17, 2025 22:09

Copilot finished work on behalf of Quist September 17, 2025 22:09

Quist requested changes Sep 18, 2025

View reviewed changes

Quist reviewed Sep 18, 2025

View reviewed changes

Copilot started work on behalf of Quist September 18, 2025 06:48 View session

Remove validation steps and streamline as pure deployment workflow

5ff5c1a

Co-authored-by: Quist <1188754+Quist@users.noreply.github.com>

Quist marked this pull request as ready for review September 18, 2025 06:50

Copilot AI review requested due to automatic review settings September 18, 2025 06:50

Copilot AI requested a review from Quist September 18, 2025 06:51

Copilot stopped work on behalf of Quist due to an error September 18, 2025 06:51
Copilot has encountered an error. See logs for additional details.

Copilot AI reviewed Sep 18, 2025

View reviewed changes

Quist approved these changes Sep 18, 2025

View reviewed changes

Copilot started work on behalf of Quist September 18, 2025 21:20 View session

Copilot AI requested a review from Quist September 18, 2025 21:21

Copilot finished work on behalf of Quist September 18, 2025 21:21

Merge branch 'master' into copilot/fix-4

2e2684c

Quist merged commit 3d85f1c into master Sep 21, 2025
1 check passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Implement automated PR preview deployment system #5

Implement automated PR preview deployment system #5

Uh oh!

Copilot AI commented Sep 17, 2025 •

edited

Loading

Uh oh!

Quist left a comment

Uh oh!

Quist Sep 18, 2025

Uh oh!

Copilot AI Sep 18, 2025

Uh oh!

Quist commented Sep 18, 2025

Uh oh!

Copilot AI commented Sep 18, 2025

Uh oh!

Copilot AI commented Sep 18, 2025

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI Sep 18, 2025

Uh oh!

Copilot AI Sep 18, 2025

Uh oh!

Copilot AI Sep 18, 2025

Uh oh!

Quist Sep 18, 2025

Uh oh!

github-actions bot commented Sep 21, 2025

Uh oh!

Uh oh!

Uh oh!

-          sed -i '/<title>/a\<!-- PR Preview Build #${{ github.event.pull_request.number }} -->' preview-build/index.html
+          if grep -qi '<title>' preview-build/index.html; then
+            sed -i '/<title>/I a <!-- PR Preview Build #${{ github.event.pull_request.number }} -->' preview-build/index.html
+          else
+            echo "Warning: <title> tag not found in preview-build/index.html. Skipping preview indicator insertion."
+          fi

	> 3. Compare with live site: https://${{ github.repository_owner }}.github.io
	> 3. Compare with live site: https://quist.github.io

Implement automated PR preview deployment system #5

Implement automated PR preview deployment system #5

Uh oh!

Conversation

Copilot AI commented Sep 17, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What's New

How It Works

Benefits

Uh oh!

Quist left a comment

Choose a reason for hiding this comment

Uh oh!

Quist Sep 18, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Sep 18, 2025

Choose a reason for hiding this comment

Uh oh!

Quist commented Sep 18, 2025

Uh oh!

Copilot AI commented Sep 18, 2025

Uh oh!

Copilot AI commented Sep 18, 2025

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Copilot AI Sep 18, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Sep 18, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Sep 18, 2025

Choose a reason for hiding this comment

Uh oh!

Quist Sep 18, 2025

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Sep 21, 2025

Uh oh!

Uh oh!

Uh oh!

Copilot AI commented Sep 17, 2025 •

edited

Loading