Add capacitor action #4713
Add capacitor action #4713
Conversation
WalkthroughAdds Capacitor Android build steps to Changes
Sequence DiagramsequenceDiagram
participant GH as GitHub Actions
participant Build as yarn build
participant Npm as npm/yarn install
participant Gen as capacitor.config.generator.mjs
participant Cap as Capacitor CLI (npx cap)
participant Action as action-capacitor-android@v1
participant Art as Artifact Storage
GH->>Build: yarn build
Build-->>GH: web assets (dist)
rect rgb(230,245,255)
Note over GH,Npm: New Android Capacitor flow
GH->>Npm: install `@capacitor/core`, `@capacitor/cli`, `@capacitor/android`
Npm-->>GH: deps installed
GH->>Gen: node capacitor.config.generator.mjs
Gen-->>GH: capacitor config generated
GH->>Cap: npx cap sync android
Cap-->>GH: android/ project prepared
GH->>Action: run Narottam04/action-capacitor-android@v1 (build & sign using secrets)
Action-->>GH: signed APK produced
end
GH->>Art: upload signed APK artifact (betaflight-configurator-apk)
Art-->>GH: APK stored
GH->>Art: upload dist artifact
Art-->>GH: dist stored
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes
Pre-merge checks and finishing touches❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (1 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 4
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
.github/workflows/deploy.yml(1 hunks)
🧰 Additional context used
🪛 actionlint (1.7.8)
.github/workflows/deploy.yml
69-69: the runner of "actions/upload-artifact@v3" action is too old to run on GitHub Actions. update the action's version to fix this issue
(action)
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
.github/workflows/deploy.yml (1)
40-42: Remove the redundantnpm installstep; Capacitor packages are already inpackage.json.All three Capacitor packages (
@capacitor/core,@capacitor/cli,@capacitor/android) are already declared inpackage.jsonand will be installed during theyarn installstep (line 37). The inlinenpm installon lines 40-42 is redundant and introduces unnecessary npm/yarn mixing that can cause lock file conflicts.Remove this step:
- - name: Install Capacitor Dependencies - run: | - npm install @capacitor/core @capacitor/cli @capacitor/android - - name: Sync Web Assets to Android Project run: npx cap sync android
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
.github/workflows/deploy.yml(1 hunks)
🔇 Additional comments (1)
.github/workflows/deploy.yml (1)
44-56: LGTM on Capacitor setup sequence and Android SDK configuration.The JDK setup (Java 17, temurin), Android SDK filter (including build-tools;34.0.0), and Capacitor sync steps are well-configured. The
npx cap sync androidcommand is correct for updating an existing Capacitor Android project without re-initializing.
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
.github/workflows/deploy.yml(1 hunks)
🧰 Additional context used
🪛 actionlint (1.7.8)
.github/workflows/deploy.yml
44-44: specifying action "action-capacitor-android@v1" in invalid format because owner is missing. available formats are "{owner}/{repo}@{ref}" or "{owner}/{repo}/{path}@{ref}"
(action)
🔇 Additional comments (1)
.github/workflows/deploy.yml (1)
43-55: Setup looks solid after fixing the action reference.The Capacitor build, signing, and artifact upload steps follow good practices. The action-capacitor-android generates signed APK files for testing, and the APK output path aligns with standard Gradle release build structure. The artifact upload uses @v4 consistently with the rest of the workflow.
|
@coderabbitai one more question - do we need changes in vite.config.js to how the Android app consumes the PWA |
|
Tip For best results, initiate chat on the files or code changes. 🧩 Analysis chain🏁 Script executed: Length of output: 6056 🏁 Script executed: Length of output: 227 @haslinghuis, based on my analysis of your configuration, the Recommended Changes:1. Base Path for Assets (Important)Add export default defineConfig({
base: './', // Add this for Capacitor
define: {
__APP_VERSION__: JSON.stringify(pkg.version),
// ...
},
// ... rest of config
});Without this, Capacitor may have issues resolving assets since they'll use absolute paths from root ( 2. PWA Plugin Consideration (Optional)Since Capacitor provides its own native app shell, you might want to conditionally disable or adjust the PWA plugin for Capacitor builds. The service worker and PWA manifest are primarily for web deployment: const isCapacitorBuild = process.env.CAPACITOR_BUILD === 'true';
// In plugins array:
!isCapacitorBuild && VitePWA({
// ... existing config
})Then set the env var in your workflow: 3. Multi-page App Entry PointsYour current setup has two HTML entry points ( Current Config Status:✅ The |
|
@coderabbitai - to verify used https://github.com/betaflight/betaflight-configurator/pull/4706/files#diff-58e6f63d87181b1c6a8cb6e5f1691df04aa32854456efcd52ca71c8541375d26R123 while developing locally - having yarn dev to provide the web part. |
|
Tip For best results, initiate chat on the files or code changes. 🧩 Analysis chain🏁 Script executed: Length of output: 9543 🏁 Script executed: Length of output: 70 🏁 Script executed: Length of output: 1956 🏁 Script executed: Length of output: 1305 🏁 Script executed: Length of output: 4141 @haslinghuis, perfect! That clarifies the development workflow. Looking at PR #4706, I see the critical change at line 123 of vite.config.js: server: {
port: 8000,
strictPort: true,
host: "0.0.0.0", // Listen on all network interfaces for Android device access
},This enables the standard Capacitor live-reload dev workflow where the Android app loads content from your dev server over the network. Current StatusFor Development (with
For Production Builds:
Recommended Changes to vite.config.jsexport default defineConfig({
base: './', // Important for production APK asset paths
define: {
__APP_VERSION__: JSON.stringify(pkg.version),
// ...
},
// ... rest of config
server: {
port: 8000,
strictPort: true,
host: "0.0.0.0", // From PR #4706 - enables Android dev workflow
},The 🧠 Learnings used |
|
@coderabbitai full review |
✅ Actions performedFull review triggered. |
| - name: Generate Capacitor Config | ||
| run: node capacitor.config.generator.mjs |
There was a problem hiding this comment.
@coderabbitai - this was not needed in development. Please clarify
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Check if capacitor.config files are gitignored
echo "=== Checking .gitignore for capacitor.config ===="
if [ -f .gitignore ]; then
rg -n "capacitor.config" .gitignore || echo "No capacitor.config entries found in .gitignore"
fi
echo -e "\n=== Checking for capacitor.config.generator.mjs ===="
if [ -f capacitor.config.generator.mjs ]; then
echo "Generator script exists. Content:"
cat capacitor.config.generator.mjs
else
echo "Generator script not found"
fi
echo -e "\n=== Checking for existing capacitor.config files ===="
fd -t f "^capacitor\.config\." -d 1
echo -e "\n=== Checking git tracking status of capacitor.config files ===="
git ls-files | grep "capacitor.config" || echo "No capacitor.config files are tracked in git"
Length of output: 2250
@haslinghuis The key difference is that capacitor.config.json is gitignored (line 43 in .gitignore), so it doesn't exist in CI's fresh checkout.
In development:
- You ran the generator manually once (likely with
--devflag for live reload) - The generated
capacitor.config.jsonpersisted locally on your machine - You didn't need to regenerate it unless your IP changed or you cleaned the directory
In CI:
- Fresh checkout on every run
capacitor.config.jsondoesn't exist (gitignored)- Must be generated before
npx cap sync androidruns - CI runs in standard mode (no
--devflag), which simply copiescapacitor.config.base.jsontocapacitor.config.jsonwithout the dev server configuration
The generator script has two modes:
--dev: Adds server URL for Vite dev server live reload (development)- Standard: Just uses base config as-is (production/CI)
Without this step in CI, the npx cap sync android command would fail because it requires capacitor.config.json to exist.
🧠 Learnings used
Learnt from: haslinghuis
Repo: betaflight/betaflight-configurator PR: 4706
File: src/js/protocols/CapacitorSerial.js:47-47
Timestamp: 2025-11-24T15:07:25.227Z
Learning: In betaflight-configurator's CapacitorSerial protocol (src/js/protocols/CapacitorSerial.js), the fire-and-forget this.loadDevices() call in the constructor is intentional background pre-loading. The actual critical device list loading for UI population is orchestrated by port_handler.js via serial.getDevices("serial"), which properly awaits CapacitorSerial.getDevices() → loadDevices() in a complete async chain. The constructor's async call does not cause race conditions.
haslinghuis
force-pushed
the
capacitor-action
branch
from
6e242f0 to
dc88c63
Compare
|
|
Preview URL: https://pr4713.betaflight-app-preview.pages.dev |
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
vite.config.js (1)
86-112: Consider conditionally disabling VitePWA for Capacitor builds.Based on PR discussion, the VitePWA plugin generates service workers and manifests that aren't needed for native Capacitor apps. The bot recommended conditionally disabling this plugin for Capacitor builds to avoid unnecessary overhead and potential conflicts.
Apply this pattern to conditionally include VitePWA:
plugins: [ vue(), serveLocalesPlugin(), copy({ targets: [ { src: "locales/**/*", dest: "src/dist/locales" }, { src: "resources/**/*", dest: "src/dist/resources" }, { src: "src/tabs/**/*", dest: "src/dist/tabs" }, { src: "src/images/**/*", dest: "src/dist/images" }, { src: "src/components/**/*", dest: "src/dist/components" }, ], hook: "writeBundle", }), - VitePWA({ + ...(process.env.CAPACITOR_BUILD ? [] : [VitePWA({ registerType: "prompt", workbox: { globPatterns: ["**/*.{js,css,html,ico,png,svg,json,mcm}"], // 5MB maximumFileSizeToCacheInBytes: 5 * 1024 * 1024, }, includeAssets: ["favicon.ico", "apple-touch-icon.png"], manifest: { name: pkg.displayName, short_name: pkg.productName, description: pkg.description, theme_color: "#ffffff", icons: [ { src: "/images/pwa/pwa-192-192.png", sizes: "192x192", type: "image/png", }, { src: "/images/pwa/pwa-512-512.png", sizes: "512x512", type: "image/png", }, ], }, - }), + })]), ],Then set
CAPACITOR_BUILD=truein your Capacitor build workflow.Based on PR discussion and bot recommendations.
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
.github/workflows/deploy.yml(1 hunks)vite.config.js(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- .github/workflows/deploy.yml
🔇 Additional comments (2)
vite.config.js (2)
53-53: I'll help you verify and rewrite this review comment. Let me start by examining the repository structure and build configuration.
<function_calls>
#!/bin/bashCheck if package.json exists and examine build scripts
if [ -f "package.json" ]; then
echo "=== Build Scripts ==="
jq '.scripts' package.json 2>/dev/null || cat package.json | grep -A 20 '"scripts"'
else
echo "package.json not found"
fiList root files to understand project structure
echo -e "\n=== Root files ==="
ls -la | grep -E '.(json|js|config)$'
</function_calls>
<function_calls>
#!/bin/bashRead vite.config.js to understand full configuration
echo "=== vite.config.js ==="
wc -l vite.config.js
echo ""
cat -n vite.config.js
</function_calls>
61-64: I'm unable to complete the verification due to repository access issues in the sandbox environment. However, based on the context provided:Unable to verify entry point necessity due to sandbox limitations.
The codebase search cannot be executed to confirm whether both
mainandreceiver_mspentry points are necessary for the Capacitor Android app. The naming convention suggestsreceiver_msp(likely MultiWii Serial Protocol receiver) is a specific feature module, but verification requires:
- Confirming
receiver_msp.htmlis actively referenced in the app- Checking if it's conditionally loaded or always required
- Verifying it's not dead code from a previous refactor
This should be manually verified by checking:
- Whether
receiver_msp.htmlis imported or navigated to anywhere in the codebase- If the entry point is actually bundled and loaded by the Android app
1 participant
Summary by CodeRabbit
✏️ Tip: You can customize this high-level summary in your review settings.