diff --git a/composer.json b/composer.json
index 7b449210..066656bb 100644
--- a/composer.json
+++ b/composer.json
@@ -12,12 +12,18 @@
     "suggest": {
         "dpc-sdp/tide_api:^4.0.0": "Allows to use Drupal in headless mode",
         "dpc-sdp/tide_webform:^4.0.0": "Allows to use questionnaires",
-        "dpc-sdp/tide_news:^4.0.0": "News content type and related configuration for Tide Drupal 10 distribution"
+        "dpc-sdp/tide_news:^4.0.0": "News content type and related configuration for Tide Drupal 10 distribution",
+        "dpc-sdp/tide_automated_listing:^4.0.0": "Allows to use tide automated listing"
     },
     "repositories": {
         "drupal": {
             "type": "composer",
-            "url": "https://packages.drupal.org/10"
+            "url": "https://packages.drupal.org/8"
+        },
+        "dpc-sdp/tide_automated_listing": {
+            "type": "vcs",
+            "no-api": true,
+            "url": "https://github.com/dpc-sdp/tide_automated_listing.git"
         }
     }
 }
diff --git a/tests/behat/bootstrap/TideCommonTrait.php b/tests/behat/bootstrap/TideCommonTrait.php
new file mode 100644
index 00000000..31dfc582
--- /dev/null
+++ b/tests/behat/bootstrap/TideCommonTrait.php
@@ -0,0 +1,163 @@
+<?php
+
+/**
+ * Common test trait for Tide.
+ *
+ * @todo Review this trait and try using BehatSteps trait instead.
+ */
+trait TideCommonTrait {
+
+  /**
+   * @Then I am in the :path path
+   */
+  public function assertCurrentPath($path) {
+    $current_path = $this->getSession()->getCurrentUrl();
+    $current_path = parse_url($current_path, PHP_URL_PATH);
+    $current_path = ltrim($current_path, '/');
+    $current_path = $current_path == '' ? '<front>' : $current_path;
+
+    if ($current_path != $path) {
+      throw new \Exception(sprintf('Current path is "%s", but expected is "%s"', $current_path, $path));
+    }
+  }
+
+  /**
+   * Creates and authenticates a user with the given role(s).
+   *
+   * @Given I am logged in as a user with the :role role(s)
+   * @Given I am logged in as a/an :role
+   */
+  public function assertAuthenticatedByRole($role) {
+    // Override parent assertion to allow using 'anonymous user' role without
+    // actually creating a user with role. By default,
+    // assertAuthenticatedByRole() will create a user with 'authenticated role'
+    // even if 'anonymous user' role is provided.
+    if ($role === 'anonymous user') {
+      if (!empty($this->loggedInUser)) {
+        $this->logout();
+      }
+    }
+    else {
+      parent::assertAuthenticatedByRole($role);
+    }
+  }
+
+  /**
+   * @Then I wait for :sec second(s)
+   */
+  public function waitForSeconds($sec) {
+    sleep($sec);
+  }
+
+  /**
+   * Wait for AJAX to finish.
+   *
+   * @see \Drupal\FunctionalJavascriptTests\JSWebAssert::assertWaitOnAjaxRequest()
+   *
+   * @Given I wait :timeout seconds for AJAX to finish
+   */
+  public function iWaitForAjaxToFinish($timeout) {
+    $condition = <<<JS
+      (function() {
+        function isAjaxing(instance) {
+          return instance && instance.ajaxing === true;
+        }
+        return (
+          // Assert no AJAX request is running (via jQuery or Drupal) and no
+          // animation is running.
+          (typeof jQuery === 'undefined' || (jQuery.active === 0 && jQuery(':animated').length === 0)) &&
+          (typeof Drupal === 'undefined' || typeof Drupal.ajax === 'undefined' || !Drupal.ajax.instances.some(isAjaxing))
+        );
+      }());
+JS;
+    $result = $this->getSession()->wait($timeout * 1000, $condition);
+    if (!$result) {
+      throw new \RuntimeException('Unable to complete AJAX request.');
+    }
+  }
+
+  /**
+   * @Given no :type content type
+   */
+  public function removeContentType($type) {
+    $content_type_entity = \Drupal::entityTypeManager()->getStorage('node_type')->load($type);
+    if ($content_type_entity) {
+      $content_type_entity->delete();
+    }
+  }
+
+  /**
+   * @When I scroll :selector into view
+   * @When I scroll selector :selector into view
+   *
+   * @param string $selector
+   *   Allowed selectors: #id, .className, //xpath.
+   *
+   * @throws \Exception
+   */
+  public function scrollIntoView($selector) {
+    $function = <<<JS
+      (function() {
+        jQuery("$selector").get(0).scrollIntoView(false);
+      }());
+JS;
+    try {
+      $this->getSession()->executeScript($function);
+    }
+    catch (Exception $e) {
+      throw new \Exception(__METHOD__ . ' failed');
+    }
+  }
+
+  /**
+   * @Then /^I click on link with href "([^"]*)"$/
+   * @Then /^I click on link with href value "([^"]*)"$/
+   *
+   * @param string $href
+   *   The href value.
+   */
+  public function clickOnLinkWithHref(string $href) {
+    $page = $this->getSession()->getPage();
+    $link = $page->find('xpath', '//a[@href="' . $href . '"]');
+    if ($link === NULL) {
+      throw new \Exception('Link with href "' . $href . '" not found.');
+    }
+    $link->click();
+  }
+
+  /**
+   * @Then /^I click on the horizontal tab "([^"]*)"$/
+   * @Then /^I click on the horizontal tab with text "([^"]*)"$/
+   *
+   * @param string $text
+   *   The text.
+   */
+  public function clickOnHorzTab(string $text) {
+    $page = $this->getSession()->getPage();
+    $link = $page->find('xpath', '//ul[contains(@class, "horizontal-tabs-list")]/li[contains(@class, "horizontal-tab-button")]/a/strong[text()="' . $text . '"]');
+    if ($link === NULL) {
+      throw new \Exception('The horizontal tab with text "' . $text . '" not found.');
+    }
+    $link->click();
+  }
+
+  /**
+   * @Then /^I click on the detail "([^"]*)"$/
+   * @Then /^I click on the detail with text "([^"]*)"$/
+   *
+   * @param string $text
+   *   The text.
+   */
+  public function clickOnDetail(string $text) {
+    $page = $this->getSession()->getPage();
+    $link = $page->find('xpath', '//div[contains(@class, "details-wrapper")]/details/summary[text()="' . $text . '"]');
+    if ($link === NULL) {
+      $link = $page->find('xpath', '//div[contains(@class, "details-wrapper")]/details/summary/span[text()="' . $text . '"]');
+      if ($link === NULL) {
+        throw new \Exception('The detail with text "' . $text . '" not found.');
+      }
+    }
+    $link->click();
+  }
+
+}
diff --git a/tests/behat/features/access.feature b/tests/behat/features/access.feature
index 289444da..4afbab5b 100644
--- a/tests/behat/features/access.feature
+++ b/tests/behat/features/access.feature
@@ -9,7 +9,6 @@ Feature: Access to Landing Page content type
     Given I am logged in as a user with the "<role>" role
     When I go to "node/add/landing_page"
     Then I should get a "<response>" HTTP response
