[IOS] MiniApp.jsbundle not updated

[jomnius]

PROBLEM:

I created iOS ElectrodeContainer framework and copied that into native application. When native application was launched, and it then launched the Electrode Native screen, it was using one week old code instead of the latest changes.

I cannot figure out how to make sure included MiniApp.jsbundle contains latest code. I was told that doing ern run-ios would regenerate the bundle, but I use that command rarely. Most likely last time one week ago.

(Oh, I need to do "npm install -g ios-deploy"! Never knew...)

I'm looking for CI/CD compatible way to make sure that MiniApp.jsbundle is generated from latest codes and included into iOS ElectrodeContainer framework.

DETAILS:

When opening the auto-generated ElectrodeContainer.xcodeproj, selecting project root (ElectrodeContainer), Project (ElectrodeContainer) - Target (ElectrodeContainer) and then looking at "Build Phases" and "Copy Bundle Resources", I can see MiniApp.jsbundle on the list. The file does exist inside framework.

Please note that I'm not running react-native-xcode.sh by myself at any point and I cannot see it anywhere in Xcode project. Should it be somewhere? Should I run it myself?

I deleted ~/.ern folder, MyApp node_modules folder and yarn.lock file. Then I run more or less following commands:

ern --debug
ern platform use 0.14.3
ern cauldron repo remove my-cauldron
ern cauldron repo add my-cauldron git@github.compa.ny:Project/my-cauldron.git --current true

rm -rf ./.container/ios
ern create-container --descriptor MyRunner:ios:0.0.5 --outDir $PWD/.container/ios
yarn

# some scripts to fix stuff e.g. set Bitcode, search paths

find .container -type f -name '*.js' -delete

Then I created framework without errors, about:

xcrun xcodebuild -project ${CONTAINER_PROJECT_PATH} -configuration ${BUILD_TYPE} -target ${TARGET_NAME} CONFIGURATION_BUILD_DIR=${build_dir} DEBUG_INFORMATION_FORMAT=dwarf-with-dsym ONLY_ACTIVE_ARCH=NO -sdk ${sdk}

And then copied the generated framework to native app, which was successfully built and launched.

QUESTION:

Which step is generating the production MiniApp.jsbundle and based on what? I thought it's done at ern create-container, but since the native app got old stuff, I must be missing some refresh step.

[belemaire]

Hi @jomnius,

You shouldn't have to run react-native-xcode.sh, this is the script that is shipped with react-native itself and that is used to perform the bundling for react-native apps when using react-native directly. When using electrode native, ern takes care of the bundling (producing the MiniApp.jsbundle that ends up in the Container, as a part of the Container generation process).

What ern create-container --descriptor MyRunner:ios:0.0.5does is that it looks in the Cauldron for all MiniApps/native dependencies that are stored in the Cauldron for MyRunner:ios:0.0.5.

For example, let's say in the Cauldron, for MyRunner:ios:0.0.5 there are these two MiniApps stored :

- my-first-miniapp@0.0.1
- my-second-miniapp@0.0.1

Then no matter, how many times you run ern create-container --descriptor MyRunner:ios:0.0.5, it will always generate a Container (and MiniApp.jsbundle) containing these two versions of the MiniApps, even if they released more recent versions, the Cauldron is the source of truth regarding what to include in the bundle and it says 0.0.1 of these two MiniApps.

Only way to reflect latest code changes of these MiniApps is to bump their versions, publish new versions, and update the versions to use in the Container (ultimately MiniApp.jsbundle) through ern cauldron update miniapps my-first-miniapp@0.0.2 for example if bumping my-first-miniapp. When you run ern create-container again, this time it'll pick 0.0.2 version of this miniapp instead of 0.0.1. This is a bit cumbersome as you or someone needs to regularly publish new versions of the MiniApps to the npm registry and then update them in Cauldron to see changes reflected in the Container.

Another way is also to use git branch for MiniApp versions (this is useful for generating dev containers on CI mostly), in that case, instead of specifying npm registry path (with versions) for the MiniApps, you can use git repo path with branch, for example :

- https://github.com/org-or-user/my-first-miniapp.git#develop
- https://github.com/org-or-user/my-second-miniapp.git#develop

