-
Notifications
You must be signed in to change notification settings - Fork 382
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #4482 from ampproject/add/4439-transform-media-siz…
…es-heights Adapt heights, sizes and media attributes for SSR
- Loading branch information
Showing
16 changed files
with
949 additions
and
99 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,79 @@ | ||
<?php | ||
|
||
namespace AmpProject\Dom; | ||
|
||
use DOMNodeList; | ||
|
||
/** | ||
* Class AmpProject\Dom\CssByteCountCalculator. | ||
* | ||
* Calculates the total byte count of CSS styles in a given document. | ||
* | ||
* This can be used to check against the allowed limit of 75kB that AMP enforces. | ||
* | ||
* @package ampproject/common | ||
*/ | ||
final class CssByteCountCalculator | ||
{ | ||
|
||
/** | ||
* XPath query to fetch the <style amp-custom> tag, relative to the <head> node. | ||
* | ||
* @var string | ||
*/ | ||
const AMP_CUSTOM_STYLE_TAG_XPATH = './/style[@amp-custom]'; | ||
|
||
/** | ||
* XPath query to fetch the inline style attributes, relative to the <body> node. | ||
* | ||
* @var string | ||
*/ | ||
const INLINE_STYLE_ATTRIBUTES_XPATH = './/@style'; | ||
|
||
/** | ||
* Document to calculate the total byte count for. | ||
* | ||
* @var Document | ||
*/ | ||
private $document; | ||
|
||
/** | ||
* Instantiate a CssByteCountCalculator object. | ||
* | ||
* @param Document $document Document to calculate the total byte count for. | ||
*/ | ||
public function __construct(Document $document) | ||
{ | ||
$this->document = $document; | ||
} | ||
|
||
/** | ||
* Calculate the byte count for the provided document. | ||
* | ||
* @return int Total byte count of CSS styles in the document. | ||
*/ | ||
public function calculate() | ||
{ | ||
$ampCustomStyle = $this->document->xpath->query(self::AMP_CUSTOM_STYLE_TAG_XPATH, $this->document->head); | ||
$inlineStyles = $this->document->xpath->query(self::INLINE_STYLE_ATTRIBUTES_XPATH, $this->document->body); | ||
|
||
return $this->calculateForNodeList($ampCustomStyle) + $this->calculateForNodeList($inlineStyles); | ||
} | ||
|
||
/** | ||
* Calculate the byte count of CSS styles for a given node list. | ||
* | ||
* @param DOMNodeList $nodeList Node list to calculate the byte count of CSS styles for. | ||
* @return int Byte count of CSS styles for the given node list. | ||
*/ | ||
private function calculateForNodeList(DOMNodeList $nodeList) | ||
{ | ||
$byteCount = 0; | ||
|
||
foreach ($nodeList as $node) { | ||
$byteCount += strlen($node->textContent); | ||
} | ||
|
||
return $byteCount; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,58 @@ | ||
<?php | ||
|
||
namespace AmpProject\Common; | ||
|
||
use AmpProject\Dom\CssByteCountCalculator; | ||
use AmpProject\Dom\Document; | ||
use PHPUnit\Framework\TestCase; | ||
|
||
/** | ||
* Tests for AmpProject\Dom\CssByteCountCalculator. | ||
* | ||
* @covers CssByteCountCalculator | ||
* @package ampproject/common | ||
*/ | ||
class CssByteCountCalculatorTest extends TestCase | ||
{ | ||
|
||
/** | ||
* Data provider for testing the calculate() method. | ||
* | ||
* @return array Testing data. | ||
*/ | ||
public function dataCalculate() | ||
{ | ||
return [ | ||
'amp_custom_style_tag' => [ | ||
'<html><head><style amp-custom>12345</style>', 5, | ||
], | ||
'one_inline_style_attribute' => [ | ||
'<html><body><div style="12345"></div></body></html>', 5, | ||
], | ||
'multiple_inline_style_attributes' => [ | ||
'<html><body><div style="1234"></div><div style="567"><div style="89"></body></html>', 9, | ||
], | ||
'amp_custom_style_tag_and_multiple_inline_style_attributes' => [ | ||
'<html><head><style amp-custom>12345</style></head><body><div style="1234"></div><div style="567"><div style="89"></body></html>', 14, | ||
], | ||
'amp_custom_style_tag_outside_head' => [ | ||
'<html><head><style amp-custom>12345</style></head><body><style amp-custom>123</style></body></html>', 5, | ||
], | ||
'multibyte_chars_are_counted_in_bytes_not_chars' => [ | ||
'<html><head><style amp-custom>Iñtërnâtiônàlizætiøn</style></head><body><div style="Iñtërnâtiônàlizætiøn"></div></body></html>', 54, | ||
], | ||
]; | ||
} | ||
|
||
/** | ||
* Test the calculate() method. | ||
* | ||
* @dataProvider dataCalculate | ||
* @covers CssByteCountCalculator::calculate() | ||
*/ | ||
public function testCalculate($html, $expected) | ||
{ | ||
$document = Document::fromHtml($html); | ||
$this->assertEquals($expected, (new CssByteCountCalculator($document))->calculate()); | ||
} | ||
} |
Oops, something went wrong.