ci: test docker builds for PRs and pushes on master

[CalvinTPark]

Related Issue

fix #116

Details

Adds GitHub CI workflow to test docker image builds.

Helps ensure repo changes build and are tested against a sample SPFx project:

• Builds docker image on:
  • linux/amd64
  • linux/arm64/v8
• Creates and builds a sample SPFx react webpart

See example runs:

• CalvinTPark/docker-spfx workflow (20881679928)-1
  
• CalvinTPark/docker-spfx workflow (20881679928)-2
  
  • Build with docker buildkit cache:
  • 

GitHub Docker Report example (build) [Click to open]

Docker Build summary

For a detailed look at the build, download the following build record archive and import it into Docker Desktop's Builds view.
Build records include details such as timing, dependencies, results, logs, traces, and other information about a build. Learn more

⬇️ CalvinTPark~docker-spfx~N682B3.dockerbuild (36.43 KB - includes 1 build record)

Find this useful? Let us know

ID	Name	Status	Cached	Duration
N682B3	docker-spfx (default)	✅ completed	50%	2s

Build inputs

workdir: .
set:
  - '*.cache-from=type=gha,scope=dockerspfx'
  - '*.cache-to=type=gha,scope=dockerspfx,mode=max'
targets:
  - default

Bake definition

{
  "group": {
    "default": {
      "targets": [
        "default"
      ]
    }
  },
  "target": {
    "default": {
      "context": ".",
      "dockerfile": "Dockerfile",
      "tags": [
        "docker.io/m365pnp/spfx:latest",
        "docker.io/m365pnp/spfx:online"
      ],
      "cache-from": [
        {
          "scope": "dockerspfx",
          "type": "gha"
        }
      ],
      "cache-to": [
        {
          "mode": "max",
          "scope": "dockerspfx",
          "type": "gha"
        }
      ],
      "target": "default",
      "platforms": [
        "linux/amd64",
        "linux/arm64/v8"
      ]
    }
  }
}

---

GitHub Docker Report example (test) [Click to open]

Docker Build summary

For a detailed look at the build, download the following build record archive and import it into Docker Desktop's Builds view.
Build records include details such as timing, dependencies, results, logs, traces, and other information about a build. Learn more

⬇️ CalvinTPark~docker-spfx~0RMDXK.dockerbuild (74.39 KB - includes 1 build record)

Find this useful? Let us know

ID	Name	Status	Cached	Duration
0RMDXK	docker-spfx	✅ completed	27%	6m21s

Build inputs

workdir: .
set:
  - '*.cache-from=type=gha,scope=dockerspfx'
  - '*.cache-to=type=gha,scope=dockerspfx,mode=max'
targets:
  - test

Bake definition

{
  "group": {
    "default": {
      "targets": [
        "test"
      ]
    }
  },
  "target": {
    "test": {
      "context": ".",
      "dockerfile": "Dockerfile",
      "cache-from": [
        {
          "scope": "dockerspfx",
          "type": "gha"
        }
      ],
      "cache-to": [
        {
          "mode": "max",
          "scope": "dockerspfx",
          "type": "gha"
        }
      ],
      "platforms": [
        "linux/amd64",
        "linux/arm64/v8"
      ],
      "output": [
        {
          "type": "cacheonly"
        }
      ]
    }
  }
}

---

Potential task: fix the PNPM cache across test runs

[Copilot]

Pull request overview

This PR adds continuous integration testing for Docker image builds on PRs and pushes to the master branch. The workflow validates that the Docker image can be successfully built on both linux/amd64 and linux/arm64/v8 platforms and can create and build a sample SPFx React webpart project.

Changes:

• Adds new CI workflow that builds the Docker image and tests it by creating a sample SPFx webpart
• Converts Dockerfile to multi-stage build with test stages for automated validation
• Adds docker-bake.hcl configuration for managing build targets and platforms

Reviewed changes

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

Show a summary per file

File	Description
.github/workflows/ci.yml	New CI workflow that builds and tests the Docker image on PRs and master branch pushes
docker-bake.hcl	New Docker Bake configuration defining build targets for default image and test scenarios
Dockerfile	Refactored to multi-stage build with test stages (test-base, test-webpart) for CI validation
.github/workflows/build-and-push.yaml	Updated to specify the 'default' build target for consistency with new multi-stage structure
.gitattributes	Enforces LF line endings for consistent cross-platform behavior
.dockerignore	Excludes unnecessary files from Docker build context (.github, assets, OS-specific files)
README.md	Adds documentation section with examples for building and running custom images

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The ci.yml workflow uses actions/checkout@v6 while the existing build-and-push.yaml workflow uses actions/checkout@v4. These should use the same version for consistency across the repository's CI workflows.