canva-ci-integration
Configure Canva CI/CD integration with GitHub Actions and testing. Use when setting up automated testing, configuring CI pipelines, or integrating Canva tests into your build process. Trigger with phrases like "canva CI", "canva GitHub Actions", "canva automated tests", "CI canva".
claude-code
Allowed Tools
ReadWriteEditBash(gh:*)
Provided by Plugin
canva-pack
Claude Code skill pack for Canva (30 skills)
Installation
This skill is included in the canva-pack plugin:
/plugin install canva-pack@claude-code-plugins-plus
Click to copy
Instructions
Canva CI Integration
Overview
Set up CI/CD pipelines for Canva integrations with automated testing.
Prerequisites
- GitHub repository with Actions enabled
- Canva test API key
- npm/pnpm project configured
Instructions
Step 1: Create GitHub Actions Workflow
Create .github/workflows/canva-integration.yml:
name: Canva Integration Tests
on:
push:
branches: [main]
pull_request:
branches: [main]
env:
CANVA_API_KEY: ${{ secrets.CANVA_API_KEY }}
jobs:
test:
runs-on: ubuntu-latest
env:
CANVA_API_KEY: ${{ secrets.CANVA_API_KEY }}
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version: '20'
cache: 'npm'
- run: npm ci
- run: npm test -- --coverage
- run: npm run test:integration
Step 2: Configure Secrets
gh secret set CANVA_API_KEY --body "sk_test_***"
Step 3: Add Integration Tests
describe('Canva Integration', () => {
it.skipIf(!process.env.CANVA_API_KEY)('should connect', async () => {
const client = getCanvaClient();
const result = await client.healthCheck();
expect(result.status).toBe('ok');
});
});
Output
- Automated test pipeline
- PR checks configured
- Coverage reports uploaded
- Release workflow ready
Error Handling
| Issue | Cause | Solution |
|---|---|---|
| Secret not found | Missing configuration | Add secret via gh secret set |
| Tests timeout | Network issues | Increase timeout or mock |
| Auth failures | Invalid key | Check secret value |
Examples
Release Workflow
on:
push:
tags: ['v*']
jobs:
release:
runs-on: ubuntu-latest
env:
CANVA_API_KEY: ${{ secrets.CANVA_API_KEY_PROD }}
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version: '20'
- run: npm ci
- name: Verify Canva production readiness
run: npm run test:integration
- run: npm run build
- run: npm publish
Branch Protection
required_status_checks:
- "test"
- "canva-integration"
Resources
Next Steps
For deployment patterns, see canva-deploy-integration.