Add publishing oci images workflow

Author: andreiltd

.github/workflows/publish.yml

@@ -0,0 +1,99 @@
+name: Build and publish a Wasm Component to GitHub Artifacts
+
+on:
+  push:
+    tags:
+      - v*
+  workflow_dispatch:
+
+env:
+  IMAGE_NAME: ${{ github.repository }}
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    permissions:
+      id-token: write
+      packages: write
+      contents: read
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '23'
+          cache: 'npm'
+
+      - name: Set up just
+      - uses: extractions/setup-just@v3
+
+      - name: Extract package information
+        id: pkg
+        run: |
+          echo "COMPONENT_NAME=$(npm pkg get name | tr -d '"')" >> $GITHUB_ENV
+          echo "COMPONENT_DESCRIPTION=$(npm pkg get description | tr -d '"')" >> $GITHUB_ENV
+          echo "COMPONENT_SOURCE=$(npm pkg get repository.url | tr -d '"')" >> $GITHUB_ENV
+          echo "COMPONENT_HOMEPAGE=$(npm pkg get homepage | tr -d '"')" >> $GITHUB_ENV
+          echo "COMPONENT_LICENSES=$(npm pkg get license | tr -d '"')" >> $GITHUB_ENV
+
+      - name: Docker meta
+        id: meta
+        uses: docker/metadata-action@v5
+        with:
+          images: ghcr.io/${{ github.actor }}/${{ env.COMPONENT_NAME }}
+          tags: |
+            type=semver,pattern={{version}}
+
+      - name: Login to GitHub Container Registry
+        uses: docker/login-action@v3
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Install cosign
+        if: github.event_name != 'workflow_dispatch'
+        uses: sigstore/[email protected]
+
+      - name: Build the component
+        run: just build
+
+      - name: Normalize COMPONENT_NAME and Append .wasm
+        run: echo "COMPONENT_NAME_UNDERSCORED=${COMPONENT_NAME//-/_}.wasm" >> $GITHUB_ENV
+
+      - name: Publish `:<version>` to GitHub Container Registry
+        if: github.event_name != 'workflow_dispatch'
+        id: publish_versioned
+        uses: bytecodealliance/wkg-github-action@v5
+        with:
+          file: dist/${{ env.COMPONENT_NAME_UNDERSCORED }}
+          oci-reference-without-tag: ghcr.io/${{ env.IMAGE_NAME }}/${{ env.COMPONENT_NAME }}
+          version: ${{ fromJSON(steps.meta.outputs.json).labels['org.opencontainers.image.version'] }}
+          description: ${{ env.COMPONENT_DESCRIPTION }}
+          source: ${{ env.COMPONENT_SOURCE }}
+          homepage: ${{ env.COMPONENT_HOMEPAGE }}
+          licenses: ${{ env.COMPONENT_LICENSES }}
+
+      - name: Sign the versioned wasm component
+        if: github.event_name != 'workflow_dispatch'
+        run: cosign sign --yes ghcr.io/${{ env.IMAGE_NAME }}/${{ env.COMPONENT_NAME }}@${{ steps.publish_versioned.outputs.digest }}
+
+      - name: Publish `:latest` release to GitHub Container Registry
+        if: github.event_name != 'workflow_dispatch'
+        id: publish_latest
+        uses: bytecodealliance/wkg-github-action@v5
+        with:
+          file: dist/${{ env.COMPONENT_NAME_UNDERSCORED }}
+          oci-reference-without-tag: ghcr.io/${{ env.IMAGE_NAME }}/${{ env.COMPONENT_NAME }}
+          version: latest
+          description: ${{ env.COMPONENT_DESCRIPTION }}
+          source: ${{ env.COMPONENT_SOURCE }}
+          homepage: ${{ env.COMPONENT_HOMEPAGE }}
+          licenses: ${{ env.COMPONENT_LICENSES }}
+
+      - name: Sign the latest wasm component
+        if: github.event_name != 'workflow_dispatch'
+        run: cosign sign --yes ghcr.io/${{ env.IMAGE_NAME }}/${{ env.COMPONENT_NAME }}@${{ steps.publish_latest.outputs.digest }}

.github/workflows/test.yml

@@ -17,14 +17,15 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: '23'
-      - name: Install dependencies
-        run: npm install
+          cache: 'npm'
+      - name: Set up just
+      - uses: extractions/setup-just@v3
       - name: Install Wasmtime
         run: |
           curl https://wasmtime.dev/install.sh -sSf | bash
           echo "$HOME/.wasmtime/bin" >> $GITHUB_PATH
       - name: Build the project
-        run: npm run build
+        run: just build
       - name: Run tests
         run: npm test
       - name: Run format checks

README.md

@@ -53,7 +53,7 @@ Alternatively, run:
 ```bash
 $ npm install
 $ npm run build
-$ wasmtime serve -S common dist/server.component.wasm
+$ wasmtime serve -S common dist/sample-wasi-http-js.wasm
 ```
 
 ## See Also

justfile

@@ -1,3 +1,5 @@
+package-name := trim_start_match(trim_end_match(`npm pkg get name`, "\""), "\"")
+
 alias b := build
 
 # List all recipes
@@ -27,4 +29,4 @@ test: build
 
 serve: build
     @echo 'Serving guest...'
-    wasmtime serve -S common dist/server.component.wasm
+    wasmtime serve -S common dist/{{package-name}}.wasm

package.json

@@ -2,12 +2,17 @@
   "name": "sample-wasi-http-js",
   "version": "0.1.0",
   "description": "Sample project demonstratingu JS project targeting WASI http",
+  "homepage": "https://github.com/bytecodealliance/sample-wasi-http-js",
   "license": "(Apache-2.0 WITH LLVM-exception)",
   "author": "Tomasz Andrzejak",
   "type": "module",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/bytecodealliance/sample-wasi-http-js"
+  },
   "scripts": {
     "bundle": "rollup -c",
-    "build": "npm run bundle && componentize-js  --aot --wit wit -o dist/server.component.wasm dist/bundle.js",
+    "build": "npm run bundle && componentize-js --aot --wit wit -o dist/$npm_package_name.wasm dist/bundle.js",
     "format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,css,md}\"",
     "lint": "eslint src/**/*.js",
     "test": "vitest --run"