🐛 LCP Opacity Zero Bug Test Template

Bug Description:

WP Rocket's LCP detection script incorrectly selects images with opacity: 0 as LCP candidates because it only checks width and height but ignores visibility properties like opacity and visibility.

Expected: The visible image should be detected as LCP

Actual Bug: The hidden image (opacity: 0) is being detected as LCP

Real example: belivria.com

GitHub Issue: This template should be used to create a GitHub issue for fixing the LCP detection logic.

🎯 Main Test Case: Product Grid with Hidden Images

This simulates the exact issue from belivria.com where hover reveals a hidden image.

Visible product image - SHOULD be detected as LCP

Product 1 (Main Bug Test)

$29.99

Hover to see hidden image

Product 2

$39.99

Hover to see hidden image

🧪 Edge Cases: Different Visibility Methods

Test Case 1: Inline Style opacity: 0

Image with inline opacity 0 - should NOT be LCP

This image has style="opacity: 0" and should NOT be detected as LCP.

Test Case 2: visibility: hidden

Image with visibility hidden - should NOT be LCP

This image has style="visibility: hidden" and should NOT be detected as LCP.

Test Case 3: display: none

This image has style="display: none" and should NOT be detected as LCP.

Test Case 4: Very Low Opacity (0.01)

Image with very low opacity - should NOT be LCP

This image has style="opacity: 0.01" and should NOT be detected as LCP.

✅ Control Test: Fully Visible Image

Fully visible image - SHOULD be detected as LCP

This image is fully visible and SHOULD be detected as LCP if it's the largest.

📋 Testing Instructions

Load this page in a browser with WP Rocket active
Check WP Rocket's LCP detection - it should detect one of the visible images, not the hidden ones
Expected Result: WP Rocket should detect data-test="visible-image-1" or data-test="fully-visible" as LCP
Bug Result: WP Rocket incorrectly detects data-test="hidden-image-1" or other hidden images as LCP
Verify the fix: After fixing the bug, only visible images should be LCP candidates

Code Fix Needed:

The LCP detection script should check for:

opacity > 0 (or a reasonable threshold like 0.1)
visibility !== 'hidden'
display !== 'none'
Element is not visually hidden by parent containers

🔧 Developer Debug Info

File Location: /wp-content/rocket-test-data/templates/lcp-opacity-zero-bug.php

Issue Context: Based on belivria.com where WP Rocket detected bez-imeni-1-22-350x350.jpg instead of screenshot_3-5-350x350.png

Root Cause: LCP detection only checks element dimensions but ignores CSS visibility properties

Related Code: Check inc/Engine/Media/AboveTheFold/Frontend/Controller.php around line 129