❗️Cannot start the phonegap local server

[JGreenlee]

I first noticed this yesterday when I was working on a freshly-cloned, clean copy of the e-mission-phone repo. I don't know why it wasn't an issue before then.

This seems related to the issue described in e-mission/e-mission-phone@460f6ee. That commit was supposed to fix the issue, but I still experience it (on master and any other branch with the upgraded versions):

[phonegap] Discovered platform "browser" in config.xml or package.json. Adding it to the project
[phonegap] Using cordova-fetch for cordova-browser@^6.0.0
(node:33927) Warning: Accessing non-existent property 'browser' of module exports inside circular dependency
(Use `node --trace-warnings ...` to show where the warning was created)
 [warning] CordovaError: Failed to fetch platform cordova-browser@^6.0.0
Probably this is either a connection problem, or platform spec is incorrect.
Check your connection and platform name/version/URL.
Could not determine package name from output:
added 24 packages in 7s

So the browser platform is present in package.json, but we still have the issue where "cordova tries to add it itself, and that completely messes up the node_modules".
phonegap is uninstalled and cannot be used after this point.

full log below:

jgreenle-34794s:e-mission-phone jgreenle$ npm run serve

> [email protected] serve
> phonegap --verbose serve

[phonegap] Running command: /Users/jgreenle/openpath/clean/e-mission-phone/hooks/before_prepare/download_translation.js /Users/jgreenle/openpath/clean/e-mission-phone
[phonegap] Running command: /Users/jgreenle/openpath/clean/e-mission-phone/hooks/before_prepare/ios_use_apns_token.js /Users/jgreenle/openpath/clean/e-mission-phone
/usr/bin/git
Downloading locales: /Users/jgreenle/openpath/clean/e-mission-phone/bin/conf/translate_config.json not found, I will extract translate repo from translation_config.json.sample.
Already up to date.
[phonegap] Discovered platform "browser" in config.xml or package.json. Adding it to the project
[phonegap] Using cordova-fetch for cordova-browser@^6.0.0
(node:33927) Warning: Accessing non-existent property 'browser' of module exports inside circular dependency
(Use `node --trace-warnings ...` to show where the warning was created)
 [warning] CordovaError: Failed to fetch platform cordova-browser@^6.0.0
Probably this is either a connection problem, or platform spec is incorrect.
Check your connection and platform name/version/URL.
Could not determine package name from output:
added 24 packages in 7s

13 packages are looking for funding
  run `npm fund` for details
    at /Users/jgreenle/openpath/clean/e-mission-phone/node_modules/phonegap/node_modules/cordova-lib/src/cordova/platform/addHelper.js:296:31
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
  code: 0,
  context: undefined
}
[phonegap] starting app server...
There was an unhandled exception within phonegap-cli! If you would like to help the PhoneGap project, please file the following details over at https://github.com/phonegap/phonegap-cli/issues
Error: ENOENT: no such file or directory, open '/Users/jgreenle/openpath/clean/e-mission-phone/node_modules/connect-phonegap/res/middleware/autoreload-http.js'
    at Object.openSync (node:fs:584:3)
    at Object.readFileSync (node:fs:452:35)
    at /Users/jgreenle/openpath/clean/e-mission-phone/node_modules/connect-phonegap/lib/util/scripts-to-inject.js:43:35
    at Array.forEach (<anonymous>)
    at Object.getScripts (/Users/jgreenle/openpath/clean/e-mission-phone/node_modules/connect-phonegap/lib/util/scripts-to-inject.js:41:17)
    at module.exports (/Users/jgreenle/openpath/clean/e-mission-phone/node_modules/connect-phonegap/lib/middleware/inject.js:21:35)
    at module.exports (/Users/jgreenle/openpath/clean/e-mission-phone/node_modules/connect-phonegap/lib/middleware.js:109:13)
    at module.exports (/Users/jgreenle/openpath/clean/e-mission-phone/node_modules/connect-phonegap/lib/serve.js:68:14)
    at startServer (/Users/jgreenle/openpath/clean/e-mission-phone/node_modules/phonegap/lib/phonegap/serve.js:113:16)
    at /Users/jgreenle/openpath/clean/e-mission-phone/node_modules/phonegap/lib/phonegap/serve.js:136:16

Saving session...
...copying shared history...
...saving history...truncating history files...
...completed.

[Process completed]

Steps to reproduce:

1. git clone https://github.com/e-mission/e-mission-phone.git && cd e-mission-phone (successful)
2. . setup/setup_serve.sh (successful)
3. npm run serve (unsuccessful)

[JGreenlee]

Actually, this fixes it and can be used as a workaround:

1. npx cordova platform rm browser
2. npx cordova platform add browser

Then npm run serve works.

So, maybe we can just add npx cordova platform add browser to the setup script.

[shankari]

@JGreenlee Yeah there's clearly a [warning] CordovaError: Failed to fetch platform cordova-browser@^6.0.0

Do you still see this if you are off the VPN during the initial installation?
In general, I have seen download failures due to SSL issues when on the VPN

If you are off the VPN and the serve install still fails, you can go ahead and npx cordova platform add browser to the setup script. Hopefully we will not need this any more once we switch to React Native and Expo

[shankari]

I checked out a brand new repo (to /tmp) to experiment with this.

When I ran the setup with the VPN turned on, it failed at

added 1183 packages, and audited 1184 packages in 1m

97 packages are looking for funding
  run `npm fund` for details

36 vulnerabilities (2 low, 15 moderate, 17 high, 2 critical)

To address issues that do not require attention, run:
  npm audit fix

Some issues need review, and may require choosing
a different dependency.

Run `npm audit` for details.
Updating bower
bower cached        https://github.com/sebastianbarry/angular-qrcode.git#7.3.0
bower validate      7.3.0 against https://github.com/sebastianbarry/angular-qrcode.git#v7.3.0
bower cached        https://github.com/driftyco/ionic-bower.git#1.3.1
bower validate      1.3.1 against https://github.com/driftyco/ionic-bower.git#1.3.1
bower SELF_SIGNED_CERT_IN_CHAIN      Request to https://registry.bower.io/packages/ng-walkthrough failed: self-signed certificate in certificate chain

[shankari]

After even getting off the vpn, I am able to reproduce this issue.
I think that the issue might be that the browser is stored in

  "cordova": {
    "platforms": [
      "browser"
    ]
  }

But we don't do cordova prepare or any other cordova comments to read that platform information.

[shankari]

So npx cordova plugin rm browser && npx cordova plugin add browser will work, but I think that npx cordova prepare will also work and is likely more principled.

[shankari]

yup! npx cordova prepare at the end of the setup script seems to fix everything, even in a freshly checked out repo.