CldVideoPlayer: poster fails with aspectRatio and a transformation array #675

Bug report

Describe the bug

In next-cloudinary 7.x (Video Player v4), when CldVideoPlayer has both an aspectRatio and a transformation array, the poster image fails to load (Cloudinary returns a 400). The video itself plays normally.

This is the remaining case after #674, which fixes the poster for aspectRatio on its own and with a transformation object, but deliberately leaves arrays unchanged.

Steps to reproduce

<CldVideoPlayer
  width="1620"
  height="1080"
  src="videos/mountain-stars"
  aspectRatio="16:9"
  transformation={[{ effect: 'sepia' }, { width: 300 }]}
/>

The poster URL ends with a step that has ar_16:9 and no crop, which Cloudinary rejects for images:

…/poster?tx=q_auto/e_sepia/ar_16:9/c_limit,w_700  → 400

Expected behaviour

The poster loads, as it did in 6.x.

Cause

The player turns each item of a transformation array into its own URL step and adds aspectRatio as one more step on its own (see cloudinary/cloudinary-video-player#1087). In 6.x (Video Player 1.x), aspectRatio only set the player's size and never appeared in the URLs, so this combination worked.

Why it isn't fixed in #674

With an array, each item is a separate step the user chose on purpose, and the order matters (for example, a crop before or after an effect). Merging the steps into one object, as #674 does for objects, could change the result the user asked for. Possible approaches to discuss:

• add the aspect ratio to the user's last step instead of a separate one,
• or leave the array as is and document the workaround below.

Workaround

The 7.0.0 workaround also works with arrays: add cropMode="fill". The player puts the crop in the same step as the aspect ratio, so the poster loads:

<CldVideoPlayer
  width="1620"
  height="1080"
  src="videos/mountain-stars"
  aspectRatio="16:9"
  transformation={[{ effect: 'sepia' }, { width: 300 }]}
  {...({ cropMode: 'fill' } as object)}
/>

…/poster?tx=q_auto/e_sepia/ar_16:9,c_fill/c_limit,w_700  → loads

As with the 7.0.0 workaround, this also crops the video to the aspect ratio (1620×1080 → 1620×910 for 16:9), and cropMode isn't in the TypeScript types, hence the cast.

Environment

• next-cloudinary 7.0.0
• Cloudinary Video Player 4.1.2 (the version next-cloudinary loads)
• Next.js 16