diff --git a/templates/content/node--oe-call-proposals--teaser.html.twig b/templates/content/node--oe-call-proposals--teaser.html.twig index eb651b64b..4f4034691 100644 --- a/templates/content/node--oe-call-proposals--teaser.html.twig +++ b/templates/content/node--oe-call-proposals--teaser.html.twig @@ -26,6 +26,7 @@ 'lists': additional_information, 'lists_variant': 'vertical', 'badges': badges, - 'external_link': external_link + 'external_link': external_link, + 'extra_attributes': extra_attributes|default([]), }) }} {% endblock %} diff --git a/templates/content/node--oe-call-tenders--teaser.html.twig b/templates/content/node--oe-call-tenders--teaser.html.twig index d244be6c4..8831e584a 100644 --- a/templates/content/node--oe-call-tenders--teaser.html.twig +++ b/templates/content/node--oe-call-tenders--teaser.html.twig @@ -26,6 +26,7 @@ 'lists': additional_information, 'lists_variant': 'vertical', 'badges': badges, - 'external_link': external_link + 'external_link': external_link, + 'extra_attributes': extra_attributes|default([]), }) }} {% endblock %} diff --git a/templates/content/node--oe-consultation--teaser.html.twig b/templates/content/node--oe-consultation--teaser.html.twig index 9bb4461cd..3106ce2b7 100644 --- a/templates/content/node--oe-consultation--teaser.html.twig +++ b/templates/content/node--oe-consultation--teaser.html.twig @@ -26,6 +26,7 @@ 'lists': additional_information, 'lists_variant': 'vertical', 'badges': badges, - 'external_link': external_link + 'external_link': external_link, + 'extra_attributes': extra_attributes|default([]), }) }} {% endblock %} diff --git a/templates/content/node--oe-event--teaser.html.twig b/templates/content/node--oe-event--teaser.html.twig index 6d3e166df..4e7f3801c 100644 --- a/templates/content/node--oe-event--teaser.html.twig +++ b/templates/content/node--oe-event--teaser.html.twig @@ -22,6 +22,7 @@ 'lists': additional_information, 'lists_variant': 'vertical', 'badges': badges, - 'external_link': external_link + 'external_link': external_link, + 'extra_attributes': extra_attributes|default([]), }) }} {% endblock %} diff --git a/templates/content/node--oe-news--teaser.html.twig b/templates/content/node--oe-news--teaser.html.twig index 544209d90..1f618075e 100644 --- a/templates/content/node--oe-news--teaser.html.twig +++ b/templates/content/node--oe-news--teaser.html.twig @@ -26,7 +26,8 @@ 'lists': additional_information, 'lists_variant': 'vertical', 'badges': badges, - 'external_link': external_link + 'external_link': external_link, + 'extra_attributes': extra_attributes|default([]), }) }} {% endblock %} {% endapply %} diff --git a/templates/content/node--oe-organisation--teaser.html.twig b/templates/content/node--oe-organisation--teaser.html.twig index 576f6e23a..bfcad472d 100644 --- a/templates/content/node--oe-organisation--teaser.html.twig +++ b/templates/content/node--oe-organisation--teaser.html.twig @@ -34,6 +34,7 @@ 'lists_variant': 'vertical', 'image': image_url ? { 'src': image_url }, 'badges': badges, - 'external_link': external_link + 'external_link': external_link, + 'extra_attributes': extra_attributes|default([]), }) }} {% endblock %} diff --git a/templates/content/node--oe-page--teaser.html.twig b/templates/content/node--oe-page--teaser.html.twig index 230d4fd59..de85a1363 100644 --- a/templates/content/node--oe-page--teaser.html.twig +++ b/templates/content/node--oe-page--teaser.html.twig @@ -13,6 +13,7 @@ 'lists': additional_information|default([]), 'lists_variant': 'vertical', 'badges': badges, - 'external_link': external_link + 'external_link': external_link, + 'extra_attributes': extra_attributes|default([]), }) }} {% endblock %} diff --git a/templates/content/node--oe-person--teaser.html.twig b/templates/content/node--oe-person--teaser.html.twig index 4a47ff134..f5bf56a66 100644 --- a/templates/content/node--oe-person--teaser.html.twig +++ b/templates/content/node--oe-person--teaser.html.twig @@ -45,7 +45,6 @@ {% set additional_information = additional_information|merge([additional_information_items]) %} {% endif %} - {% block content %} {{ pattern('list_item', { 'variant': 'thumbnail_secondary', @@ -57,6 +56,7 @@ 'lists_variant': 'vertical', 'image': content.portrait_image ? { 'src': content.portrait_image|render }, 'badges': badges, - 'external_link': external_link + 'external_link': external_link, + 'extra_attributes': extra_attributes|default([]), }) }} {% endblock %} diff --git a/templates/content/node--oe-policy--teaser.html.twig b/templates/content/node--oe-policy--teaser.html.twig index 85f003c80..81c43af97 100644 --- a/templates/content/node--oe-policy--teaser.html.twig +++ b/templates/content/node--oe-policy--teaser.html.twig @@ -13,6 +13,7 @@ 'lists': additional_information|default([]), 'lists_variant': 'vertical', 'badges': badges, - 'external_link': external_link + 'external_link': external_link, + 'extra_attributes': extra_attributes|default([]), }) }} {% endblock %} diff --git a/templates/content/node--oe-project--teaser.html.twig b/templates/content/node--oe-project--teaser.html.twig index f74a0e262..ef58f1ad1 100644 --- a/templates/content/node--oe-project--teaser.html.twig +++ b/templates/content/node--oe-project--teaser.html.twig @@ -27,6 +27,7 @@ 'lists_variant': 'vertical', 'image': image_url ? { 'src': image_url }, 'badges': badges, - 'external_link': external_link + 'external_link': external_link, + 'extra_attributes': extra_attributes|default([]), }) }} {% endblock %} diff --git a/templates/content/node--oe-publication--teaser.html.twig b/templates/content/node--oe-publication--teaser.html.twig index 56769f703..0ac468b5f 100644 --- a/templates/content/node--oe-publication--teaser.html.twig +++ b/templates/content/node--oe-publication--teaser.html.twig @@ -20,6 +20,7 @@ 'lists': additional_information, 'lists_variant': 'vertical', 'badges': badges, - 'external_link': external_link + 'external_link': external_link, + 'extra_attributes': extra_attributes|default([]), }) }} {% endblock %} diff --git a/templates/patterns/featured_item/featured_item.ui_patterns.yml b/templates/patterns/featured_item/featured_item.ui_patterns.yml index 8ebf16af1..2cf31f724 100644 --- a/templates/patterns/featured_item/featured_item.ui_patterns.yml +++ b/templates/patterns/featured_item/featured_item.ui_patterns.yml @@ -76,4 +76,11 @@ featured_item: type: "array" label: "Contextual links" description: "Render array of contextual links" - preview: ~ \ No newline at end of file + preview: ~ + extra_attributes: + type: "array" + label: "Extra attributes" + description: "List of extra attributes" + preview: + - name: "extra-attr" + value: "extra value" diff --git a/templates/patterns/featured_item/pattern-featured-item.html.twig b/templates/patterns/featured_item/pattern-featured-item.html.twig index d4a208aa6..2fe5d2a67 100644 --- a/templates/patterns/featured_item/pattern-featured-item.html.twig +++ b/templates/patterns/featured_item/pattern-featured-item.html.twig @@ -78,4 +78,5 @@ 'secondary_meta': _footer_items, 'picture': _picture, 'labels': badges, + 'extra_attributes': extra_attributes|default([]), } %} diff --git a/templates/patterns/file_teaser/file_teaser.ui_patterns.yml b/templates/patterns/file_teaser/file_teaser.ui_patterns.yml index a9dc61e03..87e575ede 100644 --- a/templates/patterns/file_teaser/file_teaser.ui_patterns.yml +++ b/templates/patterns/file_teaser/file_teaser.ui_patterns.yml @@ -118,3 +118,10 @@ file_teaser: label: "Contextual links" description: "Render array of contextual links" preview: ~ + extra_attributes: + type: "array" + label: "Extra attributes" + description: "List of extra attributes" + preview: + - name: "extra-attr" + value: "extra value" diff --git a/templates/patterns/file_teaser/pattern-file-teaser.html.twig b/templates/patterns/file_teaser/pattern-file-teaser.html.twig index 1c7621afc..ed2344d9d 100644 --- a/templates/patterns/file_teaser/pattern-file-teaser.html.twig +++ b/templates/patterns/file_teaser/pattern-file-teaser.html.twig @@ -134,4 +134,5 @@ 'variant': 'thumbnail', 'lists': _lists, 'label': _label, + 'extra_attributes': extra_attributes|default([]), } only %} diff --git a/templates/patterns/highlighted_list/pattern-highlighted-list--variant-four-columns.html.twig b/templates/patterns/highlighted_list/pattern-highlighted-list--variant-four-columns.html.twig index 0beaf65f0..61d24eccc 100644 --- a/templates/patterns/highlighted_list/pattern-highlighted-list--variant-four-columns.html.twig +++ b/templates/patterns/highlighted_list/pattern-highlighted-list--variant-four-columns.html.twig @@ -26,7 +26,8 @@ 'image_position': (loop.first or loop.index == 4) ? 'top' : '', 'divider': (loop.index == 2 or loop.index == 5) ? true : false, 'extra_classes': (loop.index == 2 or loop.index == 5) ? 'ecl-u-flex-grow-1 ecl-u-mb-m' : 'ecl-u-flex-grow-1', - 'contextual_links': item.contextual_links + 'contextual_links': item.contextual_links, + 'extra_attributes': item.extra_attributes|default([]), }, 'default') %} {% set _items = _items|merge([_item]) %} {% endfor %} diff --git a/templates/patterns/highlighted_list/pattern-highlighted-list.html.twig b/templates/patterns/highlighted_list/pattern-highlighted-list.html.twig index 4d62a2e42..a2f113758 100644 --- a/templates/patterns/highlighted_list/pattern-highlighted-list.html.twig +++ b/templates/patterns/highlighted_list/pattern-highlighted-list.html.twig @@ -22,7 +22,8 @@ 'image_position': 'top', 'divider': true, 'extra_classes': 'ecl-u-flex-grow-1', - 'contextual_links': highlighted_item.contextual_links + 'contextual_links': highlighted_item.contextual_links, + 'extra_attributes': highlighted_item.extra_attributes|default([]), }, 'default') %} {% endif %} @@ -45,7 +46,8 @@ 'image_position': loop.first ? 'top' : '', 'divider': true, 'extra_classes': loop.last ? 'ecl-u-flex-grow-1' : 'ecl-u-flex-grow-1 ecl-u-mb-m', - 'contextual_links': item.contextual_links + 'contextual_links': item.contextual_links, + 'extra_attributes': item.extra_attributes|default([]), }, 'default') %} {% set _items = _items|merge([_item]) %} {% endfor %} diff --git a/templates/patterns/list_item/list_item.ui_patterns.yml b/templates/patterns/list_item/list_item.ui_patterns.yml index 11556a9b2..0b2827c7c 100644 --- a/templates/patterns/list_item/list_item.ui_patterns.yml +++ b/templates/patterns/list_item/list_item.ui_patterns.yml @@ -169,3 +169,10 @@ list_item: label: 'Extra classes string' description: 'Extra classes string' preview: '' + extra_attributes: + type: "array" + label: "Extra attributes" + description: "List of extra attributes" + preview: + - name: "extra-attr" + value: "extra value" diff --git a/templates/patterns/list_item/pattern-list-item--variant-block.html.twig b/templates/patterns/list_item/pattern-list-item--variant-block.html.twig index d8dedad65..a40e64ee9 100644 --- a/templates/patterns/list_item/pattern-list-item--variant-block.html.twig +++ b/templates/patterns/list_item/pattern-list-item--variant-block.html.twig @@ -32,4 +32,6 @@ title: _title|default([]), description: detail|smart_trim(_length), labels: badges, + extra_classes: extra_classes|default(''), + extra_attributes: extra_attributes|default([]), } only %} diff --git a/templates/patterns/list_item/pattern-list-item--variant-highlight.html.twig b/templates/patterns/list_item/pattern-list-item--variant-highlight.html.twig index 82d3dc875..0ade07061 100644 --- a/templates/patterns/list_item/pattern-list-item--variant-highlight.html.twig +++ b/templates/patterns/list_item/pattern-list-item--variant-highlight.html.twig @@ -72,4 +72,6 @@ labels: badges, primary_meta: primary_meta|default([]), secondary_meta: _secondary_meta|default([]), + extra_classes: extra_classes|default(''), + extra_attributes: extra_attributes|default([]), } only %} diff --git a/templates/patterns/list_item/pattern-list-item.html.twig b/templates/patterns/list_item/pattern-list-item.html.twig index 5f138d55d..ab376fce4 100644 --- a/templates/patterns/list_item/pattern-list-item.html.twig +++ b/templates/patterns/list_item/pattern-list-item.html.twig @@ -171,4 +171,5 @@ secondary_meta: _secondary_meta|default([]), date: _date|default([]), extra_classes: extra_classes|default(''), + extra_attributes: extra_attributes|default([]), } only %} diff --git a/tests/src/Kernel/fixtures/rendering.yml b/tests/src/Kernel/fixtures/rendering.yml index 0b995a1ec..be3358fff 100644 --- a/tests/src/Kernel/fixtures/rendering.yml +++ b/tests/src/Kernel/fixtures/rendering.yml @@ -953,12 +953,15 @@ badges: - label: "Highlighted" variant: "highlight" + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: 'img.ecl-file__image[src="https://inno-ecl.s3.amazonaws.com/media/examples/example-image.jpg"]': 1 'img.ecl-file__image[alt="thumbnail alt"]': 1 'a.ecl-file__download[href="http://example.com"]': 1 - 'div.ecl-file.ecl-file--thumbnail': 1 + 'div.ecl-file.ecl-file--thumbnail[extra-attr="extra value"]': 1 'div.ecl-file__container div.ecl-file__info ul.ecl-file__detail-meta': 1 'div.ecl-file__container div.ecl-file__info': 1 'div.ecl-file__translation-container': 1 @@ -1483,9 +1486,12 @@ variant: "highlight" - label: "Status: Open" variant: "high" + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: - 'article.ecl-content-item div.ecl-content-item__content-block div.ecl-content-block__title a.ecl-link[href="http://example.com"]': 1 + 'article.ecl-content-item[extra-attr="extra value"] div.ecl-content-item__content-block div.ecl-content-block__title a.ecl-link[href="http://example.com"]': 1 'article.ecl-content-item picture.ecl-content-item__picture--large': 0 'article.ecl-content-item picture.ecl-content-item__picture--left': 0 'article.ecl-content-item picture.ecl-content-item__picture--right': 0 @@ -1508,9 +1514,12 @@ length: 6 meta: - "Meta 1" + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: - 'article.ecl-content-item div.ecl-content-item__content-block div.ecl-content-block__title a.ecl-link[href="http://example.com"]': 1 + 'article.ecl-content-item[extra-attr="extra value"] div.ecl-content-item__content-block div.ecl-content-block__title a.ecl-link[href="http://example.com"]': 1 'article.ecl-content-item picture.ecl-content-item__picture--large': 0 'article.ecl-content-item picture.ecl-content-item__picture--left': 0 'article.ecl-content-item picture.ecl-content-item__picture--right': 0 @@ -1721,9 +1730,12 @@ meta: - "Meta 1" - "Meta 2" + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: - 'article.ecl-content-item div.ecl-content-item__content-block a.ecl-link[href="http://example.com"]': 1 + 'article.ecl-content-item[extra-attr="extra value"] div.ecl-content-item__content-block a.ecl-link[href="http://example.com"]': 1 'article.ecl-content-item img.ecl-content-item__image[alt="Alternate text for primary image"]': 1 'article.ecl-content-item img.ecl-content-item__image[src="http://via.placeholder.com/150x150"]': 1 'article.ecl-content-item picture[data-ecl-picture-link]': 1 @@ -1748,9 +1760,12 @@ meta: - "Meta 1" - "Meta 2" + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: - 'article.ecl-content-item div.ecl-content-item__content-block a.ecl-link[href="http://example.com"]': 1 + 'article.ecl-content-item[extra-attr="extra value"] div.ecl-content-item__content-block a.ecl-link[href="http://example.com"]': 1 'article.ecl-content-item img.ecl-content-item__image[alt="Alternate text for secondary image"]': 1 'article.ecl-content-item img.ecl-content-item__image[src="http://via.placeholder.com/120x80"]': 1 'article.ecl-content-item picture[data-ecl-picture-link]': 1 @@ -1782,9 +1797,12 @@ secondary_meta: - label: "Brussels" icon: "location" + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: - article.ecl-card div.ecl-card__body div.ecl-content-block.ecl-card__content-block: 1 + article.ecl-card[extra-attr="extra value"] div.ecl-card__body div.ecl-content-block.ecl-card__content-block: 1 article.ecl-card div.ecl-card__body a.ecl-link--standalone[href="http://example.com"]: 1 article.ecl-card img.ecl-card__image[alt="Alternate text for secondary image"]: 1 article.ecl-card img.ecl-card__image[src="http://via.placeholder.com/300x300"]: 1 @@ -1814,6 +1832,9 @@ alt: "Alternate text for secondary image" detail: "This is a very long description. Better to trim it off." length: 32 + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: article.ecl-card div.ecl-card__body a.ecl-link--standalone[href="http://example.com"]: 1 @@ -1841,9 +1862,12 @@ variant: "highlight" - label: "Status: Open" variant: "high" + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: - 'article.ecl-card div.ecl-card__body a.ecl-link--standalone[href="http://example.com"]': 1 + 'article.ecl-card[extra-attr="extra value"] div.ecl-card__body a.ecl-link--standalone[href="http://example.com"]': 1 'article.ecl-card div.ecl-card__image': 0 'article.ecl-card div.ecl-card__body ul.ecl-content-block__primary-meta-container': 0 'article.ecl-card div.ecl-card__body ul.ecl-content-block__label-container': 1 @@ -1875,9 +1899,12 @@ variant: "highlight" - label: "Status: Open" variant: "medium" + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: - 'article.ecl-content-item div.ecl-content-item__content-block a.ecl-link[href="http://example.com"]': 1 + 'article.ecl-content-item[extra-attr="extra value"] div.ecl-content-item__content-block a.ecl-link[href="http://example.com"]': 1 'article.ecl-content-item time.ecl-date-block.ecl-date-block--ongoing.ecl-content-item__date': 1 'article.ecl-content-item time.ecl-date-block.ecl-date-block--ongoing.ecl-content-item__date abbr.ecl-date-block__month[title="July"]': 1 equals: @@ -1913,9 +1940,12 @@ definition: "Thursday 15 November, 08:00 AM to Friday 16 November" - term: "Where" definition: "The EGG, Rue Barra 175, 1070 Brussels, Belgium" + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: - 'article.ecl-content-item div.ecl-content-item__content-block a.ecl-link[href="http://example.com"]': 1 + 'article.ecl-content-item[extra-attr="extra value"] div.ecl-content-item__content-block a.ecl-link[href="http://example.com"]': 1 'article.ecl-content-item time.ecl-date-block.ecl-date-block--ongoing.ecl-content-item__date': 1 'article.ecl-content-item time.ecl-date-block.ecl-date-block--ongoing.ecl-content-item__date abbr.ecl-date-block__month[title="July"]': 1 'div.ecl-content-block__list-container dl.ecl-u-mb-xl .ecl-description-list__term': 2 @@ -3017,11 +3047,14 @@ variant: "highlight" - label: "Status: Open" variant: "high" + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: "img.ecl-card__image[src=\"http://via.placeholder.com/120x80\"]": 1 'div.ecl-content-block__title a.ecl-link--standalone[href="https://example.com"]': 1 - 'article.ecl-card picture[data-ecl-picture-link]': 1 + 'article.ecl-card[extra-attr="extra value"] picture[data-ecl-picture-link]': 1 'a.ecl-button': 0 'article.ecl-card div.ecl-card__body ul.ecl-content-block__label-container': 1 'ul.ecl-content-block__label-container li.ecl-content-block__label-item': 2 @@ -3121,9 +3154,13 @@ href: "https://example.com" label: "Link title" external_link: true + extra_attributes: + - name: "extra-attr" + value: "extra value" assertions: count: "div.ecl-card__image": 0 + 'article.ecl-card[extra-attr="extra value"]': 1 'div.ecl-content-block__title a.ecl-link--standalone.ecl-link--icon[href="https://example.com"]': 1 'a.ecl-button[href="https://example.com"]': 1 'svg.ecl-icon.ecl-icon--xs.ecl-button__icon': 1 @@ -4547,6 +4584,9 @@ image: src: "https://loremflickr.com/1200/900/arch" alt: "Highlighted item image" + extra_attributes: + - name: "extra-attr1" + value: "extra value1" items: - title: "Item 2" detail: "Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem." @@ -4559,6 +4599,9 @@ image: src: "https://loremflickr.com/1200/900/arch" alt: "Item 2 image" + extra_attributes: + - name: "extra-attr2" + value: "extra value2" - title: "Item 3" url: "https://external.com" detail: "In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam" @@ -4612,8 +4655,8 @@ 'div.ecl-content-block__title': 4 'div.ecl-content-block__title a': 3 'picture.ecl-content-item__picture': 2 - 'div.ecl-col-l-8 picture.ecl-content-item__picture--large img.ecl-content-item__image[src="https://loremflickr.com/1200/900/arch"][alt="Highlighted item image"]': 1 - 'div.ecl-col-l-4 picture.ecl-content-item__picture--medium img.ecl-content-item__image[src="https://loremflickr.com/1200/900/arch"][alt="Item 2 image"]': 1 + 'div.ecl-col-l-8 article.ecl-content-item[extra-attr1="extra value1"] picture.ecl-content-item__picture--large img.ecl-content-item__image[src="https://loremflickr.com/1200/900/arch"][alt="Highlighted item image"]': 1 + 'div.ecl-col-l-4 article.ecl-content-item[extra-attr2="extra value2"] picture.ecl-content-item__picture--medium img.ecl-content-item__image[src="https://loremflickr.com/1200/900/arch"][alt="Item 2 image"]': 1 'div#highlighted-news-block div.ecl-col-l-8 a': 1 'div#highlighted-news-block div.ecl-col-l-4 a': 2 'ul.ecl-content-block__primary-meta-container': 4 @@ -4783,6 +4826,9 @@ definition: "Thursday 15 November, 08:00 AM to Friday 16 November" - term: "Where" definition: "The EGG, Rue Barra 175, 1070 Brussels, Belgium" + extra_attributes: + - name: "extra-attr1" + value: "extra value1" - title: "In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo" url: "https://external.com" detail: "In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam" @@ -4845,6 +4891,7 @@ 'div div.ecl-row.ecl-u-border-color-neutral.ecl-u-border-width-1.ecl-u-border-bottom.ecl-u-pb-l': 1 'div.ecl-row div.ecl-col-l-3.ecl-u-d-flex.ecl-u-flex-column': 4 'div.ecl-row article.ecl-content-item.ecl-u-flex-grow-1': 6 + 'div.ecl-row article.ecl-content-item[extra-attr1="extra value1"].ecl-u-flex-grow-1': 1 'div.ecl-row article.ecl-content-item--divider.ecl-u-flex-grow-1.ecl-u-mb-m': 2 'div.ecl-content-block__title': 6 'div.ecl-content-block__title a': 4