Hide sale badge if product image is disabled

[roykho]

Submission Review Guidelines:

• I have followed the WooCommerce Contributing Guidelines and the WordPress Coding Standards.
• I have checked to ensure there aren't other open Pull Requests for the same update/change.
• I have reviewed my code for security best practices.
• Following the above guidelines will result in quick merges and clear and detailed feedback when appropriate.

Changes proposed in this Pull Request:

This PR fixes an issue with the on-sale badge covering the product title when product image is disabled.

For reference the woocommerce/woocommerce-blocks#10297 that introduced this issue.

Before	After

How to test the changes in this Pull Request:

Using the WooCommerce Testing Instructions Guide, include your detailed testing instructions:

1. Add the following blocks to a post/page. Hand-picked Products, Best Selling Products, Products by Category, Newest Products, On Sale Products, Products by Attribute, Products by Tag, Top Rated Products.
2. For each of these blocks, ensure the Sale badge is on the top right of the product image.
3. Now turn off Product Image in the inspector controls. Ensure the Sale badge is now hidden.
4. Save the post/page and ensure it shows the same in the frontend.

Changelog entry

• Automatically create a changelog entry from the details below.

Significance

• Patch
• Minor
• Major

Type

• Fix - Fixes an existing bug
• Add - Adds functionality
• Update - Update existing functionality
• Dev - Development related task
• Tweak - A minor adjustment to the codebase
• Performance - Address performance issues
• Enhancement - Improvement to existing functionality

Message Fix on-sale badge covering product title when product image is disabled

Comment

[github-actions]

Hi @Aljullu, @imanish003,

Apart from reviewing the code changes, please make sure to review the testing instructions as well.

You can follow this guide to find out what good testing instructions should look like:
https://github.com/woocommerce/woocommerce/wiki/Writing-high-quality-testing-instructions

[Aljullu]

It looks good, but I wonder if we could hide it from the PHP side, instead of from CSS. I just took a look and I think we would only need to modify this line? 🤔

woocommerce/plugins/woocommerce/src/Blocks/BlockTypes/AbstractProductGrid.php

Line 613 in b36bacf

if ( empty( $this->attributes['contentVisibility']['price'] ) ) {

What do you think?

[roykho]

@Aljullu good idea, done!

[github-actions]

Test Results Summary

Commit SHA: 8b1a5f4

Test 🧪	Passed ✅	Failed 🚨	Broken 🚧	Skipped ⏭️	Unknown ❔	Total 📊	Duration ⏱️
API Tests	259	0	0	2	0	261	0m 37s
E2E Tests	258	0	0	3	0	261	13m 33s

---

To view the full API test report, click here.
To view the full E2E test report, click here.
To view all test reports, visit the WooCommerce Test Reports Dashboard.

[Aljullu]

LGTM, thanks for handling that, @roykho!

[thealexandrelara]

Ohh nice catch! Thank you for working on this, Roy! ✅