Skip to content

Commit

Permalink
Merge branch 'trunk' into object-caching-info
Browse files Browse the repository at this point in the history
  • Loading branch information
@mkurdybanowski
mkurdybanowski authored Jul 29, 2024
2 parents 74897bb + 9533db2 commit 8f1c0b3
Show file tree
Hide file tree
Showing 50 changed files with 2,163 additions and 1,964 deletions.
17 changes: 17 additions & 0 deletions bin/test-php-watch.sh
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
#!/bin/bash
if ! which inotifywait >/dev/null 2>&1; then
echo "Error: the inotifywait command is not available. Make sure you have inotify-tools installed."
exit 1
fi

while true; do
echo "Waiting for a change in the plugins directory..."
output=$(inotifywait -e modify,create,delete -r ./plugins 2> /dev/null)
plugin_slug=$(echo "$output" | awk -F/ '{print $3}')
sleep 1 # Give the user a chance to copy text from terminal before IDE auto-saves.
clear
echo "Running phpunit tests for $(tput bold)$plugin_slug$(tput sgr0):"
# TODO: Interrupt when a change is made while running tests or re-run if change made since tests started running.
# Note: This is calling phpunit directly and not the composer script due to extra noise it outputs.
npm run wp-env --silent -- run tests-cli --env-cwd=/var/www/html/wp-content/plugins/performance -- vendor/bin/phpunit --testsuite "$plugin_slug" "$@"
done
4 changes: 4 additions & 0 deletions composer.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,14 +50,18 @@
"@format:auto-sizes",
"@format:dominant-color-images",
"@format:embed-optimizer",
"@format:image-prioritizer",
"@format:optimization-detective",
"@format:performance-lab",
"@format:speculation-rules",
"@format:webp-uploads"
],
"format:auto-sizes": "@format -- ./plugins/auto-sizes --standard=./plugins/auto-sizes/phpcs.xml.dist",
"format:dominant-color-images": "@format -- ./plugins/dominant-color-images --standard=./plugins/dominant-color-images/phpcs.xml.dist",
"format:embed-optimizer": "@format -- ./plugins/embed-optimizer --standard=./plugins/embed-optimizer/phpcs.xml.dist",
"format:image-prioritizer": "@format -- ./plugins/image-prioritizer --standard=./plugins/image-prioritizer/phpcs.xml.dist",
"format:optimization-detective": "@format -- ./plugins/optimization-detective --standard=./plugins/optimization-detective/phpcs.xml.dist",
"format:performance-lab": "@format -- ./plugins/performance-lab --standard=./plugins/performance-lab/phpcs.xml.dist",
"format:speculation-rules": "@format -- ./plugins/speculation-rules --standard=./plugins/speculation-rules/phpcs.xml.dist",
"format:webp-uploads": "@format -- ./plugins/webp-uploads --standard=./plugins/webp-uploads/phpcs.xml.dist",
"lint": "phpcs",
Expand Down
11 changes: 10 additions & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,11 +43,20 @@
"generate-pending-release-diffs": "bin/generate-pending-release-diffs.sh",
"format-js": "wp-scripts format",
"lint-js": "wp-scripts lint-js",
"format-php": "composer format",
"format-php": "composer format:all",
"phpstan": "composer phpstan",
"lint-php": "composer lint:all",
"test-php": "wp-env run tests-cli --env-cwd=/var/www/html/wp-content/plugins/performance composer test:plugins",
"test-php-watch": "./bin/test-php-watch.sh",
"test-php-multisite": "wp-env run tests-cli --env-cwd=/var/www/html/wp-content/plugins/performance composer test-multisite:plugins",
"test-php:performance-lab": "wp-env run tests-cli --env-cwd=/var/www/html/wp-content/plugins/performance composer test:performance-lab",
"test-php:auto-sizes": "wp-env run tests-cli --env-cwd=/var/www/html/wp-content/plugins/performance composer test:auto-sizes",
"test-php:dominant-color-images": "wp-env run tests-cli --env-cwd=/var/www/html/wp-content/plugins/performance composer test:dominant-color-images",
"test-php:embed-optimizer": "wp-env run tests-cli --env-cwd=/var/www/html/wp-content/plugins/performance composer test:embed-optimizer",
"test-php:image-prioritizer": "wp-env run tests-cli --env-cwd=/var/www/html/wp-content/plugins/performance composer test:image-prioritizer",
"test-php:optimization-detective": "wp-env run tests-cli --env-cwd=/var/www/html/wp-content/plugins/performance composer test:optimization-detective",
"test-php:speculation-rules": "wp-env run tests-cli --env-cwd=/var/www/html/wp-content/plugins/performance composer test:speculation-rules",
"test-php:webp-uploads": "wp-env run tests-cli --env-cwd=/var/www/html/wp-content/plugins/performance composer test:webp-uploads",
"wp-env": "wp-env",
"prepare": "husky"
}
Expand Down
16 changes: 13 additions & 3 deletions plugins/auto-sizes/hooks.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -156,6 +156,18 @@ function auto_sizes_improve_image_sizes_attributes( string $content ): string {
return $content;
}