-    And save screenshot
     Examples:
       | role               | response |
       | authenticated user | 404      |
diff --git a/tests/behat/features/fields.feature b/tests/behat/features/fields.feature
index 8b7b43ee..3617aa7d 100644
--- a/tests/behat/features/fields.feature
+++ b/tests/behat/features/fields.feature
@@ -138,7 +138,6 @@ Feature: Fields for Landing Page content type
     Given I am logged in as a user with the "create landing_page content" permission
     # Given I am logged in as a user with the "editor" role
     When I visit "node/add/landing_page"
-    And save screenshot
     Then I see field "Title"
     And I should see an "input#edit-title-0-value.required" element
 
@@ -302,3 +301,65 @@ Feature: Fields for Landing Page content type
     # This field can be "seen" but not visible.
     And I see field "field_landing_page_component[0][subform][field_customise][value]"
     And save screenshot
+    
+  @api @suggest @javascript @skipped
+  Scenario: Request a landing page with an automated listing component via API
+    Given vocabulary "topic" with name "Topic" exists
+    And topic terms:
+      | name       | parent |
+      | Test Topic | 0      |
+
+    Given landing_page content:
+      | title                     | path                     | moderation_state | uuid                                | field_topic | field_node_primary_site | field_landing_page_summary | field_landing_page_bg_colour |
+      | [TEST] Landing Page title | /test-landing-page-alias | published        | 99999999-aaaa-bbbb-ccc-000000000000 | Test Topic  | Test Site               | Test Summary               | White                       |
+
+    Given I am logged in as a user with the "Administrator" role
+    When I edit landing_page "[TEST] Landing Page title"
+    And I click on link with href "#edit-group-components"
+
+    And I select "Card collection" from "edit-field-landing-page-component-add-more-add-more-select"
+    And I press the "edit-field-landing-page-component-add-more-add-more-button" button
+    Then I wait for AJAX to finish
+
+    Then I fill in "Collection title" with "Test Automated Listing"
+    And I check the box "Landing Page"
+
+    Then I click on the horizontal tab "Layout options"
+    And I fill in "Minimum number of cards to display" with "2"
+    And I fill in "Number of cards shown per page" with "9"
+    And I select the radio button "Show 'no results' message"
+    And I select "Changed" from "Sort by a date filter"
+    And I select "Ascending" from "Sort order"
+
+    Then I select "Published" from "Change to"
+    And I press the "Save" button
+
+    Given I am an anonymous user
+    When I send a GET request to "/api/v1/node/landing_page/99999999-aaaa-bbbb-ccc-000000000000?include=field_landing_page_component"
+    Then the rest response status code should be 200
+    And the response should be in JSON
+    And the JSON node "data" should exist
+    And the JSON node "included" should exist
+    And the JSON node "included" should have 1 element
+    And the JSON node "included[0].type" should be equal to "paragraph--automated_card_listing"
+    And the JSON node "included[0].attributes" should exist
+    And the JSON node "included[0].attributes.field_paragraph_title" should be equal to "Test Automated Listing"
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing" should exist
+
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.results.min_not_met" should be equal to "no_results_message"
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.results.no_results_message" should be equal to "There are currently no results"
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.results.min" should be equal to "2"
+
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.display.type" should be equal to "grid"
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.display.items_per_page" should be equal to "9"
+
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.filter_operator" should be equal to "OR"
+
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.filter_today.status" should be equal to "false"
+
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.content_type[0]" should be equal to "landing_page"
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.filters.type.values[0]" should be equal to "landing_page"
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.filters.type.operator" should be equal to "OR"
+
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.sort.field" should be equal to "changed"
+    And the JSON node "included[0].attributes.field_paragraph_auto_listing.sort.direction" should be equal to "asc"