Skip to content

Commit

Permalink
EWPP-2069: Adapt rendering tests.
Browse files Browse the repository at this point in the history
  • Loading branch information
22Alexandra committed Apr 29, 2022
1 parent 95ab8b1 commit 5cda45f
Show file tree
Hide file tree
Showing 4 changed files with 18 additions and 22 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@
extra_classes: 'ecl-contextual-navigation__link',
link: item|merge({
type: 'standalone',
external: is_external,
external: item.is_external,
icon_path: ecl_icon_path,
}),
}) only %}
Expand Down
22 changes: 9 additions & 13 deletions tests/src/Kernel/Paragraphs/ParagraphsTest.php
Original file line number Diff line number Diff line change
Expand Up @@ -405,8 +405,8 @@ public function testListItemBlock() {
$crawler = new Crawler($this->renderParagraph($paragraph));
$this->assertEquals('List block title', trim($crawler->filter('h2.ecl-u-type-heading-2')->text()));
// Assert that the external icon is rendered for each list item paragraph.
$this->assertCount(3, $crawler->filter('svg.ecl-icon.ecl-icon--s.ecl-link__icon'));
$this->assertEquals('<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>', $crawler->filter('svg.ecl-icon.ecl-icon--s.ecl-link__icon')->html());
$this->assertCount(3, $crawler->filter('svg.ecl-icon.ecl-icon--2xs.ecl-link__icon'));
$this->assertEquals('<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>', $crawler->filter('svg.ecl-icon.ecl-icon--2xs.ecl-link__icon')->html());

// Assert the external icon is rendered for the list item block.
$this->assertCount(1, $crawler->filter('svg.ecl-icon.ecl-icon--xs.ecl-link__icon'));
Expand Down Expand Up @@ -564,15 +564,15 @@ public function testContextualNavigation(): void {
$this->assertEquals('Link 1', trim($actual));
$actual = $link1->attr('href');
$this->assertEquals('http://example.com/page-one', trim($actual));
$icon = $link1->filter('svg.ecl-icon.ecl-icon--xs.ecl-link__icon')->html();
$icon = $link1->filter('svg.ecl-icon.ecl-icon--2xs.ecl-link__icon')->html();
$this->assertEquals('<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>', $icon);

$link2 = $crawler->filter('nav.ecl-contextual-navigation ul.ecl-contextual-navigation__list a.ecl-contextual-navigation__link')->eq(1);
$actual = $link2->filter('span.ecl-link__label')->text();
$this->assertEquals('Link 2', trim($actual));
$actual = $link2->attr('href');
$this->assertEquals('http://example.com/page-two', trim($actual));
$icon = $link2->filter('svg.ecl-icon.ecl-icon--xs.ecl-link__icon')->html();
$icon = $link2->filter('svg.ecl-icon.ecl-icon--2xs.ecl-link__icon')->html();
$this->assertEquals('<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>', $icon);

$actual = $crawler->filter('nav.ecl-contextual-navigation ul.ecl-contextual-navigation__list li.ecl-contextual-navigation__item--collapsed a.ecl-contextual-navigation__link')->eq(0)->text();
Expand Down Expand Up @@ -624,11 +624,9 @@ public function testFactsFigures(): void {
$test_cases = [
'eu' => [
'fact_icon_size' => 'l',
'view_all_icon_size' => 'm',
],
'ec' => [
'fact_icon_size' => 'm',
'view_all_icon_size' => 'xs',
],
];
foreach ($test_cases as $component_library => $icon_sizes) {
Expand All @@ -651,7 +649,7 @@ public function testFactsFigures(): void {

$html = $this->renderParagraph($paragraph);
$crawler = new Crawler($html);
$this->assertFactsFigures($crawler, $component_library, $icon_sizes['fact_icon_size'], $icon_sizes['view_all_icon_size']);
$this->assertFactsFigures($crawler, $component_library, $icon_sizes['fact_icon_size']);

// Assert paragraph with empty Title and Link fields.
$paragraph = Paragraph::create([
Expand All @@ -676,22 +674,18 @@ public function testFactsFigures(): void {
* Component library.
* @param string $fact_icon_size
* Size of the icon in facts.
* @param string $view_all_icon_size
* Size of the icon of view all link.
*/
protected function assertFactsFigures(Crawler $crawler, string $component_library, string $fact_icon_size, string $view_all_icon_size): void {
protected function assertFactsFigures(Crawler $crawler, string $component_library, string $fact_icon_size): void {
$this->assertCount(1, $crawler->filter('div.ecl-fact-figures.ecl-fact-figures--col-3 div.ecl-fact-figures__items'));

$this->assertCount(1, $crawler->filter("div.ecl-fact-figures__item:nth-child(1) svg.ecl-icon.ecl-icon--$fact_icon_size.ecl-fact-figures__icon"), $component_library);
$this->assertCount(1, $crawler->filter("div.ecl-fact-figures__item:nth-child(2) svg.ecl-icon.ecl-icon--$fact_icon_size.ecl-fact-figures__icon"));
$this->assertCount(1, $crawler->filter("div.ecl-fact-figures__item:nth-child(3) svg.ecl-icon.ecl-icon--$fact_icon_size.ecl-fact-figures__icon"));
$this->assertCount(1, $crawler->filter("div.ecl-fact-figures__view-all svg.ecl-icon.ecl-icon--$view_all_icon_size.ecl-icon--rotate-90.ecl-link__icon"));

$this->assertEquals('Facts and figures', trim($crawler->filter('h2.ecl-u-type-heading-2')->text()));
$this->assertEquals("<use xlink:href=\"/themes/custom/oe_theme/dist/$component_library/images/icons/sprites/icons.svg#infographic\"></use>", $crawler->filter("div.ecl-fact-figures__item:nth-child(1) svg.ecl-icon.ecl-icon--$fact_icon_size.ecl-fact-figures__icon")->html());
$this->assertEquals("<use xlink:href=\"/themes/custom/oe_theme/dist/$component_library/images/icons/sprites/icons.svg#spreadsheet\"></use>", $crawler->filter("div.ecl-fact-figures__item:nth-child(2) svg.ecl-icon.ecl-icon--$fact_icon_size.ecl-fact-figures__icon")->html());
$this->assertEquals("<use xlink:href=\"/themes/custom/oe_theme/dist/$component_library/images/icons/sprites/icons.svg#digital\"></use>", $crawler->filter("div.ecl-fact-figures__item:nth-child(3) svg.ecl-icon.ecl-icon--$fact_icon_size.ecl-fact-figures__icon")->html());
$this->assertEquals("<use xlink:href=\"/themes/custom/oe_theme/dist/$component_library/images/icons/sprites/icons.svg#corner-arrow\"></use>", $crawler->filter("div.ecl-fact-figures__view-all svg.ecl-icon.ecl-icon--$view_all_icon_size.ecl-icon--rotate-90.ecl-link__icon")->html());
$this->assertEquals('10 millions', trim($crawler->filter('div.ecl-fact-figures__item:nth-child(1) div.ecl-fact-figures__value')->text()));
$this->assertEquals('20 millions', trim($crawler->filter('div.ecl-fact-figures__item:nth-child(2) div.ecl-fact-figures__value')->text()));
$this->assertEquals('30 millions', trim($crawler->filter('div.ecl-fact-figures__item:nth-child(3) div.ecl-fact-figures__value')->text()));
Expand All @@ -702,11 +696,13 @@ protected function assertFactsFigures(Crawler $crawler, string $component_librar
$this->assertEquals('Fact description 2', trim($crawler->filter('div.ecl-fact-figures__item:nth-child(2) div.ecl-fact-figures__description')->text()));
$this->assertEquals('Fact description 3', trim($crawler->filter('div.ecl-fact-figures__item:nth-child(3) div.ecl-fact-figures__description')->text()));

$link = $crawler->filter('div.ecl-fact-figures__view-all a.ecl-link.ecl-link--standalone.ecl-fact-figures__view-all-link');
$link = $crawler->filter('div.ecl-fact-figures__view-all a.ecl-link.ecl-link--standalone.ecl-link--icon.ecl-link--icon-after.ecl-fact-figures__view-all-link');
$actual = $link->text();
$this->assertEquals('View all metrics', trim($actual));
$actual = $link->attr('href');
$this->assertEquals('http://www.example.com/', trim($actual));
$icon = $link->filter('svg.ecl-icon.ecl-icon--2xs.ecl-link__icon')->html();
$this->assertEquals("<use xlink:href=\"/themes/custom/oe_theme/dist/$component_library/images/icons/sprites/icons.svg#external\"></use>", $icon);
}

/**
Expand Down
2 changes: 1 addition & 1 deletion tests/src/Kernel/Patterns/LinkPatternRenderingTest.php
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ public function testLinkPatternRendering() {
$crawler = new Crawler($html);
$this->assertEquals('Link text', $crawler->filter('a.ecl-link.ecl-link--standalone.ecl-link--icon.ecl-link--icon-after span.ecl-link__label')->text());
$this->assertEquals('https://example.com', $crawler->filter('a.ecl-link.ecl-link--standalone.ecl-link--icon.ecl-link--icon-after')->attr('href'));
$this->assertEquals('<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>', $crawler->filter('svg.ecl-icon.ecl-icon--s.ecl-link__icon')->html());
$this->assertEquals('<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>', $crawler->filter('svg.ecl-icon.ecl-icon--2xs.ecl-link__icon')->html());
}

}
14 changes: 7 additions & 7 deletions tests/src/Kernel/fixtures/rendering.yml
Original file line number Diff line number Diff line change
Expand Up @@ -1994,13 +1994,13 @@
'span.ecl-link__label': 3
equals:
'li.ecl-contextual-navigation__item a.ecl-contextual-navigation__link[href="http://link-1.com"] span.ecl-link__label': "Item one"
'li.ecl-contextual-navigation__item a.ecl-contextual-navigation__link[href="http://link-1.com"] svg.ecl-icon.ecl-icon--xs.ecl-link__icon': '<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>'
'li.ecl-contextual-navigation__item a.ecl-contextual-navigation__link[href="http://link-1.com"] svg.ecl-icon.ecl-icon--2xs.ecl-link__icon': '<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>'
'li.ecl-contextual-navigation__item a.ecl-contextual-navigation__link[href="http://link-2.com"]': "Item two"
'li.ecl-contextual-navigation__item a.ecl-contextual-navigation__link[href="http://link-3.com"] span.ecl-link__label': "Item three"
'li.ecl-contextual-navigation__item a.ecl-contextual-navigation__link[href="http://link-3.com"] svg.ecl-icon.ecl-icon--xs.ecl-link__icon': '<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>'
'li.ecl-contextual-navigation__item a.ecl-contextual-navigation__link[href="http://link-3.com"] svg.ecl-icon.ecl-icon--2xs.ecl-link__icon': '<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>'
'li.ecl-contextual-navigation__item a.ecl-contextual-navigation__link[href="http://link-4.com"]': "Item four"
'li.ecl-contextual-navigation__item a.ecl-contextual-navigation__link[href="http://link-5.com"] span.ecl-link__label': "Item five"
'li.ecl-contextual-navigation__item a.ecl-contextual-navigation__link[href="http://link-5.com"] svg.ecl-icon.ecl-icon--xs.ecl-link__icon': '<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>'
'li.ecl-contextual-navigation__item a.ecl-contextual-navigation__link[href="http://link-5.com"] svg.ecl-icon.ecl-icon--2xs.ecl-link__icon': '<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>'
'div.ecl-contextual-navigation__label': "Navigation title"
'button.ecl-contextual-navigation__more .ecl-button__label': "More label"
- array:
Expand Down Expand Up @@ -2037,7 +2037,7 @@
'a.ecl-link--icon-before svg': 0
equals:
'a.ecl-link--standalone[href="http://example.com"] .ecl-link__label': "Button label"
'svg.ecl-icon.ecl-icon--s.ecl-link__icon': '<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>'
'svg.ecl-icon.ecl-icon--2xs.ecl-link__icon': '<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>'
- array:
'#type': pattern
'#id': button
Expand All @@ -2049,10 +2049,10 @@
external_link: true
assertions:
count:
'a.ecl-link--standalone': 1
'a.ecl-link--icon': 0
'a.ecl-link--icon': 1
equals:
'a.ecl-link--standalone[href="http://example.com"]': "Button label"
'a.ecl-link--standalone[href="http://example.com"] .ecl-link__label': "Button label"
'svg.ecl-icon.ecl-icon--2xs.ecl-link__icon': '<use xlink:href="/themes/custom/oe_theme/dist/ec/images/icons/sprites/icons.svg#external"></use>'
- array:
'#type': pattern
'#id': button
Expand Down

0 comments on commit 5cda45f

Please sign in to comment.