[ENG-6619] validate icon PNGs before running build (#1477)

* validate icon PNGs before running build

* address PR feedback

* address PR feedback

* address more PR feedback

.gitattributes

@@ -1,2 +1,5 @@
 * text eol=lf
+*.png binary
+*.jpg binary
+
 **/yarn.lock linguist-generated

packages/eas-cli/package.json

@@ -66,6 +66,7 @@
     "nullthrows": "1.1.1",
     "ora": "5.1.0",
     "pkg-dir": "4.2.0",
+    "pngjs": "6.0.0",
     "promise-limit": "2.7.0",
     "promise-retry": "2.0.1",
     "prompts": "2.4.2",
@@ -89,11 +90,13 @@
     "@types/cli-progress": "3.11.0",
     "@types/dateformat": "3.0.1",
     "@types/envinfo": "7.8.1",
+    "@types/express": "4.17.14",
     "@types/fs-extra": "9.0.13",
     "@types/getenv": "^1.0.0",
     "@types/mime": "3.0.1",
     "@types/node-fetch": "2.6.2",
     "@types/node-forge": "1.3.0",
+    "@types/pngjs": "6.0.1",
     "@types/promise-retry": "1.1.3",
     "@types/prompts": "2.4.1",
     "@types/semver": "7.3.12",
@@ -103,6 +106,7 @@
     "@types/wrap-ansi": "3.0.0",
     "axios": "0.27.2",
     "eslint-plugin-graphql": "4.0.0",
+    "express": "4.18.2",
     "memfs": "3.4.7",
     "mockdate": "3.0.5",
     "nock": "13.2.9",

packages/eas-cli/src/build/__tests__/validate-test.ts

@@ -0,0 +1,142 @@
+import { Platform, Workflow } from '@expo/eas-build-job';
+import { ExitError } from '@oclif/core/lib/errors';
+import path from 'path';
+import { instance, mock, when } from 'ts-mockito';
+
+import { CommonContext } from '../context';
+import { validatePNGsForManagedProjectAsync } from '../validate';
+
+const fixturesPath = path.join(__dirname, 'fixtures');
+
+describe(validatePNGsForManagedProjectAsync, () => {
+  it('does not validate PNGs for generic projects', async () => {
+    const ctxMock = mock<CommonContext<Platform.ANDROID>>();
+    when(ctxMock.workflow).thenReturn(Workflow.GENERIC);
+    const ctx = instance(ctxMock);
+    await expect(validatePNGsForManagedProjectAsync(ctx)).resolves.not.toThrow();
+  });
+
+  it('does not validate PNGs for projects with SDK >= 47', async () => {
+    const ctxMock = mock<CommonContext<Platform.ANDROID>>();
+    when(ctxMock.workflow).thenReturn(Workflow.GENERIC);
+    when(ctxMock.exp).thenReturn({
+      name: 'blah',
+      slug: 'blah',
+      android: { adaptiveIcon: { foregroundImage: 'assets/icon.jpg' } },
+      sdkVersion: '47.0.0',
+    });
+    const ctx = instance(ctxMock);
+    await expect(validatePNGsForManagedProjectAsync(ctx)).resolves.not.toThrow();
+  });
+
+  describe(Platform.ANDROID, () => {
+    it('exits if foregroundImage is not a file with .png extension', async () => {
+      const ctxMock = mock<CommonContext<Platform.ANDROID>>();
+      when(ctxMock.workflow).thenReturn(Workflow.MANAGED);
+      when(ctxMock.platform).thenReturn(Platform.ANDROID);
+      when(ctxMock.exp).thenReturn({
+        name: 'blah',
+        slug: 'blah',
+        android: { adaptiveIcon: { foregroundImage: 'assets/icon.jpg' } },
+        sdkVersion: '46.0.0',
+      });
+      const ctx = instance(ctxMock);
+
+      await expect(validatePNGsForManagedProjectAsync(ctx)).rejects.toThrow(ExitError);
+    });
+
+    it('exits if foregroundImage is not a png file', async () => {
+      const ctxMock = mock<CommonContext<Platform.ANDROID>>();
+      when(ctxMock.workflow).thenReturn(Workflow.MANAGED);
+      when(ctxMock.platform).thenReturn(Platform.ANDROID);
+      when(ctxMock.exp).thenReturn({
+        name: 'blah',
+        slug: 'blah',
+        android: { adaptiveIcon: { foregroundImage: path.join(fixturesPath, 'icon-jpg.png') } },
+        sdkVersion: '46.0.0',
+      });
+      const ctx = instance(ctxMock);
+
+      await expect(validatePNGsForManagedProjectAsync(ctx)).rejects.toThrow(ExitError);
+    });
+
+    it('does not throw if foregroundImage is a png file', async () => {
+      const ctxMock = mock<CommonContext<Platform.ANDROID>>();
+      when(ctxMock.workflow).thenReturn(Workflow.MANAGED);
+      when(ctxMock.platform).thenReturn(Platform.ANDROID);
+      when(ctxMock.exp).thenReturn({
+        name: 'blah',
+        slug: 'blah',
+        android: { adaptiveIcon: { foregroundImage: path.join(fixturesPath, 'icon-alpha.png') } },
+        sdkVersion: '46.0.0',
+      });
+      const ctx = instance(ctxMock);
+
+      await expect(validatePNGsForManagedProjectAsync(ctx)).resolves.not.toThrow();
+    });
+  });
+
+  // Validating iOS PNGs is currently disabled
+  // See https://github.com/expo/eas-cli/pull/1477 for context
+  xdescribe(Platform.IOS, () => {
+    it('exits if icon is not a file with .png extension', async () => {
+      const ctxMock = mock<CommonContext<Platform.IOS>>();
+      when(ctxMock.workflow).thenReturn(Workflow.MANAGED);
+      when(ctxMock.platform).thenReturn(Platform.IOS);
+      when(ctxMock.exp).thenReturn({
+        name: 'blah',
+        slug: 'blah',
+        ios: { icon: path.join(fixturesPath, 'assets/icon.jpg') },
+        sdkVersion: '46.0.0',
+      });
+      const ctx = instance(ctxMock);
+
+      await expect(validatePNGsForManagedProjectAsync(ctx)).rejects.toThrow(ExitError);
+    });
+
+    it('exits if icon is not a png file', async () => {
+      const ctxMock = mock<CommonContext<Platform.IOS>>();
+      when(ctxMock.workflow).thenReturn(Workflow.MANAGED);
+      when(ctxMock.platform).thenReturn(Platform.IOS);
+      when(ctxMock.exp).thenReturn({
+        name: 'blah',
+        slug: 'blah',
+        ios: { icon: path.join(fixturesPath, 'icon-jpg.png') },
+        sdkVersion: '46.0.0',
+      });
+      const ctx = instance(ctxMock);
+
+      await expect(validatePNGsForManagedProjectAsync(ctx)).rejects.toThrow(ExitError);
+    });
+
+    it('exits if icon has alpha channel (transparency)', async () => {
+      const ctxMock = mock<CommonContext<Platform.IOS>>();
+      when(ctxMock.workflow).thenReturn(Workflow.MANAGED);
+      when(ctxMock.platform).thenReturn(Platform.IOS);
+      when(ctxMock.exp).thenReturn({
+        name: 'blah',
+        slug: 'blah',
+        ios: { icon: path.join(fixturesPath, 'icon-alpha.png') },
+        sdkVersion: '46.0.0',
+      });
+      const ctx = instance(ctxMock);
+
+      await expect(validatePNGsForManagedProjectAsync(ctx)).rejects.toThrow(ExitError);
+    });
+
+    it('does not throw if icon is a png file and does not have alpha channel', async () => {
+      const ctxMock = mock<CommonContext<Platform.IOS>>();
+      when(ctxMock.workflow).thenReturn(Workflow.MANAGED);
+      when(ctxMock.platform).thenReturn(Platform.IOS);
+      when(ctxMock.exp).thenReturn({
+        name: 'blah',
+        slug: 'blah',
+        ios: { icon: path.join(fixturesPath, 'icon-no-alpha.png') },
+        sdkVersion: '46.0.0',
+      });
+      const ctx = instance(ctxMock);
+
+      await expect(validatePNGsForManagedProjectAsync(ctx)).resolves.not.toThrow();
+    });
+  });
+});

packages/eas-cli/src/build/android/build.ts

@@ -24,7 +24,11 @@ import {
 import { AndroidBuildContext, BuildContext, CommonContext } from '../context';
 import { transformMetadata } from '../graphql';
 import { logCredentialsSource } from '../utils/credentials';
-import { checkGoogleServicesFileAsync, checkNodeEnvVariable } from '../validate';
+import {
+  checkGoogleServicesFileAsync,
+  checkNodeEnvVariable,
+  validatePNGsForManagedProjectAsync,
+} from '../validate';
 import { transformJob } from './graphql';
 import { prepareJobAsync } from './prepareJob';
 import { syncProjectConfigurationAsync } from './syncProjectConfiguration';
@@ -53,6 +57,7 @@ This means that it will most likely produce an AAB and you will not be able to i
 
   checkNodeEnvVariable(ctx);
   await checkGoogleServicesFileAsync(ctx);
+  await validatePNGsForManagedProjectAsync(ctx);
 
   const gradleContext = await resolveGradleBuildContextAsync(ctx.projectDir, buildProfile);
 

packages/eas-cli/src/build/ios/build.ts

@@ -10,7 +10,11 @@ import { findApplicationTarget, resolveTargetsAsync } from '../../project/ios/ta
 import { BuildRequestSender, JobData, prepareBuildRequestForPlatformAsync } from '../build';
 import { BuildContext, CommonContext, IosBuildContext } from '../context';
 import { transformMetadata } from '../graphql';
-import { checkGoogleServicesFileAsync, checkNodeEnvVariable } from '../validate';
+import {
+  checkGoogleServicesFileAsync,
+  checkNodeEnvVariable,
+  validatePNGsForManagedProjectAsync,
+} from '../validate';
 import { ensureIosCredentialsAsync } from './credentials';
 import { transformJob } from './graphql';
 import { prepareJobAsync } from './prepareJob';
@@ -28,6 +32,7 @@ export async function createIosContextAsync(
 
   checkNodeEnvVariable(ctx);
   await checkGoogleServicesFileAsync(ctx);
+  await validatePNGsForManagedProjectAsync(ctx);
 
   const xcodeBuildContext = await resolveXcodeBuildContextAsync(
     {

packages/eas-cli/src/build/validate.ts

@@ -1,8 +1,11 @@
 import { Platform, Workflow } from '@expo/eas-build-job';
+import { Errors } from '@oclif/core';
 import fs from 'fs-extra';
 import path from 'path';
+import semver from 'semver';
 
 import Log, { learnMore } from '../log';
+import { isPNGAsync } from '../utils/image';
 import { getVcsClient } from '../vcs';
 import { CommonContext } from './context';
 
@@ -50,3 +53,137 @@ export async function checkGoogleServicesFileAsync<T extends Platform>(
 function isInsideDirectory(file: string, directory: string): boolean {
   return file.startsWith(directory);
 }
+
+export async function validatePNGsForManagedProjectAsync<T extends Platform>(
+  ctx: CommonContext<T>
+): Promise<void> {
+  if (ctx.workflow !== Workflow.MANAGED) {
+    return;
+  }
+
+  // don't run PNG checks on SDK 47 and newer
+  // see https://github.com/expo/eas-cli/pull/1477#issuecomment-1293914917
+  if (!ctx.exp.sdkVersion || semver.satisfies(ctx.exp.sdkVersion, '>= 47.0.0')) {
+    return;
+  }
+
+  if (ctx.platform === Platform.ANDROID) {
+    await validateAndroidPNGsAsync(ctx as CommonContext<Platform.ANDROID>);
+  }
+  // Validating iOS PNGs is currently disabled
+  // See https://github.com/expo/eas-cli/pull/1477 for context
+  //
+  // else {
+  //   await validateIosPNGsAsync(ctx as CommonContext<Platform.IOS>);
+  // }
+}
+
+type ConfigPng = { configPath: string; pngPath: string | undefined };
+
+async function validateAndroidPNGsAsync(ctx: CommonContext<Platform.ANDROID>): Promise<void> {
+  const pngs: ConfigPng[] = [
+    {
+      configPath: 'exp.icon',
+      pngPath: ctx.exp.icon,
+    },
+    {
+      configPath: 'exp.android.icon',
+      pngPath: ctx.exp.android?.icon,
+    },
+    {
+      configPath: 'exp.android.adaptiveIcon.foregroundImage',
+      pngPath: ctx.exp.android?.adaptiveIcon?.foregroundImage,
+    },
+    {
+      configPath: 'exp.android.adaptiveIcon.backgroundImage',
+      pngPath: ctx.exp.android?.adaptiveIcon?.backgroundImage,
+    },
+    {
+      configPath: 'exp.splash.image',
+      pngPath: ctx.exp.splash?.image,
+    },
+    {
+      configPath: 'exp.notification.icon',
+      pngPath: ctx.exp.notification?.icon,
+    },
+  ];
+  await validatePNGsAsync(pngs);
+}
+
+// Validating iOS PNGs is currently disabled
+// See https://github.com/expo/eas-cli/pull/1477 for context
+//
+// async function validateIosPNGsAsync(ctx: CommonContext<Platform.IOS>): Promise<void> {
+//   const pngs: ConfigPng[] = [
+//     {
+//       configPath: 'exp.icon',
+//       pngPath: ctx.exp.icon,
+//     },
+//     {
+//       configPath: 'exp.ios.icon',
+//       pngPath: ctx.exp.ios?.icon,
+//     },
+//     {
+//       configPath: 'exp.splash.image',
+//       pngPath: ctx.exp.splash?.image,
+//     },
+//     {
+//       configPath: 'exp.notification.icon',
+//       pngPath: ctx.exp.notification?.icon,
+//     },
+//   ];
+//   await validatePNGsAsync(pngs);
+
+//   const icon = ctx.exp.ios?.icon ?? ctx.exp.icon;
+//   if (!icon) {
+//     return;
+//   }
+//   const iconConfigPath = `expo${ctx.exp.ios?.icon ? '.ios' : ''}.icon`;
+
+//   try {
+//     await ensurePNGIsNotTransparentAsync(icon);
+//   } catch (err: any) {
+//     if (err instanceof ImageTransparencyError) {
+//       Log.error(
+//         `Your iOS app icon (${iconConfigPath}) can't have transparency if you wish to upload your app to the Apple App Store.`
+//       );
+//       Log.error(learnMore('https://expo.fyi/remove-alpha-channel', { dim: false }));
+//       Errors.exit(1);
+//     } else {
+//       throw err;
+//     }
+//   }
+// }
+
+async function validatePNGsAsync(configPngs: ConfigPng[]): Promise<void> {
+  const validationPromises = configPngs.map(configPng => validatePNGAsync(configPng));
+  const validationResults = await Promise.allSettled(validationPromises);
+  const failedValidations = validationResults.filter(
+    (result): result is PromiseRejectedResult => result.status === 'rejected'
+  );
+
+  if (failedValidations.length === 0) {
+    return;
+  }
+
+  Log.error('PNG images validation failed:');
+  for (const { reason } of failedValidations) {
+    const error: Error = reason;
+    Log.error(`- ${error.message}`);
+  }
+  Errors.exit(1);
+}
+
+async function validatePNGAsync({ configPath, pngPath }: ConfigPng): Promise<void> {
+  if (!pngPath) {
+    return;
+  }
+
+  if (!pngPath.endsWith('.png')) {
+    throw new Error(`"${configPath}" is not a PNG file`);
+  }
+
+  if (!(await isPNGAsync(pngPath))) {
+    throw new Error(`"${configPath}" is not valid PNG`);
+  }
+}