This way, whenever you run ern create-container, it will pick the latest from develop of these miniapps, ensuring that you always get the latest code of the MiniApps. You don't even have (and you shoudln't really) go through Cauldron in that case. Indeed, you can just pass the MiniApps directly to the create-container command instead of going through descriptor, as such : ern create-container --miniapps https://github.com/org-or-user/my-first-miniapp.git#develop https://github.com/org-or-user/my-second-miniapp.git#develop (so just replacing --descriptor by --miniapps in your command). That's how we are doing it on our CI to regularly build dev containers containing the latest code changes of all MiniApps repos (in our case it's done automatically on a timely trigger, but you could also trigger it in some way any time a change is pushed to one of the miniapp repos develop branch, whatever works for you).

So for dev, that's how you can do it to simplify things and ensure that dev containers will always have the latest changes from the miniapps.

Then at the time of release, and only at the time of release should you use Cauldron (I mean, you can use it for dev as well, but as we've seen it's not the more convenient thing). What we do at the time of release (let's say version 17.8.0 of our native app) is that we tag all of the miniapps repos (this is CI scripted as well) with native-app-name-android-17.8.0 and then we create the native application version 17.8.0 in cauldron (ern cauldron add nativeapp native-app-name:android:17.8.0) and add all the miniapps with the tag instead of the branch, so something like ern cauldron add miniapps https://github.com/org-or-user/my-first-miniapp.git#native-app-name-android-17.8.0 https://github.com/org-or-user/my-second-miniapp.git#native-app-name-android-17.8.0 -d native-app-name:android:17.8.0

Cauldron mostly only needs to hold released native app versions (and the exact versions of the miniapps included in this native app version, be it as git hub repo with tags or npm registry with fixed version), so that it knows what is precisely inside each released native application version to guarantee code push safety. For the rest, especially dev CI, cauldron can be bypassed (at least for storing dev native app version).

[jomnius]

Right after sending the "bug report", I realised I had made last miniapp release a week ago. That explains the old content, exactly as you said :) Still was hoping you might have some advice, as you in deed did. Great many thanx!

Tried several different ways, got several different errors. Here's some better ones:

ERROR 1:

When trying the https url you suggested, it fails

jmiettunen@mac-11339 my-miniapp (master) $ ern create-container --miniapps https://github.saobby.my.eu.orgpa.ny/Project/my-miniapp --outDir $PWD/.container/android --platform android

✖ Command failed: /Users/jmiettunen/.ern/versions/0.14.3/node_modules/ern-core/node_modules/.bin/yarn add https://github.saobby.my.eu.orgpa.ny/Project/my-miniapp --ignore-engines --non-interactive --exact  
error An unexpected error occurred: "https://github.saobby.my.eu.orgpa.ny/Project/my-miniapp: Invalid tar header. Maybe the tar is corrupted or it needs to be gunzipped?".

Seems like this error happens, because yarn does not recognize URL as git repo and then by default expects to download a tar ball.

Error downloading git repo over HTTP without a commit hash

So I'll try to define URL as git repo. These URL scheme were found from your PackagePath-test.js file.

Just adding .git at the end of https url:

ERROR 2:

jmiettunen@mac-11339 my-miniapp (master) $ ern create-container --miniapps https://github.saobby.my.eu.orgpa.ny/Project/my-miniapp.git --outDir $PWD/.container/android --platform android

⠇ Generating Container locallyrunLocalContainerGen failed: Error: Command failed: /Users/jmiettunen/.ern/versions/0.14.3/node_modules/ern-core/node_modules/.bin/yarn add https://github.saobby.my.eu.orgpa.ny:Project/my-miniapp.git --ignore-engines --non-interactive --exact  
error An unexpected error occurred: "Refusing to download the git repo {\"hostname\":\"github.compa.ny\",\"protocol\":\"https:\",\"repository\":\"https://github.saobby.my.eu.orgpa.ny/:Project/my-miniapp.git\"} over HTTPS without a commit hash - possible certificate error?".

I would prefer not to define commit hash, somehow I feel this should work without it. I always want to use HEAD of master git branch (in this case), not any specific commit.

Yes, I could get last commit hash of origin master with e.g.

git ls-remote git@github.compa.ny:Project/my-miniapp | grep refs/heads/master | cut -f 1

Then trying some combinations of ssh urls, e.g.:

ERROR 3:

jmiettunen@mac-11339 my-miniapp (master) $ ern create-container --miniapps git+ssh://git@github.compa.ny:Project/my-miniapp.git --outDir $PWD/.container/android --platform android
[v0.14.3] [Cauldron: my-cauldron]

✔ Validity checks have passed
⠸ Generating Container locallyrunLocalContainerGen failed: Error: Cannot find module '/var/folders/tp/gjpvd0wn0350tz0qndp0cb2j_sy6vd/T/tmp-35615ulIJU6wzIzjM/node_modules/@apps/my-miniapp/package.json'
✖ Cannot find module '/var/folders/tp/gjpvd0wn0350tz0qndp0cb2j_sy6vd/T/tmp-35615ulIJU6wzIzjM/node_modules/@apps/my-miniapp/package.json'

When I go into that tmp folder, this is what's there (below). There is no package.json file. That node_modules folder contains only react-native-electrode-bridge and .bin folders.

jmiettunen@mac-11339 my-miniapp $ pwd
/private/var/folders/tp/gjpvd0wn0350tz0qndp0cb2j_sy6vd/T/tmp-35615ulIJU6wzIzjM/node_modules/@apps/my-miniapp

jmiettunen@mac-11339 my-miniapp $ ls -la
total 104
drwxr-xr-x  18 jmiettunen  domänen-benutzer   576 Mar 26 14:17 .
drwxr-xr-x   8 jmiettunen  domänen-benutzer   256 Mar 26 14:17 ..
-rw-r--r--   1 jmiettunen  domänen-benutzer    68 Mar 26 09:53 .babelrc
-rw-r--r--   1 jmiettunen  domänen-benutzer   114 Mar 26 09:53 .buckconfig
drwxr-xr-x   3 jmiettunen  domänen-benutzer    96 Mar 26 14:17 .container
-rw-r--r--   1 jmiettunen  domänen-benutzer   228 Mar 26 09:53 .eslintrc.json
-rw-r--r--   1 jmiettunen  domänen-benutzer   186 Mar 26 09:53 .flow-coverage-report.json
-rw-r--r--   1 jmiettunen  domänen-benutzer  3673 Mar 26 09:53 .flowconfig
-rw-r--r--   1 jmiettunen  domänen-benutzer    16 Mar 26 09:53 .gitattributes
-rw-r--r--   1 jmiettunen  domänen-benutzer  1265 Mar 26 09:53 .gitignore
-rw-r--r--   1 jmiettunen  domänen-benutzer   265 Mar 26 09:53 .npmignore
-rw-r--r--   1 jmiettunen  domänen-benutzer    78 Mar 26 09:53 .npmrc
-rw-r--r--   1 jmiettunen  domänen-benutzer    13 Mar 26 09:53 .prettierignore
drwxr-xr-x   3 jmiettunen  domänen-benutzer    96 Mar 26 14:17 .vscode
-rw-r--r--   1 jmiettunen  domänen-benutzer     2 Mar 26 09:53 .watchmanconfig
-rw-r--r--   1 jmiettunen  domänen-benutzer    63 Mar 26 09:53 .yarnrc
-rw-r--r--   1 jmiettunen  domänen-benutzer   446 Mar 26 09:53 .zappr.yaml
drwxr-xr-x   4 jmiettunen  domänen-benutzer   128 Mar 26 14:17 node_modules

SUCCESS:

the only one that has worked so far is using file scheme - and running yarn before trying to create container. Otherwise got error note that react-native was not found. We guessed it's because ern was looking into local node_modules folder, which was empty (clean build).

ern create-container --miniapps file:$PWD --outDir $PWD/.container/android --platform android

Any suggestions or comments? I think we now got some functional solution, so otherwise you can close this. Much appreciated for your help!

[belemaire]

@jomnius Sorry for my belated answer, I am currently on vacation with limited time to look to issues.

• The commit hash does not have to be specified. The error seems to be misleading and not related to not specifying a commit hash. By default I think yarn will pull from master branch in case of a GitHub repository (or maybe from default branch, I am not so sure now). Anyway, even though it is not needed, we usually always specify the branch as the "commit hash" (i.e #master at the end of the url) to make it very explicit which branch gets pulled (as you can see, otherwise, non yarn users, or even yarn users, might end up not really knowing which branch gets pulled. Specifying it part of the url makes it clear, always better practice even though not needed. My opinion though).

• On the issue you linked, I can see that for one of the user, the error refusing to download .. without a commit hash was due to using a colon instead of an slhash. You should try it out using github.compa.ny/Project instead of github.compa.ny:Project I think this might solve the issue you are experiencing with yarn.

[jomnius]

Just a note that this issue can be closed... although having this documented in some place could be really useful!