From 873082b83737665a8a6fcf28aee8bbe961628366 Mon Sep 17 00:00:00 2001 From: RaduCristianPopescu <119046336+RaduCristianPopescu@users.noreply.github.com> Date: Thu, 31 Jul 2025 16:29:07 +0300 Subject: [PATCH 1/7] feat: added thumbnail image control --- .../feedzy-rss-feeds-admin-abstract.php | 33 +++++++++- .../feedzy-rss-feeds-gutenberg-block.php | 4 ++ js/FeedzyBlock/Editor.js | 38 +++++------ js/FeedzyBlock/attributes.js | 10 ++- js/FeedzyBlock/inspector.js | 66 +++++++++++++++++++ 5 files changed, 126 insertions(+), 25 deletions(-) diff --git a/includes/abstract/feedzy-rss-feeds-admin-abstract.php b/includes/abstract/feedzy-rss-feeds-admin-abstract.php index 65ff80f13..251ede89f 100644 --- a/includes/abstract/feedzy-rss-feeds-admin-abstract.php +++ b/includes/abstract/feedzy-rss-feeds-admin-abstract.php @@ -620,6 +620,8 @@ public function get_short_code_attributes( $atts ) { 'default' => '', // thumbs pixel size. 'size' => '', + // default aspect ratio for the image. + 'aspectRatio' => 'auto', // only display item if title contains specific keywords (Use comma(,) and plus(+) keyword). 'keywords_title' => '', // only display item if title OR content contains specific keywords (Use comma(,) and plus(+) keyword). @@ -1421,10 +1423,24 @@ private function get_feed_item_filter( $sc, $sizes, $item, $feed_url, $index, $i ) ) { $the_thumbnail = $this->feedzy_image_encode( $the_thumbnail ); - $content_thumb .= ''; + + $img_style = ''; + + if ( isset( $sizes['height'] ) && is_numeric( $sizes['height'] ) ) { + $img_style .= 'height:' . $sizes['height'] . 'px;'; + } + + if ( isset( $sc['aspectRatio'] ) ) { + $img_style .= 'aspect-ratio:' . $sc['aspectRatio'] . ';'; + } else if ( isset( $sizes['width'] ) && is_numeric( $sizes['width'] ) ) { + $img_style .= 'width:' . $sizes['width'] . 'px;'; + } + + $content_thumb .= ''; + if ( ! isset( $sc['amp'] ) || 'no' !== $sc['amp'] ) { $content_thumb .= ''; - } + } } if ( empty( $the_thumbnail ) && 'yes' === $sc['thumb'] ) { @@ -1593,11 +1609,22 @@ private function get_feed_item_filter( $sc, $sizes, $item, $feed_url, $index, $i if ( empty( $item_content ) ) { $item_content = esc_html__( 'Post Content', 'feedzy-rss-feeds' ); } + + $img_style = ''; + if ( isset( $sizes['height'] ) ) { + $img_style = 'height:' . $sizes['height'] . 'px;'; + if ( isset( $sc['aspectRatio'] ) ) { + $img_style .= 'aspect-ratio:' . $sc['aspectRatio'] . ';'; + } else if( isset( $sizes['width'] ) ) { + $img_style .= 'width:' . $sizes['width'] . 'px;'; + } + } + $item_array = array( 'feed_url' => $item->get_feed()->subscribe_url(), 'item_unique_hash' => wp_hash( $item->get_permalink() ), 'item_img_class' => 'rss_image', - 'item_img_style' => 'width:' . $sizes['width'] . 'px; height:' . $sizes['height'] . 'px;', + 'item_img_style' => $img_style, 'item_url' => $new_link, 'item_url_target' => $sc['target'], 'item_url_follow' => isset( $sc['follow'] ) && 'yes' === $sc['follow'] ? 'nofollow' : '', diff --git a/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php b/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php index 8752e324f..45995da07 100644 --- a/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php +++ b/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php @@ -171,6 +171,10 @@ public function feedzy_register_block_type() { 'type' => 'number', 'default' => 150, ), + 'aspectRatio' => array( + 'type' => 'string', + 'default' => 'auto', + ), 'price' => array( 'type' => 'boolean', 'default' => true, diff --git a/js/FeedzyBlock/Editor.js b/js/FeedzyBlock/Editor.js index 91a6022f1..05f6efee5 100644 --- a/js/FeedzyBlock/Editor.js +++ b/js/FeedzyBlock/Editor.js @@ -53,6 +53,7 @@ class Editor extends Component { this.onThumb = this.onThumb.bind(this); this.onDefault = this.onDefault.bind(this); this.onSize = this.onSize.bind(this); + this.onAspectRatio = this.onAspectRatio.bind(this); this.onReferralURL = this.onReferralURL.bind(this); this.onColumns = this.onColumns.bind(this); this.onTemplate = this.onTemplate.bind(this); @@ -326,6 +327,9 @@ class Editor extends Component { onSize(value) { this.props.setAttributes({ size: !value ? 150 : Number(value) }); } + onAspectRatio(value) { + this.props.setAttributes({ aspectRatio: value }); + } onReferralURL(value) { window.tiTrk?.with('feedzy').add({ feature: 'block-referral-url' }); this.props.setAttributes({ referral_url: value }); @@ -669,9 +673,9 @@ class Editor extends Component {
- + />
diff --git a/js/FeedzyBlock/attributes.js b/js/FeedzyBlock/attributes.js index 79a831595..9ca1441dd 100644 --- a/js/FeedzyBlock/attributes.js +++ b/js/FeedzyBlock/attributes.js @@ -117,7 +117,7 @@ const attributes = { disableStyle: { type: 'boolean', default: false, - }, + }, follow: { type: 'string', default: 'no', @@ -137,7 +137,11 @@ const attributes = { _dry_run_tags_: { type: 'string', default: '', - } + }, + aspectRatio: { + type: 'string', + default: 'auto', + }, }; -export default attributes; \ No newline at end of file +export default attributes; diff --git a/js/FeedzyBlock/inspector.js b/js/FeedzyBlock/inspector.js index 1d68c3a9c..d29a224dc 100644 --- a/js/FeedzyBlock/inspector.js +++ b/js/FeedzyBlock/inspector.js @@ -660,6 +660,72 @@ class Inspector extends Component { this.props.edit.onSize } /> + )} From 18e5498a06fe587a4973a7a34542b12905702401 Mon Sep 17 00:00:00 2001 From: RaduCristianPopescu <119046336+RaduCristianPopescu@users.noreply.github.com> Date: Thu, 31 Jul 2025 16:35:57 +0300 Subject: [PATCH 2/7] fix: formatting --- .../feedzy-rss-feeds-admin-abstract.php | 18 ++++++++++++------ .../feedzy-rss-feeds-gutenberg-block.php | 2 +- 2 files changed, 13 insertions(+), 7 deletions(-) diff --git a/includes/abstract/feedzy-rss-feeds-admin-abstract.php b/includes/abstract/feedzy-rss-feeds-admin-abstract.php index 251ede89f..caac7b36c 100644 --- a/includes/abstract/feedzy-rss-feeds-admin-abstract.php +++ b/includes/abstract/feedzy-rss-feeds-admin-abstract.php @@ -621,7 +621,7 @@ public function get_short_code_attributes( $atts ) { // thumbs pixel size. 'size' => '', // default aspect ratio for the image. - 'aspectRatio' => 'auto', + 'aspectRatio' => 'auto', // only display item if title contains specific keywords (Use comma(,) and plus(+) keyword). 'keywords_title' => '', // only display item if title OR content contains specific keywords (Use comma(,) and plus(+) keyword). @@ -1422,14 +1422,20 @@ private function get_feed_item_filter( $sc, $sizes, $item, $feed_url, $index, $i ) ) ) { - $the_thumbnail = $this->feedzy_image_encode( $the_thumbnail ); + $the_thumbnail = $this->feedzy_image_encode( $the_thumbnail ); - $img_style = ''; + $img_style = ''; - if ( isset( $sizes['height'] ) && is_numeric( $sizes['height'] ) ) { + if ( isset( $sizes['height'] ) && is_numeric( $sizes['height'] ) ) { $img_style .= 'height:' . $sizes['height'] . 'px;'; } + if ( isset( $sc['aspectRatio'] ) ) { + $img_style .= 'aspect-ratio:' . $sc['aspectRatio'] . ';'; + } elseif ( isset( $sizes['width'] ) && is_numeric( $sizes['width'] ) ) { + $img_style .= 'width:' . $sizes['width'] . 'px;'; + } + if ( isset( $sc['aspectRatio'] ) ) { $img_style .= 'aspect-ratio:' . $sc['aspectRatio'] . ';'; } else if ( isset( $sizes['width'] ) && is_numeric( $sizes['width'] ) ) { @@ -1440,7 +1446,7 @@ private function get_feed_item_filter( $sc, $sizes, $item, $feed_url, $index, $i if ( ! isset( $sc['amp'] ) || 'no' !== $sc['amp'] ) { $content_thumb .= ''; - } + } } if ( empty( $the_thumbnail ) && 'yes' === $sc['thumb'] ) { @@ -1615,7 +1621,7 @@ private function get_feed_item_filter( $sc, $sizes, $item, $feed_url, $index, $i $img_style = 'height:' . $sizes['height'] . 'px;'; if ( isset( $sc['aspectRatio'] ) ) { $img_style .= 'aspect-ratio:' . $sc['aspectRatio'] . ';'; - } else if( isset( $sizes['width'] ) ) { + } elseif ( isset( $sizes['width'] ) ) { $img_style .= 'width:' . $sizes['width'] . 'px;'; } } diff --git a/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php b/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php index 45995da07..65a6d27af 100644 --- a/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php +++ b/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php @@ -171,7 +171,7 @@ public function feedzy_register_block_type() { 'type' => 'number', 'default' => 150, ), - 'aspectRatio' => array( + 'aspectRatio' => array( 'type' => 'string', 'default' => 'auto', ), From c466b87a05527cc5185358d1d51c2109a161a65e Mon Sep 17 00:00:00 2001 From: RaduCristianPopescu <119046336+RaduCristianPopescu@users.noreply.github.com> Date: Fri, 1 Aug 2025 10:25:56 +0300 Subject: [PATCH 3/7] chore: format --- includes/abstract/feedzy-rss-feeds-admin-abstract.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/includes/abstract/feedzy-rss-feeds-admin-abstract.php b/includes/abstract/feedzy-rss-feeds-admin-abstract.php index caac7b36c..be075d877 100644 --- a/includes/abstract/feedzy-rss-feeds-admin-abstract.php +++ b/includes/abstract/feedzy-rss-feeds-admin-abstract.php @@ -1438,7 +1438,7 @@ private function get_feed_item_filter( $sc, $sizes, $item, $feed_url, $index, $i if ( isset( $sc['aspectRatio'] ) ) { $img_style .= 'aspect-ratio:' . $sc['aspectRatio'] . ';'; - } else if ( isset( $sizes['width'] ) && is_numeric( $sizes['width'] ) ) { + } elseif ( isset( $sizes['width'] ) && is_numeric( $sizes['width'] ) ) { $img_style .= 'width:' . $sizes['width'] . 'px;'; } From 27164cc98e5d16743042c8461202b0149e22a01c Mon Sep 17 00:00:00 2001 From: RaduCristianPopescu <119046336+RaduCristianPopescu@users.noreply.github.com> Date: Fri, 1 Aug 2025 10:43:42 +0300 Subject: [PATCH 4/7] refactor: selector's design --- js/FeedzyBlock/inspector.js | 25 ++++++++++++++++--------- 1 file changed, 16 insertions(+), 9 deletions(-) diff --git a/js/FeedzyBlock/inspector.js b/js/FeedzyBlock/inspector.js index d29a224dc..57bb9ffd3 100644 --- a/js/FeedzyBlock/inspector.js +++ b/js/FeedzyBlock/inspector.js @@ -682,21 +682,21 @@ class Inspector extends Component { '1:1 (Square)', 'feedzy-rss-feeds' ), - value: '1 / 1', + value: '1/1', }, { label: __( - '16:9 (Widescreen)', + '4:3 (Standard)', 'feedzy-rss-feeds' ), - value: '16 / 9', + value: '4/3', }, { label: __( - '4:3 (Standard)', + '3:4 (Portrait)', 'feedzy-rss-feeds' ), - value: '4 / 3', + value: '3/4', }, { label: __( @@ -707,17 +707,24 @@ class Inspector extends Component { }, { label: __( - '2:1 (Banner)', + '2:3 (Clasic Portrait)', 'feedzy-rss-feeds' ), - value: '2 / 1', + value: '2/3', }, { label: __( - '3:4 (Portrait)', + '16:9 (Widescreen)', + 'feedzy-rss-feeds' + ), + value: '16/9', + }, + { + label: __( + '9:16 (Vertical)', 'feedzy-rss-feeds' ), - value: '3 / 4', + value: '9/16', }, ]} onChange={ From 251a556956193b9b709006b8ac8ceeb150f0fe6f Mon Sep 17 00:00:00 2001 From: RaduCristianPopescu <119046336+RaduCristianPopescu@users.noreply.github.com> Date: Mon, 4 Aug 2025 16:50:05 +0300 Subject: [PATCH 5/7] fix: update default aspect ratio for compatibility --- .../feedzy-rss-feeds-admin-abstract.php | 88 ++++++++----------- .../feedzy-rss-feeds-gutenberg-block.php | 2 +- js/FeedzyBlock/attributes.js | 2 +- js/FeedzyBlock/inspector.js | 4 +- 4 files changed, 43 insertions(+), 53 deletions(-) diff --git a/includes/abstract/feedzy-rss-feeds-admin-abstract.php b/includes/abstract/feedzy-rss-feeds-admin-abstract.php index be075d877..adccf52ff 100644 --- a/includes/abstract/feedzy-rss-feeds-admin-abstract.php +++ b/includes/abstract/feedzy-rss-feeds-admin-abstract.php @@ -621,7 +621,7 @@ public function get_short_code_attributes( $atts ) { // thumbs pixel size. 'size' => '', // default aspect ratio for the image. - 'aspectRatio' => 'auto', + 'aspectRatio' => '1', // only display item if title contains specific keywords (Use comma(,) and plus(+) keyword). 'keywords_title' => '', // only display item if title OR content contains specific keywords (Use comma(,) and plus(+) keyword). @@ -1406,64 +1406,54 @@ private function get_feed_item_filter( $sc, $sizes, $item, $feed_url, $index, $i $item_link = $item->get_feed()->get_permalink(); } } - $new_link = apply_filters( 'feedzy_item_url_filter', $item_link, $sc, $item ); + $new_link = apply_filters( 'feedzy_item_url_filter', $item_link, $sc, $item ); + $amp_running = function_exists( 'amp_is_request' ) && amp_is_request(); + $content_thumb = ''; - // Fetch image thumbnail. + $thumbnail_to_use = ''; if ( 'yes' === $sc['thumb'] || 'auto' === $sc['thumb'] ) { - $the_thumbnail = $this->feedzy_retrieve_image( $item, $sc ); - $content_thumb = ''; + // Fetch image thumbnail. + $thumbnail_to_use = $this->feedzy_retrieve_image( $item, $sc ); + $thumbnail_to_use = $this->feedzy_image_encode( $thumbnail_to_use ); + + if ( empty( $thumbnail_to_use ) && 'yes' === $sc['thumb'] ) { + $thumbnail_to_use = $sc['default']; + } + } else { + $thumbnail_to_use = $sc['default']; + } + + if ( ! empty( $thumbnail_to_use ) && is_string( $thumbnail_to_use ) ) { + $img_style = ''; + + if ( isset( $sizes['height'] ) && is_numeric( $sizes['height'] ) ) { + $img_style .= 'height:' . $sizes['height'] . 'px;'; + } + + if ( isset( $sc['aspectRatio'] ) && '1' !== $sc['aspectRatio'] ) { + $img_style .= 'aspect-ratio:' . $sc['aspectRatio'] . '; object-fit: fill;'; + } + if ( - is_string( $the_thumbnail ) && ! empty( $the_thumbnail ) && + isset( $sizes['width'] ) && is_numeric( $sizes['width'] ) && ( - 'yes' === $sc['thumb'] || + $sizes['width'] !== $sizes['height'] || // Note: Custom modification via filters. ( - 'auto' === $sc['thumb'] && - ! strpos( $the_thumbnail, 'img/feedzy.svg' ) + isset( $sc['aspectRatio'] ) && + ( + ( 'auto' === $sc['aspectRatio'] && $amp_running ) || // Note: AMP compatibility. Auto without `height` breaks the layout. + '1' === $sc['aspectRatio'] // Note: Backward compatiblity. + ) ) ) ) { - $the_thumbnail = $this->feedzy_image_encode( $the_thumbnail ); - - $img_style = ''; - - if ( isset( $sizes['height'] ) && is_numeric( $sizes['height'] ) ) { - $img_style .= 'height:' . $sizes['height'] . 'px;'; - } - - if ( isset( $sc['aspectRatio'] ) ) { - $img_style .= 'aspect-ratio:' . $sc['aspectRatio'] . ';'; - } elseif ( isset( $sizes['width'] ) && is_numeric( $sizes['width'] ) ) { - $img_style .= 'width:' . $sizes['width'] . 'px;'; - } - - if ( isset( $sc['aspectRatio'] ) ) { - $img_style .= 'aspect-ratio:' . $sc['aspectRatio'] . ';'; - } elseif ( isset( $sizes['width'] ) && is_numeric( $sizes['width'] ) ) { - $img_style .= 'width:' . $sizes['width'] . 'px;'; - } - - $content_thumb .= ''; - - if ( ! isset( $sc['amp'] ) || 'no' !== $sc['amp'] ) { - $content_thumb .= ''; - } + $img_style .= 'width:' . $sizes['width'] . 'px;'; } - if ( empty( $the_thumbnail ) && 'yes' === $sc['thumb'] ) { - $content_thumb .= ''; - if ( ! isset( $sc['amp'] ) || 'no' !== $sc['amp'] ) { - $content_thumb .= ''; - } - } - $content_thumb = apply_filters( 'feedzy_thumb_output', $content_thumb, $feed_url, $sizes, $item ); - } else { - $content_thumb = ''; - $content_thumb .= ''; - if ( ! isset( $sc['amp'] ) || 'no' !== $sc['amp'] ) { - $content_thumb .= ''; - } - $content_thumb = apply_filters( 'feedzy_thumb_output', $content_thumb, $feed_url, $sizes, $item ); + $content_thumb .= ''; + $content_thumb = apply_filters( 'feedzy_thumb_output', $content_thumb, $feed_url, $sizes, $item ); } + $content_title = html_entity_decode( $item->get_title(), ENT_QUOTES, 'UTF-8' ); if ( is_numeric( $sc['title'] ) ) { $length = intval( $sc['title'] ); @@ -1619,7 +1609,7 @@ private function get_feed_item_filter( $sc, $sizes, $item, $feed_url, $index, $i $img_style = ''; if ( isset( $sizes['height'] ) ) { $img_style = 'height:' . $sizes['height'] . 'px;'; - if ( isset( $sc['aspectRatio'] ) ) { + if ( isset( $sc['aspectRatio'] ) && '1' !== $sc['aspectRatio'] ) { $img_style .= 'aspect-ratio:' . $sc['aspectRatio'] . ';'; } elseif ( isset( $sizes['width'] ) ) { $img_style .= 'width:' . $sizes['width'] . 'px;'; diff --git a/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php b/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php index 65a6d27af..8edb37c5a 100644 --- a/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php +++ b/includes/gutenberg/feedzy-rss-feeds-gutenberg-block.php @@ -173,7 +173,7 @@ public function feedzy_register_block_type() { ), 'aspectRatio' => array( 'type' => 'string', - 'default' => 'auto', + 'default' => '1', ), 'price' => array( 'type' => 'boolean', diff --git a/js/FeedzyBlock/attributes.js b/js/FeedzyBlock/attributes.js index 9ca1441dd..c39c401c3 100644 --- a/js/FeedzyBlock/attributes.js +++ b/js/FeedzyBlock/attributes.js @@ -140,7 +140,7 @@ const attributes = { }, aspectRatio: { type: 'string', - default: 'auto', + default: '1', }, }; diff --git a/js/FeedzyBlock/inspector.js b/js/FeedzyBlock/inspector.js index 57bb9ffd3..456552228 100644 --- a/js/FeedzyBlock/inspector.js +++ b/js/FeedzyBlock/inspector.js @@ -667,7 +667,7 @@ class Inspector extends Component { )} value={ this.props.attributes - .aspectRatio || '1:1' + .aspectRatio } options={[ { @@ -682,7 +682,7 @@ class Inspector extends Component { '1:1 (Square)', 'feedzy-rss-feeds' ), - value: '1/1', + value: '1', }, { label: __( From 283064dac1d5588ff19f11e61582c252b3359115 Mon Sep 17 00:00:00 2001 From: RaduCristianPopescu <119046336+RaduCristianPopescu@users.noreply.github.com> Date: Mon, 4 Aug 2025 16:51:49 +0300 Subject: [PATCH 6/7] fix: linter --- includes/abstract/feedzy-rss-feeds-admin-abstract.php | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/includes/abstract/feedzy-rss-feeds-admin-abstract.php b/includes/abstract/feedzy-rss-feeds-admin-abstract.php index adccf52ff..0027ae1ea 100644 --- a/includes/abstract/feedzy-rss-feeds-admin-abstract.php +++ b/includes/abstract/feedzy-rss-feeds-admin-abstract.php @@ -1406,8 +1406,8 @@ private function get_feed_item_filter( $sc, $sizes, $item, $feed_url, $index, $i $item_link = $item->get_feed()->get_permalink(); } } - $new_link = apply_filters( 'feedzy_item_url_filter', $item_link, $sc, $item ); - $amp_running = function_exists( 'amp_is_request' ) && amp_is_request(); + $new_link = apply_filters( 'feedzy_item_url_filter', $item_link, $sc, $item ); + $amp_running = function_exists( 'amp_is_request' ) && amp_is_request(); $content_thumb = ''; $thumbnail_to_use = ''; @@ -1424,7 +1424,7 @@ private function get_feed_item_filter( $sc, $sizes, $item, $feed_url, $index, $i } if ( ! empty( $thumbnail_to_use ) && is_string( $thumbnail_to_use ) ) { - $img_style = ''; + $img_style = ''; if ( isset( $sizes['height'] ) && is_numeric( $sizes['height'] ) ) { $img_style .= 'height:' . $sizes['height'] . 'px;'; From 1974b4c0e43bb7b0073e17fd95ce68327a3b2d4a Mon Sep 17 00:00:00 2001 From: RaduCristianPopescu <119046336+RaduCristianPopescu@users.noreply.github.com> Date: Tue, 5 Aug 2025 10:30:37 +0300 Subject: [PATCH 7/7] test: add e2e tests for Feedzy Classic Block aspect ratios --- tests/e2e/specs/classic-block.spec.js | 65 +++++++++++++++++++++++++++ 1 file changed, 65 insertions(+) create mode 100644 tests/e2e/specs/classic-block.spec.js diff --git a/tests/e2e/specs/classic-block.spec.js b/tests/e2e/specs/classic-block.spec.js new file mode 100644 index 000000000..e5a9c38e1 --- /dev/null +++ b/tests/e2e/specs/classic-block.spec.js @@ -0,0 +1,65 @@ +/** + * WordPress dependencies + */ +import { test, expect } from '@wordpress/e2e-test-utils-playwright'; + +test.describe('Feedzy Classic Block', () => { + test('check aspect ratio default', async ({ editor, page, admin }) => { + await admin.createNewPost(); + + await editor.insertBlock({ + name: 'feedzy-rss-feeds/feedzy-block', + attributes: { + feeds: 'https://www.nasa.gov/feeds/iotd-feed/', + max: 1, + }, + }); + + const postId = await editor.publishPost(); + await page.goto(`/?p=${postId}`); + + const image = page.locator('.feedzy-rss .rss_image img'); + await expect(image).toHaveAttribute( + 'style', + 'height:150px;width:150px;' + ); + }); + + test('check aspect ratio (3/2)', async ({ editor, page, admin }) => { + await admin.createNewPost(); + + await editor.insertBlock({ + name: 'feedzy-rss-feeds/feedzy-block', + attributes: { + aspectRatio: '3/2', + feeds: 'https://www.nasa.gov/feeds/iotd-feed/', + max: 1, + }, + }); + + const postId = await editor.publishPost(); + await page.goto(`/?p=${postId}`); + + const image = page.locator('.feedzy-rss .rss_image img'); + await expect(image).toHaveAttribute('style', /aspect-ratio:\s*3\/2;/i); + }); + + test('check aspect ratio auto', async ({ editor, page, admin }) => { + await admin.createNewPost(); + + await editor.insertBlock({ + name: 'feedzy-rss-feeds/feedzy-block', + attributes: { + aspectRatio: 'auto', + feeds: 'https://www.nasa.gov/feeds/iotd-feed/', + max: 1, + }, + }); + + const postId = await editor.publishPost(); + await page.goto(`/?p=${postId}`); + + const image = page.locator('.feedzy-rss .rss_image img'); + await expect(image).toHaveAttribute('style', /aspect-ratio:\s*auto;/i); + }); +});