Video block: Fix incorrect aspect ratio for portrait videos with rotation metadata

[Copilot]

Portrait videos encoded in landscape orientation with a container-level rotation flag (common on mobile devices) render with a swapped aspect ratio on the front end. The inline aspect-ratio: 1920 / 1080 style added by render_block_core_video uses the physical (pre-rotation) dimensions from wp_get_attachment_metadata(), which wp_read_video_metadata() populates from getID3's raw resolution_x/resolution_y — neither of which accounts for rotation.

Why aspect-ratio: auto W / H is not the fix

The obvious candidate — prepending auto — doesn't work. Per the HTML spec and CSSWG issue #7524, <video> has a defined default object size of 300×150 that is always treated as the element's natural aspect ratio before video data loads. auto therefore resolves to 300/150 before loading rather than falling back to W/H, reintroducing the CLS that the inline style was specifically introduced to prevent.

Root cause

getID3 does compute the rotation from the QuickTime tkhd atom's transform matrix and stores it in $data['video']['rotate'], but wp_read_video_metadata() never extracts it into the stored attachment metadata.

Changes

• wp_read_video_metadata filter (gutenberg_add_video_rotation_to_metadata): persists getID3's $data['video']['rotate'] into the attachment metadata rotate key at upload time. Does not overwrite a rotate value already present.

• render_block_core_video: when rotate is ±90 or ±270, swaps width/height before writing the width/height HTML attributes and the aspect-ratio inline style:

$width  = $metadata['width'];
$height = $metadata['height'];
if ( isset( $metadata['rotate'] ) && in_array( abs( (int) $metadata['rotate'] ), array( 90, 270 ), true ) ) {
    $width  = $metadata['height'];
    $height = $metadata['width'];
}
// aspect-ratio: 1080 / 1920  ← correct for a 90°-rotated 1920×1080 file
$aspect_ratio_style = sprintf( 'aspect-ratio: %d / %d;', $width, $height );

Limitation

Videos already in the media library will not have the rotate key in their stored metadata until attachment metadata is regenerated (e.g. re-upload or wp media regenerate). Newly uploaded videos are fixed automatically.

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• caniuse.com
  • Triggering command: /home/REDACTED/work/_temp/ghcca-node/node/bin/node /home/REDACTED/work/_temp/ghcca-node/node/bin/node --enable-source-maps /home/REDACTED/work/_temp/copilot-developer-action-main/dist/index.js (dns block)
• developer.wordpress.org
  • Triggering command: /home/REDACTED/work/_temp/ghcca-node/node/bin/node /home/REDACTED/work/_temp/ghcca-node/node/bin/node --enable-source-maps /home/REDACTED/work/_temp/copilot-developer-action-main/dist/index.js (dns block)
• drafts.csswg.org
  • Triggering command: /home/REDACTED/work/_temp/ghcca-node/node/bin/node /home/REDACTED/work/_temp/ghcca-node/node/bin/node --enable-source-maps /home/REDACTED/work/_temp/copilot-developer-action-main/dist/index.js (dns block)
• https://api.github.com/graphql
  • Triggering command: /usr/bin/gh gh pr view 70293 --json body,title,comments (http block)
