[Bug]: Theme parameters not working on Android 15 with Telegram v11.7.0

[fraybyl1]

Telegram Application

Telegram for Android

Describe the Bug

After upgrading to sdk-react version 3.0.10, I encountered an issue where the theme parameter:

var(--tg-theme-secondary-bg-colour)

or

themeParams.secondaryBackgroundColour()

does not work correctly on Android. Instead of applying the expected colour, it defaults to black/white depending on the Telegram theme. This problem is not present on a PC with telegram-desktop, where the colours work as expected. Rolling back to sdk-react version 2.x.x solves the problem.

Environment:

• SDK Version: 3.0.10
• Platform: Android 15
• Telegram Version: 11.7.0

Rolling back to sdk-react version 2.x.x fixes the issue.

The problem seems specific to Android, as it works fine on telegram-desktop.

in debug mode on android:

tgWebAppThemeParams :{ 
secondary_bg_color: "#5eabe1"
}

Relevant init Code Snippet:

export async function init(debug: boolean): Promise<void> {
  setDebug(debug);

  initSDK();

  if (!backButton.isSupported() || !miniApp.isSupported()) {
    throw new Error('ERR_NOT_SUPPORTED');
  }

  try {
    const mountPromises: Promise<unknown>[] = [];

    backButton.mount();

    if (miniApp.mount.isAvailable()) {
      try {
        const promise = miniApp.mount();
        mountPromises.push(promise);
        await promise;
        if (miniApp.ready.isAvailable()) miniApp.ready();
        if (miniApp.bindCssVars.isAvailable()) miniApp.bindCssVars();
        if (themeParams.bindCssVars.isAvailable()) themeParams.bindCssVars();
      } catch (err) {
        console.error("MiniApp mount failed:", err);
      }
    }

    if (viewport.mount.isAvailable()) {
      try {
        const promise = viewport.mount();
        mountPromises.push(promise);
        await promise;
        if (viewport.bindCssVars.isAvailable()) viewport.bindCssVars();
      } catch (err) {
        console.error("Viewport mount failed:", err);
      }
    }

    if (!miniApp.isSupported() && themeParams.mount.isAvailable()) {
      try {
        await themeParams.mount();
        if (themeParams.bindCssVars.isAvailable()) themeParams.bindCssVars();
      } catch (err) {
        console.error("ThemeParams mount failed:", err);
      }
    }

    await Promise.all(mountPromises);

    initData.restore();

    if (viewport.expand.isAvailable()) {
      try {
        viewport.expand();
      } catch (err) {
        console.error("Viewport expand failed:", err);
      }
    }
  } catch (error) {
    console.error('Initialization failed:', error);
    throw new Error('ERR_INIT_FAILED');
  }
}

To Reproduce

1. Upgrade to sdk-react version 3.0.10.
2. Use themeParams.secondaryBackgroundColour() or var(--tg-theme-secondary-bg-colour) in the app.
3. Run the app on Android 15 with Telegram v11.7.0.
4. Observe that the color is incorrect (black/white instead of the expected theme color).

Expected Behavior

themeParams.secondaryBackgroundColour() or var(--tg-theme-secondary-bg-colour) should return the correct color.

[fraybyl1]

Update:

Checked on iOS, everything works. Apparently the problem is only android. Tested on two phones.