Uploaded image for project: 'PUBLIC - Liferay Portal Community Edition'
  1. PUBLIC - Liferay Portal Community Edition
  2. LPS-96791

As a marketer I can set a click goal when creating a test on DXP

    Details

    • Type: Story
    • Status: Closed
    • Priority: Major
    • Resolution: Completed
    • Affects Version/s: None
    • Fix Version/s: Master
    • Component/s: AB Testing
    • Labels:

      Description

      Motivation

      See Epic (LPS-87072) and Spike (---LPS-95354---)for general AB testing motivation.

      As of Liferay 7.2, content pages can be customized for different audiences by creating experiences. All pages have at least one experience, targeted for the “Default” audience (i.e. any visitor).

      The purpose of an AB test is to find the page experience that maximizes a goal for a given audience, by comparing the performance of different experience variants during a time. One of the most common goal use cases are measuring click targets on the variants, that is why it is important to cover this situation.

      Design

      • Variations with respect to the Figma (for this story only):
        • Tab navigation (Active Test, history) not included

      Technical Aspects

      Click target selection only works with clickable elements (buttons, links) that contain an "id" HTML attribute. This requirement matches that of the Analytics Client to track clicks on elements.

      In order to test click target selection:

      • On the content page, add an HTML block
      • Add a link element with an id:

      <a href="https://www.liferay.com" class="btn btn-primary" id="liferay-button-id">Go Liferay</a>

      Acceptance Criteria

      1. The click goal section shows in A/B test sidebar

      • Given a Content Page with an active Test for the selected Experience
      • When the AB test sidebar is opened
      • and When the goal selected is clicked
      • Then the Click goal Section is shown under the Set Target button

      2. Set Target - clickable elements highlighted

      • Given a Content Page with an active Test for the selected Experience
      • When clicking on the Set Target Button
      • Then:
        • The page shows All clickable elements highlighted on page
        • The UI shows the Set Target button active

      3. Set Target - hover on clickable element

      • Given Criteria #2
      • When cursor goes over a highlighted element
      • Then:
        • The by default cursor changes to pointer
        • A tooltip Click Element to Set as Click Target for your Goal appears
        • The border of the highlighted area gets darker

      4. Set Target - select clickable element

      • Given Criteria #3
      • When cursor clicks on a highlighted element
      • Then a contextual panel shows:
        • The id of the element
        • The Set Element as Click Target button

      5. Set Target - set clickable element as Target

      • Given Criteria #4
      • When Set Element as Click Target button is clicked on the contextual panel
      • Then:
        • The element is set as the Click Target
        • The UI of the page reflects selection
        • The panel closes
        • The UI of the Click Goal Section in the sidebar includes the id of the element as a link
        • The Set Target button changes to Edit Target

      6. Set Target Cancellation

      • Given: Criteria #3.
      • When clicking in any not allowed part of the page
      • Then:
        • The page does not show the clickable elements on page highlighted
        • And the UI shows the Set Target button by default

      7. Set Target - hover on non-clickable element

      • Given Criteria #2
      • When cursor goes over a non highlighted element
      • Then the by default cursor changes to not-allowed cursor

      8. Edit Target

      • Given: criteria #5
      • When clicking the Edit Target button
      • Then:
        • The page shows All clickable elements highlighted on page
        • The UI shows the Edit Target button active
      • When Selecting new element
      • Then:
        • The new element is set as the Click Target
        • The UI of the page reflects selection
        • The panel closes
        • The UI of the Click Goal Section in the sidebar includes the name of the selected element as a link
        • The button keeps Edit Target

      9. Removing Target

      • Given: criteria #5
      • When clicking on the target link in the sidebar and 
      • Then:
        • There is not a selected element anymore
        • The help text turns to original _Select Element to be measured
        • Edit Target button turns to Set Target

      10. Recover a target in a long scroll page

      • Given: criteria #5 and that it is not possible to view the Target on the page because of the scroll
      • When click the name of the target link
      • Then there is an anchor where the Target is placed on the page

        Attachments

          Issue Links

            Activity

              People

              • Votes:
                0 Vote for this issue
                Watchers:
                0 Start watching this issue

                Dates

                • Created:
                  Updated:
                  Resolved:

                  Packages

                  Version Package
                  Master