Miraeld commented 3 months ago

Description

Fixes #88

Documentation

Technical documentation

This PR adds the following templates for Desktop AND Mobile:

lcp_bg_img_in_section
lcp_section_template_relative
lcp_section_template2
lcp_picture_template
lcp_bg_relative_attribute_incss
lcp_bg_img_in_header_template
lcp_6647_svgbg_template
lcp_6599_template2
lcp_picture_media_type_mixed
lcp_picture_relative

Type of change

[x] Enhancement (non-breaking change which improves an existing functionality).

Checklists

Feature validation

[x] I validated all the Acceptance Criteria. If possible, provide sreenshots or videos.
[x] I triggered all changed lines of code at least once without new errors/warnings/notices.

Miraeld commented 3 months ago

Updated to comply latest feedback :)

jeawhanlee commented 3 months ago

The viewport expectation for the template: lcp_picture_template2 is wrong on mobile which causes a failure for that specific template. Manual testing shows this.

Expected Viewport for mobile - /rocket-test-data/images/test3.gif for http://mike.e2e.rocketlabsqa.ovh/lcp_picture_template2 is not present in actual - [{"type":"picture","src":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/1_BDCYb3Yx8exGZVu5lLRPNw.png","sources":[{"srcset":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/lcp/testavif.avif","media":"","type":"","sizes":""}]},{"type":"picture","src":"http://mike.e2e.rocketlabsqa.ovh/test.png","sources":[]},{"type":"picture","src":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/lcp/testwebp.webp","sources":[{"srcset":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/paper.jpeg","media":"(max-width: 400px)","type":"","sizes":""},{"srcset":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/lcp/testjpeg.jpeg","media":"(max-width: 800px)","type":"","sizes":""}]}]

Expected Viewport for mobile - /rocket-test-data/images/testjpg3.jpg for http://mike.e2e.rocketlabsqa.ovh/lcp_picture_template2 is not present in actual - [{"type":"picture","src":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/1_BDCYb3Yx8exGZVu5lLRPNw.png","sources":[{"srcset":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/lcp/testavif.avif","media":"","type":"","sizes":""}]},{"type":"picture","src":"http://mike.e2e.rocketlabsqa.ovh/test.png","sources":[]},{"type":"picture","src":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/lcp/testwebp.webp","sources":[{"srcset":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/paper.jpeg","media":"(max-width: 400px)","type":"","sizes":""},{"srcset":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/lcp/testjpeg.jpeg","media":"(max-width: 800px)","type":"","sizes":""}]}]

Expected Viewport for mobile - /rocket-test-data/images/lcp/testjpg2.jpg for http://mike.e2e.rocketlabsqa.ovh/lcp_picture_template2 is not present in actual - [{"type":"picture","src":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/1_BDCYb3Yx8exGZVu5lLRPNw.png","sources":[{"srcset":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/lcp/testavif.avif","media":"","type":"","sizes":""}]},{"type":"picture","src":"http://mike.e2e.rocketlabsqa.ovh/test.png","sources":[]},{"type":"picture","src":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/lcp/testwebp.webp","sources":[{"srcset":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/paper.jpeg","media":"(max-width: 400px)","type":"","sizes":""},{"srcset":"http://mike.e2e.rocketlabsqa.ovh/wp-content/rocket-test-data/images/lcp/testjpeg.jpeg","media":"(max-width: 800px)","type":"","sizes":""}]}]

MathieuLamiot commented 3 months ago

All good here on the new templates.

wp-media / wp-rocket-e2e

Closes #88: Add LCP Templates #116