Skip to content

fix(build): replace deprecated SCSS @import with @use statements #1108

fix(build): replace deprecated SCSS @import with @use statements

fix(build): replace deprecated SCSS @import with @use statements #1108

name: on-pull-request-or-push
on:
workflow_dispatch:
pull_request:
push:
branches:
- development
env:
NX_BRANCH: ${{ github.event.number }}
NX_RUN_GROUP: ${{ github.run_id }}
NX_CLOUD_AUTH_TOKEN: ${{ secrets.NX_CLOUD_AUTH_TOKEN }}
MOZ_HEALESS: 1
SAUCE_USERNAME_PR: valorkinpr
SAUCE_ACCESS_KEY_PR: e0a97bd3-4b74-4408-89bf-cce1b44a8bf1
PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: 0
CACHE_NODE_MODULES_PATH: |
~/.npm
node_modules
CACHE_DIST_PATH: dist
jobs:
# one run
one_run:
runs-on: ubuntu-22.04
steps:
- name: Cancel Previous Runs
uses: styfle/[email protected]
with:
access_token: ${{ secrets.GITHUB_TOKEN }}
# install dependencies
install:
runs-on: ubuntu-22.04
needs: one_run
steps:
- uses: actions/checkout@v4
- uses: actions/cache@v4
id: cache
with:
path: ${{ env.CACHE_NODE_MODULES_PATH }}
key: node_modules-${{ hashFiles('**/package-lock.json') }}
- run: npm ci
if: steps.cache.outputs.cache-hit != 'true'
# build ngx-bootstrap
build:
needs: install
runs-on: ubuntu-22.04
steps:
- uses: actions/checkout@v4
- uses: actions/cache@v4
with:
path: ${{ env.CACHE_NODE_MODULES_PATH }}
key: node_modules-${{ hashFiles('**/package-lock.json') }}
- uses: actions/cache@v4
with:
path: ${{ env.CACHE_DIST_PATH }}
key: dist-${{ github.run_id }}
- run: |
npx nx build ngx-bootstrap --configuration=production
npx nx prerender --configuration=production
# run unit tests
unit_tests_with_coverage:
runs-on: ubuntu-22.04
needs: build
steps:
- uses: actions/checkout@v4
- uses: actions/cache@v4
with:
path: ${{ env.CACHE_NODE_MODULES_PATH }}
key: node_modules-${{ hashFiles('**/package-lock.json') }}
- uses: actions/cache@v4
with:
path: ${{ env.CACHE_DIST_PATH }}
key: dist-${{ github.run_id }}
# - run: npm test -- --runner=cloud --codeCoverage
- run: npm test -- --codeCoverage
- run: npx codecov ./coverage/
continue-on-error: true
# run linting
linting:
runs-on: ubuntu-22.04
needs: install
steps:
- uses: actions/checkout@v4
- uses: actions/cache@v4
with:
path: ${{ env.CACHE_NODE_MODULES_PATH }}
key: node_modules-${{ hashFiles('**/package-lock.json') }}
# - run: npm run lint -- --runner=cloud
- run: npm run lint --
# deploy to cloudflare pages
cloudflare_deploy:
runs-on: ubuntu-22.04
needs: build
outputs:
deployment_url: ${{ steps.cloudflare_deploy.outputs.deployment-url }}
preview_url: ${{ steps.extract_preview_url.outputs.preview_url }}
steps:
- uses: actions/checkout@v4
# Wait for Cloudflare deployment with intelligent polling
- name: Wait for Cloudflare deployment
id: wait_deployment
run: |
echo "Waiting for Cloudflare deployment to complete..."
MAX_ATTEMPTS=30
ATTEMPT=0
BRANCH_NAME=${GITHUB_HEAD_REF:-${GITHUB_REF#refs/heads/}}
while [ $ATTEMPT -lt $MAX_ATTEMPTS ]; do
echo "Attempt $((ATTEMPT + 1))/$MAX_ATTEMPTS: Checking deployment status..."
# Get deployments for the project
RESPONSE=$(curl -s -H "Authorization: Bearer ${{ secrets.CLOUDFLARE_API_TOKEN }}" \
"https://api.cloudflare.com/client/v4/accounts/${{ secrets.CLOUDFLARE_ACCOUNT_ID }}/pages/projects/ngx-bootstrap/deployments")
# Check if we have a successful deployment for this branch/commit
DEPLOYMENT_URL=$(echo "$RESPONSE" | jq -r --arg branch "$BRANCH_NAME" --arg commit "$GITHUB_SHA" \
'.result[] | select(.deployment_trigger.metadata.branch == $branch and .deployment_trigger.metadata.commit_hash == $commit and .latest_stage.status == "success") | .url' | head -1)
if [ "$DEPLOYMENT_URL" != "null" ] && [ -n "$DEPLOYMENT_URL" ]; then
echo "✅ Deployment ready! URL: $DEPLOYMENT_URL"
echo "deployment_url=$DEPLOYMENT_URL" >> $GITHUB_OUTPUT
exit 0
fi
# Check if deployment failed
FAILED=$(echo "$RESPONSE" | jq -r --arg branch "$BRANCH_NAME" --arg commit "$GITHUB_SHA" \
'.result[] | select(.deployment_trigger.metadata.branch == $branch and .deployment_trigger.metadata.commit_hash == $commit and .latest_stage.status == "failure") | .id' | head -1)
if [ "$FAILED" != "null" ] && [ -n "$FAILED" ]; then
echo "❌ Deployment failed!"
exit 1
fi
echo "⏳ Deployment still in progress, waiting 20 seconds..."
sleep 20
ATTEMPT=$((ATTEMPT + 1))
done
echo "❌ Timeout waiting for deployment"
exit 1
- name: Set preview URL output
id: get_preview_url
run: |
if [ -n "${{ steps.cloudflare_deploy.outputs.deployment-url }}" ]; then
# Extract just the hostname from the full URL
PREVIEW_URL=$(echo "${{ steps.cloudflare_deploy.outputs.deployment-url }}" | sed 's|https://||')
echo "preview_url=$PREVIEW_URL" >> $GITHUB_OUTPUT
echo "Preview URL: https://$PREVIEW_URL"
else
echo "No preview URL available"
fi
# run playwright
e2e_smoke:
name: e2e smoke (${{ matrix.shard }}/${{ strategy.job-total }})
runs-on: ubuntu-22.04
needs: [install, build, cloudflare_deploy]
strategy:
fail-fast: false
matrix:
shard: [1, 2]
steps:
- uses: actions/checkout@v4
- uses: actions/cache@v4
with:
path: ${{ env.CACHE_NODE_MODULES_PATH }}
key: node_modules-${{ hashFiles('**/package-lock.json') }}
- uses: actions/cache@v4
with:
path: ${{ env.CACHE_DIST_PATH }}
key: dist-${{ github.run_id }}
- name: Install playwright browsers
run: |
PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD=1 npx playwright install
npx playwright install-deps chromium
- name: smoke e2e on cloudflare pages
if: ${{ needs.cloudflare_deploy.outputs.preview_url }}
run: PLAYWRIGHT_TEST_BASE_URL="https://${{ needs.cloudflare_deploy.outputs.preview_url }}" npx nx run ngx-bootstrap-docs-e2e:e2e --pwProject=chromium-integration --skipServe --shard=${{ matrix.shard }}/${{ strategy.job-total }}
- name: smoke e2e local
if: ${{ !needs.cloudflare_deploy.outputs.preview_url }}
run: npx nx run ngx-bootstrap-docs-e2e:e2e --pwProject=chromium-integration --shard=${{ matrix.shard }}/${{ strategy.job-total }}
- uses: actions/upload-artifact@v4
if: always()
with:
name: playwright-report-smoke-${{ matrix.shard }}_${{ strategy.job-total }}
path: apps/ngx-bootstrap-docs-e2e/playwright-report
retention-days: 14
e2e_full:
name: e2e full
runs-on: ubuntu-22.04
needs: [e2e_smoke, cloudflare_deploy]
strategy:
fail-fast: false
matrix:
shard: [1, 2]
steps:
- uses: actions/checkout@v4
- uses: actions/cache@v4
with:
path: ${{ env.CACHE_NODE_MODULES_PATH }}
key: node_modules-${{ hashFiles('**/package-lock.json') }}
- uses: actions/cache@v4
with:
path: ${{ env.CACHE_DIST_PATH }}
key: dist-${{ github.run_id }}
- name: Install playwright browsers
run: |
PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD=1 npx playwright install
npx playwright install-deps chromium
- name: full e2e on cloudflare pages
if: ${{ needs.cloudflare_deploy.outputs.preview_url }}
continue-on-error: true
run: npx nx run ngx-bootstrap-docs-e2e:e2e --pwProject=chromium-full --baseUrl=https://${{ needs.cloudflare_deploy.outputs.preview_url }} --skipServe --shard=${{ matrix.shard }}/${{ strategy.job-total }}
- name: full e2e on local
if: ${{ !needs.cloudflare_deploy.outputs.preview_url }}
continue-on-error: true
run: npx nx run ngx-bootstrap-docs-e2e:e2e --pwProject=chromium-full --shard=${{ matrix.shard }}/${{ strategy.job-total }}
- uses: actions/upload-artifact@v4
if: always()
with:
name: playwright-report-full-${{ matrix.shard }}_${{ strategy.job-total }}
path: apps/ngx-bootstrap-docs-e2e/playwright-report
retention-days: 14