$remove_data_attributes = static function () use ( $processor ): void {
$processor->remove_attribute( 'data-needs-sizes-update' );
$processor->remove_attribute( 'data-align' );
$processor->remove_attribute( 'data-resize-width' );
};

// Bail early if the responsive images are disabled.
if ( null === $processor->get_attribute( 'sizes' ) ) {
$remove_data_attributes();
return $processor->get_updated_html();
}

// Skips second time parsing if already processed.
if ( null === $processor->get_attribute( 'data-needs-sizes-update' ) ) {
return $content;
Expand Down Expand Up @@ -206,9 +218,7 @@ function auto_sizes_improve_image_sizes_attributes( string $content ): string {
$processor->set_attribute( 'sizes', $sizes );
}

$processor->remove_attribute( 'data-needs-sizes-update' );
$processor->remove_attribute( 'data-align' );
$processor->remove_attribute( 'data-resize-width' );
$remove_data_attributes();

return $processor->get_updated_html();
}
Expand Down
65 changes: 20 additions & 45 deletions plugins/auto-sizes/tests/test-improve-sizes.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,26 @@ public function set_up(): void {
remove_filter( 'wp_content_img_tag', 'auto_sizes_update_content_img_tag' );
}

/**
* Test that if disable responsive image then it will not add sizes attribute.
*
* @covers ::auto_sizes_improve_image_sizes_attributes
*/
public function test_that_if_disable_responsive_image_then_it_will_not_add_sizes_attribute(): void {
// Disable responsive images.
add_filter( 'wp_calculate_image_sizes', '__return_false' );

$image_size = 'large';

$block_content = '<!-- wp:image {"id":' . self::$image_id . ',"sizeSlug":"' . $image_size . '","linkDestination":"none"} --><figure class="wp-block-image size-' . $image_size . '"><img src="' . wp_get_attachment_image_url( self::$image_id, $image_size ) . '" alt="" class="wp-image-' . self::$image_id . '"/></figure><!-- /wp:image -->';

$result = apply_filters( 'the_content', $block_content );

$img_processor = new WP_HTML_Tag_Processor( $result );
$this->assertTrue( $img_processor->next_tag( array( 'tag_name' => 'IMG' ) ) );
$this->assertNull( $img_processor->get_attribute( 'sizes' ), 'The sizes attribute should not added in IMG tag.' );
}

