Azure Deployment Timeout: "Post Run actions/checkout@v3" Step Hangs Indefinitely

Question

I'm deploying an Angular app to Azure Static Web Apps using GitHub Actions. The build process completes without errors, but the workflow hangs on the "Post Run actions/checkout@v3" step until it eventually times out and the deployment is aborted. This issue is preventing my app from being deployed successfully.

Below is a snapshot of my GitHub workflow file build process:

Azure Build & Deploy Workflow-1

Azure Build & Deploy Workflow-2

Answer 1

The error is solved now, the problem was neither with the app nor the Azure Static Apps configuration, rather it was due to autostart functionality of the custom-webpack-bundle analyser added to the app which prompted opening the browser during the production build, which Azure couldn't do; hence it got hang & the process ran indefinitely.

New webpack.config.js code:

const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const plugins = [];

if (process.env.ANALYZE) {
  plugins.push(new BundleAnalyzerPlugin());
}

module.exports = { plugins };

Answer 2

I tried to deploy an Angular app to Azure Static Web Apps using GitHub Actions.

Create a GitHub repository.

This is my .yml file

name: Azure Static Web Apps CI/CD
on:
  push:
    branches:
      - main
  pull_request:
    types: [opened, synchronize, reopened, closed]
    branches:
      - main
jobs:
  build_and_deploy_job:
    if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
    runs-on: ubuntu-latest
    name: Build and Deploy Job
    steps:
      - uses: actions/checkout@v3
        with:
          submodules: true
          lfs: false
      - name: Build And Deploy
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_ASHY_DESERT_SECRET_KEY }}
          repo_token: ${{ secrets.GITHUB_TOKEN }}
          action: "upload" 
          app_location: "/" 
          api_location: "" 
          output_location: "dist/angular-basic" 
  close_pull_request_job:
    if: github.event_name == 'pull_request' && github.event.action == 'closed'
    runs-on: ubuntu-latest
    name: Close Pull Request Job
    steps:
      - name: Close Pull Request
        id: closepullrequest
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_ASHY_DESERT_SECRET_KEY }}
          action: "close"

After creating the repository in your GitHub account, use the command below to copy the project to your local machine.

git clone https://github.com/<YOUR_GITHUB_ACCOUNT_NAME>static-web-app.git

Then, open Visual Studio Code and go to File > Open Folder to open the copied repository in the editor.

Install Azure static webapps extension:

1. Select View > Extension.
2. In the Search Extensions in Marketplace, type Azure Static Web Apps.
3. Select Install for Azure Static Web Apps.
4. The extension installs into Visual Studio Code.

Create a Static web app

In Visual Studio code, select the Azure logo in the taskbar to open the Azure window.

1.Once the app is created, a confirmation notification is shown in Visual Studio Code.

2. Once the deployment is complete, you can navigate directly to your website.

4. To view the website in the browser, right-click the project in the Static Web Apps extension and select Browse Site.

Here's the Output: