Meteor 2.16: Splashscreen after hot code push

mobile Cordova
1

Hello,

I’m using meteor 2.16 together with Angular for the front and Cordova for the mobile apps. We did not get a chance to start working on migrating to Meteor 3, so for now we’re stuck on the 2.16 version.

Starting with meteor 2.14, the cordova-plugin-splashscreen has been removed and we are now facing an issue. Before, whenever a new version of our code was sent to the app using HCP:

  1. we would show the splashscreen
  2. let the cordova app reload with the new version of our code
  3. hide the splascreen

Now, unfortunately, we cannot show the splashscreen anymore because the plugin has been removed. So when the cordova app reloads to apply the new code, we get a blank screen, and then our app loads. Is there a way to show the splashscreen like before, or is there some workaround ?

How do you guys handle the hot code push reload ?

Thanks,
Sebastian

2

Hey @seeeb,

Disclaimer: I haven’t tested any of this on a device, this is purely from reading the Meteor source code. Let me know if something doesn’t work as expected. :smile:

The splashscreen plugin was removed in Meteor 2.14 because Cordova Android 12+ now handles the initial launch splash natively (via cordova-android core). The trade-off is that the old navigator.splashscreen.show() / .hide() API — which let you programmatically show/hide the splash at any time — is no longer available by default.

The launch-screen package still references navigator.splashscreen internally, but that object no longer exists without the plugin.

Workaround 1 — Re-add the plugin manually

The simplest fix if you just want the old behavior back:

meteor add cordova:cordova-plugin-splashscreen@6.0.2

This should restore navigator.splashscreen.show() / .hide(), and the launch-screen package should work as before. The plugin still works with recent Cordova versions — Meteor just stopped bundling it by default.

Workaround 2 — HTML/CSS overlay (no plugin needed)

If you’d rather not depend on the old plugin, you can create a full-screen overlay that you show before the HCP reload and that gets naturally destroyed when the WebView reloads with the new version:

In your main HTML:

<div id="hcp-overlay" style="display:none; position:fixed; inset:0; z-index:99999; background:#fff; align-items:center; justify-content:center;">
  <p>Updating…</p>
</div>

In your client startup:

if (Meteor.isCordova) {
  WebAppLocalServer.onNewVersionReady(() => {
    const overlay = document.getElementById('hcp-overlay');
    if (overlay) overlay.style.display = 'flex';
    // Reload happens automatically via the autoupdate package
  });
}

Since the page fully reloads after switchToPendingVersion(), the overlay disappears naturally when the new version renders.

Workaround 3 — Reload._onMigrate hook

For more control over timing, you can hook into the reload migration system:

if (Meteor.isCordova) {
  Reload._onMigrate('hcpSplash', (retry) => {
    document.getElementById('hcp-overlay').style.display = 'flex';
    return [true]; // allow reload to proceed
  });
}

This fires right before the actual reload, so the overlay appears at the last possible moment.

Workaround 1 is the quickest path. Workaround 2/3 give you full control over the UI without an extra Cordova plugin dependency. Again, untested — happy to dig deeper if you hit issues.

1 Like
3

Hello,

Thank you very much for your reply. Unfortunately, the plugin cannot be installed if the cordova-android version is >= 11.0.0. Here is the exact message I get when compiling the app:

Installing “cordova-plugin-splashscreen” for android
%% Plugin doesn’t support this project’s cordova-android version. cordova-android: 14.0.1, failed version requirement: >=3.6.0 <11.0.0
Plugin doesn’t support this project’s cordova-android version. cordova-android: 14.0.1, failed version requirement: >=3.6.0 <11.0.0
%% Skipping ‘cordova-plugin-splashscreen’ for android

I’m currently trying to implement something along the solution number 2. However, my issue is the white screen that appears after the reload, not before. To be more precise, I think the white screen appears when the app reloads and before the index.html has been parsed.
For this, I’m adding a spinner as early as I can in the index.html file, that will be removed once the app fully loads.

4

Hi,

I use the package quave:reloader to manage HCP. It manages also the splashscreen

I am on 3.4 but It was working for 2.x.

5

Hello, thanks for the tip, I will give it a try.
So does that mean that you are able to show the native splashscreen after the app reloads ? Just like on a cold boot ?

6

https://packosphere.com/quave/reloader

Yes by using launchScreenDelay parameter. But, I am in ’ Reload when the app allows’ mode, So I didn’t take the testing very far.

7

Will certainly give it a try. Are you using this plugin for both Android and iOS ?

8

Yes. IOS and Android.

9

I installed the plugin and after I update using hot code push, I can see this in the logs:
"navigator.splashscreen.show()" is unsupported on Android.
And the splashscreen is never shown.
This is consistent with what I found in the docs, that on cordova-android >= 12 this function does not work anymore. So I’m still unsure how can this work for others :frowning: but not for me