/**
* Test the image block with different image sizes and full alignment.
*
Expand Down Expand Up @@ -86,9 +106,6 @@ public function test_image_block_with_wide_alignment( string $image_size ): void
*/
public function data_image_sizes(): array {
return array(
'Return full or wideSize 1280px instead of thumb size 150px' => array(
'thumbnail',
),
'Return full or wideSize 1280px instead of medium size 300px' => array(
'medium',
),
Expand Down Expand Up @@ -145,10 +162,6 @@ public function test_image_block_with_default_alignment( string $image_size, str
*/
public function data_image_sizes_for_default_alignment(): array {
return array(
'Return thumbnail image size 150px instead of contentSize 620px' => array(
'thumbnail',
'sizes="(max-width: 150px) 100vw, 150px" ',
),
'Return medium image size 300px instead of contentSize 620px' => array(
'medium',
'sizes="(max-width: 300px) 100vw, 300px" ',
Expand All @@ -161,11 +174,6 @@ public function data_image_sizes_for_default_alignment(): array {
'full',
'sizes="(max-width: 620px) 100vw, 620px" ',
),
'Return resized size 100px instead of contentSize 620px or thumbnail image size 150px' => array(
'thumbnail',
'sizes="(max-width: 100px) 100vw, 100px" ',
true,
),
'Return resized size 100px instead of contentSize 620px or medium image size 300px' => array(
'medium',
'sizes="(max-width: 100px) 100vw, 100px" ',
Expand Down Expand Up @@ -229,11 +237,6 @@ public function test_image_block_with_left_right_center_alignment( string $image
*/
public function data_image_sizes_for_left_right_center_alignment(): array {
return array(
'Return thumbnail image size 150px with left alignment' => array(
'thumbnail',
'sizes="(max-width: 150px) 100vw, 150px" ',
'left',
),
'Return medium image size 300px with left alignment' => array(
'medium',
'sizes="(max-width: 300px) 100vw, 300px" ',
Expand All @@ -249,11 +252,6 @@ public function data_image_sizes_for_left_right_center_alignment(): array {
'sizes="(max-width: 1080px) 100vw, 1080px" ',
'left',
),
'Return thumbnail image size 150px with right alignment' => array(
'thumbnail',
'sizes="(max-width: 150px) 100vw, 150px" ',
'right',
),
'Return medium image size 300px with right alignment' => array(
'medium',
'sizes="(max-width: 300px) 100vw, 300px" ',
Expand All @@ -269,11 +267,6 @@ public function data_image_sizes_for_left_right_center_alignment(): array {
'sizes="(max-width: 1080px) 100vw, 1080px" ',
'right',
),
'Return thumbnail image size 150px with center alignment' => array(
'thumbnail',
'sizes="(max-width: 150px) 100vw, 150px" ',
'center',
),
'Return medium image size 300px with center alignment' => array(
'medium',
'sizes="(max-width: 300px) 100vw, 300px" ',
Expand All @@ -289,12 +282,6 @@ public function data_image_sizes_for_left_right_center_alignment(): array {
'sizes="(max-width: 1080px) 100vw, 1080px" ',
'center',
),
'Return resized size 100px instead of thumbnail image size 150px with left alignment' => array(
'thumbnail',
'sizes="(max-width: 100px) 100vw, 100px" ',
'left',
true,
),
'Return resized size 100px instead of medium image size 300px with left alignment' => array(
'medium',
'sizes="(max-width: 100px) 100vw, 100px" ',
Expand All @@ -313,12 +300,6 @@ public function data_image_sizes_for_left_right_center_alignment(): array {
'left',
true,
),
'Return resized size 100px instead of thumbnail image size 150px with right alignment' => array(
'thumbnail',
'sizes="(max-width: 100px) 100vw, 100px" ',
'right',
true,
),
'Return resized size 100px instead of medium image size 300px with right alignment' => array(
'medium',
'sizes="(max-width: 100px) 100vw, 100px" ',
Expand All @@ -337,12 +318,6 @@ public function data_image_sizes_for_left_right_center_alignment(): array {
'right',
true,
),
'Return resized size 100px instead of thumbnail image size 150px with center alignment' => array(
'thumbnail',
'sizes="(max-width: 100px) 100vw, 100px" ',
'center',
true,
),
'Return resized size 100px instead of medium image size 300px with center alignment' => array(
'medium',
'sizes="(max-width: 100px) 100vw, 100px" ',
Expand Down
69 changes: 7 additions & 62 deletions plugins/auto-sizes/tests/test-optimization-detective.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@
*/

class Test_Auto_Sizes_Optimization_Detective extends WP_UnitTestCase {
use Optimization_Detective_Test_Helpers;

/**
* Runs the routine before each test is executed.
*/
Expand Down Expand Up @@ -102,76 +104,19 @@ public function data_provider_test_od_optimize_template_output_buffer(): array {
* @phpstan-param array<string, mixed> $element_metrics
*/
public function test_od_optimize_template_output_buffer( array $element_metrics, string $buffer, string $expected ): void {
$slug = od_get_url_metrics_slug( od_get_normalized_query_vars() );
$sample_size = od_get_url_metrics_breakpoint_sample_size();
foreach ( array_merge( od_get_breakpoint_max_widths(), array( 1000 ) ) as $viewport_width ) {
for ( $i = 0; $i < $sample_size; $i++ ) {
OD_URL_Metrics_Post_Type::store_url_metric(
$slug,
$this->get_validated_url_metric(
$viewport_width,
array(
$element_metrics,
)
)
);
}
}

$remove_initial_tabs = static function ( string $input ): string {
return (string) preg_replace( '/^\t+/m', '', $input );
};
$this->populate_url_metrics( array( $element_metrics ) );

$html_start_doc = '<html lang="en"><head><meta charset="utf-8"><title>...</title></head><body>';
$html_end_doc = '</body></html>';

$expected = $remove_initial_tabs( $expected );
$buffer = $remove_initial_tabs( $buffer );

$buffer = od_optimize_template_output_buffer( $html_start_doc . $buffer . $html_end_doc );
$buffer = preg_replace( '#.+?<body[^>]*>#s', '', $buffer );
$buffer = preg_replace( '#</body>.*$#s', '', $buffer );

$this->assertEquals( $expected, $buffer );
}

/**
* Gets a validated URL metric.
*
* @param int $viewport_width Viewport width for the URL metric.
* @param array<array{xpath: string, isLCP: bool}> $elements Elements.
* @return OD_URL_Metric URL metric.
* @throws Exception From OD_URL_Metric if there is a parse error, but there won't be.
*/
private function get_validated_url_metric( int $viewport_width, array $elements = array() ): OD_URL_Metric {
$data = array(
'url' => home_url( '/' ),
'viewport' => array(
'width' => $viewport_width,
'height' => 800,
),
'timestamp' => microtime( true ),
'elements' => array_map(
static function ( array $element ): array {
return array_merge(
array(
'isLCPCandidate' => true,
'intersectionRatio' => 1,
'intersectionRect' => array(
'width' => 100,
'height' => 100,
),
'boundingClientRect' => array(
'width' => 100,
'height' => 100,
),
),
$element
);
},
$elements
),
$this->assertEquals(
$this->remove_initial_tabs( $expected ),
$this->remove_initial_tabs( $buffer ),
"Buffer snapshot:\n$buffer"
);
return new OD_URL_Metric( $data );
}
}
Loading

0 comments on commit 8f1c0b3

Please sign in to comment.