fix(bazel): ng_package(data) should support non-text files (#32721)

PR Close #32721

packages/bazel/src/ng_package/packager.ts

@@ -109,7 +109,7 @@ function main(args: string[]): number {
    * @param inputPath Path to the file in the input tree.
    * @param fileContent Content of the file.
    */
-  function writeFileFromInputPath(inputPath: string, fileContent: string) {
+  function writeFileFromInputPath(inputPath: string, fileContent: string | Buffer) {
     // We want the relative path from the given file to its ancestor "root" directory.
     // This root depends on whether the file lives in the source tree (srcDir) as a basic file
     // input to ng_package, the bin output tree (binDir) as the output of another rule, or
@@ -127,7 +127,7 @@ function main(args: string[]): number {
 
     // Always ensure that the target directory exists.
     shx.mkdir('-p', path.dirname(outputPath));
-    fs.writeFileSync(outputPath, fileContent, 'utf-8');
+    fs.writeFileSync(outputPath, fileContent);
   }
 
   /**
@@ -135,7 +135,7 @@ function main(args: string[]): number {
    * @param inputPath a path relative to the binDir, typically from a file in the deps[]
    */
   function copyFileFromInputPath(inputPath: string) {
-    writeFileFromInputPath(inputPath, fs.readFileSync(inputPath, 'utf-8'));
+    writeFileFromInputPath(inputPath, fs.readFileSync(inputPath));
   }
 
   /**

packages/bazel/test/ng_package/example/BUILD.bazel

@@ -22,6 +22,7 @@ ng_package(
         ":arbitrary_bin_file",
         ":arbitrary_genfiles_file",
         ":extra-styles.css",
+        ":logo.png",
     ],
     entry_point = ":index.ts",
     entry_point_name = "waffels",

packages/bazel/test/ng_package/example_package.golden

@@ -42,6 +42,7 @@ fesm5
   fesm5/secondary.js.map
   fesm5/waffels.js
   fesm5/waffels.js.map
+logo.png
 package.json
 secondary
   secondary/package.json
@@ -987,6 +988,10 @@ export { MyModule };
 //# sourceMappingURL=waffels.js.map
 
 
+--- logo.png ---
+
+9db278d630f5fabd8e7ba16c2e329a3a
+
 --- package.json ---
 
 {

packages/bazel/test/ng_package/example_package.spec.ts

@@ -6,6 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
+import * as crypto from 'crypto';
 import {createPatch} from 'diff';
 import * as fs from 'fs';
 import * as path from 'path';
@@ -73,6 +74,10 @@ function getDescendantFilesContents(directoryPath: string): string[] {
       result.push(...getDescendantFilesContents(path.posix.join(directoryPath, dir)));
     });
   }
+  // Binary files should equal the same as in the srcdir.
+  else if (path.extname(directoryPath) === '.png') {
+    result.push(`--- ${directoryPath} ---`, '', hashFileContents(directoryPath), '');
+  }
   // Note that we don't want to include ".map" files in the golden file since these are not
   // consistent across different environments (e.g. path delimiters)
   else if (path.extname(directoryPath) !== '.map') {
@@ -137,6 +142,10 @@ function readFileContents(filePath: string): string {
   return fs.readFileSync(filePath, 'utf8').replace(/\r/g, '');
 }
 
+function hashFileContents(filePath: string): string {
+  return crypto.createHash('md5').update(fs.readFileSync(filePath)).digest('hex');
+}
+
 if (require.main === module) {
   const args = process.argv.slice(2);
   const acceptingNewGold = (args[0] === '--accept');