Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

EWPP-3875: Update News CT rendering tests. #1374

Merged
merged 6 commits into from
Jan 22, 2024
Merged

EWPP-3875: Update News CT rendering tests. #1374

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
7a93646
EWPP-3875: Add link icon to related links and fix the featured media …
22Alexandra Jan 14, 2024
27d9cd4
EWPP-3875: Update News CT rendering tests.
22Alexandra Jan 14, 2024
41d96f4
EWPP-3875: Replace border color grey-15 with new color codes based on…
22Alexandra Jan 16, 2024
8867be7
EWPP-3875: Replace ECL Message component with Notification in content…
22Alexandra Jan 16, 2024
8ba4ee6
EWPP-3875: Update border color in contacts rendering.
22Alexandra Jan 17, 2024
3ed412f
EWPP-3875: Add a twig function to determine the border color class.
22Alexandra Jan 22, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion ...s/compositions/ec-component-content-language-switcher/content-language-switcher.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
#}
<div class="ecl-lang-select-page ecl-u-bg-grey-5 ecl-u-pv-m">
<div class="ecl-container">
{% include '@ecl-twig/message' with {
{% include '@ecl-twig/notification' with {
title: 'English is available via machine translation – please use the link below.'|t,
variant: 'warning',
extra_classes: ecl_component_library == 'ec' ? 'ecl-u-mb-m ecl-u-bg-transparent' : 'ecl-u-mb-m',
Expand Down
3 changes: 2 additions & 1 deletion templates/field/field--node--oe-news-sources--oe-news--full.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,11 @@
* @see ./core/themes/stable/templates/field/field.html.twig
*/
#}
{% set _color = ecl_component_library == 'ec' ? 'neutral-40' : 'primary-10' %}
<h3 class="ecl-u-type-heading-3 ecl-u-mt-3xl">{{ 'Sources'|t }}</h3>
{% for item in items %}
{% set bubble_cache = item.content|render %}
<div class="ecl-u-border-bottom ecl-u-border-color-grey-15 ecl-u-pt-m ecl-u-pb-m">
<div class="ecl-u-border-bottom ecl-u-border-color-{{ _color }} ecl-u-pt-m ecl-u-pb-m">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since we repeat this 5 times only in this PR, we could turn this into a Twig function that, depending on the library , prints out the right class, as ecl-u-border-color-{{ _color }}, like this:

Suggested change
<div class="ecl-u-border-bottom ecl-u-border-color-{{ _color }} ecl-u-pt-m ecl-u-pb-m">
<div class="ecl-u-border-bottom {{ ecl_class_border_color() }} ecl-u-pt-m ecl-u-pb-m">

{% include '@ecl-twig/link' with {
link: {
type: 'standalone',
Expand Down
3 changes: 2 additions & 1 deletion templates/field/field--oe-contact--oe-link--full.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,10 @@
* @see ./core/themes/stable/templates/field/field.html.twig
*/
#}
{% set _color = ecl_component_library == 'ec' ? 'neutral-40' : 'primary-10' %}
{% for item in items %}
{% set bubble_cache = item.content|render %}
<div class="ecl-u-border-bottom ecl-u-border-color-grey-15 ecl-u-pt-l ecl-u-pb-l">
<div class="ecl-u-border-bottom ecl-u-border-color-{{ _color }} ecl-u-pt-l ecl-u-pb-l">
{% include '@ecl-twig/link' with {
link: {
type: 'standalone',
Expand Down
3 changes: 2 additions & 1 deletion templates/field/field--oe-contact--oe-press-contact-url--full.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,10 @@
* @see ./core/themes/stable/templates/field/field.html.twig
*/
#}
{% set _color = ecl_component_library == 'ec' ? 'neutral-40' : 'primary-10' %}
{% for item in items %}
{% set bubble_cache = item.content|render %}
<div class="ecl-u-border-bottom ecl-u-border-color-grey-15 ecl-u-pt-l ecl-u-pb-l">
<div class="ecl-u-border-bottom ecl-u-border-color-{{ _color }} ecl-u-pt-l ecl-u-pb-l">
{% include '@ecl-twig/link' with {
link: {
type: 'standalone',
Expand Down
6 changes: 4 additions & 2 deletions templates/field/field--oe-related-links.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,16 @@
{% set _color = ecl_component_library == 'ec' ? 'neutral-40' : 'primary-10' %}
<h2 class="ecl-u-type-heading-2 ecl-u-mt-3xl">{{ 'Related links'|t }}</h2>
{% for item in items %}
{% set bubble_cache = item.content|render %}
<div class="ecl-u-border-bottom ecl-u-border-color-grey-15 ecl-u-pt-m ecl-u-pb-m">
<div class="ecl-u-border-bottom ecl-u-border-color-{{ _color }} ecl-u-pt-m ecl-u-pb-m">
{% include '@ecl-twig/link' with {
link: {
type: 'standalone',
label: item.content['#title'],
path: item.content['#url'],
icon_position: 'after'
}
},
icon: get_link_icon(item.content['#url'].toString(), 'xs')
} %}
</div>
{% endfor %}
3 changes: 2 additions & 1 deletion templates/oe_contact/oe-contact--full.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
* @see ./modules/contrib/oe_content_entity/modules/oe_content_entity_contact/templates/oe-contact.html.twig
*/
#}
{% set _color = ecl_component_library == 'ec' ? 'neutral-40' : 'primary-10' %}
{% set image = content.oe_image|field_value|render %}
<div class="ecl-row ecl-u-mv-xl">
{% block title %}
Expand All @@ -26,7 +27,7 @@
{% endif %}
{{ content.group_contact_information }}
{% if not entity.oe_press_contact_url.isEmpty() or not entity.oe_link.isEmpty() %}
<div class="ecl-u-border-top ecl-u-border-color-grey-15 ecl-u-mt-s">
<div class="ecl-u-border-top ecl-u-border-color-{{ _color }} ecl-u-mt-s">
{{ content.oe_press_contact_url }}
{{ content.oe_link }}
</div>
Expand Down
17 changes: 7 additions & 10 deletions tests/src/Functional/ContentNewsRenderTest.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,6 @@ protected function setUp(): void {
* Tests that the News page renders correctly.
*/
public function testNewsRendering(): void {
$this->markTestSkipped('Must be re-enabled before considering migration to ECL 4 as complete.');
// Create a News node.
/** @var \Drupal\node\Entity\Node $node */
$node = $this->getStorage('node')->create([
Expand All @@ -69,7 +68,7 @@ public function testNewsRendering(): void {
$this->drupalGet($node->toUrl());

// Assert page header - metadata.
$page_header = $this->assertSession()->elementExists('css', '.ecl-page-header.ecl-page-header--negative');
$page_header = $this->assertSession()->elementExists('css', '.ecl-page-header');
$assert = new PatternPageHeaderAssert();
$expected_values = [
'title' => 'Test news node',
Expand Down Expand Up @@ -99,9 +98,9 @@ public function testNewsRendering(): void {
])->save();
$this->drupalGet($node->toUrl());
$this->assertEquals('Sources', $this->assertSession()->elementExists('css', 'h3.ecl-u-type-heading-3')->getText());
$internal_source_link = $this->assertSession()->elementExists('css', 'div.ecl-u-border-bottom.ecl-u-border-color-grey-15.ecl-u-pt-m.ecl-u-pb-m:nth-child(3)');
$internal_source_link = $this->assertSession()->elementExists('css', 'div.ecl-u-border-bottom.ecl-u-border-color-neutral-40.ecl-u-pt-m.ecl-u-pb-m:nth-child(3)');
$this->assertLinkIcon($internal_source_link, 'Internal source link', '/build/node', FALSE, 'xs');
$external_source_link = $this->assertSession()->elementExists('css', 'div.ecl-u-border-bottom.ecl-u-border-color-grey-15.ecl-u-pt-m.ecl-u-pb-m:nth-child(4)');
$external_source_link = $this->assertSession()->elementExists('css', 'div.ecl-u-border-bottom.ecl-u-border-color-neutral-40.ecl-u-pt-m.ecl-u-pb-m:nth-child(4)');
$this->assertLinkIcon($external_source_link, 'External source link', 'https://example.com', TRUE, 'xs');

$node->set('oe_news_location', 'http://publications.europa.eu/resource/authority/place/ARE_AUH');
Expand Down Expand Up @@ -248,12 +247,10 @@ public function testNewsRendering(): void {
])->save();
$this->drupalGet($node->toUrl());
$this->assertEquals('Related links', $this->assertSession()->elementExists('css', 'h2.ecl-u-type-heading-2:nth-child(8)')->getText());
$first_related_link = $this->assertSession()->elementExists('css', 'div.ecl-u-border-bottom.ecl-u-border-color-grey-15.ecl-u-pt-m.ecl-u-pb-m:nth-child(9) a');
$this->assertEquals('/build/node', $first_related_link->getAttribute('href'));
$this->assertEquals('Node listing', $first_related_link->getText());
$second_related_link = $this->assertSession()->elementExists('css', 'div.ecl-u-border-bottom.ecl-u-border-color-grey-15.ecl-u-pt-m.ecl-u-pb-m:nth-child(10) a');
$this->assertEquals('https://example.com', $second_related_link->getAttribute('href'));
$this->assertEquals('External link', $second_related_link->getText());
$first_related_link = $this->assertSession()->elementExists('css', 'div.ecl-u-border-bottom.ecl-u-border-color-neutral-40.ecl-u-pt-m.ecl-u-pb-m:nth-child(9) a');
$this->assertLinkIcon($first_related_link, 'Node listing', '/build/node', FALSE, 'xs');
$second_related_link = $this->assertSession()->elementExists('css', 'div.ecl-u-border-bottom.ecl-u-border-color-neutral-40.ecl-u-pt-m.ecl-u-pb-m:nth-child(10) a');
$this->assertLinkIcon($second_related_link, 'External link', 'https://example.com', TRUE, 'xs');
}

}
4 changes: 2 additions & 2 deletions tests/src/Functional/ContentRenderTestBase.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -309,7 +309,7 @@ protected function assertContactDefaultRender(NodeElement $element, string $name
$field_list_assert->assertVariant('horizontal', $contacts_html);

// Assert Press contacts field.
$links_wrapper = $element->findAll('css', 'div.ecl-u-border-top.ecl-u-border-color-grey-15.ecl-u-mt-s div.ecl-u-border-bottom.ecl-u-border-color-grey-15.ecl-u-pt-l.ecl-u-pb-l');
$links_wrapper = $element->findAll('css', 'div.ecl-u-border-top.ecl-u-border-color-neutral-40.ecl-u-mt-s div.ecl-u-border-bottom.ecl-u-border-color-neutral-40.ecl-u-pt-l.ecl-u-pb-l');
$this->assertCount(2, $links_wrapper);
$this->assertLinkIcon($links_wrapper[0], 'Press contacts', "http://www.example.com/press_contact_$name");

Expand Down Expand Up @@ -468,7 +468,7 @@ protected function assertContentHeader(NodeElement $element, string $title, stri
* Icon size.
*/
protected function assertLinkIcon(NodeElement $element, string $title, string $href, bool $is_external = TRUE, string $icon_size = 's'): void {
$link = $element->findAll('css', 'a.ecl-link.ecl-link--standalone.ecl-link--icon.ecl-link--icon-after');
$link = $element->findAll('css', 'a.ecl-link.ecl-link--standalone.ecl-link--icon');
$this->assertCount(1, $link);
$this->assertEquals($href, $link[0]->getAttribute('href'));

Expand Down
1 change: 0 additions & 1 deletion tests/src/Kernel/NewsRenderTest.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ protected function setUp(): void {
* Tests News node type rendered as teaser.
*/
public function testNewsTeaser(): void {
$this->markTestSkipped('Must be re-enabled before considering migration to ECL 4 as complete.');
$file = \Drupal::service('file.repository')->writeData(file_get_contents(\Drupal::service('extension.list.theme')->getPath('oe_theme') . '/tests/fixtures/example_1.jpeg'), 'public://example_1.jpeg');
$file->setPermanent();
$file->save();
Expand Down
4 changes: 2 additions & 2 deletions tests/src/PatternAssertions/ListItemAssert.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,11 +37,11 @@ protected function getAssertions($variant): array {
return [
'title' => [
[$this, 'assertElementText'],
'article.ecl-content-item div.ecl-content-item__content-block h1.ecl-content-block__title',
'article.ecl-content-item div.ecl-content-item__content-block div.ecl-content-block__title',
],
'url' => [
[$this, 'assertElementAttribute'],
'article.ecl-content-item div.ecl-content-item__content-block h1.ecl-content-block__title a.ecl-link.ecl-link--standalone',
'article.ecl-content-item div.ecl-content-item__content-block div.ecl-content-block__title a.ecl-link.ecl-link--standalone',
'href',
],
'meta' => [
Expand Down