• https://api.github.com/repos/PHPCSStandards/PHPCSUtils/zipball/c216317e96c8b3f5932808f9b0f1f7a14e3bbf55
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/PHPCSStandards/PHP_CodeSniffer/zipball/0ca86845ce43291e8f5692c7356fccf3bcf02bf4
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/PHPCSStandards/composer-installer/zipball/845eb62303d2ca9b289ef216356568ccc075ffd1
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/PHPCompatibility/PHPCompatibility/zipball/9fb324479acf6f39452e0655d2429cc0d3914243
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/PHPCompatibility/PHPCompatibilityParagonie/zipball/244d7b04fc4bc2117c15f5abe23eb933b5f02bbf
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/PHPCompatibility/PHPCompatibilityWP/zipball/7c8d18b4d90dac9e86b0869a608fa09158e168fa
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/clue/reactphp-term/zipball/00f297dc597eaee2ebf98af8f27cca5d21d60fa3
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/clue/reactphp-utf8/zipball/d5cd04d39cb5457aa5df830b7c4b301d2694217e
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/composer/installers/zipball/12fb2dfe5e16183de69e784a7b84046c43d97e8e
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/doctrine/instantiator/zipball/c6222283fa3f4ac679f8b9ced9a4e23f163e80d0
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/igorw/evenement/zipball/0a16b0d71ab13284339abb99d9d2bd813640efbc
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/jolicode/php-os-helper/zipball/e71596ae67d477fe214a5908f5522b9e4d19fd37
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/myclabs/DeepCopy/zipball/07d290f0c47959fd5eed98c95ee5602db07e0b6a
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/nikic/PHP-Parser/zipball/dca41cd15c2ac9d055ad70dbfd011130757d1f82
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/phar-io/manifest/zipball/54750ef60c58e43759730615a392c31c80e23176
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/phar-io/version/zipball/4f7fd7836c6f332bb2933569e566a0d6c4cbed74
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/reactphp/event-loop/zipball/ba276bda6083df7e0050fd9b33f66ad7a4ac747a
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/reactphp/stream/zipball/1e5b0acb8fe55143b5b426817155190eb6f5b18d
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/code-unit-reverse-lookup/zipball/ac91f01ccec49fb77bdc6fd1e548bc70f7faa3e5
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/code-unit/zipball/1fc9f64c0927627ef78ba436c9b17d967e68e120
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/complexity/zipball/25f207c40d62b8b7aa32f5ab026c53561964053a
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/diff/zipball/ba01945089c3a293b01ba9badc29ad55b106b0bc
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/environment/zipball/830c43a844f1f8d5b7a1f6d6076b784454d8b7ed
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/exporter/zipball/14c6ba52f95a36c3d27c835d65efc7123c446e8c
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/lines-of-code/zipball/e1e4a170560925c26d424b6a03aed157e7dcc5c5
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/php-code-coverage/zipball/85402a822d1ecf1db1096959413d35e1c37cf1a5
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/php-file-iterator/zipball/cf1c2e7c203ac650e352f4cc675a7021e7d1b3cf
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/php-text-template/zipball/5da5f67fc95621df9ff4c4e5a84d6a8a2acf7c28
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/recursion-context/zipball/539c6691e0623af6dc6f9c20384c120f963465a0
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/sebastianbergmann/version/zipball/c6c1022351a901512170118436c764e473f6de8c
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/symfony/polyfill-ctype/zipball/a3cc8b044a6ea513310cbd48ef7333b384945638
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• https://api.github.com/repos/theseer/tokenizer/zipball/b7489ce515e168639d17feec34b8847c326b0b3c
  • Triggering command: /usr/bin/php8.3 /usr/bin/php8.3 -n -c /tmp/rV4vwg /usr/bin/composer install --no-interaction (http block)
• weston.ruter.net
  • Triggering command: /home/REDACTED/work/_temp/ghcca-node/node/bin/node /home/REDACTED/work/_temp/ghcca-node/node/bin/node --enable-source-maps /home/REDACTED/work/_temp/copilot-developer-action-main/dist/index.js (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Video block renders incorrect aspect ratio for portrait videos on front end</issue_title>
<issue_description>### Description

Expected Behavior

Portrait videos added via the Video block should render with the correct aspect ratio on the front end, matching how they appear in the editor (vertical orientation).

Current Behavior

Portrait videos added via the Video block render with an incorrect aspect ratio on the front end — the width and height values appear to be swapped in the block HTML, causing videos to display in landscape orientation instead of portrait.

There's a style="aspect-ratio: 1920 / 1080;" attribute on the video tag that seems to cause it. style="aspect-ratio: auto 1920 / 1080;" would be right.

Step-by-step reproduction instructions

• Upload a portrait-oriented video to the Media Library (important, videos uploaded to the Editor seem to work).
• Add it to a post using the Video block
• Save and publish the post
• View the post on the front end
• Video renders with incorrect (landscape) aspect ratio despite correct orientation in editor

Screenshots, screen recording, code snippet

Environment info

No response

Please confirm that you have searched existing issues in the repo.

• Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

• Yes

Please confirm which theme type you used for testing.

• Block
• Classic
• Hybrid (e.g. classic with theme.json)
• Not sure</issue_description>

Comments on the Issue (you are @copilot in this section)

• Fixes Video block renders incorrect aspect ratio for portrait videos on front end #76219

---

🔒 GitHub Advanced Security automatically protects Copilot coding agent pull requests. You can protect all pull requests by enabling Advanced Security for your repositories. Learn more about Advanced Security.

[github-actions]

Flaky tests detected in 49c715b.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/22737399016
📝 Reported issues:

• [Flaky Test] Allow creating custom block templates in classic themes #52687 in /test/e2e/specs/editor/various/post-editor-template-mode.spec.js
• [Flaky Test] Custom Completer: should insert option #47280 in /test/e2e/specs/editor/various/autocomplete-and-mentions.spec.js
• [Flaky Test] User Mention: should insert two subsequent mentions #48569 in /test/e2e/specs/editor/various/autocomplete-and-mentions.spec.js
• [Flaky Test] should not create undo levels when publishing #48864 in /test/e2e/specs/editor/various/undo.spec.js