Binary files in examples directory are corrupted in dist archives

[yacchin1205]

PNG image files in the examples/img/ directory are corrupted when downloaded from the dist archive (jspsych.zip) attached to GitHub releases. The files appear as invalid data instead of proper PNG images.

Steps to Reproduce

1. Download the dist archive (jspsych.zip) from any recent jsPsych release
2. Extract the archive
3. Navigate to examples/img/
4. Try to open blue.png or orange.png
5. The files will not open as valid images

Possible Cause

The issue might be related to the build process during GitHub Actions workflow. In packages/config/gulp.js, the createCoreDistArchive task https://github.com/jspsych/jsPsych/blob/main/packages/config/gulp.js#L89-L96 appears to apply a text replacement operation to all files in the examples directory:

  src("examples/**/*", { base: "." })
    // Rewrite script source paths
    .pipe(
      replace(
        /<script src="(.*)\/packages\/(.*)\/dist\/index\.browser\.js"/g,
        '<script src="$1/dist/$2.js"'
      )

It seems that this replace() operation might be treating binary files (PNG images) as UTF-8 text, which could corrupt them by replacing invalid byte sequences with the UTF-8 replacement character (0xEF 0xBF 0xBD).

• hexdump blue-original.png | head -n 1 - 0000000 5089 474e 0a0d 0a1a 0000 0d00 4849 5244
• hexdump blue-distarchive.png | head -n 1 - 0000000 bfef 50bd 474e 0a0d 0a1a 0000 0d00 4849 (<- starts with 0xEF 0xBF 0xBD)

Possible Solution

It might be helpful to ensure that text transformations are only applied to text-based files (such as HTML, JS, CSS) and that binary files (images, etc.) are copied without modification during the build process.