dpc-sdp/WoVG-GMP-360

Numbered accordion and the CJS - Dropdown Selection - Heading - SDP variable

Opened this issue · 0 comments

Issue description

The CJS - Dropdown Selection - Heading - SDP variable returns a newline (e.g. \n) character when using a numbered accordion in Ripple/SDP.

This results in an invalid or empty link_text value being passed to GA4:

image

And a value with a new line in GA3 (UA):

image

This only occurs when using a numbered accordion in Ripple/SDP:

image

The default accordion (without numbers) works Ok.

Steps to reproduce the issue

  1. Enter preview mode in Tag Manager
  2. Click on a numbered accordion item in SDP
  3. Inspect the link_text value and CJS - Dropdown Selection - Heading - SDP variable value in Tag Manager preview for the GA - Event - Dropdown Selection - SDP event.

What's the expected result?

For the screenshot above, the expected value clicking on the first item is:

1 accordion #1

What's the actual result?

1\n
accordion #1

Additional details

Changing target.innerText to target.textContent.trim() in CJS - Dropdown Selection - Heading - SDP resolves the issue, e.g.:

From this:

return target ? target.innerText : 'no-value';

to this:

return target ? target.textContent.trim() : 'no-value';

e.g. updated code for the CJS - Dropdown Selection - Heading - SDP variable:

function() {
  var el = {{Click Element}};
  if(el && typeof el.closest != 'undefined') {
    var target = el.closest(".rpl-accordion__button");
    return target ? target.textContent.trim() : 'no-value';
  }
  return 'no-value';
}

This change works for both the numbered and default accordions used in SDP/Ripple.

Thank you!