From c6a741821e4b761e70e6fcaa2e27af9c633f82dc Mon Sep 17 00:00:00 2001 From: Hugo EXTRAT Date: Thu, 21 Aug 2025 13:52:01 +0200 Subject: [PATCH 1/3] feat(expo): enhances notification config retrieval Improves notification configuration by first checking `expo-notifications` plugin for icon and color. Falls back to deprecated `config.notification` settings. Warns about missing notification icon for Android. --- .../android/setupFirebaseNotifationIcon.ts | 43 ++++++++++++++++--- 1 file changed, 38 insertions(+), 5 deletions(-) diff --git a/packages/messaging/plugin/src/android/setupFirebaseNotifationIcon.ts b/packages/messaging/plugin/src/android/setupFirebaseNotifationIcon.ts index 7a226e7a53..b707ce3abd 100644 --- a/packages/messaging/plugin/src/android/setupFirebaseNotifationIcon.ts +++ b/packages/messaging/plugin/src/android/setupFirebaseNotifationIcon.ts @@ -26,18 +26,51 @@ export const withExpoPluginFirebaseNotification: ConfigPlugin = config => { }); }; +// Helper function to get notification icon and color from either config.notification or expo-notifications plugin +const getNotificationConfig = (config: ExpoConfig) => { + // Check expo-notifications plugin + if (config.plugins) { + const expoNotificationsPlugin = config.plugins.find(plugin => + Array.isArray(plugin) && plugin[0] === 'expo-notifications' + ); + + if (expoNotificationsPlugin && Array.isArray(expoNotificationsPlugin)) { + const pluginConfig = expoNotificationsPlugin[1]; + if (pluginConfig && typeof pluginConfig === 'object') { + return { + icon: pluginConfig.icon, + color: pluginConfig.color, + }; + } + } + } + + /** + * @deprecated + * Get notification config from config.notification + * Will be removed in the future as `expo-notifications` plugin is the recommended way to configure notifications. + */ + if (config.notification) { + return { + icon: config.notification.icon, + color: config.notification.color, + }; + } + + return { icon: undefined, color: undefined }; +}; + export function setFireBaseMessagingAndroidManifest( config: ExpoConfig, application: ManifestApplication, ) { - // If the notification object is not defined, print a friendly warning - if (!config.notification) { + const { icon, color } = getNotificationConfig(config); + if (!icon) { // This warning is important because the notification icon can only use pure white on Android. By default, the system uses the app icon as the notification icon, but the app icon is usually not pure white, so you need to set the notification icon // eslint-disable-next-line no-console console.warn( 'For Android 8.0 and above, it is necessary to set the notification icon to ensure correct display. Otherwise, the notification will not show the correct icon. For more information, visit https://docs.expo.dev/versions/latest/config/app/#notification', ); - return config; } // Defensive code @@ -46,7 +79,7 @@ export function setFireBaseMessagingAndroidManifest( const metaData = application['meta-data']; if ( - config.notification.icon && + icon && !hasMetaData(application, 'com.google.firebase.messaging.default_notification_icon') ) { // Expo will automatically create '@drawable/notification_icon' resource if you specify config.notification.icon. @@ -59,7 +92,7 @@ export function setFireBaseMessagingAndroidManifest( } if ( - config.notification.color && + color && !hasMetaData(application, 'com.google.firebase.messaging.default_notification_color') ) { metaData.push({ From baf4c89af7865b44f82f90df4ed7b587c234e8a1 Mon Sep 17 00:00:00 2001 From: Hugo EXTRAT Date: Tue, 23 Sep 2025 15:25:01 +0200 Subject: [PATCH 2/3] fix lint --- .../plugin/src/android/setupFirebaseNotifationIcon.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/messaging/plugin/src/android/setupFirebaseNotifationIcon.ts b/packages/messaging/plugin/src/android/setupFirebaseNotifationIcon.ts index b707ce3abd..154bd6e708 100644 --- a/packages/messaging/plugin/src/android/setupFirebaseNotifationIcon.ts +++ b/packages/messaging/plugin/src/android/setupFirebaseNotifationIcon.ts @@ -30,10 +30,10 @@ export const withExpoPluginFirebaseNotification: ConfigPlugin = config => { const getNotificationConfig = (config: ExpoConfig) => { // Check expo-notifications plugin if (config.plugins) { - const expoNotificationsPlugin = config.plugins.find(plugin => - Array.isArray(plugin) && plugin[0] === 'expo-notifications' + const expoNotificationsPlugin = config.plugins.find( + plugin => Array.isArray(plugin) && plugin[0] === 'expo-notifications', ); - + if (expoNotificationsPlugin && Array.isArray(expoNotificationsPlugin)) { const pluginConfig = expoNotificationsPlugin[1]; if (pluginConfig && typeof pluginConfig === 'object') { @@ -56,7 +56,7 @@ const getNotificationConfig = (config: ExpoConfig) => { color: config.notification.color, }; } - + return { icon: undefined, color: undefined }; }; From b2637599164e42220b6aec14faf74e1dfddb6bf0 Mon Sep 17 00:00:00 2001 From: Hugo EXTRAT Date: Tue, 23 Sep 2025 15:55:16 +0200 Subject: [PATCH 3/3] test: make sure both config works --- .../plugin/__tests__/androidPlugin.test.ts | 179 ++++++++++++------ .../__tests__/fixtures/expo-config-example.ts | 39 +++- 2 files changed, 163 insertions(+), 55 deletions(-) diff --git a/packages/messaging/plugin/__tests__/androidPlugin.test.ts b/packages/messaging/plugin/__tests__/androidPlugin.test.ts index f2c333212b..a612c03ae6 100644 --- a/packages/messaging/plugin/__tests__/androidPlugin.test.ts +++ b/packages/messaging/plugin/__tests__/androidPlugin.test.ts @@ -1,70 +1,141 @@ import { describe, expect, it } from '@jest/globals'; import { setFireBaseMessagingAndroidManifest } from '../src/android/setupFirebaseNotifationIcon'; import { ExpoConfig } from '@expo/config-types'; -import expoConfigExample from './fixtures/expo-config-example'; +import { + expoConfigExample, + expoNotificationsConfigExample, + expoNotificationsConfigWithoutColorExample, + expoNotificationsConfigWithoutPluginExample, +} from './fixtures/expo-config-example'; import manifestApplicationExample from './fixtures/application-example'; import { ManifestApplication } from '@expo/config-plugins/build/android/Manifest'; describe('Config Plugin Android Tests', function () { - it('applies changes to app/src/main/AndroidManifest.xml with color', async function () { - const config: ExpoConfig = JSON.parse(JSON.stringify(expoConfigExample)); - const manifestApplication: ManifestApplication = JSON.parse( - JSON.stringify(manifestApplicationExample), - ); - setFireBaseMessagingAndroidManifest(config, manifestApplication); - expect(manifestApplication['meta-data']).toContainEqual({ - $: { - 'android:name': 'com.google.firebase.messaging.default_notification_icon', - 'android:resource': '@drawable/notification_icon', - }, + describe('notification config', () => { + it('applies changes to app/src/main/AndroidManifest.xml with color', async function () { + const config: ExpoConfig = JSON.parse(JSON.stringify(expoConfigExample)); + const manifestApplication: ManifestApplication = JSON.parse( + JSON.stringify(manifestApplicationExample), + ); + setFireBaseMessagingAndroidManifest(config, manifestApplication); + expect(manifestApplication['meta-data']).toContainEqual({ + $: { + 'android:name': 'com.google.firebase.messaging.default_notification_icon', + 'android:resource': '@drawable/notification_icon', + }, + }); + expect(manifestApplication['meta-data']).toContainEqual({ + $: { + 'android:name': 'com.google.firebase.messaging.default_notification_color', + 'android:resource': '@color/notification_icon_color', + 'tools:replace': 'android:resource', + }, + }); }); - expect(manifestApplication['meta-data']).toContainEqual({ - $: { - 'android:name': 'com.google.firebase.messaging.default_notification_color', - 'android:resource': '@color/notification_icon_color', - 'tools:replace': 'android:resource', - }, + + it('applies changes to app/src/main/AndroidManifest.xml without color', async function () { + const config = JSON.parse(JSON.stringify(expoConfigExample)); + const manifestApplication: ManifestApplication = JSON.parse( + JSON.stringify(manifestApplicationExample), + ); + config.notification!.color = undefined; + setFireBaseMessagingAndroidManifest(config, manifestApplication); + expect(manifestApplication['meta-data']).toContainEqual({ + $: { + 'android:name': 'com.google.firebase.messaging.default_notification_icon', + 'android:resource': '@drawable/notification_icon', + }, + }); + expect(manifestApplication['meta-data']).not.toContainEqual({ + $: { + 'android:name': 'com.google.firebase.messaging.default_notification_icon', + 'android:resource': '@drawable/notification_icon_color', + 'tools:replace': 'android:resource', + }, + }); + }); + + it('applies changes to app/src/main/AndroidManifest.xml without notification', async function () { + // eslint-disable-next-line no-console + const warnOrig = console.warn; + let called = false; + // eslint-disable-next-line no-console + console.warn = (_: string) => { + called = true; + }; + const config: ExpoConfig = JSON.parse(JSON.stringify(expoConfigExample)); + const manifestApplication: ManifestApplication = JSON.parse( + JSON.stringify(manifestApplicationExample), + ); + config.notification = undefined; + setFireBaseMessagingAndroidManifest(config, manifestApplication); + expect(called).toBeTruthy(); + // eslint-disable-next-line no-console + console.warn = warnOrig; }); }); - it('applies changes to app/src/main/AndroidManifest.xml without color', async function () { - const config = JSON.parse(JSON.stringify(expoConfigExample)); - const manifestApplication: ManifestApplication = JSON.parse( - JSON.stringify(manifestApplicationExample), - ); - config.notification!.color = undefined; - setFireBaseMessagingAndroidManifest(config, manifestApplication); - expect(manifestApplication['meta-data']).toContainEqual({ - $: { - 'android:name': 'com.google.firebase.messaging.default_notification_icon', - 'android:resource': '@drawable/notification_icon', - }, + describe('expo-notifications config', () => { + it('applies changes to app/src/main/AndroidManifest.xml with color', async function () { + const config: ExpoConfig = JSON.parse(JSON.stringify(expoNotificationsConfigExample)); + const manifestApplication: ManifestApplication = JSON.parse( + JSON.stringify(manifestApplicationExample), + ); + setFireBaseMessagingAndroidManifest(config, manifestApplication); + expect(manifestApplication['meta-data']).toContainEqual({ + $: { + 'android:name': 'com.google.firebase.messaging.default_notification_icon', + 'android:resource': '@drawable/notification_icon', + }, + }); + expect(manifestApplication['meta-data']).toContainEqual({ + $: { + 'android:name': 'com.google.firebase.messaging.default_notification_color', + 'android:resource': '@color/notification_icon_color', + 'tools:replace': 'android:resource', + }, + }); }); - expect(manifestApplication['meta-data']).not.toContainEqual({ - $: { - 'android:name': 'com.google.firebase.messaging.default_notification_icon', - 'android:resource': '@drawable/notification_icon_color', - 'tools:replace': 'android:resource', - }, + + it('applies changes to app/src/main/AndroidManifest.xml without color', async function () { + const config = JSON.parse(JSON.stringify(expoNotificationsConfigWithoutColorExample)); + const manifestApplication: ManifestApplication = JSON.parse( + JSON.stringify(manifestApplicationExample), + ); + setFireBaseMessagingAndroidManifest(config, manifestApplication); + expect(manifestApplication['meta-data']).toContainEqual({ + $: { + 'android:name': 'com.google.firebase.messaging.default_notification_icon', + 'android:resource': '@drawable/notification_icon', + }, + }); + expect(manifestApplication['meta-data']).not.toContainEqual({ + $: { + 'android:name': 'com.google.firebase.messaging.default_notification_icon', + 'android:resource': '@drawable/notification_icon_color', + 'tools:replace': 'android:resource', + }, + }); }); - }); - it('applies changes to app/src/main/AndroidManifest.xml without notification', async function () { - // eslint-disable-next-line no-console - const warnOrig = console.warn; - let called = false; - // eslint-disable-next-line no-console - console.warn = (_: string) => { - called = true; - }; - const config: ExpoConfig = JSON.parse(JSON.stringify(expoConfigExample)); - const manifestApplication: ManifestApplication = JSON.parse( - JSON.stringify(manifestApplicationExample), - ); - config.notification = undefined; - setFireBaseMessagingAndroidManifest(config, manifestApplication); - expect(called).toBeTruthy(); - // eslint-disable-next-line no-console - console.warn = warnOrig; + it('applies changes to app/src/main/AndroidManifest.xml without notification', async function () { + // eslint-disable-next-line no-console + const warnOrig = console.warn; + let called = false; + // eslint-disable-next-line no-console + console.warn = (_: string) => { + called = true; + }; + const config: ExpoConfig = JSON.parse( + JSON.stringify(expoNotificationsConfigWithoutPluginExample), + ); + const manifestApplication: ManifestApplication = JSON.parse( + JSON.stringify(manifestApplicationExample), + ); + setFireBaseMessagingAndroidManifest(config, manifestApplication); + expect(called).toBeTruthy(); + // eslint-disable-next-line no-console + console.warn = warnOrig; + }); }); }); diff --git a/packages/messaging/plugin/__tests__/fixtures/expo-config-example.ts b/packages/messaging/plugin/__tests__/fixtures/expo-config-example.ts index c9aa9e1e27..095ab1d3af 100644 --- a/packages/messaging/plugin/__tests__/fixtures/expo-config-example.ts +++ b/packages/messaging/plugin/__tests__/fixtures/expo-config-example.ts @@ -12,4 +12,41 @@ const expoConfigExample: ExpoConfig = { }, }; -export default expoConfigExample; +const expoNotificationsConfigExample: ExpoConfig = { + name: 'FirebaseMessagingTest', + slug: 'fire-base-messaging-test', + plugins: [ + [ + 'expo-notifications', + { + icon: `IconAsset`, + color: '#1D172D', + }, + ], + ], +}; + +const expoNotificationsConfigWithoutColorExample: ExpoConfig = { + name: 'FirebaseMessagingTest', + slug: 'fire-base-messaging-test', + plugins: [ + [ + 'expo-notifications', + { + icon: `IconAsset`, + }, + ], + ], +}; + +const expoNotificationsConfigWithoutPluginExample: ExpoConfig = { + name: 'FirebaseMessagingTest', + slug: 'fire-base-messaging-test', +}; + +export { + expoConfigExample, + expoNotificationsConfigExample, + expoNotificationsConfigWithoutColorExample, + expoNotificationsConfigWithoutPluginExample, +};